@8wave/ai-elements 0.73.0 → 0.75.0

package/dist-vue/_chunks/{PkChatbotFilePreview-JSpi3pmN.js → PkChatbotFilePreview-DHzuGtz5.js}

@@ -1,4 +1,4 @@
-import { n as e, t } from "./useLightbox-BiZUwsmB.js";
+import { n as e, t } from "./useLightbox-1sB7fmFb.js";
 import { computed as n, createBlock as r, createCommentVNode as i, createElementBlock as a, createElementVNode as o, createVNode as s, defineComponent as c, onMounted as l, openBlock as u, ref as d, toDisplayString as f, unref as p } from "vue";
 import { VvIcon as m } from "@volverjs/ui-vue/components";
 //#region ../../packages/components/src/chat/PkChatbotFilePreview.vue?vue&type=script&setup=true&lang.ts
@@ -82,4 +82,4 @@ var h = { class: "pk-chatbot-file-preview" }, g = [
 //#endregion
 export { x as t };
 
-//# sourceMappingURL=PkChatbotFilePreview-JSpi3pmN.js.map
+//# sourceMappingURL=PkChatbotFilePreview-DHzuGtz5.js.map

package/dist-vue/_chunks/{PkChatbotFilePreview-JSpi3pmN.js.map → PkChatbotFilePreview-DHzuGtz5.js.map}

@@ -1 +1 @@
-{"version":3,"file":"PkChatbotFilePreview-JSpi3pmN.js","names":["$t","$emit"],"sources":["../../../../packages/components/src/chat/PkChatbotFilePreview.vue","../../../../packages/components/src/chat/PkChatbotFilePreview.vue"],"sourcesContent":["<script lang=\"ts\" setup>\n    import { computed, ref, onMounted } from 'vue'\n    import { useLightbox, useImageSizes } from '../composables/useLightbox'\n\n    const props = defineProps<{\n        mediaType: string\n        url: string\n        filename?: string\n        loading?: boolean\n        error?: string\n        removable?: boolean\n    }>()\n\n    defineEmits<{\n        remove: []\n    }>()\n\n    const isImage = computed(() => props.mediaType.startsWith('image/'))\n\n    const galleryRef = ref<HTMLElement>()\n    const { preload, getSize } = useImageSizes()\n    const { init } = useLightbox({ gallery: galleryRef, loop: false })\n\n    onMounted(async () => {\n        if (!isImage.value) {\n            return\n        }\n        preload([{ url: props.url }])\n        await init()\n    })\n</script>\n\n<template>\n    <div class=\"pk-chatbot-file-preview\">\n        <div v-if=\"isImage\" ref=\"galleryRef\">\n            <a\n                :href=\"url\"\n                :data-pswp-src=\"url\"\n                :data-pswp-width=\"getSize(url).width\"\n                :data-pswp-height=\"getSize(url).height\"\n                :data-pswp-caption=\"filename ?? ''\"\n                class=\"pk-chatbot-file-preview__thumb-link\">\n                <img\n                    :src=\"url\"\n                    :alt=\"filename\"\n                    class=\"pk-chatbot-file-preview__thumb\" />\n            </a>\n        </div>\n        <a\n            v-else\n            :href=\"url\"\n            target=\"_blank\"\n            rel=\"noopener noreferrer\"\n            class=\"pk-chatbot-file-preview__icon-link\">\n            <VvIcon name=\"ri:file-line\" class=\"pk-chatbot-file-preview__icon\" />\n        </a>\n        <span v-if=\"filename\" class=\"pk-chatbot-file-preview__name\">{{\n            filename\n        }}</span>\n        <VvIcon\n            v-if=\"loading\"\n            name=\"line-md:loading-loop\"\n            class=\"pk-chatbot-file-preview__loading\" />\n        <VvIcon\n            v-else-if=\"error\"\n            name=\"ri:error-warning-line\"\n            :title=\"error\"\n            class=\"pk-chatbot-file-preview__error\" />\n        <button\n            v-if=\"removable && !loading\"\n            type=\"button\"\n            class=\"pk-chatbot-file-preview__remove\"\n            :title=\"$t('action.remove')\"\n            @click=\"$emit('remove')\">\n            <VvIcon name=\"ri:close-line\" />\n        </button>\n    </div>\n</template>\n\n<style lang=\"scss\">\n    .pk-chatbot-file-preview {\n        display: inline-flex;\n        align-items: center;\n        gap: var(--spacing-4);\n        max-width: 160px;\n        padding: var(--spacing-4) var(--spacing-xs);\n        background-color: var(--color-surface-1);\n        border: 1px solid var(--color-surface-3);\n        border-radius: var(--rounded-md);\n        font-size: var(--text-12);\n        color: var(--color-word-2);\n\n        &__thumb-link {\n            display: flex;\n            flex-shrink: 0;\n            cursor: pointer;\n        }\n\n        &__thumb {\n            width: var(--spacing-20);\n            height: var(--spacing-20);\n            object-fit: cover;\n            border-radius: var(--rounded-sm);\n            flex-shrink: 0;\n        }\n\n        &__icon-link {\n            display: flex;\n            flex-shrink: 0;\n            color: inherit;\n            text-decoration: none;\n        }\n\n        &__icon {\n            width: var(--spacing-16);\n            height: var(--spacing-16);\n            flex-shrink: 0;\n            color: var(--color-word-3);\n        }\n\n        &__name {\n            flex: 1;\n            min-width: 0;\n            overflow: hidden;\n            text-overflow: ellipsis;\n            white-space: nowrap;\n        }\n\n        &__loading,\n        &__error {\n            width: var(--spacing-14);\n            height: var(--spacing-14);\n            flex-shrink: 0;\n        }\n\n        &__error {\n            color: var(--color-danger);\n        }\n\n        &__remove {\n            background: none;\n            border: none;\n            cursor: pointer;\n            padding: 0;\n            color: var(--color-word-4);\n            flex-shrink: 0;\n            display: flex;\n            align-items: center;\n            line-height: 1;\n\n            &:hover {\n                color: var(--color-word-1);\n            }\n        }\n    }\n</style>\n","<script lang=\"ts\" setup>\n    import { computed, ref, onMounted } from 'vue'\n    import { useLightbox, useImageSizes } from '../composables/useLightbox'\n\n    const props = defineProps<{\n        mediaType: string\n        url: string\n        filename?: string\n        loading?: boolean\n        error?: string\n        removable?: boolean\n    }>()\n\n    defineEmits<{\n        remove: []\n    }>()\n\n    const isImage = computed(() => props.mediaType.startsWith('image/'))\n\n    const galleryRef = ref<HTMLElement>()\n    const { preload, getSize } = useImageSizes()\n    const { init } = useLightbox({ gallery: galleryRef, loop: false })\n\n    onMounted(async () => {\n        if (!isImage.value) {\n            return\n        }\n        preload([{ url: props.url }])\n        await init()\n    })\n</script>\n\n<template>\n    <div class=\"pk-chatbot-file-preview\">\n        <div v-if=\"isImage\" ref=\"galleryRef\">\n            <a\n                :href=\"url\"\n                :data-pswp-src=\"url\"\n                :data-pswp-width=\"getSize(url).width\"\n                :data-pswp-height=\"getSize(url).height\"\n                :data-pswp-caption=\"filename ?? ''\"\n                class=\"pk-chatbot-file-preview__thumb-link\">\n                <img\n                    :src=\"url\"\n                    :alt=\"filename\"\n                    class=\"pk-chatbot-file-preview__thumb\" />\n            </a>\n        </div>\n        <a\n            v-else\n            :href=\"url\"\n            target=\"_blank\"\n            rel=\"noopener noreferrer\"\n            class=\"pk-chatbot-file-preview__icon-link\">\n            <VvIcon name=\"ri:file-line\" class=\"pk-chatbot-file-preview__icon\" />\n        </a>\n        <span v-if=\"filename\" class=\"pk-chatbot-file-preview__name\">{{\n            filename\n        }}</span>\n        <VvIcon\n            v-if=\"loading\"\n            name=\"line-md:loading-loop\"\n            class=\"pk-chatbot-file-preview__loading\" />\n        <VvIcon\n            v-else-if=\"error\"\n            name=\"ri:error-warning-line\"\n            :title=\"error\"\n            class=\"pk-chatbot-file-preview__error\" />\n        <button\n            v-if=\"removable && !loading\"\n            type=\"button\"\n            class=\"pk-chatbot-file-preview__remove\"\n            :title=\"$t('action.remove')\"\n            @click=\"$emit('remove')\">\n            <VvIcon name=\"ri:close-line\" />\n        </button>\n    </div>\n</template>\n\n<style lang=\"scss\">\n    .pk-chatbot-file-preview {\n        display: inline-flex;\n        align-items: center;\n        gap: var(--spacing-4);\n        max-width: 160px;\n        padding: var(--spacing-4) var(--spacing-xs);\n        background-color: var(--color-surface-1);\n        border: 1px solid var(--color-surface-3);\n        border-radius: var(--rounded-md);\n        font-size: var(--text-12);\n        color: var(--color-word-2);\n\n        &__thumb-link {\n            display: flex;\n            flex-shrink: 0;\n            cursor: pointer;\n        }\n\n        &__thumb {\n            width: var(--spacing-20);\n            height: var(--spacing-20);\n            object-fit: cover;\n            border-radius: var(--rounded-sm);\n            flex-shrink: 0;\n        }\n\n        &__icon-link {\n            display: flex;\n            flex-shrink: 0;\n            color: inherit;\n            text-decoration: none;\n        }\n\n        &__icon {\n            width: var(--spacing-16);\n            height: var(--spacing-16);\n            flex-shrink: 0;\n            color: var(--color-word-3);\n        }\n\n        &__name {\n            flex: 1;\n            min-width: 0;\n            overflow: hidden;\n            text-overflow: ellipsis;\n            white-space: nowrap;\n        }\n\n        &__loading,\n        &__error {\n            width: var(--spacing-14);\n            height: var(--spacing-14);\n            flex-shrink: 0;\n        }\n\n        &__error {\n            color: var(--color-danger);\n        }\n\n        &__remove {\n            background: none;\n            border: none;\n            cursor: pointer;\n            padding: 0;\n            color: var(--color-word-4);\n            flex-shrink: 0;\n            display: flex;\n            align-items: center;\n            line-height: 1;\n\n            &:hover {\n                color: var(--color-word-1);\n            }\n        }\n    }\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;EAII,IAAM,IAAQ,GAaR,IAAU,QAAe,EAAM,UAAU,WAAW,SAAS,CAAA,EAE7D,IAAa,GAAiB,EAC9B,EAAE,YAAS,eAAY,GAAc,EACrC,EAAE,YAAS,EAAY;GAAE,SAAS;GAAY,MAAM;GAAO,CAAA;SAEjE,EAAU,YAAY;AACb,KAAQ,UAGb,EAAQ,CAAC,EAAE,KAAK,EAAM,KAAK,CAAC,CAAA,EAC5B,MAAM,GAAK;IACd;;eAID,EA2CM,OA3CN,GA2CM;IA1CS,EAAA,SAAA,GAAA,EAAX,EAaM,OAAA;;cAbkB;KAAJ,KAAI;QACpB,EAWI,KAAA;KAVC,MAAM,EAAA;KACN,iBAAe,EAAA;KACf,mBAAiB,EAAA,EAAO,CAAC,EAAA,IAAG,CAAE;KAC9B,oBAAkB,EAAA,EAAO,CAAC,EAAA,IAAG,CAAE;KAC/B,qBAAmB,EAAA,YAAQ;KAC5B,OAAM;QACN,EAG6C,OAAA;KAFxC,KAAK,EAAA;KACL,KAAK,EAAA;KACN,OAAM;2CAGlB,EAOI,KAAA;;KALC,MAAM,EAAA;KACP,QAAO;KACP,KAAI;KACJ,OAAM;QACN,EAAoE,GAAA;KAA5D,MAAK;KAAe,OAAM;;IAE1B,EAAA,YAAA,GAAA,EAAZ,EAES,QAFT,GAES,EADL,EAAA,SAAQ,EAAA,EAAA,IAAA,EAAA,IAAA,GAAA;IAGF,EAAA,WAAA,GAAA,EADV,EAG+C,GAAA;;KAD3C,MAAK;KACL,OAAM;UAEK,EAAA,SAAA,GAAA,EADf,EAI6C,GAAA;;KAFzC,MAAK;KACJ,OAAO,EAAA;KACR,OAAM;;IAEA,EAAA,aAAS,CAAK,EAAA,WAAA,GAAA,EADxB,EAOS,UAAA;;KALL,MAAK;KACL,OAAM;KACL,OAAOA,EAAAA,GAAE,gBAAA;KACT,SAAK,AAAA,EAAA,QAAA,MAAEC,EAAAA,MAAK,SAAA;QACb,EAA+B,GAAA,EAAvB,MAAK,iBAAe,CAAA,CAAA,EAAA,GAAA,EAAA,IAAA,EAAA,IAAA,GAAA"}
+{"version":3,"file":"PkChatbotFilePreview-DHzuGtz5.js","names":["$t","$emit"],"sources":["../../../../packages/components/src/chat/PkChatbotFilePreview.vue","../../../../packages/components/src/chat/PkChatbotFilePreview.vue"],"sourcesContent":["<script lang=\"ts\" setup>\n    import { computed, ref, onMounted } from 'vue'\n    import { useLightbox, useImageSizes } from '../composables/useLightbox'\n\n    const props = defineProps<{\n        mediaType: string\n        url: string\n        filename?: string\n        loading?: boolean\n        error?: string\n        removable?: boolean\n    }>()\n\n    defineEmits<{\n        remove: []\n    }>()\n\n    const isImage = computed(() => props.mediaType.startsWith('image/'))\n\n    const galleryRef = ref<HTMLElement>()\n    const { preload, getSize } = useImageSizes()\n    const { init } = useLightbox({ gallery: galleryRef, loop: false })\n\n    onMounted(async () => {\n        if (!isImage.value) {\n            return\n        }\n        preload([{ url: props.url }])\n        await init()\n    })\n</script>\n\n<template>\n    <div class=\"pk-chatbot-file-preview\">\n        <div v-if=\"isImage\" ref=\"galleryRef\">\n            <a\n                :href=\"url\"\n                :data-pswp-src=\"url\"\n                :data-pswp-width=\"getSize(url).width\"\n                :data-pswp-height=\"getSize(url).height\"\n                :data-pswp-caption=\"filename ?? ''\"\n                class=\"pk-chatbot-file-preview__thumb-link\">\n                <img\n                    :src=\"url\"\n                    :alt=\"filename\"\n                    class=\"pk-chatbot-file-preview__thumb\" />\n            </a>\n        </div>\n        <a\n            v-else\n            :href=\"url\"\n            target=\"_blank\"\n            rel=\"noopener noreferrer\"\n            class=\"pk-chatbot-file-preview__icon-link\">\n            <VvIcon name=\"ri:file-line\" class=\"pk-chatbot-file-preview__icon\" />\n        </a>\n        <span v-if=\"filename\" class=\"pk-chatbot-file-preview__name\">{{\n            filename\n        }}</span>\n        <VvIcon\n            v-if=\"loading\"\n            name=\"line-md:loading-loop\"\n            class=\"pk-chatbot-file-preview__loading\" />\n        <VvIcon\n            v-else-if=\"error\"\n            name=\"ri:error-warning-line\"\n            :title=\"error\"\n            class=\"pk-chatbot-file-preview__error\" />\n        <button\n            v-if=\"removable && !loading\"\n            type=\"button\"\n            class=\"pk-chatbot-file-preview__remove\"\n            :title=\"$t('action.remove')\"\n            @click=\"$emit('remove')\">\n            <VvIcon name=\"ri:close-line\" />\n        </button>\n    </div>\n</template>\n\n<style lang=\"scss\">\n    .pk-chatbot-file-preview {\n        display: inline-flex;\n        align-items: center;\n        gap: var(--spacing-4);\n        max-width: 160px;\n        padding: var(--spacing-4) var(--spacing-xs);\n        background-color: var(--color-surface-1);\n        border: 1px solid var(--color-surface-3);\n        border-radius: var(--rounded-md);\n        font-size: var(--text-12);\n        color: var(--color-word-2);\n\n        &__thumb-link {\n            display: flex;\n            flex-shrink: 0;\n            cursor: pointer;\n        }\n\n        &__thumb {\n            width: var(--spacing-20);\n            height: var(--spacing-20);\n            object-fit: cover;\n            border-radius: var(--rounded-sm);\n            flex-shrink: 0;\n        }\n\n        &__icon-link {\n            display: flex;\n            flex-shrink: 0;\n            color: inherit;\n            text-decoration: none;\n        }\n\n        &__icon {\n            width: var(--spacing-16);\n            height: var(--spacing-16);\n            flex-shrink: 0;\n            color: var(--color-word-3);\n        }\n\n        &__name {\n            flex: 1;\n            min-width: 0;\n            overflow: hidden;\n            text-overflow: ellipsis;\n            white-space: nowrap;\n        }\n\n        &__loading,\n        &__error {\n            width: var(--spacing-14);\n            height: var(--spacing-14);\n            flex-shrink: 0;\n        }\n\n        &__error {\n            color: var(--color-danger);\n        }\n\n        &__remove {\n            background: none;\n            border: none;\n            cursor: pointer;\n            padding: 0;\n            color: var(--color-word-4);\n            flex-shrink: 0;\n            display: flex;\n            align-items: center;\n            line-height: 1;\n\n            &:hover {\n                color: var(--color-word-1);\n            }\n        }\n    }\n</style>\n","<script lang=\"ts\" setup>\n    import { computed, ref, onMounted } from 'vue'\n    import { useLightbox, useImageSizes } from '../composables/useLightbox'\n\n    const props = defineProps<{\n        mediaType: string\n        url: string\n        filename?: string\n        loading?: boolean\n        error?: string\n        removable?: boolean\n    }>()\n\n    defineEmits<{\n        remove: []\n    }>()\n\n    const isImage = computed(() => props.mediaType.startsWith('image/'))\n\n    const galleryRef = ref<HTMLElement>()\n    const { preload, getSize } = useImageSizes()\n    const { init } = useLightbox({ gallery: galleryRef, loop: false })\n\n    onMounted(async () => {\n        if (!isImage.value) {\n            return\n        }\n        preload([{ url: props.url }])\n        await init()\n    })\n</script>\n\n<template>\n    <div class=\"pk-chatbot-file-preview\">\n        <div v-if=\"isImage\" ref=\"galleryRef\">\n            <a\n                :href=\"url\"\n                :data-pswp-src=\"url\"\n                :data-pswp-width=\"getSize(url).width\"\n                :data-pswp-height=\"getSize(url).height\"\n                :data-pswp-caption=\"filename ?? ''\"\n                class=\"pk-chatbot-file-preview__thumb-link\">\n                <img\n                    :src=\"url\"\n                    :alt=\"filename\"\n                    class=\"pk-chatbot-file-preview__thumb\" />\n            </a>\n        </div>\n        <a\n            v-else\n            :href=\"url\"\n            target=\"_blank\"\n            rel=\"noopener noreferrer\"\n            class=\"pk-chatbot-file-preview__icon-link\">\n            <VvIcon name=\"ri:file-line\" class=\"pk-chatbot-file-preview__icon\" />\n        </a>\n        <span v-if=\"filename\" class=\"pk-chatbot-file-preview__name\">{{\n            filename\n        }}</span>\n        <VvIcon\n            v-if=\"loading\"\n            name=\"line-md:loading-loop\"\n            class=\"pk-chatbot-file-preview__loading\" />\n        <VvIcon\n            v-else-if=\"error\"\n            name=\"ri:error-warning-line\"\n            :title=\"error\"\n            class=\"pk-chatbot-file-preview__error\" />\n        <button\n            v-if=\"removable && !loading\"\n            type=\"button\"\n            class=\"pk-chatbot-file-preview__remove\"\n            :title=\"$t('action.remove')\"\n            @click=\"$emit('remove')\">\n            <VvIcon name=\"ri:close-line\" />\n        </button>\n    </div>\n</template>\n\n<style lang=\"scss\">\n    .pk-chatbot-file-preview {\n        display: inline-flex;\n        align-items: center;\n        gap: var(--spacing-4);\n        max-width: 160px;\n        padding: var(--spacing-4) var(--spacing-xs);\n        background-color: var(--color-surface-1);\n        border: 1px solid var(--color-surface-3);\n        border-radius: var(--rounded-md);\n        font-size: var(--text-12);\n        color: var(--color-word-2);\n\n        &__thumb-link {\n            display: flex;\n            flex-shrink: 0;\n            cursor: pointer;\n        }\n\n        &__thumb {\n            width: var(--spacing-20);\n            height: var(--spacing-20);\n            object-fit: cover;\n            border-radius: var(--rounded-sm);\n            flex-shrink: 0;\n        }\n\n        &__icon-link {\n            display: flex;\n            flex-shrink: 0;\n            color: inherit;\n            text-decoration: none;\n        }\n\n        &__icon {\n            width: var(--spacing-16);\n            height: var(--spacing-16);\n            flex-shrink: 0;\n            color: var(--color-word-3);\n        }\n\n        &__name {\n            flex: 1;\n            min-width: 0;\n            overflow: hidden;\n            text-overflow: ellipsis;\n            white-space: nowrap;\n        }\n\n        &__loading,\n        &__error {\n            width: var(--spacing-14);\n            height: var(--spacing-14);\n            flex-shrink: 0;\n        }\n\n        &__error {\n            color: var(--color-danger);\n        }\n\n        &__remove {\n            background: none;\n            border: none;\n            cursor: pointer;\n            padding: 0;\n            color: var(--color-word-4);\n            flex-shrink: 0;\n            display: flex;\n            align-items: center;\n            line-height: 1;\n\n            &:hover {\n                color: var(--color-word-1);\n            }\n        }\n    }\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;EAII,IAAM,IAAQ,GAaR,IAAU,QAAe,EAAM,UAAU,WAAW,SAAS,CAAA,EAE7D,IAAa,GAAiB,EAC9B,EAAE,YAAS,eAAY,GAAc,EACrC,EAAE,YAAS,EAAY;GAAE,SAAS;GAAY,MAAM;GAAO,CAAA;SAEjE,EAAU,YAAY;AACb,KAAQ,UAGb,EAAQ,CAAC,EAAE,KAAK,EAAM,KAAK,CAAC,CAAA,EAC5B,MAAM,GAAK;IACd;;eAID,EA2CM,OA3CN,GA2CM;IA1CS,EAAA,SAAA,GAAA,EAAX,EAaM,OAAA;;cAbkB;KAAJ,KAAI;QACpB,EAWI,KAAA;KAVC,MAAM,EAAA;KACN,iBAAe,EAAA;KACf,mBAAiB,EAAA,EAAO,CAAC,EAAA,IAAG,CAAE;KAC9B,oBAAkB,EAAA,EAAO,CAAC,EAAA,IAAG,CAAE;KAC/B,qBAAmB,EAAA,YAAQ;KAC5B,OAAM;QACN,EAG6C,OAAA;KAFxC,KAAK,EAAA;KACL,KAAK,EAAA;KACN,OAAM;2CAGlB,EAOI,KAAA;;KALC,MAAM,EAAA;KACP,QAAO;KACP,KAAI;KACJ,OAAM;QACN,EAAoE,GAAA;KAA5D,MAAK;KAAe,OAAM;;IAE1B,EAAA,YAAA,GAAA,EAAZ,EAES,QAFT,GAES,EADL,EAAA,SAAQ,EAAA,EAAA,IAAA,EAAA,IAAA,GAAA;IAGF,EAAA,WAAA,GAAA,EADV,EAG+C,GAAA;;KAD3C,MAAK;KACL,OAAM;UAEK,EAAA,SAAA,GAAA,EADf,EAI6C,GAAA;;KAFzC,MAAK;KACJ,OAAO,EAAA;KACR,OAAM;;IAEA,EAAA,aAAS,CAAK,EAAA,WAAA,GAAA,EADxB,EAOS,UAAA;;KALL,MAAK;KACL,OAAM;KACL,OAAOA,EAAAA,GAAE,gBAAA;KACT,SAAK,AAAA,EAAA,QAAA,MAAEC,EAAAA,MAAK,SAAA;QACb,EAA+B,GAAA,EAAvB,MAAK,iBAAe,CAAA,CAAA,EAAA,GAAA,EAAA,IAAA,EAAA,IAAA,GAAA"}

package/dist-vue/_chunks/{PkChatbotInput-ODPhsqZt.js → PkChatbotInput-C5QSmt21.js}

@@ -1,5 +1,5 @@
-import { t as e } from "./PkStreamingMarkdown-CtiMH6FD.js";
-import { t } from "./PkChatbotFilePreview-JSpi3pmN.js";
+import { t as e } from "./PkStreamingMarkdown-BAhC3uGK.js";
+import { t } from "./PkChatbotFilePreview-DHzuGtz5.js";
 import { Fragment as n, computed as r, createBlock as i, createCommentVNode as a, createElementBlock as o, createElementVNode as s, createTextVNode as c, createVNode as l, defineComponent as u, mergeModels as d, mergeProps as f, nextTick as p, normalizeClass as ee, normalizeProps as te, onBeforeUnmount as m, onMounted as h, openBlock as g, ref as _, renderList as ne, renderSlot as re, toDisplayString as v, unref as y, useModel as b, useTemplateRef as x, vModelText as ie, withCtx as S, withDirectives as ae, withKeys as oe, withModifiers as C } from "vue";
 import { VvButton as se, VvDropdown as ce, VvDropdownAction as le, VvIcon as ue } from "@volverjs/ui-vue/components";
 import { useDropZone as de } from "@vueuse/core";
@@ -302,4 +302,4 @@ var O = D, fe = { class: "pk-chatbot-input" }, pe = {
 //#endregion
 export { L as t };
 
-//# sourceMappingURL=PkChatbotInput-ODPhsqZt.js.map
+//# sourceMappingURL=PkChatbotInput-C5QSmt21.js.map

package/dist-vue/_chunks/{PkChatbotInput-ODPhsqZt.js.map → PkChatbotInput-C5QSmt21.js.map}

@@ -1 +1 @@
-{"version":3,"file":"PkChatbotInput-ODPhsqZt.js","names":["$t","$slots","$n"],"sources":["../../../../node_modules/.pnpm/autosize@6.0.1/node_modules/autosize/dist/autosize.esm.js","../../../../packages/components/src/chat/PkChatbotInput.vue","../../../../packages/components/src/chat/PkChatbotInput.vue"],"sourcesContent":["var e=new Map;function t(t){var o=e.get(t);o&&o.destroy()}function o(t){var o=e.get(t);o&&o.update()}var r=null;\"undefined\"==typeof window?((r=function(e){return e}).destroy=function(e){return e},r.update=function(e){return e}):((r=function(t,o){return t&&Array.prototype.forEach.call(t.length?t:[t],function(t){return function(t){if(t&&t.nodeName&&\"TEXTAREA\"===t.nodeName&&!e.has(t)){var o,r=null,n=window.getComputedStyle(t),i=(o=t.value,function(){a({testForHeightReduction:\"\"===o||!t.value.startsWith(o),restoreTextAlign:null}),o=t.value}),l=function(o){t.removeEventListener(\"autosize:destroy\",l),t.removeEventListener(\"autosize:update\",s),t.removeEventListener(\"input\",i),window.removeEventListener(\"resize\",s),Object.keys(o).forEach(function(e){return t.style[e]=o[e]}),e.delete(t)}.bind(t,{height:t.style.height,resize:t.style.resize,textAlign:t.style.textAlign,overflowY:t.style.overflowY,overflowX:t.style.overflowX,wordWrap:t.style.wordWrap});t.addEventListener(\"autosize:destroy\",l),t.addEventListener(\"autosize:update\",s),t.addEventListener(\"input\",i),window.addEventListener(\"resize\",s),t.style.overflowX=\"hidden\",t.style.wordWrap=\"break-word\",e.set(t,{destroy:l,update:s}),s()}function a(e){var o,i,l=e.restoreTextAlign,s=void 0===l?null:l,d=e.testForHeightReduction,u=void 0===d||d,c=n.overflowY;if(0!==t.scrollHeight&&(\"vertical\"===n.resize?t.style.resize=\"none\":\"both\"===n.resize&&(t.style.resize=\"horizontal\"),u&&(o=function(e){for(var t=[];e&&e.parentNode&&e.parentNode instanceof Element;)e.parentNode.scrollTop&&t.push([e.parentNode,e.parentNode.scrollTop]),e=e.parentNode;return function(){return t.forEach(function(e){var t=e[0],o=e[1];t.style.scrollBehavior=\"auto\",t.scrollTop=o,t.style.scrollBehavior=null})}}(t),t.style.height=\"\"),i=\"content-box\"===n.boxSizing?t.scrollHeight-(parseFloat(n.paddingTop)+parseFloat(n.paddingBottom)):t.scrollHeight+parseFloat(n.borderTopWidth)+parseFloat(n.borderBottomWidth),\"none\"!==n.maxHeight&&i>parseFloat(n.maxHeight)?(\"hidden\"===n.overflowY&&(t.style.overflow=\"scroll\"),i=parseFloat(n.maxHeight)):\"hidden\"!==n.overflowY&&(t.style.overflow=\"hidden\"),t.style.height=i+\"px\",s&&(t.style.textAlign=s),o&&o(),r!==i&&(t.dispatchEvent(new Event(\"autosize:resized\",{bubbles:!0})),r=i),c!==n.overflow&&!s)){var v=n.textAlign;\"hidden\"===n.overflow&&(t.style.textAlign=\"start\"===v?\"end\":\"start\"),a({restoreTextAlign:v,testForHeightReduction:!0})}}function s(){a({testForHeightReduction:!0,restoreTextAlign:null})}}(t)}),t}).destroy=function(e){return e&&Array.prototype.forEach.call(e.length?e:[e],t),e},r.update=function(e){return e&&Array.prototype.forEach.call(e.length?e:[e],o),e});var n=r;export default n;\n","<script setup lang=\"ts\">\n    // @ts-expect-error - no types for autosize\n    import autosize from 'autosize'\n    import {\n        computed,\n        nextTick,\n        onBeforeUnmount,\n        onMounted,\n        ref,\n        useTemplateRef,\n    } from 'vue'\n    import { useDropZone } from '@vueuse/core'\n    import type { AgentFileUpload } from 'models'\n    import type { PendingAttachment } from 'composables'\n    import PkStreamingMarkdown from './PkStreamingMarkdown.vue'\n    import PkChatbotFilePreview from './PkChatbotFilePreview.vue'\n\n    const modelValue = defineModel<string>()\n    const pendingAttachments = defineModel<PendingAttachment[]>(\n        'pendingAttachments',\n        { default: () => [] },\n    )\n\n    const emit = defineEmits<{\n        submit: []\n        'stop-generation': []\n        'file-select': [file: File]\n    }>()\n\n    const props = defineProps<{\n        placeholder?: string\n        dismissableNotice?: string\n        status?: 'submitted' | 'streaming' | 'ready' | 'error'\n        maxMessageLength?: number\n        fileUpload?: AgentFileUpload\n        enableDragDrop?: boolean\n    }>()\n\n    const isDismissableNoticeVisible = ref<boolean>(true)\n    const closeDismissableNotice = () => {\n        isDismissableNoticeVisible.value = false\n    }\n\n    const textareaEl = useTemplateRef<HTMLTextAreaElement>('textareaEl')\n    const fileInputEl = useTemplateRef<HTMLInputElement>('fileInputEl')\n    const cameraInputEl = useTemplateRef<HTMLInputElement>('cameraInputEl')\n    const formEl = useTemplateRef<HTMLFormElement>('formEl')\n\n    const hasCaptureSupport = 'capture' in document.createElement('input')\n\n    onMounted(() => {\n        try {\n            if (textareaEl.value) {\n                autosize(textareaEl.value)\n            }\n        } catch {\n            // autosize initialization failed, textarea remains functional\n        }\n    })\n\n    onBeforeUnmount(() => {\n        try {\n            if (textareaEl.value) {\n                autosize.destroy(textareaEl.value)\n            }\n        } catch {\n            // ignore cleanup errors\n        }\n        for (const att of pendingAttachments.value) {\n            URL.revokeObjectURL(att.localUrl)\n        }\n    })\n\n    const isStreaming = computed(() => {\n        return props.status === 'streaming'\n    })\n    const isSubmitted = computed(() => {\n        return props.status === 'submitted'\n    })\n\n    const currentLength = computed(() => modelValue.value?.length ?? 0)\n\n    const isOverLimit = computed(() => {\n        return (\n            props.maxMessageLength !== undefined &&\n            currentLength.value > props.maxMessageLength\n        )\n    })\n\n    const isUploadingAnyFile = computed(() =>\n        pendingAttachments.value.some((a) => a.state === 'uploading'),\n    )\n\n    const acceptMimeTypes = computed(\n        () => props.fileUpload?.allowedMimeTypes?.join(',') ?? '',\n    )\n\n    const acceptImageMimeTypes = computed(() =>\n        (props.fileUpload?.allowedMimeTypes ?? [])\n            .filter((m) => m.startsWith('image/'))\n            .join(','),\n    )\n\n    const showCameraOption = computed(\n        () => hasCaptureSupport && acceptImageMimeTypes.value.length > 0,\n    )\n\n    const isSubmitEnabled = computed(() => {\n        if (isStreaming.value || isSubmitted.value) {\n            return false\n        }\n        if (isUploadingAnyFile.value) {\n            return false\n        }\n        if (isOverLimit.value) {\n            return false\n        }\n        return (modelValue.value?.trim().length ?? 0) > 0\n    })\n\n    const autosizeTextarea = () => {\n        if (textareaEl.value) {\n            autosize.update(textareaEl.value)\n        }\n    }\n\n    const handleSubmit = () => {\n        if (isSubmitEnabled.value) {\n            emit('submit')\n            nextTick(() => {\n                autosizeTextarea()\n                textareaEl.value?.blur()\n            })\n        }\n    }\n\n    const openFilePicker = () => {\n        fileInputEl.value?.click()\n    }\n\n    const openCameraPicker = () => {\n        cameraInputEl.value?.click()\n    }\n\n    const onFileChange = (event: Event) => {\n        const input = event.target as HTMLInputElement\n        const file = input.files?.[0]\n        if (file) {\n            emit('file-select', file)\n        }\n        // Reset so the same file can be selected again\n        input.value = ''\n    }\n\n    const removeAttachment = (id: string) => {\n        const att = pendingAttachments.value.find((a) => a.id === id)\n        if (att) {\n            URL.revokeObjectURL(att.localUrl)\n        }\n        pendingAttachments.value = pendingAttachments.value.filter(\n            (a) => a.id !== id,\n        )\n    }\n\n    const isDragDropEnabled = computed(\n        () => (props.enableDragDrop ?? true) && !!props.fileUpload?.enabled,\n    )\n\n    const handleDrop = (files: File[] | null) => {\n        if (!isDragDropEnabled.value || !files) {\n            return\n        }\n        for (const file of files) {\n            emit('file-select', file)\n        }\n    }\n\n    const { isOverDropZone } = useDropZone(formEl, {\n        dataTypes: computed(() => props.fileUpload?.allowedMimeTypes ?? []),\n        onDrop: handleDrop,\n    })\n</script>\n\n<template>\n    <div class=\"pk-chatbot-input\">\n        <div\n            v-if=\"dismissableNotice && isDismissableNoticeVisible\"\n            class=\"pk-chatbot-input-dismissable-notice\">\n            <PkStreamingMarkdown\n                :markdown=\"dismissableNotice\"\n                class=\"wysiwyg\" />\n            <VvButton\n                v-if=\"dismissableNotice\"\n                :title=\"$t('action.close')\"\n                modifiers=\"action-quiet\"\n                icon=\"ri:close-line\"\n                class=\"w-18 h-18\"\n                @click=\"closeDismissableNotice\" />\n        </div>\n        <form\n            ref=\"formEl\"\n            class=\"pk-chatbot-input__form\"\n            @submit.prevent=\"handleSubmit\">\n            <div\n                v-if=\"isOverDropZone && isDragDropEnabled\"\n                class=\"pk-chatbot-input__drop-overlay\">\n                <VvIcon\n                    name=\"ri:upload-cloud-2-line\"\n                    class=\"pk-chatbot-input__drop-overlay-icon\" />\n                <span>{{ $t('action.dropFile') }}</span>\n            </div>\n            <div\n                v-if=\"pendingAttachments.length\"\n                class=\"pk-chatbot-input__attachments\">\n                <PkChatbotFilePreview\n                    v-for=\"att in pendingAttachments\"\n                    :key=\"att.id\"\n                    :media-type=\"att.file.type\"\n                    :url=\"att.localUrl\"\n                    :filename=\"att.file.name\"\n                    :loading=\"att.state === 'uploading'\"\n                    :error=\"att.state === 'error' ? att.error : undefined\"\n                    :removable=\"att.state !== 'uploading'\"\n                    @remove=\"removeAttachment(att.id)\" />\n            </div>\n            <div class=\"pk-chatbot-input__fieldset\">\n                <VvDropdown\n                    v-if=\"\n                        fileUpload &&\n                        fileUpload.enabled &&\n                        (showCameraOption || $slots['additional-actions'])\n                    \"\n                    v-bind=\"{\n                        placement: 'top-start',\n                        modifiers: 'menu',\n                        flip: true,\n                        offset: 3,\n                    }\">\n                    <template #default=\"{ init, toggle, aria }\">\n                        <button\n                            :ref=\"(e: any) => init(e)\"\n                            v-bind=\"aria\"\n                            class=\"pk-chatbot-input__button\"\n                            type=\"button\"\n                            :title=\"$t('action.attachFile')\"\n                            :disabled=\"isStreaming || isSubmitted\"\n                            @click=\"toggle\">\n                            <VvIcon\n                                name=\"ri:add-line\"\n                                class=\"pk-chatbot-input__button-icon\" />\n                        </button>\n                    </template>\n                    <template #items>\n                        <VvDropdownAction\n                            v-if=\"showCameraOption\"\n                            :disabled=\"isStreaming || isSubmitted\"\n                            @click=\"openCameraPicker\">\n                            <VvIcon\n                                name=\"ri:camera-line\"\n                                class=\"pk-chatbot-input__dropdown-icon\" />\n                            {{ $t('action.takePhoto') }}\n                        </VvDropdownAction>\n                        <VvDropdownAction\n                            :disabled=\"isStreaming || isSubmitted\"\n                            @click=\"openFilePicker\">\n                            <VvIcon\n                                name=\"ri:attachment-line\"\n                                class=\"pk-chatbot-input__dropdown-icon\" />\n                            {{ $t('action.attachFile') }}\n                        </VvDropdownAction>\n                        <slot name=\"additional-actions\" />\n                    </template>\n                </VvDropdown>\n                <button\n                    v-else-if=\"fileUpload && fileUpload.enabled\"\n                    class=\"pk-chatbot-input__button\"\n                    type=\"button\"\n                    :title=\"$t('action.attachFile')\"\n                    :disabled=\"isStreaming || isSubmitted\"\n                    @click=\"openFilePicker\">\n                    <VvIcon\n                        name=\"ri:add-line\"\n                        class=\"pk-chatbot-input__button-icon\" />\n                </button>\n                <input\n                    v-if=\"fileUpload && fileUpload.enabled\"\n                    ref=\"fileInputEl\"\n                    type=\"file\"\n                    hidden\n                    :accept=\"acceptMimeTypes\"\n                    @change=\"onFileChange\" />\n                <input\n                    v-if=\"fileUpload && fileUpload.enabled && showCameraOption\"\n                    ref=\"cameraInputEl\"\n                    type=\"file\"\n                    capture=\"environment\"\n                    hidden\n                    :accept=\"acceptImageMimeTypes\"\n                    @change=\"onFileChange\" />\n                <div class=\"pk-chatbot-input__content\">\n                    <textarea\n                        ref=\"textareaEl\"\n                        v-model=\"modelValue\"\n                        class=\"pk-chatbot-input__textarea\"\n                        name=\"message\"\n                        rows=\"1\"\n                        :placeholder\n                        @focus=\"autosizeTextarea\"\n                        @blur=\"autosizeTextarea\"\n                        @paste=\"nextTick(autosizeTextarea)\"\n                        @keydown.enter.prevent=\"handleSubmit\"></textarea>\n                </div>\n                <div\n                    v-if=\"maxMessageLength\"\n                    class=\"pk-chatbot-input__counter\"\n                    :class=\"{ 'pk-chatbot-input__counter--over': isOverLimit }\">\n                    {{ $n(currentLength, 'integer') }}/<span\n                        class=\"opacity-60\"\n                        >{{ $n(maxMessageLength, 'integer') }}</span\n                    >\n                </div>\n                <button\n                    v-if=\"isStreaming\"\n                    class=\"pk-chatbot-input__button\"\n                    type=\"button\"\n                    :title=\"$t('action.stop')\"\n                    @click=\"emit('stop-generation')\">\n                    <VvIcon\n                        name=\"ri:stop-circle-line\"\n                        class=\"pk-chatbot-input__button-icon\" />\n                </button>\n                <button\n                    v-else\n                    class=\"pk-chatbot-input__button\"\n                    type=\"submit\"\n                    :title=\"\n                        isSubmitEnabled\n                            ? $t('action.submit')\n                            : $t('label.disabled')\n                    \"\n                    :disabled=\"!isSubmitEnabled\">\n                    <VvIcon\n                        :name=\"\n                            isSubmitted\n                                ? 'line-md:loading-loop'\n                                : isSubmitEnabled\n                                  ? 'ri:send-ins-fill'\n                                  : 'ri:send-ins-line'\n                        \"\n                        class=\"pk-chatbot-input__button-icon\" />\n                </button>\n            </div>\n        </form>\n    </div>\n</template>\n\n<style lang=\"scss\">\n    .pk-chatbot-input {\n        position: relative;\n        display: flex;\n        flex-direction: column;\n        margin-inline: var(--spacing-sm);\n        margin-bottom: var(--spacing-sm);\n\n        &-dismissable-notice {\n            position: relative;\n            padding: var(--spacing-sm);\n            display: flex;\n            align-items: flex-start;\n            justify-content: space-between;\n            gap: var(--spacing-sm);\n            background-color: var(--color-surface-1);\n            border-top-left-radius: var(--rounded-xl);\n            border-top-right-radius: var(--rounded-xl);\n            transition-property: var(--transition-property-all);\n            transition-duration: var(--duration-300);\n            transition-timing-function: var(--ease-in-out);\n            font-size: var(--text-14);\n            color: var(--color-word-2);\n\n            &::after {\n                content: '';\n                display: block;\n                position: absolute;\n                left: 0;\n                right: 0;\n                bottom: calc(-1 * var(--spacing-12));\n                height: var(--spacing-12);\n                background: var(--color-surface-1);\n                z-index: 1;\n            }\n        }\n\n        &__form {\n            position: relative;\n            display: flex;\n            z-index: 1;\n            flex-direction: column;\n            border-radius: var(--rounded-xl);\n            border: 1px solid var(--color-surface-3);\n            background-color: var(--color-surface);\n            padding: var(--spacing-14);\n            box-shadow: var(--shadow-lg);\n            font-size: var(\n                --text-16\n            ); // prevent ios zoom on input focus by using a font size >= 16px\n            gap: var(--spacing-xs);\n            transition: border-color var(--duration-200) var(--ease-in-out);\n\n            @include media-breakpoint-up('sm', $breakpoints) {\n                font-size: var(--text-14);\n                padding: var(--spacing-10);\n            }\n\n            &:has(:focus-within) {\n                border-color: var(--color-word-5);\n            }\n        }\n\n        &__drop-overlay {\n            position: absolute;\n            inset: 0;\n            z-index: 10;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            gap: var(--spacing-xs);\n            border-radius: var(--rounded-xl);\n            background-color: color-mix(\n                in srgb,\n                var(--color-surface) 85%,\n                transparent\n            );\n            pointer-events: none;\n        }\n\n        &__fieldset {\n            display: flex;\n            align-items: center;\n            gap: var(--spacing-xs);\n            flex: 1;\n        }\n\n        &__content {\n            flex: 1;\n            display: flex;\n            flex-direction: column;\n            gap: var(--spacing-4);\n            min-width: 0;\n            overflow: hidden;\n        }\n\n        &__textarea {\n            display: block;\n            border: none;\n            outline: none;\n            resize: none;\n            width: 100%;\n            color: var(--color-word-1);\n            background-color: var(--color-surface);\n            overflow: hidden;\n\n            &::placeholder {\n                color: var(--color-word-4);\n            }\n        }\n\n        &__attachments {\n            display: flex;\n            flex-wrap: wrap;\n            gap: var(--spacing-4);\n            padding-bottom: var(--spacing-xs);\n            border-bottom: 1px solid var(--color-surface-2);\n        }\n\n        &__button {\n            background-color: transparent;\n            border: none;\n            cursor: pointer;\n            color: var(--color-word-1);\n            padding: var(--spacing-4);\n            flex-shrink: 0;\n            transition: var(--transition-colors);\n            border-radius: var(--rounded);\n\n            &:hover {\n                background-color: var(--color-surface-2);\n            }\n\n            &:focus-visible {\n                outline: 1px solid var(--color-surface-5);\n                outline-offset: 0;\n            }\n\n            &:disabled {\n                cursor: not-allowed;\n                opacity: 0.5;\n            }\n\n            &-icon {\n                display: block;\n                width: var(--spacing-20);\n                height: var(--spacing-20);\n            }\n        }\n\n        &__counter {\n            background-color: var(--color-surface-1);\n            border: 1px solid var(--color-surface-3);\n            border-radius: var(--rounded-md);\n            font-size: var(--text-12);\n            color: var(--color-word-3);\n            line-height: 1;\n            padding-inline: var(--spacing-6);\n            padding-block: var(--spacing-4);\n            z-index: 1;\n            font-variant-numeric: tabular-nums;\n            font-family: var(--font-mono);\n            font-weight: var(--font-bold);\n\n            &--over {\n                color: var(--color-danger);\n                border-color: var(--color-danger-lighten-5);\n                font-weight: var(--font-bold);\n            }\n        }\n    }\n</style>\n","<script setup lang=\"ts\">\n    // @ts-expect-error - no types for autosize\n    import autosize from 'autosize'\n    import {\n        computed,\n        nextTick,\n        onBeforeUnmount,\n        onMounted,\n        ref,\n        useTemplateRef,\n    } from 'vue'\n    import { useDropZone } from '@vueuse/core'\n    import type { AgentFileUpload } from 'models'\n    import type { PendingAttachment } from 'composables'\n    import PkStreamingMarkdown from './PkStreamingMarkdown.vue'\n    import PkChatbotFilePreview from './PkChatbotFilePreview.vue'\n\n    const modelValue = defineModel<string>()\n    const pendingAttachments = defineModel<PendingAttachment[]>(\n        'pendingAttachments',\n        { default: () => [] },\n    )\n\n    const emit = defineEmits<{\n        submit: []\n        'stop-generation': []\n        'file-select': [file: File]\n    }>()\n\n    const props = defineProps<{\n        placeholder?: string\n        dismissableNotice?: string\n        status?: 'submitted' | 'streaming' | 'ready' | 'error'\n        maxMessageLength?: number\n        fileUpload?: AgentFileUpload\n        enableDragDrop?: boolean\n    }>()\n\n    const isDismissableNoticeVisible = ref<boolean>(true)\n    const closeDismissableNotice = () => {\n        isDismissableNoticeVisible.value = false\n    }\n\n    const textareaEl = useTemplateRef<HTMLTextAreaElement>('textareaEl')\n    const fileInputEl = useTemplateRef<HTMLInputElement>('fileInputEl')\n    const cameraInputEl = useTemplateRef<HTMLInputElement>('cameraInputEl')\n    const formEl = useTemplateRef<HTMLFormElement>('formEl')\n\n    const hasCaptureSupport = 'capture' in document.createElement('input')\n\n    onMounted(() => {\n        try {\n            if (textareaEl.value) {\n                autosize(textareaEl.value)\n            }\n        } catch {\n            // autosize initialization failed, textarea remains functional\n        }\n    })\n\n    onBeforeUnmount(() => {\n        try {\n            if (textareaEl.value) {\n                autosize.destroy(textareaEl.value)\n            }\n        } catch {\n            // ignore cleanup errors\n        }\n        for (const att of pendingAttachments.value) {\n            URL.revokeObjectURL(att.localUrl)\n        }\n    })\n\n    const isStreaming = computed(() => {\n        return props.status === 'streaming'\n    })\n    const isSubmitted = computed(() => {\n        return props.status === 'submitted'\n    })\n\n    const currentLength = computed(() => modelValue.value?.length ?? 0)\n\n    const isOverLimit = computed(() => {\n        return (\n            props.maxMessageLength !== undefined &&\n            currentLength.value > props.maxMessageLength\n        )\n    })\n\n    const isUploadingAnyFile = computed(() =>\n        pendingAttachments.value.some((a) => a.state === 'uploading'),\n    )\n\n    const acceptMimeTypes = computed(\n        () => props.fileUpload?.allowedMimeTypes?.join(',') ?? '',\n    )\n\n    const acceptImageMimeTypes = computed(() =>\n        (props.fileUpload?.allowedMimeTypes ?? [])\n            .filter((m) => m.startsWith('image/'))\n            .join(','),\n    )\n\n    const showCameraOption = computed(\n        () => hasCaptureSupport && acceptImageMimeTypes.value.length > 0,\n    )\n\n    const isSubmitEnabled = computed(() => {\n        if (isStreaming.value || isSubmitted.value) {\n            return false\n        }\n        if (isUploadingAnyFile.value) {\n            return false\n        }\n        if (isOverLimit.value) {\n            return false\n        }\n        return (modelValue.value?.trim().length ?? 0) > 0\n    })\n\n    const autosizeTextarea = () => {\n        if (textareaEl.value) {\n            autosize.update(textareaEl.value)\n        }\n    }\n\n    const handleSubmit = () => {\n        if (isSubmitEnabled.value) {\n            emit('submit')\n            nextTick(() => {\n                autosizeTextarea()\n                textareaEl.value?.blur()\n            })\n        }\n    }\n\n    const openFilePicker = () => {\n        fileInputEl.value?.click()\n    }\n\n    const openCameraPicker = () => {\n        cameraInputEl.value?.click()\n    }\n\n    const onFileChange = (event: Event) => {\n        const input = event.target as HTMLInputElement\n        const file = input.files?.[0]\n        if (file) {\n            emit('file-select', file)\n        }\n        // Reset so the same file can be selected again\n        input.value = ''\n    }\n\n    const removeAttachment = (id: string) => {\n        const att = pendingAttachments.value.find((a) => a.id === id)\n        if (att) {\n            URL.revokeObjectURL(att.localUrl)\n        }\n        pendingAttachments.value = pendingAttachments.value.filter(\n            (a) => a.id !== id,\n        )\n    }\n\n    const isDragDropEnabled = computed(\n        () => (props.enableDragDrop ?? true) && !!props.fileUpload?.enabled,\n    )\n\n    const handleDrop = (files: File[] | null) => {\n        if (!isDragDropEnabled.value || !files) {\n            return\n        }\n        for (const file of files) {\n            emit('file-select', file)\n        }\n    }\n\n    const { isOverDropZone } = useDropZone(formEl, {\n        dataTypes: computed(() => props.fileUpload?.allowedMimeTypes ?? []),\n        onDrop: handleDrop,\n    })\n</script>\n\n<template>\n    <div class=\"pk-chatbot-input\">\n        <div\n            v-if=\"dismissableNotice && isDismissableNoticeVisible\"\n            class=\"pk-chatbot-input-dismissable-notice\">\n            <PkStreamingMarkdown\n                :markdown=\"dismissableNotice\"\n                class=\"wysiwyg\" />\n            <VvButton\n                v-if=\"dismissableNotice\"\n                :title=\"$t('action.close')\"\n                modifiers=\"action-quiet\"\n                icon=\"ri:close-line\"\n                class=\"w-18 h-18\"\n                @click=\"closeDismissableNotice\" />\n        </div>\n        <form\n            ref=\"formEl\"\n            class=\"pk-chatbot-input__form\"\n            @submit.prevent=\"handleSubmit\">\n            <div\n                v-if=\"isOverDropZone && isDragDropEnabled\"\n                class=\"pk-chatbot-input__drop-overlay\">\n                <VvIcon\n                    name=\"ri:upload-cloud-2-line\"\n                    class=\"pk-chatbot-input__drop-overlay-icon\" />\n                <span>{{ $t('action.dropFile') }}</span>\n            </div>\n            <div\n                v-if=\"pendingAttachments.length\"\n                class=\"pk-chatbot-input__attachments\">\n                <PkChatbotFilePreview\n                    v-for=\"att in pendingAttachments\"\n                    :key=\"att.id\"\n                    :media-type=\"att.file.type\"\n                    :url=\"att.localUrl\"\n                    :filename=\"att.file.name\"\n                    :loading=\"att.state === 'uploading'\"\n                    :error=\"att.state === 'error' ? att.error : undefined\"\n                    :removable=\"att.state !== 'uploading'\"\n                    @remove=\"removeAttachment(att.id)\" />\n            </div>\n            <div class=\"pk-chatbot-input__fieldset\">\n                <VvDropdown\n                    v-if=\"\n                        fileUpload &&\n                        fileUpload.enabled &&\n                        (showCameraOption || $slots['additional-actions'])\n                    \"\n                    v-bind=\"{\n                        placement: 'top-start',\n                        modifiers: 'menu',\n                        flip: true,\n                        offset: 3,\n                    }\">\n                    <template #default=\"{ init, toggle, aria }\">\n                        <button\n                            :ref=\"(e: any) => init(e)\"\n                            v-bind=\"aria\"\n                            class=\"pk-chatbot-input__button\"\n                            type=\"button\"\n                            :title=\"$t('action.attachFile')\"\n                            :disabled=\"isStreaming || isSubmitted\"\n                            @click=\"toggle\">\n                            <VvIcon\n                                name=\"ri:add-line\"\n                                class=\"pk-chatbot-input__button-icon\" />\n                        </button>\n                    </template>\n                    <template #items>\n                        <VvDropdownAction\n                            v-if=\"showCameraOption\"\n                            :disabled=\"isStreaming || isSubmitted\"\n                            @click=\"openCameraPicker\">\n                            <VvIcon\n                                name=\"ri:camera-line\"\n                                class=\"pk-chatbot-input__dropdown-icon\" />\n                            {{ $t('action.takePhoto') }}\n                        </VvDropdownAction>\n                        <VvDropdownAction\n                            :disabled=\"isStreaming || isSubmitted\"\n                            @click=\"openFilePicker\">\n                            <VvIcon\n                                name=\"ri:attachment-line\"\n                                class=\"pk-chatbot-input__dropdown-icon\" />\n                            {{ $t('action.attachFile') }}\n                        </VvDropdownAction>\n                        <slot name=\"additional-actions\" />\n                    </template>\n                </VvDropdown>\n                <button\n                    v-else-if=\"fileUpload && fileUpload.enabled\"\n                    class=\"pk-chatbot-input__button\"\n                    type=\"button\"\n                    :title=\"$t('action.attachFile')\"\n                    :disabled=\"isStreaming || isSubmitted\"\n                    @click=\"openFilePicker\">\n                    <VvIcon\n                        name=\"ri:add-line\"\n                        class=\"pk-chatbot-input__button-icon\" />\n                </button>\n                <input\n                    v-if=\"fileUpload && fileUpload.enabled\"\n                    ref=\"fileInputEl\"\n                    type=\"file\"\n                    hidden\n                    :accept=\"acceptMimeTypes\"\n                    @change=\"onFileChange\" />\n                <input\n                    v-if=\"fileUpload && fileUpload.enabled && showCameraOption\"\n                    ref=\"cameraInputEl\"\n                    type=\"file\"\n                    capture=\"environment\"\n                    hidden\n                    :accept=\"acceptImageMimeTypes\"\n                    @change=\"onFileChange\" />\n                <div class=\"pk-chatbot-input__content\">\n                    <textarea\n                        ref=\"textareaEl\"\n                        v-model=\"modelValue\"\n                        class=\"pk-chatbot-input__textarea\"\n                        name=\"message\"\n                        rows=\"1\"\n                        :placeholder\n                        @focus=\"autosizeTextarea\"\n                        @blur=\"autosizeTextarea\"\n                        @paste=\"nextTick(autosizeTextarea)\"\n                        @keydown.enter.prevent=\"handleSubmit\"></textarea>\n                </div>\n                <div\n                    v-if=\"maxMessageLength\"\n                    class=\"pk-chatbot-input__counter\"\n                    :class=\"{ 'pk-chatbot-input__counter--over': isOverLimit }\">\n                    {{ $n(currentLength, 'integer') }}/<span\n                        class=\"opacity-60\"\n                        >{{ $n(maxMessageLength, 'integer') }}</span\n                    >\n                </div>\n                <button\n                    v-if=\"isStreaming\"\n                    class=\"pk-chatbot-input__button\"\n                    type=\"button\"\n                    :title=\"$t('action.stop')\"\n                    @click=\"emit('stop-generation')\">\n                    <VvIcon\n                        name=\"ri:stop-circle-line\"\n                        class=\"pk-chatbot-input__button-icon\" />\n                </button>\n                <button\n                    v-else\n                    class=\"pk-chatbot-input__button\"\n                    type=\"submit\"\n                    :title=\"\n                        isSubmitEnabled\n                            ? $t('action.submit')\n                            : $t('label.disabled')\n                    \"\n                    :disabled=\"!isSubmitEnabled\">\n                    <VvIcon\n                        :name=\"\n                            isSubmitted\n                                ? 'line-md:loading-loop'\n                                : isSubmitEnabled\n                                  ? 'ri:send-ins-fill'\n                                  : 'ri:send-ins-line'\n                        \"\n                        class=\"pk-chatbot-input__button-icon\" />\n                </button>\n            </div>\n        </form>\n    </div>\n</template>\n\n<style lang=\"scss\">\n    .pk-chatbot-input {\n        position: relative;\n        display: flex;\n        flex-direction: column;\n        margin-inline: var(--spacing-sm);\n        margin-bottom: var(--spacing-sm);\n\n        &-dismissable-notice {\n            position: relative;\n            padding: var(--spacing-sm);\n            display: flex;\n            align-items: flex-start;\n            justify-content: space-between;\n            gap: var(--spacing-sm);\n            background-color: var(--color-surface-1);\n            border-top-left-radius: var(--rounded-xl);\n            border-top-right-radius: var(--rounded-xl);\n            transition-property: var(--transition-property-all);\n            transition-duration: var(--duration-300);\n            transition-timing-function: var(--ease-in-out);\n            font-size: var(--text-14);\n            color: var(--color-word-2);\n\n            &::after {\n                content: '';\n                display: block;\n                position: absolute;\n                left: 0;\n                right: 0;\n                bottom: calc(-1 * var(--spacing-12));\n                height: var(--spacing-12);\n                background: var(--color-surface-1);\n                z-index: 1;\n            }\n        }\n\n        &__form {\n            position: relative;\n            display: flex;\n            z-index: 1;\n            flex-direction: column;\n            border-radius: var(--rounded-xl);\n            border: 1px solid var(--color-surface-3);\n            background-color: var(--color-surface);\n            padding: var(--spacing-14);\n            box-shadow: var(--shadow-lg);\n            font-size: var(\n                --text-16\n            ); // prevent ios zoom on input focus by using a font size >= 16px\n            gap: var(--spacing-xs);\n            transition: border-color var(--duration-200) var(--ease-in-out);\n\n            @include media-breakpoint-up('sm', $breakpoints) {\n                font-size: var(--text-14);\n                padding: var(--spacing-10);\n            }\n\n            &:has(:focus-within) {\n                border-color: var(--color-word-5);\n            }\n        }\n\n        &__drop-overlay {\n            position: absolute;\n            inset: 0;\n            z-index: 10;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            gap: var(--spacing-xs);\n            border-radius: var(--rounded-xl);\n            background-color: color-mix(\n                in srgb,\n                var(--color-surface) 85%,\n                transparent\n            );\n            pointer-events: none;\n        }\n\n        &__fieldset {\n            display: flex;\n            align-items: center;\n            gap: var(--spacing-xs);\n            flex: 1;\n        }\n\n        &__content {\n            flex: 1;\n            display: flex;\n            flex-direction: column;\n            gap: var(--spacing-4);\n            min-width: 0;\n            overflow: hidden;\n        }\n\n        &__textarea {\n            display: block;\n            border: none;\n            outline: none;\n            resize: none;\n            width: 100%;\n            color: var(--color-word-1);\n            background-color: var(--color-surface);\n            overflow: hidden;\n\n            &::placeholder {\n                color: var(--color-word-4);\n            }\n        }\n\n        &__attachments {\n            display: flex;\n            flex-wrap: wrap;\n            gap: var(--spacing-4);\n            padding-bottom: var(--spacing-xs);\n            border-bottom: 1px solid var(--color-surface-2);\n        }\n\n        &__button {\n            background-color: transparent;\n            border: none;\n            cursor: pointer;\n            color: var(--color-word-1);\n            padding: var(--spacing-4);\n            flex-shrink: 0;\n            transition: var(--transition-colors);\n            border-radius: var(--rounded);\n\n            &:hover {\n                background-color: var(--color-surface-2);\n            }\n\n            &:focus-visible {\n                outline: 1px solid var(--color-surface-5);\n                outline-offset: 0;\n            }\n\n            &:disabled {\n                cursor: not-allowed;\n                opacity: 0.5;\n            }\n\n            &-icon {\n                display: block;\n                width: var(--spacing-20);\n                height: var(--spacing-20);\n            }\n        }\n\n        &__counter {\n            background-color: var(--color-surface-1);\n            border: 1px solid var(--color-surface-3);\n            border-radius: var(--rounded-md);\n            font-size: var(--text-12);\n            color: var(--color-word-3);\n            line-height: 1;\n            padding-inline: var(--spacing-6);\n            padding-block: var(--spacing-4);\n            z-index: 1;\n            font-variant-numeric: tabular-nums;\n            font-family: var(--font-mono);\n            font-weight: var(--font-bold);\n\n            &--over {\n                color: var(--color-danger);\n                border-color: var(--color-danger-lighten-5);\n                font-weight: var(--font-bold);\n            }\n        }\n    }\n</style>\n"],"x_google_ignoreList":[0],"mappings":"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"}
+{"version":3,"file":"PkChatbotInput-C5QSmt21.js","names":["$t","$slots","$n"],"sources":["../../../../node_modules/.pnpm/autosize@6.0.1/node_modules/autosize/dist/autosize.esm.js","../../../../packages/components/src/chat/PkChatbotInput.vue","../../../../packages/components/src/chat/PkChatbotInput.vue"],"sourcesContent":["var e=new Map;function t(t){var o=e.get(t);o&&o.destroy()}function o(t){var o=e.get(t);o&&o.update()}var r=null;\"undefined\"==typeof window?((r=function(e){return e}).destroy=function(e){return e},r.update=function(e){return e}):((r=function(t,o){return t&&Array.prototype.forEach.call(t.length?t:[t],function(t){return function(t){if(t&&t.nodeName&&\"TEXTAREA\"===t.nodeName&&!e.has(t)){var o,r=null,n=window.getComputedStyle(t),i=(o=t.value,function(){a({testForHeightReduction:\"\"===o||!t.value.startsWith(o),restoreTextAlign:null}),o=t.value}),l=function(o){t.removeEventListener(\"autosize:destroy\",l),t.removeEventListener(\"autosize:update\",s),t.removeEventListener(\"input\",i),window.removeEventListener(\"resize\",s),Object.keys(o).forEach(function(e){return t.style[e]=o[e]}),e.delete(t)}.bind(t,{height:t.style.height,resize:t.style.resize,textAlign:t.style.textAlign,overflowY:t.style.overflowY,overflowX:t.style.overflowX,wordWrap:t.style.wordWrap});t.addEventListener(\"autosize:destroy\",l),t.addEventListener(\"autosize:update\",s),t.addEventListener(\"input\",i),window.addEventListener(\"resize\",s),t.style.overflowX=\"hidden\",t.style.wordWrap=\"break-word\",e.set(t,{destroy:l,update:s}),s()}function a(e){var o,i,l=e.restoreTextAlign,s=void 0===l?null:l,d=e.testForHeightReduction,u=void 0===d||d,c=n.overflowY;if(0!==t.scrollHeight&&(\"vertical\"===n.resize?t.style.resize=\"none\":\"both\"===n.resize&&(t.style.resize=\"horizontal\"),u&&(o=function(e){for(var t=[];e&&e.parentNode&&e.parentNode instanceof Element;)e.parentNode.scrollTop&&t.push([e.parentNode,e.parentNode.scrollTop]),e=e.parentNode;return function(){return t.forEach(function(e){var t=e[0],o=e[1];t.style.scrollBehavior=\"auto\",t.scrollTop=o,t.style.scrollBehavior=null})}}(t),t.style.height=\"\"),i=\"content-box\"===n.boxSizing?t.scrollHeight-(parseFloat(n.paddingTop)+parseFloat(n.paddingBottom)):t.scrollHeight+parseFloat(n.borderTopWidth)+parseFloat(n.borderBottomWidth),\"none\"!==n.maxHeight&&i>parseFloat(n.maxHeight)?(\"hidden\"===n.overflowY&&(t.style.overflow=\"scroll\"),i=parseFloat(n.maxHeight)):\"hidden\"!==n.overflowY&&(t.style.overflow=\"hidden\"),t.style.height=i+\"px\",s&&(t.style.textAlign=s),o&&o(),r!==i&&(t.dispatchEvent(new Event(\"autosize:resized\",{bubbles:!0})),r=i),c!==n.overflow&&!s)){var v=n.textAlign;\"hidden\"===n.overflow&&(t.style.textAlign=\"start\"===v?\"end\":\"start\"),a({restoreTextAlign:v,testForHeightReduction:!0})}}function s(){a({testForHeightReduction:!0,restoreTextAlign:null})}}(t)}),t}).destroy=function(e){return e&&Array.prototype.forEach.call(e.length?e:[e],t),e},r.update=function(e){return e&&Array.prototype.forEach.call(e.length?e:[e],o),e});var n=r;export default n;\n","<script setup lang=\"ts\">\n    // @ts-expect-error - no types for autosize\n    import autosize from 'autosize'\n    import {\n        computed,\n        nextTick,\n        onBeforeUnmount,\n        onMounted,\n        ref,\n        useTemplateRef,\n    } from 'vue'\n    import { useDropZone } from '@vueuse/core'\n    import type { AgentFileUpload } from 'models'\n    import type { PendingAttachment } from 'composables'\n    import PkStreamingMarkdown from './PkStreamingMarkdown.vue'\n    import PkChatbotFilePreview from './PkChatbotFilePreview.vue'\n\n    const modelValue = defineModel<string>()\n    const pendingAttachments = defineModel<PendingAttachment[]>(\n        'pendingAttachments',\n        { default: () => [] },\n    )\n\n    const emit = defineEmits<{\n        submit: []\n        'stop-generation': []\n        'file-select': [file: File]\n    }>()\n\n    const props = defineProps<{\n        placeholder?: string\n        dismissableNotice?: string\n        status?: 'submitted' | 'streaming' | 'ready' | 'error'\n        maxMessageLength?: number\n        fileUpload?: AgentFileUpload\n        enableDragDrop?: boolean\n    }>()\n\n    const isDismissableNoticeVisible = ref<boolean>(true)\n    const closeDismissableNotice = () => {\n        isDismissableNoticeVisible.value = false\n    }\n\n    const textareaEl = useTemplateRef<HTMLTextAreaElement>('textareaEl')\n    const fileInputEl = useTemplateRef<HTMLInputElement>('fileInputEl')\n    const cameraInputEl = useTemplateRef<HTMLInputElement>('cameraInputEl')\n    const formEl = useTemplateRef<HTMLFormElement>('formEl')\n\n    const hasCaptureSupport = 'capture' in document.createElement('input')\n\n    onMounted(() => {\n        try {\n            if (textareaEl.value) {\n                autosize(textareaEl.value)\n            }\n        } catch {\n            // autosize initialization failed, textarea remains functional\n        }\n    })\n\n    onBeforeUnmount(() => {\n        try {\n            if (textareaEl.value) {\n                autosize.destroy(textareaEl.value)\n            }\n        } catch {\n            // ignore cleanup errors\n        }\n        for (const att of pendingAttachments.value) {\n            URL.revokeObjectURL(att.localUrl)\n        }\n    })\n\n    const isStreaming = computed(() => {\n        return props.status === 'streaming'\n    })\n    const isSubmitted = computed(() => {\n        return props.status === 'submitted'\n    })\n\n    const currentLength = computed(() => modelValue.value?.length ?? 0)\n\n    const isOverLimit = computed(() => {\n        return (\n            props.maxMessageLength !== undefined &&\n            currentLength.value > props.maxMessageLength\n        )\n    })\n\n    const isUploadingAnyFile = computed(() =>\n        pendingAttachments.value.some((a) => a.state === 'uploading'),\n    )\n\n    const acceptMimeTypes = computed(\n        () => props.fileUpload?.allowedMimeTypes?.join(',') ?? '',\n    )\n\n    const acceptImageMimeTypes = computed(() =>\n        (props.fileUpload?.allowedMimeTypes ?? [])\n            .filter((m) => m.startsWith('image/'))\n            .join(','),\n    )\n\n    const showCameraOption = computed(\n        () => hasCaptureSupport && acceptImageMimeTypes.value.length > 0,\n    )\n\n    const isSubmitEnabled = computed(() => {\n        if (isStreaming.value || isSubmitted.value) {\n            return false\n        }\n        if (isUploadingAnyFile.value) {\n            return false\n        }\n        if (isOverLimit.value) {\n            return false\n        }\n        return (modelValue.value?.trim().length ?? 0) > 0\n    })\n\n    const autosizeTextarea = () => {\n        if (textareaEl.value) {\n            autosize.update(textareaEl.value)\n        }\n    }\n\n    const handleSubmit = () => {\n        if (isSubmitEnabled.value) {\n            emit('submit')\n            nextTick(() => {\n                autosizeTextarea()\n                textareaEl.value?.blur()\n            })\n        }\n    }\n\n    const openFilePicker = () => {\n        fileInputEl.value?.click()\n    }\n\n    const openCameraPicker = () => {\n        cameraInputEl.value?.click()\n    }\n\n    const onFileChange = (event: Event) => {\n        const input = event.target as HTMLInputElement\n        const file = input.files?.[0]\n        if (file) {\n            emit('file-select', file)\n        }\n        // Reset so the same file can be selected again\n        input.value = ''\n    }\n\n    const removeAttachment = (id: string) => {\n        const att = pendingAttachments.value.find((a) => a.id === id)\n        if (att) {\n            URL.revokeObjectURL(att.localUrl)\n        }\n        pendingAttachments.value = pendingAttachments.value.filter(\n            (a) => a.id !== id,\n        )\n    }\n\n    const isDragDropEnabled = computed(\n        () => (props.enableDragDrop ?? true) && !!props.fileUpload?.enabled,\n    )\n\n    const handleDrop = (files: File[] | null) => {\n        if (!isDragDropEnabled.value || !files) {\n            return\n        }\n        for (const file of files) {\n            emit('file-select', file)\n        }\n    }\n\n    const { isOverDropZone } = useDropZone(formEl, {\n        dataTypes: computed(() => props.fileUpload?.allowedMimeTypes ?? []),\n        onDrop: handleDrop,\n    })\n</script>\n\n<template>\n    <div class=\"pk-chatbot-input\">\n        <div\n            v-if=\"dismissableNotice && isDismissableNoticeVisible\"\n            class=\"pk-chatbot-input-dismissable-notice\">\n            <PkStreamingMarkdown\n                :markdown=\"dismissableNotice\"\n                class=\"wysiwyg\" />\n            <VvButton\n                v-if=\"dismissableNotice\"\n                :title=\"$t('action.close')\"\n                modifiers=\"action-quiet\"\n                icon=\"ri:close-line\"\n                class=\"w-18 h-18\"\n                @click=\"closeDismissableNotice\" />\n        </div>\n        <form\n            ref=\"formEl\"\n            class=\"pk-chatbot-input__form\"\n            @submit.prevent=\"handleSubmit\">\n            <div\n                v-if=\"isOverDropZone && isDragDropEnabled\"\n                class=\"pk-chatbot-input__drop-overlay\">\n                <VvIcon\n                    name=\"ri:upload-cloud-2-line\"\n                    class=\"pk-chatbot-input__drop-overlay-icon\" />\n                <span>{{ $t('action.dropFile') }}</span>\n            </div>\n            <div\n                v-if=\"pendingAttachments.length\"\n                class=\"pk-chatbot-input__attachments\">\n                <PkChatbotFilePreview\n                    v-for=\"att in pendingAttachments\"\n                    :key=\"att.id\"\n                    :media-type=\"att.file.type\"\n                    :url=\"att.localUrl\"\n                    :filename=\"att.file.name\"\n                    :loading=\"att.state === 'uploading'\"\n                    :error=\"att.state === 'error' ? att.error : undefined\"\n                    :removable=\"att.state !== 'uploading'\"\n                    @remove=\"removeAttachment(att.id)\" />\n            </div>\n            <div class=\"pk-chatbot-input__fieldset\">\n                <VvDropdown\n                    v-if=\"\n                        fileUpload &&\n                        fileUpload.enabled &&\n                        (showCameraOption || $slots['additional-actions'])\n                    \"\n                    v-bind=\"{\n                        placement: 'top-start',\n                        modifiers: 'menu',\n                        flip: true,\n                        offset: 3,\n                    }\">\n                    <template #default=\"{ init, toggle, aria }\">\n                        <button\n                            :ref=\"(e: any) => init(e)\"\n                            v-bind=\"aria\"\n                            class=\"pk-chatbot-input__button\"\n                            type=\"button\"\n                            :title=\"$t('action.attachFile')\"\n                            :disabled=\"isStreaming || isSubmitted\"\n                            @click=\"toggle\">\n                            <VvIcon\n                                name=\"ri:add-line\"\n                                class=\"pk-chatbot-input__button-icon\" />\n                        </button>\n                    </template>\n                    <template #items>\n                        <VvDropdownAction\n                            v-if=\"showCameraOption\"\n                            :disabled=\"isStreaming || isSubmitted\"\n                            @click=\"openCameraPicker\">\n                            <VvIcon\n                                name=\"ri:camera-line\"\n                                class=\"pk-chatbot-input__dropdown-icon\" />\n                            {{ $t('action.takePhoto') }}\n                        </VvDropdownAction>\n                        <VvDropdownAction\n                            :disabled=\"isStreaming || isSubmitted\"\n                            @click=\"openFilePicker\">\n                            <VvIcon\n                                name=\"ri:attachment-line\"\n                                class=\"pk-chatbot-input__dropdown-icon\" />\n                            {{ $t('action.attachFile') }}\n                        </VvDropdownAction>\n                        <slot name=\"additional-actions\" />\n                    </template>\n                </VvDropdown>\n                <button\n                    v-else-if=\"fileUpload && fileUpload.enabled\"\n                    class=\"pk-chatbot-input__button\"\n                    type=\"button\"\n                    :title=\"$t('action.attachFile')\"\n                    :disabled=\"isStreaming || isSubmitted\"\n                    @click=\"openFilePicker\">\n                    <VvIcon\n                        name=\"ri:add-line\"\n                        class=\"pk-chatbot-input__button-icon\" />\n                </button>\n                <input\n                    v-if=\"fileUpload && fileUpload.enabled\"\n                    ref=\"fileInputEl\"\n                    type=\"file\"\n                    hidden\n                    :accept=\"acceptMimeTypes\"\n                    @change=\"onFileChange\" />\n                <input\n                    v-if=\"fileUpload && fileUpload.enabled && showCameraOption\"\n                    ref=\"cameraInputEl\"\n                    type=\"file\"\n                    capture=\"environment\"\n                    hidden\n                    :accept=\"acceptImageMimeTypes\"\n                    @change=\"onFileChange\" />\n                <div class=\"pk-chatbot-input__content\">\n                    <textarea\n                        ref=\"textareaEl\"\n                        v-model=\"modelValue\"\n                        class=\"pk-chatbot-input__textarea\"\n                        name=\"message\"\n                        rows=\"1\"\n                        :placeholder\n                        @focus=\"autosizeTextarea\"\n                        @blur=\"autosizeTextarea\"\n                        @paste=\"nextTick(autosizeTextarea)\"\n                        @keydown.enter.prevent=\"handleSubmit\"></textarea>\n                </div>\n                <div\n                    v-if=\"maxMessageLength\"\n                    class=\"pk-chatbot-input__counter\"\n                    :class=\"{ 'pk-chatbot-input__counter--over': isOverLimit }\">\n                    {{ $n(currentLength, 'integer') }}/<span\n                        class=\"opacity-60\"\n                        >{{ $n(maxMessageLength, 'integer') }}</span\n                    >\n                </div>\n                <button\n                    v-if=\"isStreaming\"\n                    class=\"pk-chatbot-input__button\"\n                    type=\"button\"\n                    :title=\"$t('action.stop')\"\n                    @click=\"emit('stop-generation')\">\n                    <VvIcon\n                        name=\"ri:stop-circle-line\"\n                        class=\"pk-chatbot-input__button-icon\" />\n                </button>\n                <button\n                    v-else\n                    class=\"pk-chatbot-input__button\"\n                    type=\"submit\"\n                    :title=\"\n                        isSubmitEnabled\n                            ? $t('action.submit')\n                            : $t('label.disabled')\n                    \"\n                    :disabled=\"!isSubmitEnabled\">\n                    <VvIcon\n                        :name=\"\n                            isSubmitted\n                                ? 'line-md:loading-loop'\n                                : isSubmitEnabled\n                                  ? 'ri:send-ins-fill'\n                                  : 'ri:send-ins-line'\n                        \"\n                        class=\"pk-chatbot-input__button-icon\" />\n                </button>\n            </div>\n        </form>\n    </div>\n</template>\n\n<style lang=\"scss\">\n    .pk-chatbot-input {\n        position: relative;\n        display: flex;\n        flex-direction: column;\n        margin-inline: var(--spacing-sm);\n        margin-bottom: var(--spacing-sm);\n\n        &-dismissable-notice {\n            position: relative;\n            padding: var(--spacing-sm);\n            display: flex;\n            align-items: flex-start;\n            justify-content: space-between;\n            gap: var(--spacing-sm);\n            background-color: var(--color-surface-1);\n            border-top-left-radius: var(--rounded-xl);\n            border-top-right-radius: var(--rounded-xl);\n            transition-property: var(--transition-property-all);\n            transition-duration: var(--duration-300);\n            transition-timing-function: var(--ease-in-out);\n            font-size: var(--text-14);\n            color: var(--color-word-2);\n\n            &::after {\n                content: '';\n                display: block;\n                position: absolute;\n                left: 0;\n                right: 0;\n                bottom: calc(-1 * var(--spacing-12));\n                height: var(--spacing-12);\n                background: var(--color-surface-1);\n                z-index: 1;\n            }\n        }\n\n        &__form {\n            position: relative;\n            display: flex;\n            z-index: 1;\n            flex-direction: column;\n            border-radius: var(--rounded-xl);\n            border: 1px solid var(--color-surface-3);\n            background-color: var(--color-surface);\n            padding: var(--spacing-14);\n            box-shadow: var(--shadow-lg);\n            font-size: var(\n                --text-16\n            ); // prevent ios zoom on input focus by using a font size >= 16px\n            gap: var(--spacing-xs);\n            transition: border-color var(--duration-200) var(--ease-in-out);\n\n            @include media-breakpoint-up('sm', $breakpoints) {\n                font-size: var(--text-14);\n                padding: var(--spacing-10);\n            }\n\n            &:has(:focus-within) {\n                border-color: var(--color-word-5);\n            }\n        }\n\n        &__drop-overlay {\n            position: absolute;\n            inset: 0;\n            z-index: 10;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            gap: var(--spacing-xs);\n            border-radius: var(--rounded-xl);\n            background-color: color-mix(\n                in srgb,\n                var(--color-surface) 85%,\n                transparent\n            );\n            pointer-events: none;\n        }\n\n        &__fieldset {\n            display: flex;\n            align-items: center;\n            gap: var(--spacing-xs);\n            flex: 1;\n        }\n\n        &__content {\n            flex: 1;\n            display: flex;\n            flex-direction: column;\n            gap: var(--spacing-4);\n            min-width: 0;\n            overflow: hidden;\n        }\n\n        &__textarea {\n            display: block;\n            border: none;\n            outline: none;\n            resize: none;\n            width: 100%;\n            color: var(--color-word-1);\n            background-color: var(--color-surface);\n            overflow: hidden;\n\n            &::placeholder {\n                color: var(--color-word-4);\n            }\n        }\n\n        &__attachments {\n            display: flex;\n            flex-wrap: wrap;\n            gap: var(--spacing-4);\n            padding-bottom: var(--spacing-xs);\n            border-bottom: 1px solid var(--color-surface-2);\n        }\n\n        &__button {\n            background-color: transparent;\n            border: none;\n            cursor: pointer;\n            color: var(--color-word-1);\n            padding: var(--spacing-4);\n            flex-shrink: 0;\n            transition: var(--transition-colors);\n            border-radius: var(--rounded);\n\n            &:hover {\n                background-color: var(--color-surface-2);\n            }\n\n            &:focus-visible {\n                outline: 1px solid var(--color-surface-5);\n                outline-offset: 0;\n            }\n\n            &:disabled {\n                cursor: not-allowed;\n                opacity: 0.5;\n            }\n\n            &-icon {\n                display: block;\n                width: var(--spacing-20);\n                height: var(--spacing-20);\n            }\n        }\n\n        &__counter {\n            background-color: var(--color-surface-1);\n            border: 1px solid var(--color-surface-3);\n            border-radius: var(--rounded-md);\n            font-size: var(--text-12);\n            color: var(--color-word-3);\n            line-height: 1;\n            padding-inline: var(--spacing-6);\n            padding-block: var(--spacing-4);\n            z-index: 1;\n            font-variant-numeric: tabular-nums;\n            font-family: var(--font-mono);\n            font-weight: var(--font-bold);\n\n            &--over {\n                color: var(--color-danger);\n                border-color: var(--color-danger-lighten-5);\n                font-weight: var(--font-bold);\n            }\n        }\n    }\n</style>\n","<script setup lang=\"ts\">\n    // @ts-expect-error - no types for autosize\n    import autosize from 'autosize'\n    import {\n        computed,\n        nextTick,\n        onBeforeUnmount,\n        onMounted,\n        ref,\n        useTemplateRef,\n    } from 'vue'\n    import { useDropZone } from '@vueuse/core'\n    import type { AgentFileUpload } from 'models'\n    import type { PendingAttachment } from 'composables'\n    import PkStreamingMarkdown from './PkStreamingMarkdown.vue'\n    import PkChatbotFilePreview from './PkChatbotFilePreview.vue'\n\n    const modelValue = defineModel<string>()\n    const pendingAttachments = defineModel<PendingAttachment[]>(\n        'pendingAttachments',\n        { default: () => [] },\n    )\n\n    const emit = defineEmits<{\n        submit: []\n        'stop-generation': []\n        'file-select': [file: File]\n    }>()\n\n    const props = defineProps<{\n        placeholder?: string\n        dismissableNotice?: string\n        status?: 'submitted' | 'streaming' | 'ready' | 'error'\n        maxMessageLength?: number\n        fileUpload?: AgentFileUpload\n        enableDragDrop?: boolean\n    }>()\n\n    const isDismissableNoticeVisible = ref<boolean>(true)\n    const closeDismissableNotice = () => {\n        isDismissableNoticeVisible.value = false\n    }\n\n    const textareaEl = useTemplateRef<HTMLTextAreaElement>('textareaEl')\n    const fileInputEl = useTemplateRef<HTMLInputElement>('fileInputEl')\n    const cameraInputEl = useTemplateRef<HTMLInputElement>('cameraInputEl')\n    const formEl = useTemplateRef<HTMLFormElement>('formEl')\n\n    const hasCaptureSupport = 'capture' in document.createElement('input')\n\n    onMounted(() => {\n        try {\n            if (textareaEl.value) {\n                autosize(textareaEl.value)\n            }\n        } catch {\n            // autosize initialization failed, textarea remains functional\n        }\n    })\n\n    onBeforeUnmount(() => {\n        try {\n            if (textareaEl.value) {\n                autosize.destroy(textareaEl.value)\n            }\n        } catch {\n            // ignore cleanup errors\n        }\n        for (const att of pendingAttachments.value) {\n            URL.revokeObjectURL(att.localUrl)\n        }\n    })\n\n    const isStreaming = computed(() => {\n        return props.status === 'streaming'\n    })\n    const isSubmitted = computed(() => {\n        return props.status === 'submitted'\n    })\n\n    const currentLength = computed(() => modelValue.value?.length ?? 0)\n\n    const isOverLimit = computed(() => {\n        return (\n            props.maxMessageLength !== undefined &&\n            currentLength.value > props.maxMessageLength\n        )\n    })\n\n    const isUploadingAnyFile = computed(() =>\n        pendingAttachments.value.some((a) => a.state === 'uploading'),\n    )\n\n    const acceptMimeTypes = computed(\n        () => props.fileUpload?.allowedMimeTypes?.join(',') ?? '',\n    )\n\n    const acceptImageMimeTypes = computed(() =>\n        (props.fileUpload?.allowedMimeTypes ?? [])\n            .filter((m) => m.startsWith('image/'))\n            .join(','),\n    )\n\n    const showCameraOption = computed(\n        () => hasCaptureSupport && acceptImageMimeTypes.value.length > 0,\n    )\n\n    const isSubmitEnabled = computed(() => {\n        if (isStreaming.value || isSubmitted.value) {\n            return false\n        }\n        if (isUploadingAnyFile.value) {\n            return false\n        }\n        if (isOverLimit.value) {\n            return false\n        }\n        return (modelValue.value?.trim().length ?? 0) > 0\n    })\n\n    const autosizeTextarea = () => {\n        if (textareaEl.value) {\n            autosize.update(textareaEl.value)\n        }\n    }\n\n    const handleSubmit = () => {\n        if (isSubmitEnabled.value) {\n            emit('submit')\n            nextTick(() => {\n                autosizeTextarea()\n                textareaEl.value?.blur()\n            })\n        }\n    }\n\n    const openFilePicker = () => {\n        fileInputEl.value?.click()\n    }\n\n    const openCameraPicker = () => {\n        cameraInputEl.value?.click()\n    }\n\n    const onFileChange = (event: Event) => {\n        const input = event.target as HTMLInputElement\n        const file = input.files?.[0]\n        if (file) {\n            emit('file-select', file)\n        }\n        // Reset so the same file can be selected again\n        input.value = ''\n    }\n\n    const removeAttachment = (id: string) => {\n        const att = pendingAttachments.value.find((a) => a.id === id)\n        if (att) {\n            URL.revokeObjectURL(att.localUrl)\n        }\n        pendingAttachments.value = pendingAttachments.value.filter(\n            (a) => a.id !== id,\n        )\n    }\n\n    const isDragDropEnabled = computed(\n        () => (props.enableDragDrop ?? true) && !!props.fileUpload?.enabled,\n    )\n\n    const handleDrop = (files: File[] | null) => {\n        if (!isDragDropEnabled.value || !files) {\n            return\n        }\n        for (const file of files) {\n            emit('file-select', file)\n        }\n    }\n\n    const { isOverDropZone } = useDropZone(formEl, {\n        dataTypes: computed(() => props.fileUpload?.allowedMimeTypes ?? []),\n        onDrop: handleDrop,\n    })\n</script>\n\n<template>\n    <div class=\"pk-chatbot-input\">\n        <div\n            v-if=\"dismissableNotice && isDismissableNoticeVisible\"\n            class=\"pk-chatbot-input-dismissable-notice\">\n            <PkStreamingMarkdown\n                :markdown=\"dismissableNotice\"\n                class=\"wysiwyg\" />\n            <VvButton\n                v-if=\"dismissableNotice\"\n                :title=\"$t('action.close')\"\n                modifiers=\"action-quiet\"\n                icon=\"ri:close-line\"\n                class=\"w-18 h-18\"\n                @click=\"closeDismissableNotice\" />\n        </div>\n        <form\n            ref=\"formEl\"\n            class=\"pk-chatbot-input__form\"\n            @submit.prevent=\"handleSubmit\">\n            <div\n                v-if=\"isOverDropZone && isDragDropEnabled\"\n                class=\"pk-chatbot-input__drop-overlay\">\n                <VvIcon\n                    name=\"ri:upload-cloud-2-line\"\n                    class=\"pk-chatbot-input__drop-overlay-icon\" />\n                <span>{{ $t('action.dropFile') }}</span>\n            </div>\n            <div\n                v-if=\"pendingAttachments.length\"\n                class=\"pk-chatbot-input__attachments\">\n                <PkChatbotFilePreview\n                    v-for=\"att in pendingAttachments\"\n                    :key=\"att.id\"\n                    :media-type=\"att.file.type\"\n                    :url=\"att.localUrl\"\n                    :filename=\"att.file.name\"\n                    :loading=\"att.state === 'uploading'\"\n                    :error=\"att.state === 'error' ? att.error : undefined\"\n                    :removable=\"att.state !== 'uploading'\"\n                    @remove=\"removeAttachment(att.id)\" />\n            </div>\n            <div class=\"pk-chatbot-input__fieldset\">\n                <VvDropdown\n                    v-if=\"\n                        fileUpload &&\n                        fileUpload.enabled &&\n                        (showCameraOption || $slots['additional-actions'])\n                    \"\n                    v-bind=\"{\n                        placement: 'top-start',\n                        modifiers: 'menu',\n                        flip: true,\n                        offset: 3,\n                    }\">\n                    <template #default=\"{ init, toggle, aria }\">\n                        <button\n                            :ref=\"(e: any) => init(e)\"\n                            v-bind=\"aria\"\n                            class=\"pk-chatbot-input__button\"\n                            type=\"button\"\n                            :title=\"$t('action.attachFile')\"\n                            :disabled=\"isStreaming || isSubmitted\"\n                            @click=\"toggle\">\n                            <VvIcon\n                                name=\"ri:add-line\"\n                                class=\"pk-chatbot-input__button-icon\" />\n                        </button>\n                    </template>\n                    <template #items>\n                        <VvDropdownAction\n                            v-if=\"showCameraOption\"\n                            :disabled=\"isStreaming || isSubmitted\"\n                            @click=\"openCameraPicker\">\n                            <VvIcon\n                                name=\"ri:camera-line\"\n                                class=\"pk-chatbot-input__dropdown-icon\" />\n                            {{ $t('action.takePhoto') }}\n                        </VvDropdownAction>\n                        <VvDropdownAction\n                            :disabled=\"isStreaming || isSubmitted\"\n                            @click=\"openFilePicker\">\n                            <VvIcon\n                                name=\"ri:attachment-line\"\n                                class=\"pk-chatbot-input__dropdown-icon\" />\n                            {{ $t('action.attachFile') }}\n                        </VvDropdownAction>\n                        <slot name=\"additional-actions\" />\n                    </template>\n                </VvDropdown>\n                <button\n                    v-else-if=\"fileUpload && fileUpload.enabled\"\n                    class=\"pk-chatbot-input__button\"\n                    type=\"button\"\n                    :title=\"$t('action.attachFile')\"\n                    :disabled=\"isStreaming || isSubmitted\"\n                    @click=\"openFilePicker\">\n                    <VvIcon\n                        name=\"ri:add-line\"\n                        class=\"pk-chatbot-input__button-icon\" />\n                </button>\n                <input\n                    v-if=\"fileUpload && fileUpload.enabled\"\n                    ref=\"fileInputEl\"\n                    type=\"file\"\n                    hidden\n                    :accept=\"acceptMimeTypes\"\n                    @change=\"onFileChange\" />\n                <input\n                    v-if=\"fileUpload && fileUpload.enabled && showCameraOption\"\n                    ref=\"cameraInputEl\"\n                    type=\"file\"\n                    capture=\"environment\"\n                    hidden\n                    :accept=\"acceptImageMimeTypes\"\n                    @change=\"onFileChange\" />\n                <div class=\"pk-chatbot-input__content\">\n                    <textarea\n                        ref=\"textareaEl\"\n                        v-model=\"modelValue\"\n                        class=\"pk-chatbot-input__textarea\"\n                        name=\"message\"\n                        rows=\"1\"\n                        :placeholder\n                        @focus=\"autosizeTextarea\"\n                        @blur=\"autosizeTextarea\"\n                        @paste=\"nextTick(autosizeTextarea)\"\n                        @keydown.enter.prevent=\"handleSubmit\"></textarea>\n                </div>\n                <div\n                    v-if=\"maxMessageLength\"\n                    class=\"pk-chatbot-input__counter\"\n                    :class=\"{ 'pk-chatbot-input__counter--over': isOverLimit }\">\n                    {{ $n(currentLength, 'integer') }}/<span\n                        class=\"opacity-60\"\n                        >{{ $n(maxMessageLength, 'integer') }}</span\n                    >\n                </div>\n                <button\n                    v-if=\"isStreaming\"\n                    class=\"pk-chatbot-input__button\"\n                    type=\"button\"\n                    :title=\"$t('action.stop')\"\n                    @click=\"emit('stop-generation')\">\n                    <VvIcon\n                        name=\"ri:stop-circle-line\"\n                        class=\"pk-chatbot-input__button-icon\" />\n                </button>\n                <button\n                    v-else\n                    class=\"pk-chatbot-input__button\"\n                    type=\"submit\"\n                    :title=\"\n                        isSubmitEnabled\n                            ? $t('action.submit')\n                            : $t('label.disabled')\n                    \"\n                    :disabled=\"!isSubmitEnabled\">\n                    <VvIcon\n                        :name=\"\n                            isSubmitted\n                                ? 'line-md:loading-loop'\n                                : isSubmitEnabled\n                                  ? 'ri:send-ins-fill'\n                                  : 'ri:send-ins-line'\n                        \"\n                        class=\"pk-chatbot-input__button-icon\" />\n                </button>\n            </div>\n        </form>\n    </div>\n</template>\n\n<style lang=\"scss\">\n    .pk-chatbot-input {\n        position: relative;\n        display: flex;\n        flex-direction: column;\n        margin-inline: var(--spacing-sm);\n        margin-bottom: var(--spacing-sm);\n\n        &-dismissable-notice {\n            position: relative;\n            padding: var(--spacing-sm);\n            display: flex;\n            align-items: flex-start;\n            justify-content: space-between;\n            gap: var(--spacing-sm);\n            background-color: var(--color-surface-1);\n            border-top-left-radius: var(--rounded-xl);\n            border-top-right-radius: var(--rounded-xl);\n            transition-property: var(--transition-property-all);\n            transition-duration: var(--duration-300);\n            transition-timing-function: var(--ease-in-out);\n            font-size: var(--text-14);\n            color: var(--color-word-2);\n\n            &::after {\n                content: '';\n                display: block;\n                position: absolute;\n                left: 0;\n                right: 0;\n                bottom: calc(-1 * var(--spacing-12));\n                height: var(--spacing-12);\n                background: var(--color-surface-1);\n                z-index: 1;\n            }\n        }\n\n        &__form {\n            position: relative;\n            display: flex;\n            z-index: 1;\n            flex-direction: column;\n            border-radius: var(--rounded-xl);\n            border: 1px solid var(--color-surface-3);\n            background-color: var(--color-surface);\n            padding: var(--spacing-14);\n            box-shadow: var(--shadow-lg);\n            font-size: var(\n                --text-16\n            ); // prevent ios zoom on input focus by using a font size >= 16px\n            gap: var(--spacing-xs);\n            transition: border-color var(--duration-200) var(--ease-in-out);\n\n            @include media-breakpoint-up('sm', $breakpoints) {\n                font-size: var(--text-14);\n                padding: var(--spacing-10);\n            }\n\n            &:has(:focus-within) {\n                border-color: var(--color-word-5);\n            }\n        }\n\n        &__drop-overlay {\n            position: absolute;\n            inset: 0;\n            z-index: 10;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            gap: var(--spacing-xs);\n            border-radius: var(--rounded-xl);\n            background-color: color-mix(\n                in srgb,\n                var(--color-surface) 85%,\n                transparent\n            );\n            pointer-events: none;\n        }\n\n        &__fieldset {\n            display: flex;\n            align-items: center;\n            gap: var(--spacing-xs);\n            flex: 1;\n        }\n\n        &__content {\n            flex: 1;\n            display: flex;\n            flex-direction: column;\n            gap: var(--spacing-4);\n            min-width: 0;\n            overflow: hidden;\n        }\n\n        &__textarea {\n            display: block;\n            border: none;\n            outline: none;\n            resize: none;\n            width: 100%;\n            color: var(--color-word-1);\n            background-color: var(--color-surface);\n            overflow: hidden;\n\n            &::placeholder {\n                color: var(--color-word-4);\n            }\n        }\n\n        &__attachments {\n            display: flex;\n            flex-wrap: wrap;\n            gap: var(--spacing-4);\n            padding-bottom: var(--spacing-xs);\n            border-bottom: 1px solid var(--color-surface-2);\n        }\n\n        &__button {\n            background-color: transparent;\n            border: none;\n            cursor: pointer;\n            color: var(--color-word-1);\n            padding: var(--spacing-4);\n            flex-shrink: 0;\n            transition: var(--transition-colors);\n            border-radius: var(--rounded);\n\n            &:hover {\n                background-color: var(--color-surface-2);\n            }\n\n            &:focus-visible {\n                outline: 1px solid var(--color-surface-5);\n                outline-offset: 0;\n            }\n\n            &:disabled {\n                cursor: not-allowed;\n                opacity: 0.5;\n            }\n\n            &-icon {\n                display: block;\n                width: var(--spacing-20);\n                height: var(--spacing-20);\n            }\n        }\n\n        &__counter {\n            background-color: var(--color-surface-1);\n            border: 1px solid var(--color-surface-3);\n            border-radius: var(--rounded-md);\n            font-size: var(--text-12);\n            color: var(--color-word-3);\n            line-height: 1;\n            padding-inline: var(--spacing-6);\n            padding-block: var(--spacing-4);\n            z-index: 1;\n            font-variant-numeric: tabular-nums;\n            font-family: var(--font-mono);\n            font-weight: var(--font-bold);\n\n            &--over {\n                color: var(--color-danger);\n                border-color: var(--color-danger-lighten-5);\n                font-weight: var(--font-bold);\n            }\n        }\n    }\n</style>\n"],"x_google_ignoreList":[0],"mappings":"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"}

package/dist-vue/_chunks/{PkChatbotMessages-CMLqkhmb.js → PkChatbotMessages-dsjB0-26.js}

@@ -1,30 +1,30 @@
 import { t as e } from "./PkChatbotError-CvZxHGlI.js";
 import { c as t, f as n, o as r, p as i, u as a } from "./src-EtGd6cRz.js";
-import { t as o } from "./PkRelativeTime-jP41qAJ5.js";
-import { t as ee } from "./PkStreamingMarkdown-CtiMH6FD.js";
-import { t as s } from "./PkChatbotFeedbackForm-CUnS-WyR.js";
-import { t as te } from "./PkChatbotFilePreview-JSpi3pmN.js";
-import { a as ne, n as re, o as c, r as l, t as u } from "./utils-DO7emdsn.js";
+import { t as o } from "./PkRelativeTime-WZ2aPcp_.js";
+import { t as ee } from "./PkStreamingMarkdown-BAhC3uGK.js";
+import { t as s } from "./PkChatbotFeedbackForm-DvUzirPP.js";
+import { t as te } from "./PkChatbotFilePreview-DHzuGtz5.js";
+import { a as ne, n as re, o as c, r as l, t as u } from "./utils-BegUBK7s.js";
 import { Fragment as d, Transition as f, computed as p, createBlock as m, createCommentVNode as h, createElementBlock as g, createElementVNode as _, createTextVNode as v, createVNode as y, defineAsyncComponent as b, defineComponent as x, mergeProps as S, nextTick as C, normalizeClass as w, normalizeStyle as T, onMounted as E, openBlock as D, ref as O, renderList as ie, renderSlot as ae, resolveDynamicComponent as oe, toDisplayString as k, unref as A, useSlots as se, useTemplateRef as ce, watch as j, withCtx as M, withModifiers as N } from "vue";
 import { VvButton as le, VvButtonGroup as ue, VvIcon as de } from "@volverjs/ui-vue/components";
 import { useI18n as fe } from "vue-i18n";
 //#region ../../packages/components/src/chat/toolComponentMap.ts
 var P = {
-	showArtifact: b(() => import("./PkToolShowArtifact-C2DgB_1z.js").then((e) => e.n)),
+	showArtifact: b(() => import("./PkToolShowArtifact-RzrDPcEQ.js").then((e) => e.n)),
 	showCalendarEvent: b(() => import("./PkToolShowCalendarEvent-DXRAzzKm.js").then((e) => e.n)),
 	showComparison: b(() => import("./PkToolShowComparison-CqN_pqBW.js").then((e) => e.n)),
-	showContactForm: b(() => import("./PkToolShowContactForm-BzzbXuhh.js").then((e) => e.n)),
+	showContactForm: b(() => import("./PkToolShowContactForm-r_GgO-ZX.js").then((e) => e.n)),
 	showEmail: b(() => import("./PkToolShowEmail-B7YiliCE.js").then((e) => e.n)),
-	showImageGallery: b(() => import("./PkToolShowImageGallery-DQXrJYop.js").then((e) => e.n)),
-	showLocation: b(() => import("./PkToolShowLocation-McDIqI8y.js").then((e) => e.n)),
+	showImageGallery: b(() => import("./PkToolShowImageGallery-B7Bt6ZGv.js").then((e) => e.n)),
+	showLocation: b(() => import("./PkToolShowLocation-DteWf0Cs.js").then((e) => e.n)),
 	showMessage: b(() => import("./PkToolShowMessage-ujP26Ae3.js").then((e) => e.n)),
-	showMultipleChoice: b(() => import("./PkToolShowMultipleChoice-DW3m6VbJ.js").then((e) => e.n)),
-	showProductList: b(() => import("./PkToolShowProductList-BDSJs7bn.js").then((e) => e.n)),
+	showMultipleChoice: b(() => import("./PkToolShowMultipleChoice-DZXfWtQp.js").then((e) => e.n)),
+	showProductList: b(() => import("./PkToolShowProductList-CtqWK0x4.js").then((e) => e.n)),
 	showQrCode: b(() => import("./PkToolShowQrCode-B4ex3m8i.js").then((e) => e.n)),
-	showSources: b(() => import("./PkToolShowSources-D5cBZxwQ.js").then((e) => e.n)),
-	showSuggestedReply: b(() => import("./PkToolShowSuggestedReply-Dm3BTWYg.js").then((e) => e.n)),
+	showSources: b(() => import("./PkToolShowSources-DK2DCvU3.js").then((e) => e.n)),
+	showSuggestedReply: b(() => import("./PkToolShowSuggestedReply-30m9yWDL.js").then((e) => e.n)),
 	showWeather: b(() => import("./PkToolShowWeather-Coq6H0iv.js")),
-	showWebPages: b(() => import("./PkToolShowWebPages-DnYVhLVU.js").then((e) => e.n))
+	showWebPages: b(() => import("./PkToolShowWebPages-DZIdrdWs.js").then((e) => e.n))
 }, pe = /* @__PURE__ */ x({
 	__name: "PkStreamingMarkdownAutoscroll",
 	props: {
@@ -181,7 +181,7 @@ var P = {
 					class: w(["pk-chatbot-message", [`pk-chatbot-message--${e.role}`, { "pk-chatbot-message--loading": K.value && X(E) && Q(e) }]]),
 					style: T({ minHeight: X(E) && Q(e) && !q.value ? `${H.value}px` : void 0 })
 				}, [
-					(D(!0), g(d, null, ie(e.parts, (o, s) => (D(), g(d, { key: s }, [A(n)(o) ? (D(), g("div", _e, [ae(c.$slots, "text", S({ ref_for: !0 }, {
+					(D(!0), g(d, null, ie(e.parts, (o, s) => (D(), g(d, { key: s }, [A(n)(o) && o.text.trim() ? (D(), g("div", _e, [ae(c.$slots, "text", S({ ref_for: !0 }, {
 						message: e,
 						part: o,
 						index: E,
@@ -385,4 +385,4 @@ var P = {
 //#endregion
 export { pe as n, F as t };
 
-//# sourceMappingURL=PkChatbotMessages-CMLqkhmb.js.map
+//# sourceMappingURL=PkChatbotMessages-dsjB0-26.js.map