@8wave/ai-elements 0.99.0-beta.1 → 0.99.0-beta.2

package/dist-vue/_chunks/PkChatbotSteps-BdU6YC_N.js

@@ -0,0 +1,172 @@
+import { t as e } from "./PkStreamingMarkdown-CjBMQ18U.js";
+import { c as t, o as n } from "./message-RohfrdWS.js";
+import { a as r, c as i, g as a, i as o, l as s, r as c, s as ee } from "./utils-Cru8TJxe.js";
+import { t as l } from "./PkChatbotStepToolDetail-BVI72gyx.js";
+import { VvIcon as u } from "@volverjs/ui-vue/components";
+import { Fragment as d, computed as f, createBlock as p, createCommentVNode as m, createElementBlock as h, createElementVNode as g, createTextVNode as _, createVNode as v, defineComponent as y, nextTick as b, normalizeClass as x, openBlock as S, reactive as C, ref as w, renderList as te, resolveDynamicComponent as ne, toDisplayString as T, unref as E, watch as D, withCtx as re } from "vue";
+import { useI18n as ie } from "vue-i18n";
+//#endregion
+//#region ../../packages/components/src/chat/PkStreamingMarkdownAutoscroll.vue
+var O = /* @__PURE__ */ y({
+	__name: "PkStreamingMarkdownAutoscroll",
+	props: {
+		markdown: {},
+		innerClass: {},
+		isDark: { type: Boolean }
+	},
+	setup(t) {
+		let n = t, r = w(), i = w(0), a = w(!1), o = () => {
+			if (!r.value) return;
+			let e = r.value.scrollTop;
+			e < i.value && i.value - e < 50 && (a.value = !0), e > i.value && e === r.value.scrollHeight - r.value.clientHeight && (a.value = !1), i.value = e;
+		};
+		return D(() => n.markdown, async () => {
+			await b(), r.value && !a.value && (r.value.scrollTop = r.value.scrollHeight);
+		}, { immediate: !0 }), (n, i) => (S(), h("div", {
+			ref_key: "scrollEl",
+			ref: r,
+			class: "overflow-auto light-scrollbar",
+			onScroll: o
+		}, [v(e, {
+			markdown: t.markdown,
+			"is-dark": t.isDark,
+			class: x(t.innerClass)
+		}, null, 8, [
+			"markdown",
+			"is-dark",
+			"class"
+		])], 544));
+	}
+}), k = {
+	key: 0,
+	class: "pk-chatbot-steps"
+}, A = ["aria-expanded"], j = { class: "pk-chatbot-steps__title" }, M = { class: "pk-chatbot-steps__meta" }, N = {
+	key: 0,
+	class: "pk-chatbot-steps__list"
+}, P = { class: "pk-chatbot-steps__step-label" }, F = { class: "pk-chatbot-steps__step-summary" }, I = {
+	key: 0,
+	class: "pk-chatbot-steps__step-duration"
+}, L = {
+	key: 0,
+	class: "pk-chatbot-steps__step-body"
+}, R = {
+	key: 2,
+	class: "pk-chatbot-steps__step-payload pk-chatbot-steps__step-payload--error"
+}, z = { class: "pk-chatbot-steps__step-payload-label" }, B = {
+	key: 0,
+	class: "pk-chatbot-steps__step-payload"
+}, V = { class: "pk-chatbot-steps__step-payload-label" }, H = {
+	key: 1,
+	class: "pk-chatbot-steps__step-payload"
+}, U = { class: "pk-chatbot-steps__step-payload-label" }, W = /* @__PURE__ */ y({
+	__name: "PkChatbotSteps",
+	props: {
+		message: {},
+		isStreaming: { type: Boolean },
+		isDark: { type: Boolean }
+	},
+	setup(y) {
+		let b = y, { t: W, n: ae } = ie({ useScope: "global" }), G = f(() => {
+			let e = b.message.parts, r = b.message.metadata?.partTimings, a = [];
+			for (let [s, c] of e.entries()) {
+				let l = n(c), u = t(c);
+				if (!l && !u) continue;
+				let d = "toolCallId" in c ? c.toolCallId : void 0;
+				a.push({
+					key: d ?? `${c.type}-${s}`,
+					part: c,
+					icon: o(c),
+					label: ee(W, c),
+					summary: i(c),
+					durationMs: d ? r?.[d] : void 0,
+					isActive: !!b.isStreaming && s === e.length - 1,
+					text: l && c.text.trim() ? c.text : void 0,
+					toolInput: u && "input" in c ? c.input : void 0,
+					toolOutput: u && "output" in c ? c.output : void 0
+				});
+			}
+			return a;
+		}), K = f(() => {
+			let { createdAt: e, completedAt: t } = b.message.metadata ?? {};
+			if (!(!e || !t)) return t - e;
+		}), q = (e) => c(ae, e), J = (e) => r(e.part) === "output-error" && "errorText" in e.part && typeof e.part.errorText == "string" ? e.part.errorText : void 0, Y = (e) => e.text || J(e) ? !0 : s(e.part) ? e.toolInput !== void 0 || e.toolOutput !== void 0 : !!(a(e.toolInput) ?? a(e.toolOutput)), X = C(/* @__PURE__ */ new Map()), Z = (e) => X.get(e.key) ?? e.isActive, oe = (e) => {
+			X.set(e.key, !Z(e));
+		}, Q = w(void 0), $ = f(() => Q.value ?? !!b.isStreaming);
+		return D(() => b.isStreaming, (e) => {
+			e && (Q.value = void 0, X.clear());
+		}), (t, n) => {
+			let r = u;
+			return G.value.length ? (S(), h("div", k, [g("button", {
+				type: "button",
+				class: "pk-chatbot-steps__header",
+				"aria-expanded": $.value,
+				onClick: n[0] ||= (e) => Q.value = !$.value
+			}, [
+				y.isStreaming ? (S(), p(r, {
+					key: 0,
+					name: "line-md:loading-loop",
+					class: "shrink-0"
+				})) : (S(), p(r, {
+					key: 1,
+					name: "ri:route-line",
+					class: "shrink-0"
+				})),
+				g("span", j, T(E(W)("messagePart.steps")), 1),
+				g("span", M, [_(T(E(W)("messagePart.stepCount", G.value.length)) + " ", 1), q(K.value) ? (S(), h(d, { key: 0 }, [_(" · " + T(q(K.value)), 1)], 64)) : m("", !0)]),
+				v(r, {
+					name: $.value ? "ri:arrow-up-s-line" : "ri:arrow-down-s-line",
+					class: "pk-chatbot-steps__chevron shrink-0 ml-auto"
+				}, null, 8, ["name"])
+			], 8, A), $.value ? (S(), h("ol", N, [(S(!0), h(d, null, te(G.value, (t) => (S(), h("li", {
+				key: t.key,
+				class: x(["pk-chatbot-steps__step", { "pk-chatbot-steps__step--active": t.isActive }])
+			}, [(S(), p(ne(Y(t) ? "button" : "div"), {
+				type: Y(t) ? "button" : void 0,
+				class: "pk-chatbot-steps__step-header",
+				"aria-expanded": Y(t) ? Z(t) : void 0,
+				onClick: (e) => Y(t) ? oe(t) : void 0
+			}, {
+				default: re(() => [
+					g("span", { class: x(["pk-chatbot-steps-marker", { "pk-chatbot-steps-marker--active": t.isActive }]) }, [t.isActive ? (S(), p(r, {
+						key: 0,
+						name: "line-md:loading-loop"
+					})) : t.icon ? (S(), p(r, {
+						key: 1,
+						name: t.icon
+					}, null, 8, ["name"])) : m("", !0)], 2),
+					g("span", P, T(t.label), 1),
+					g("span", F, T(t.summary), 1),
+					q(t.durationMs) ? (S(), h("span", I, T(q(t.durationMs)), 1)) : m("", !0),
+					Y(t) ? (S(), p(r, {
+						key: 1,
+						name: Z(t) ? "ri:arrow-up-s-line" : "ri:arrow-down-s-line",
+						class: "pk-chatbot-steps__chevron shrink-0 ml-auto"
+					}, null, 8, ["name"])) : m("", !0)
+				]),
+				_: 2
+			}, 1032, [
+				"type",
+				"aria-expanded",
+				"onClick"
+			])), Y(t) && Z(t) ? (S(), h("div", L, [t.text && t.isActive ? (S(), p(O, {
+				key: 0,
+				markdown: t.text,
+				"is-dark": y.isDark,
+				"inner-class": "wysiwyg",
+				class: "pk-chatbot-steps__step-content pk-chatbot-steps__step-content--scroll"
+			}, null, 8, ["markdown", "is-dark"])) : t.text ? (S(), p(e, {
+				key: 1,
+				markdown: t.text,
+				"is-dark": y.isDark,
+				class: "wysiwyg pk-chatbot-steps__step-content"
+			}, null, 8, ["markdown", "is-dark"])) : J(t) ? (S(), h("div", R, [g("span", z, T(E(W)("messagePart.stepError")), 1), g("pre", null, T(J(t)), 1)])) : E(s)(t.part) ? (S(), p(l, {
+				key: 3,
+				part: t.part
+			}, null, 8, ["part"])) : (S(), h(d, { key: 4 }, [E(a)(t.toolInput) ? (S(), h("div", B, [g("span", V, T(E(W)("messagePart.stepInput")), 1), g("pre", null, T(E(a)(t.toolInput)), 1)])) : m("", !0), E(a)(t.toolOutput) ? (S(), h("div", H, [g("span", U, T(E(W)("messagePart.stepOutput")), 1), g("pre", null, T(E(a)(t.toolOutput)), 1)])) : m("", !0)], 64))])) : m("", !0)], 2))), 128))])) : m("", !0)])) : m("", !0);
+		};
+	}
+});
+//#endregion
+export { O as n, W as t };
+
+//# sourceMappingURL=PkChatbotSteps-BdU6YC_N.js.map

package/dist-vue/_chunks/{PkChatbotSteps-Dv9NkYER.js.map → PkChatbotSteps-BdU6YC_N.js.map}

@@ -1 +1 @@
-{"version":3,"file":"PkChatbotSteps-Dv9NkYER.js","names":[],"sources":["../../../../packages/components/src/chat/PkStreamingMarkdownAutoscroll.vue","../../../../packages/components/src/chat/PkStreamingMarkdownAutoscroll.vue","../../../../packages/components/src/chat/PkChatbotSteps.vue","../../../../packages/components/src/chat/PkChatbotSteps.vue"],"sourcesContent":["<script lang=\"ts\" setup>\n    import { nextTick, ref, watch } from 'vue'\n    import PkStreamingMarkdown from './PkStreamingMarkdown.vue'\n\n    const props = defineProps<{\n        markdown?: string\n        innerClass?: string\n        isDark?: boolean\n    }>()\n\n    const scrollEl = ref<HTMLDivElement>()\n    const lastScrollTop = ref<number>(0)\n    const stopAutoScroll = ref<boolean>(false)\n\n    const handleScroll = () => {\n        if (!scrollEl.value) {\n            return\n        }\n        const currentScrollTop = scrollEl.value.scrollTop\n        if (currentScrollTop < lastScrollTop.value) {\n            const delta = lastScrollTop.value - currentScrollTop\n            if (delta < 50) {\n                stopAutoScroll.value = true\n            }\n        }\n        if (currentScrollTop > lastScrollTop.value) {\n            if (\n                currentScrollTop ===\n                scrollEl.value.scrollHeight - scrollEl.value.clientHeight\n            ) {\n                stopAutoScroll.value = false\n            }\n        }\n        lastScrollTop.value = currentScrollTop\n    }\n\n    watch(\n        () => props.markdown,\n        async () => {\n            await nextTick()\n            if (scrollEl.value && !stopAutoScroll.value) {\n                scrollEl.value.scrollTop = scrollEl.value.scrollHeight\n            }\n        },\n        { immediate: true },\n    )\n</script>\n\n<template>\n    <div\n        ref=\"scrollEl\"\n        class=\"overflow-auto light-scrollbar\"\n        @scroll=\"handleScroll\">\n        <PkStreamingMarkdown :markdown :is-dark :class=\"innerClass\" />\n    </div>\n</template>\n","<script lang=\"ts\" setup>\n    import { nextTick, ref, watch } from 'vue'\n    import PkStreamingMarkdown from './PkStreamingMarkdown.vue'\n\n    const props = defineProps<{\n        markdown?: string\n        innerClass?: string\n        isDark?: boolean\n    }>()\n\n    const scrollEl = ref<HTMLDivElement>()\n    const lastScrollTop = ref<number>(0)\n    const stopAutoScroll = ref<boolean>(false)\n\n    const handleScroll = () => {\n        if (!scrollEl.value) {\n            return\n        }\n        const currentScrollTop = scrollEl.value.scrollTop\n        if (currentScrollTop < lastScrollTop.value) {\n            const delta = lastScrollTop.value - currentScrollTop\n            if (delta < 50) {\n                stopAutoScroll.value = true\n            }\n        }\n        if (currentScrollTop > lastScrollTop.value) {\n            if (\n                currentScrollTop ===\n                scrollEl.value.scrollHeight - scrollEl.value.clientHeight\n            ) {\n                stopAutoScroll.value = false\n            }\n        }\n        lastScrollTop.value = currentScrollTop\n    }\n\n    watch(\n        () => props.markdown,\n        async () => {\n            await nextTick()\n            if (scrollEl.value && !stopAutoScroll.value) {\n                scrollEl.value.scrollTop = scrollEl.value.scrollHeight\n            }\n        },\n        { immediate: true },\n    )\n</script>\n\n<template>\n    <div\n        ref=\"scrollEl\"\n        class=\"overflow-auto light-scrollbar\"\n        @scroll=\"handleScroll\">\n        <PkStreamingMarkdown :markdown :is-dark :class=\"innerClass\" />\n    </div>\n</template>\n","<script lang=\"ts\" setup>\n    import { computed, reactive, ref, watch } from 'vue'\n    import { useI18n } from 'vue-i18n'\n    import type { UIChatMessage } from 'models'\n    import PkStreamingMarkdown from './PkStreamingMarkdown.vue'\n    import PkStreamingMarkdownAutoscroll from './PkStreamingMarkdownAutoscroll.vue'\n    import PkChatbotStepToolDetail from './PkChatbotStepToolDetail.vue'\n    import {\n        isReasoningPart,\n        isToolPart,\n        getPartIcon,\n        getPartState,\n        getToolPartLabel,\n        getToolPartSummary,\n        hasRichToolDetail,\n        stringifyPayload,\n        formatDuration as formatDurationWith,\n    } from './utils'\n\n    const props = defineProps<{\n        message: UIChatMessage\n        isStreaming?: boolean\n        isDark?: boolean\n    }>()\n\n    const { t: $t, n: $n } = useI18n({\n        useScope: 'global',\n    })\n\n    type MessagePart = UIChatMessage['parts'][number]\n\n    interface Step {\n        key: string\n        part: MessagePart\n        icon?: string\n        label?: string\n        summary?: string\n        durationMs?: number\n        isActive: boolean\n        text?: string\n        toolInput?: unknown\n        toolOutput?: unknown\n    }\n\n    const steps = computed<Step[]>(() => {\n        const parts = props.message.parts\n        const partTimings = props.message.metadata?.partTimings\n        const result: Step[] = []\n        for (const [index, part] of parts.entries()) {\n            const isReasoning = isReasoningPart(part)\n            const isTool = isToolPart(part)\n            if (!isReasoning && !isTool) {\n                continue\n            }\n            const toolCallId =\n                'toolCallId' in part ? (part.toolCallId as string) : undefined\n            result.push({\n                key: toolCallId ?? `${part.type}-${index}`,\n                part,\n                icon: getPartIcon(part),\n                label: getToolPartLabel($t, part),\n                summary: getToolPartSummary(part),\n                durationMs: toolCallId ? partTimings?.[toolCallId] : undefined,\n                isActive:\n                    Boolean(props.isStreaming) && index === parts.length - 1,\n                text: isReasoning && part.text.trim() ? part.text : undefined,\n                toolInput: isTool && 'input' in part ? part.input : undefined,\n                toolOutput:\n                    isTool && 'output' in part ? part.output : undefined,\n            })\n        }\n        return result\n    })\n\n    const totalDurationMs = computed(() => {\n        const { createdAt, completedAt } = props.message.metadata ?? {}\n        if (!createdAt || !completedAt) {\n            return undefined\n        }\n        return completedAt - createdAt\n    })\n\n    const formatDuration = (ms?: number) => formatDurationWith($n, ms)\n\n    const getStepError = (step: Step) =>\n        getPartState(step.part) === 'output-error' &&\n        'errorText' in step.part &&\n        typeof step.part.errorText === 'string'\n            ? step.part.errorText\n            : undefined\n\n    const hasBody = (step: Step) => {\n        if (step.text || getStepError(step)) {\n            return true\n        }\n        if (hasRichToolDetail(step.part)) {\n            return step.toolInput !== undefined || step.toolOutput !== undefined\n        }\n        return Boolean(\n            stringifyPayload(step.toolInput) ??\n            stringifyPayload(step.toolOutput),\n        )\n    }\n\n    // --- Expand / collapse ---\n    // The active (streaming) step is auto-expanded; a manual toggle always\n    // wins over the automatic behavior.\n    const manualSteps = reactive(new Map<string, boolean>())\n    const isStepExpanded = (step: Step) =>\n        manualSteps.get(step.key) ?? step.isActive\n    const toggleStep = (step: Step) => {\n        manualSteps.set(step.key, !isStepExpanded(step))\n    }\n\n    // The group is open while streaming and collapses to its header once the\n    // answer is complete, unless the user toggled it manually.\n    const manualGroup = ref<boolean | undefined>(undefined)\n    const isGroupExpanded = computed(\n        () => manualGroup.value ?? Boolean(props.isStreaming),\n    )\n    // Reset the manual override when a new stream starts so the timeline\n    // opens again on regenerate.\n    watch(\n        () => props.isStreaming,\n        (streaming) => {\n            if (streaming) {\n                manualGroup.value = undefined\n                manualSteps.clear()\n            }\n        },\n    )\n</script>\n\n<template>\n    <div v-if=\"steps.length\" class=\"pk-chatbot-steps\">\n        <button\n            type=\"button\"\n            class=\"pk-chatbot-steps__header\"\n            :aria-expanded=\"isGroupExpanded\"\n            @click=\"manualGroup = !isGroupExpanded\">\n            <VvIcon\n                v-if=\"isStreaming\"\n                name=\"line-md:loading-loop\"\n                class=\"shrink-0\" />\n            <VvIcon v-else name=\"ri:route-line\" class=\"shrink-0\" />\n            <span class=\"pk-chatbot-steps__title\">\n                {{ $t('messagePart.steps') }}\n            </span>\n            <span class=\"pk-chatbot-steps__meta\">\n                {{ $t('messagePart.stepCount', steps.length) }}\n                <template v-if=\"formatDuration(totalDurationMs)\">\n                    · {{ formatDuration(totalDurationMs) }}\n                </template>\n            </span>\n            <VvIcon\n                :name=\"\n                    isGroupExpanded\n                        ? 'ri:arrow-up-s-line'\n                        : 'ri:arrow-down-s-line'\n                \"\n                class=\"pk-chatbot-steps__chevron shrink-0 ml-auto\" />\n        </button>\n        <ol v-if=\"isGroupExpanded\" class=\"pk-chatbot-steps__list\">\n            <li\n                v-for=\"step in steps\"\n                :key=\"step.key\"\n                class=\"pk-chatbot-steps__step\"\n                :class=\"{\n                    'pk-chatbot-steps__step--active': step.isActive,\n                }\">\n                <component\n                    :is=\"hasBody(step) ? 'button' : 'div'\"\n                    :type=\"hasBody(step) ? 'button' : undefined\"\n                    class=\"pk-chatbot-steps__step-header\"\n                    :aria-expanded=\"\n                        hasBody(step) ? isStepExpanded(step) : undefined\n                    \"\n                    @click=\"hasBody(step) ? toggleStep(step) : undefined\">\n                    <span\n                        class=\"pk-chatbot-steps-marker\"\n                        :class=\"{\n                            'pk-chatbot-steps-marker--active': step.isActive,\n                        }\">\n                        <VvIcon\n                            v-if=\"step.isActive\"\n                            name=\"line-md:loading-loop\" />\n                        <VvIcon v-else-if=\"step.icon\" :name=\"step.icon\" />\n                    </span>\n                    <span class=\"pk-chatbot-steps__step-label\">\n                        {{ step.label }}\n                    </span>\n                    <span class=\"pk-chatbot-steps__step-summary\">\n                        {{ step.summary }}\n                    </span>\n                    <span\n                        v-if=\"formatDuration(step.durationMs)\"\n                        class=\"pk-chatbot-steps__step-duration\">\n                        {{ formatDuration(step.durationMs) }}\n                    </span>\n                    <VvIcon\n                        v-if=\"hasBody(step)\"\n                        :name=\"\n                            isStepExpanded(step)\n                                ? 'ri:arrow-up-s-line'\n                                : 'ri:arrow-down-s-line'\n                        \"\n                        class=\"pk-chatbot-steps__chevron shrink-0 ml-auto\" />\n                </component>\n                <div\n                    v-if=\"hasBody(step) && isStepExpanded(step)\"\n                    class=\"pk-chatbot-steps__step-body\">\n                    <PkStreamingMarkdownAutoscroll\n                        v-if=\"step.text && step.isActive\"\n                        :markdown=\"step.text\"\n                        :is-dark\n                        inner-class=\"wysiwyg\"\n                        class=\"pk-chatbot-steps__step-content pk-chatbot-steps__step-content--scroll\" />\n                    <PkStreamingMarkdown\n                        v-else-if=\"step.text\"\n                        :markdown=\"step.text\"\n                        :is-dark\n                        class=\"wysiwyg pk-chatbot-steps__step-content\" />\n                    <div\n                        v-else-if=\"getStepError(step)\"\n                        class=\"pk-chatbot-steps__step-payload pk-chatbot-steps__step-payload--error\">\n                        <span class=\"pk-chatbot-steps__step-payload-label\">\n                            {{ $t('messagePart.stepError') }}\n                        </span>\n                        <pre>{{ getStepError(step) }}</pre>\n                    </div>\n                    <PkChatbotStepToolDetail\n                        v-else-if=\"hasRichToolDetail(step.part)\"\n                        :part=\"step.part\" />\n                    <template v-else>\n                        <div\n                            v-if=\"stringifyPayload(step.toolInput)\"\n                            class=\"pk-chatbot-steps__step-payload\">\n                            <span class=\"pk-chatbot-steps__step-payload-label\">\n                                {{ $t('messagePart.stepInput') }}\n                            </span>\n                            <pre>{{ stringifyPayload(step.toolInput) }}</pre>\n                        </div>\n                        <div\n                            v-if=\"stringifyPayload(step.toolOutput)\"\n                            class=\"pk-chatbot-steps__step-payload\">\n                            <span class=\"pk-chatbot-steps__step-payload-label\">\n                                {{ $t('messagePart.stepOutput') }}\n                            </span>\n                            <pre>{{ stringifyPayload(step.toolOutput) }}</pre>\n                        </div>\n                    </template>\n                </div>\n            </li>\n        </ol>\n    </div>\n</template>\n\n<style lang=\"scss\">\n    .pk-chatbot-steps {\n        width: 100%;\n        border: var(--spacing-px) solid var(--color-surface-3);\n        border-radius: var(--rounded-lg);\n        background-color: var(--color-surface-1);\n        font-size: var(--text-12);\n        color: var(--color-word-3);\n        overflow: hidden;\n\n        &__header {\n            display: flex;\n            align-items: center;\n            gap: var(--spacing-8);\n            width: 100%;\n            min-height: var(--spacing-40);\n            padding: var(--spacing-8) var(--spacing-sm);\n            text-align: left;\n            cursor: pointer;\n            transition: background-color 0.2s ease;\n\n            &:hover {\n                background-color: var(--color-surface-2);\n            }\n        }\n\n        &__chevron {\n            font-size: var(--text-16);\n        }\n\n        &__title {\n            font-weight: 600;\n            color: var(--color-word-2);\n            flex-grow: 1;\n        }\n\n        &__meta {\n            color: var(--color-word-4);\n            font-variant-numeric: tabular-nums;\n            white-space: nowrap;\n        }\n\n        &__list {\n            background-color: var(--color-surface);\n            border-top: var(--spacing-px) solid var(--color-surface-3);\n            padding: var(--spacing-8) var(--spacing-sm);\n            display: flex;\n            flex-direction: column;\n        }\n\n        &__step {\n            position: relative;\n\n            // Vertical connector between step markers\n            &:not(:last-child)::before {\n                content: '';\n                position: absolute;\n                left: var(--spacing-10);\n                top: var(--spacing-28);\n                bottom: calc(var(--spacing-8) * -1);\n                width: var(--spacing-px);\n                background-color: var(--color-surface-4);\n            }\n        }\n\n        &__step-header {\n            display: flex;\n            align-items: center;\n            gap: var(--spacing-8);\n            width: calc(100% + var(--spacing-16));\n            min-height: var(--spacing-36);\n            margin-inline: calc(var(--spacing-8) * -1);\n            padding: var(--spacing-4) var(--spacing-8);\n            text-align: left;\n\n            &:is(button) {\n                cursor: pointer;\n                border-radius: var(--rounded);\n                transition: background-color 0.2s ease;\n\n                &:hover {\n                    background-color: var(--color-surface-2);\n                }\n            }\n        }\n\n        &-marker {\n            display: inline-flex;\n            align-items: center;\n            justify-content: center;\n            width: var(--spacing-20);\n            height: var(--spacing-20);\n            flex-shrink: 0;\n            position: relative;\n            z-index: 1;\n            background-color: var(--color-surface-1);\n            border-radius: var(--rounded-full);\n            border: var(--spacing-px) solid var(--color-surface-4);\n\n            &--active {\n                background-color: var(\n                    --chatbot-main-color,\n                    var(--color-surface-4)\n                );\n                border-color: transparent;\n                color: var(--chatbot-contrast-color, var(--color-word-1));\n            }\n        }\n\n        &__step-label {\n            min-width: 0;\n            overflow: hidden;\n            text-overflow: ellipsis;\n            white-space: nowrap;\n            color: var(--color-word-2);\n        }\n\n        &__step-summary {\n            flex: 1 1 0;\n            min-width: 0;\n            overflow: hidden;\n            text-overflow: ellipsis;\n            white-space: nowrap;\n            color: var(--color-word-4);\n        }\n\n        &__step-duration {\n            color: var(--color-word-4);\n            font-variant-numeric: tabular-nums;\n            white-space: nowrap;\n        }\n\n        &__step--active &__step-label {\n            color: var(--color-word-1);\n        }\n\n        &__step-body {\n            margin-left: var(--spacing-28);\n            margin-block: var(--spacing-4) var(--spacing-8);\n        }\n\n        &__step-content {\n            border: var(--spacing-px) solid var(--color-surface-4);\n            border-radius: var(--rounded);\n            padding: var(--spacing-8);\n            background-color: var(--color-surface-1);\n\n            &--scroll {\n                max-height: var(--spacing-256);\n            }\n        }\n\n        &__step-payload {\n            display: flex;\n            flex-direction: column;\n            gap: var(--spacing-2);\n\n            & + & {\n                margin-top: var(--spacing-8);\n            }\n\n            pre {\n                border: var(--spacing-px) solid var(--color-surface-4);\n                border-radius: var(--rounded);\n                padding: var(--spacing-8);\n                font-size: var(--text-10);\n                max-height: var(--spacing-160);\n                overflow: auto;\n                white-space: pre-wrap;\n                word-break: break-word;\n                font-family: var(--font-mono);\n                background-color: var(--color-surface-1);\n            }\n        }\n\n        &__step-payload-label {\n            font-weight: 600;\n            color: var(--color-word-3);\n            text-transform: uppercase;\n            font-size: var(--text-10);\n            letter-spacing: 0.05em;\n        }\n\n        &__step-payload--error {\n            .pk-chatbot-steps__step-payload-label,\n            pre {\n                color: var(--color-danger);\n            }\n\n            pre {\n                border-color: var(--color-danger-lighten-5);\n            }\n        }\n    }\n</style>\n","<script lang=\"ts\" setup>\n    import { computed, reactive, ref, watch } from 'vue'\n    import { useI18n } from 'vue-i18n'\n    import type { UIChatMessage } from 'models'\n    import PkStreamingMarkdown from './PkStreamingMarkdown.vue'\n    import PkStreamingMarkdownAutoscroll from './PkStreamingMarkdownAutoscroll.vue'\n    import PkChatbotStepToolDetail from './PkChatbotStepToolDetail.vue'\n    import {\n        isReasoningPart,\n        isToolPart,\n        getPartIcon,\n        getPartState,\n        getToolPartLabel,\n        getToolPartSummary,\n        hasRichToolDetail,\n        stringifyPayload,\n        formatDuration as formatDurationWith,\n    } from './utils'\n\n    const props = defineProps<{\n        message: UIChatMessage\n        isStreaming?: boolean\n        isDark?: boolean\n    }>()\n\n    const { t: $t, n: $n } = useI18n({\n        useScope: 'global',\n    })\n\n    type MessagePart = UIChatMessage['parts'][number]\n\n    interface Step {\n        key: string\n        part: MessagePart\n        icon?: string\n        label?: string\n        summary?: string\n        durationMs?: number\n        isActive: boolean\n        text?: string\n        toolInput?: unknown\n        toolOutput?: unknown\n    }\n\n    const steps = computed<Step[]>(() => {\n        const parts = props.message.parts\n        const partTimings = props.message.metadata?.partTimings\n        const result: Step[] = []\n        for (const [index, part] of parts.entries()) {\n            const isReasoning = isReasoningPart(part)\n            const isTool = isToolPart(part)\n            if (!isReasoning && !isTool) {\n                continue\n            }\n            const toolCallId =\n                'toolCallId' in part ? (part.toolCallId as string) : undefined\n            result.push({\n                key: toolCallId ?? `${part.type}-${index}`,\n                part,\n                icon: getPartIcon(part),\n                label: getToolPartLabel($t, part),\n                summary: getToolPartSummary(part),\n                durationMs: toolCallId ? partTimings?.[toolCallId] : undefined,\n                isActive:\n                    Boolean(props.isStreaming) && index === parts.length - 1,\n                text: isReasoning && part.text.trim() ? part.text : undefined,\n                toolInput: isTool && 'input' in part ? part.input : undefined,\n                toolOutput:\n                    isTool && 'output' in part ? part.output : undefined,\n            })\n        }\n        return result\n    })\n\n    const totalDurationMs = computed(() => {\n        const { createdAt, completedAt } = props.message.metadata ?? {}\n        if (!createdAt || !completedAt) {\n            return undefined\n        }\n        return completedAt - createdAt\n    })\n\n    const formatDuration = (ms?: number) => formatDurationWith($n, ms)\n\n    const getStepError = (step: Step) =>\n        getPartState(step.part) === 'output-error' &&\n        'errorText' in step.part &&\n        typeof step.part.errorText === 'string'\n            ? step.part.errorText\n            : undefined\n\n    const hasBody = (step: Step) => {\n        if (step.text || getStepError(step)) {\n            return true\n        }\n        if (hasRichToolDetail(step.part)) {\n            return step.toolInput !== undefined || step.toolOutput !== undefined\n        }\n        return Boolean(\n            stringifyPayload(step.toolInput) ??\n            stringifyPayload(step.toolOutput),\n        )\n    }\n\n    // --- Expand / collapse ---\n    // The active (streaming) step is auto-expanded; a manual toggle always\n    // wins over the automatic behavior.\n    const manualSteps = reactive(new Map<string, boolean>())\n    const isStepExpanded = (step: Step) =>\n        manualSteps.get(step.key) ?? step.isActive\n    const toggleStep = (step: Step) => {\n        manualSteps.set(step.key, !isStepExpanded(step))\n    }\n\n    // The group is open while streaming and collapses to its header once the\n    // answer is complete, unless the user toggled it manually.\n    const manualGroup = ref<boolean | undefined>(undefined)\n    const isGroupExpanded = computed(\n        () => manualGroup.value ?? Boolean(props.isStreaming),\n    )\n    // Reset the manual override when a new stream starts so the timeline\n    // opens again on regenerate.\n    watch(\n        () => props.isStreaming,\n        (streaming) => {\n            if (streaming) {\n                manualGroup.value = undefined\n                manualSteps.clear()\n            }\n        },\n    )\n</script>\n\n<template>\n    <div v-if=\"steps.length\" class=\"pk-chatbot-steps\">\n        <button\n            type=\"button\"\n            class=\"pk-chatbot-steps__header\"\n            :aria-expanded=\"isGroupExpanded\"\n            @click=\"manualGroup = !isGroupExpanded\">\n            <VvIcon\n                v-if=\"isStreaming\"\n                name=\"line-md:loading-loop\"\n                class=\"shrink-0\" />\n            <VvIcon v-else name=\"ri:route-line\" class=\"shrink-0\" />\n            <span class=\"pk-chatbot-steps__title\">\n                {{ $t('messagePart.steps') }}\n            </span>\n            <span class=\"pk-chatbot-steps__meta\">\n                {{ $t('messagePart.stepCount', steps.length) }}\n                <template v-if=\"formatDuration(totalDurationMs)\">\n                    · {{ formatDuration(totalDurationMs) }}\n                </template>\n            </span>\n            <VvIcon\n                :name=\"\n                    isGroupExpanded\n                        ? 'ri:arrow-up-s-line'\n                        : 'ri:arrow-down-s-line'\n                \"\n                class=\"pk-chatbot-steps__chevron shrink-0 ml-auto\" />\n        </button>\n        <ol v-if=\"isGroupExpanded\" class=\"pk-chatbot-steps__list\">\n            <li\n                v-for=\"step in steps\"\n                :key=\"step.key\"\n                class=\"pk-chatbot-steps__step\"\n                :class=\"{\n                    'pk-chatbot-steps__step--active': step.isActive,\n                }\">\n                <component\n                    :is=\"hasBody(step) ? 'button' : 'div'\"\n                    :type=\"hasBody(step) ? 'button' : undefined\"\n                    class=\"pk-chatbot-steps__step-header\"\n                    :aria-expanded=\"\n                        hasBody(step) ? isStepExpanded(step) : undefined\n                    \"\n                    @click=\"hasBody(step) ? toggleStep(step) : undefined\">\n                    <span\n                        class=\"pk-chatbot-steps-marker\"\n                        :class=\"{\n                            'pk-chatbot-steps-marker--active': step.isActive,\n                        }\">\n                        <VvIcon\n                            v-if=\"step.isActive\"\n                            name=\"line-md:loading-loop\" />\n                        <VvIcon v-else-if=\"step.icon\" :name=\"step.icon\" />\n                    </span>\n                    <span class=\"pk-chatbot-steps__step-label\">\n                        {{ step.label }}\n                    </span>\n                    <span class=\"pk-chatbot-steps__step-summary\">\n                        {{ step.summary }}\n                    </span>\n                    <span\n                        v-if=\"formatDuration(step.durationMs)\"\n                        class=\"pk-chatbot-steps__step-duration\">\n                        {{ formatDuration(step.durationMs) }}\n                    </span>\n                    <VvIcon\n                        v-if=\"hasBody(step)\"\n                        :name=\"\n                            isStepExpanded(step)\n                                ? 'ri:arrow-up-s-line'\n                                : 'ri:arrow-down-s-line'\n                        \"\n                        class=\"pk-chatbot-steps__chevron shrink-0 ml-auto\" />\n                </component>\n                <div\n                    v-if=\"hasBody(step) && isStepExpanded(step)\"\n                    class=\"pk-chatbot-steps__step-body\">\n                    <PkStreamingMarkdownAutoscroll\n                        v-if=\"step.text && step.isActive\"\n                        :markdown=\"step.text\"\n                        :is-dark\n                        inner-class=\"wysiwyg\"\n                        class=\"pk-chatbot-steps__step-content pk-chatbot-steps__step-content--scroll\" />\n                    <PkStreamingMarkdown\n                        v-else-if=\"step.text\"\n                        :markdown=\"step.text\"\n                        :is-dark\n                        class=\"wysiwyg pk-chatbot-steps__step-content\" />\n                    <div\n                        v-else-if=\"getStepError(step)\"\n                        class=\"pk-chatbot-steps__step-payload pk-chatbot-steps__step-payload--error\">\n                        <span class=\"pk-chatbot-steps__step-payload-label\">\n                            {{ $t('messagePart.stepError') }}\n                        </span>\n                        <pre>{{ getStepError(step) }}</pre>\n                    </div>\n                    <PkChatbotStepToolDetail\n                        v-else-if=\"hasRichToolDetail(step.part)\"\n                        :part=\"step.part\" />\n                    <template v-else>\n                        <div\n                            v-if=\"stringifyPayload(step.toolInput)\"\n                            class=\"pk-chatbot-steps__step-payload\">\n                            <span class=\"pk-chatbot-steps__step-payload-label\">\n                                {{ $t('messagePart.stepInput') }}\n                            </span>\n                            <pre>{{ stringifyPayload(step.toolInput) }}</pre>\n                        </div>\n                        <div\n                            v-if=\"stringifyPayload(step.toolOutput)\"\n                            class=\"pk-chatbot-steps__step-payload\">\n                            <span class=\"pk-chatbot-steps__step-payload-label\">\n                                {{ $t('messagePart.stepOutput') }}\n                            </span>\n                            <pre>{{ stringifyPayload(step.toolOutput) }}</pre>\n                        </div>\n                    </template>\n                </div>\n            </li>\n        </ol>\n    </div>\n</template>\n\n<style lang=\"scss\">\n    .pk-chatbot-steps {\n        width: 100%;\n        border: var(--spacing-px) solid var(--color-surface-3);\n        border-radius: var(--rounded-lg);\n        background-color: var(--color-surface-1);\n        font-size: var(--text-12);\n        color: var(--color-word-3);\n        overflow: hidden;\n\n        &__header {\n            display: flex;\n            align-items: center;\n            gap: var(--spacing-8);\n            width: 100%;\n            min-height: var(--spacing-40);\n            padding: var(--spacing-8) var(--spacing-sm);\n            text-align: left;\n            cursor: pointer;\n            transition: background-color 0.2s ease;\n\n            &:hover {\n                background-color: var(--color-surface-2);\n            }\n        }\n\n        &__chevron {\n            font-size: var(--text-16);\n        }\n\n        &__title {\n            font-weight: 600;\n            color: var(--color-word-2);\n            flex-grow: 1;\n        }\n\n        &__meta {\n            color: var(--color-word-4);\n            font-variant-numeric: tabular-nums;\n            white-space: nowrap;\n        }\n\n        &__list {\n            background-color: var(--color-surface);\n            border-top: var(--spacing-px) solid var(--color-surface-3);\n            padding: var(--spacing-8) var(--spacing-sm);\n            display: flex;\n            flex-direction: column;\n        }\n\n        &__step {\n            position: relative;\n\n            // Vertical connector between step markers\n            &:not(:last-child)::before {\n                content: '';\n                position: absolute;\n                left: var(--spacing-10);\n                top: var(--spacing-28);\n                bottom: calc(var(--spacing-8) * -1);\n                width: var(--spacing-px);\n                background-color: var(--color-surface-4);\n            }\n        }\n\n        &__step-header {\n            display: flex;\n            align-items: center;\n            gap: var(--spacing-8);\n            width: calc(100% + var(--spacing-16));\n            min-height: var(--spacing-36);\n            margin-inline: calc(var(--spacing-8) * -1);\n            padding: var(--spacing-4) var(--spacing-8);\n            text-align: left;\n\n            &:is(button) {\n                cursor: pointer;\n                border-radius: var(--rounded);\n                transition: background-color 0.2s ease;\n\n                &:hover {\n                    background-color: var(--color-surface-2);\n                }\n            }\n        }\n\n        &-marker {\n            display: inline-flex;\n            align-items: center;\n            justify-content: center;\n            width: var(--spacing-20);\n            height: var(--spacing-20);\n            flex-shrink: 0;\n            position: relative;\n            z-index: 1;\n            background-color: var(--color-surface-1);\n            border-radius: var(--rounded-full);\n            border: var(--spacing-px) solid var(--color-surface-4);\n\n            &--active {\n                background-color: var(\n                    --chatbot-main-color,\n                    var(--color-surface-4)\n                );\n                border-color: transparent;\n                color: var(--chatbot-contrast-color, var(--color-word-1));\n            }\n        }\n\n        &__step-label {\n            min-width: 0;\n            overflow: hidden;\n            text-overflow: ellipsis;\n            white-space: nowrap;\n            color: var(--color-word-2);\n        }\n\n        &__step-summary {\n            flex: 1 1 0;\n            min-width: 0;\n            overflow: hidden;\n            text-overflow: ellipsis;\n            white-space: nowrap;\n            color: var(--color-word-4);\n        }\n\n        &__step-duration {\n            color: var(--color-word-4);\n            font-variant-numeric: tabular-nums;\n            white-space: nowrap;\n        }\n\n        &__step--active &__step-label {\n            color: var(--color-word-1);\n        }\n\n        &__step-body {\n            margin-left: var(--spacing-28);\n            margin-block: var(--spacing-4) var(--spacing-8);\n        }\n\n        &__step-content {\n            border: var(--spacing-px) solid var(--color-surface-4);\n            border-radius: var(--rounded);\n            padding: var(--spacing-8);\n            background-color: var(--color-surface-1);\n\n            &--scroll {\n                max-height: var(--spacing-256);\n            }\n        }\n\n        &__step-payload {\n            display: flex;\n            flex-direction: column;\n            gap: var(--spacing-2);\n\n            & + & {\n                margin-top: var(--spacing-8);\n            }\n\n            pre {\n                border: var(--spacing-px) solid var(--color-surface-4);\n                border-radius: var(--rounded);\n                padding: var(--spacing-8);\n                font-size: var(--text-10);\n                max-height: var(--spacing-160);\n                overflow: auto;\n                white-space: pre-wrap;\n                word-break: break-word;\n                font-family: var(--font-mono);\n                background-color: var(--color-surface-1);\n            }\n        }\n\n        &__step-payload-label {\n            font-weight: 600;\n            color: var(--color-word-3);\n            text-transform: uppercase;\n            font-size: var(--text-10);\n            letter-spacing: 0.05em;\n        }\n\n        &__step-payload--error {\n            .pk-chatbot-steps__step-payload-label,\n            pre {\n                color: var(--color-danger);\n            }\n\n            pre {\n                border-color: var(--color-danger-lighten-5);\n            }\n        }\n    }\n</style>\n"],"mappings":"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"}
+{"version":3,"file":"PkChatbotSteps-BdU6YC_N.js","names":[],"sources":["../../../../packages/components/src/chat/PkStreamingMarkdownAutoscroll.vue","../../../../packages/components/src/chat/PkStreamingMarkdownAutoscroll.vue","../../../../packages/components/src/chat/PkChatbotSteps.vue","../../../../packages/components/src/chat/PkChatbotSteps.vue"],"sourcesContent":["<script lang=\"ts\" setup>\n    import { nextTick, ref, watch } from 'vue'\n    import PkStreamingMarkdown from './PkStreamingMarkdown.vue'\n\n    const props = defineProps<{\n        markdown?: string\n        innerClass?: string\n        isDark?: boolean\n    }>()\n\n    const scrollEl = ref<HTMLDivElement>()\n    const lastScrollTop = ref<number>(0)\n    const stopAutoScroll = ref<boolean>(false)\n\n    const handleScroll = () => {\n        if (!scrollEl.value) {\n            return\n        }\n        const currentScrollTop = scrollEl.value.scrollTop\n        if (currentScrollTop < lastScrollTop.value) {\n            const delta = lastScrollTop.value - currentScrollTop\n            if (delta < 50) {\n                stopAutoScroll.value = true\n            }\n        }\n        if (currentScrollTop > lastScrollTop.value) {\n            if (\n                currentScrollTop ===\n                scrollEl.value.scrollHeight - scrollEl.value.clientHeight\n            ) {\n                stopAutoScroll.value = false\n            }\n        }\n        lastScrollTop.value = currentScrollTop\n    }\n\n    watch(\n        () => props.markdown,\n        async () => {\n            await nextTick()\n            if (scrollEl.value && !stopAutoScroll.value) {\n                scrollEl.value.scrollTop = scrollEl.value.scrollHeight\n            }\n        },\n        { immediate: true },\n    )\n</script>\n\n<template>\n    <div\n        ref=\"scrollEl\"\n        class=\"overflow-auto light-scrollbar\"\n        @scroll=\"handleScroll\">\n        <PkStreamingMarkdown :markdown :is-dark :class=\"innerClass\" />\n    </div>\n</template>\n","<script lang=\"ts\" setup>\n    import { nextTick, ref, watch } from 'vue'\n    import PkStreamingMarkdown from './PkStreamingMarkdown.vue'\n\n    const props = defineProps<{\n        markdown?: string\n        innerClass?: string\n        isDark?: boolean\n    }>()\n\n    const scrollEl = ref<HTMLDivElement>()\n    const lastScrollTop = ref<number>(0)\n    const stopAutoScroll = ref<boolean>(false)\n\n    const handleScroll = () => {\n        if (!scrollEl.value) {\n            return\n        }\n        const currentScrollTop = scrollEl.value.scrollTop\n        if (currentScrollTop < lastScrollTop.value) {\n            const delta = lastScrollTop.value - currentScrollTop\n            if (delta < 50) {\n                stopAutoScroll.value = true\n            }\n        }\n        if (currentScrollTop > lastScrollTop.value) {\n            if (\n                currentScrollTop ===\n                scrollEl.value.scrollHeight - scrollEl.value.clientHeight\n            ) {\n                stopAutoScroll.value = false\n            }\n        }\n        lastScrollTop.value = currentScrollTop\n    }\n\n    watch(\n        () => props.markdown,\n        async () => {\n            await nextTick()\n            if (scrollEl.value && !stopAutoScroll.value) {\n                scrollEl.value.scrollTop = scrollEl.value.scrollHeight\n            }\n        },\n        { immediate: true },\n    )\n</script>\n\n<template>\n    <div\n        ref=\"scrollEl\"\n        class=\"overflow-auto light-scrollbar\"\n        @scroll=\"handleScroll\">\n        <PkStreamingMarkdown :markdown :is-dark :class=\"innerClass\" />\n    </div>\n</template>\n","<script lang=\"ts\" setup>\n    import { computed, reactive, ref, watch } from 'vue'\n    import { useI18n } from 'vue-i18n'\n    import type { UIChatMessage } from 'models'\n    import PkStreamingMarkdown from './PkStreamingMarkdown.vue'\n    import PkStreamingMarkdownAutoscroll from './PkStreamingMarkdownAutoscroll.vue'\n    import PkChatbotStepToolDetail from './PkChatbotStepToolDetail.vue'\n    import {\n        isReasoningPart,\n        isToolPart,\n        getPartIcon,\n        getPartState,\n        getToolPartLabel,\n        getToolPartSummary,\n        hasRichToolDetail,\n        stringifyPayload,\n        formatDuration as formatDurationWith,\n    } from './utils'\n\n    const props = defineProps<{\n        message: UIChatMessage\n        isStreaming?: boolean\n        isDark?: boolean\n    }>()\n\n    const { t: $t, n: $n } = useI18n({\n        useScope: 'global',\n    })\n\n    type MessagePart = UIChatMessage['parts'][number]\n\n    interface Step {\n        key: string\n        part: MessagePart\n        icon?: string\n        label?: string\n        summary?: string\n        durationMs?: number\n        isActive: boolean\n        text?: string\n        toolInput?: unknown\n        toolOutput?: unknown\n    }\n\n    const steps = computed<Step[]>(() => {\n        const parts = props.message.parts\n        const partTimings = props.message.metadata?.partTimings\n        const result: Step[] = []\n        for (const [index, part] of parts.entries()) {\n            const isReasoning = isReasoningPart(part)\n            const isTool = isToolPart(part)\n            if (!isReasoning && !isTool) {\n                continue\n            }\n            const toolCallId =\n                'toolCallId' in part ? (part.toolCallId as string) : undefined\n            result.push({\n                key: toolCallId ?? `${part.type}-${index}`,\n                part,\n                icon: getPartIcon(part),\n                label: getToolPartLabel($t, part),\n                summary: getToolPartSummary(part),\n                durationMs: toolCallId ? partTimings?.[toolCallId] : undefined,\n                isActive:\n                    Boolean(props.isStreaming) && index === parts.length - 1,\n                text: isReasoning && part.text.trim() ? part.text : undefined,\n                toolInput: isTool && 'input' in part ? part.input : undefined,\n                toolOutput:\n                    isTool && 'output' in part ? part.output : undefined,\n            })\n        }\n        return result\n    })\n\n    const totalDurationMs = computed(() => {\n        const { createdAt, completedAt } = props.message.metadata ?? {}\n        if (!createdAt || !completedAt) {\n            return undefined\n        }\n        return completedAt - createdAt\n    })\n\n    const formatDuration = (ms?: number) => formatDurationWith($n, ms)\n\n    const getStepError = (step: Step) =>\n        getPartState(step.part) === 'output-error' &&\n        'errorText' in step.part &&\n        typeof step.part.errorText === 'string'\n            ? step.part.errorText\n            : undefined\n\n    const hasBody = (step: Step) => {\n        if (step.text || getStepError(step)) {\n            return true\n        }\n        if (hasRichToolDetail(step.part)) {\n            return step.toolInput !== undefined || step.toolOutput !== undefined\n        }\n        return Boolean(\n            stringifyPayload(step.toolInput) ??\n            stringifyPayload(step.toolOutput),\n        )\n    }\n\n    // --- Expand / collapse ---\n    // The active (streaming) step is auto-expanded; a manual toggle always\n    // wins over the automatic behavior.\n    const manualSteps = reactive(new Map<string, boolean>())\n    const isStepExpanded = (step: Step) =>\n        manualSteps.get(step.key) ?? step.isActive\n    const toggleStep = (step: Step) => {\n        manualSteps.set(step.key, !isStepExpanded(step))\n    }\n\n    // The group is open while streaming and collapses to its header once the\n    // answer is complete, unless the user toggled it manually.\n    const manualGroup = ref<boolean | undefined>(undefined)\n    const isGroupExpanded = computed(\n        () => manualGroup.value ?? Boolean(props.isStreaming),\n    )\n    // Reset the manual override when a new stream starts so the timeline\n    // opens again on regenerate.\n    watch(\n        () => props.isStreaming,\n        (streaming) => {\n            if (streaming) {\n                manualGroup.value = undefined\n                manualSteps.clear()\n            }\n        },\n    )\n</script>\n\n<template>\n    <div v-if=\"steps.length\" class=\"pk-chatbot-steps\">\n        <button\n            type=\"button\"\n            class=\"pk-chatbot-steps__header\"\n            :aria-expanded=\"isGroupExpanded\"\n            @click=\"manualGroup = !isGroupExpanded\">\n            <VvIcon\n                v-if=\"isStreaming\"\n                name=\"line-md:loading-loop\"\n                class=\"shrink-0\" />\n            <VvIcon v-else name=\"ri:route-line\" class=\"shrink-0\" />\n            <span class=\"pk-chatbot-steps__title\">\n                {{ $t('messagePart.steps') }}\n            </span>\n            <span class=\"pk-chatbot-steps__meta\">\n                {{ $t('messagePart.stepCount', steps.length) }}\n                <template v-if=\"formatDuration(totalDurationMs)\">\n                    · {{ formatDuration(totalDurationMs) }}\n                </template>\n            </span>\n            <VvIcon\n                :name=\"\n                    isGroupExpanded\n                        ? 'ri:arrow-up-s-line'\n                        : 'ri:arrow-down-s-line'\n                \"\n                class=\"pk-chatbot-steps__chevron shrink-0 ml-auto\" />\n        </button>\n        <ol v-if=\"isGroupExpanded\" class=\"pk-chatbot-steps__list\">\n            <li\n                v-for=\"step in steps\"\n                :key=\"step.key\"\n                class=\"pk-chatbot-steps__step\"\n                :class=\"{\n                    'pk-chatbot-steps__step--active': step.isActive,\n                }\">\n                <component\n                    :is=\"hasBody(step) ? 'button' : 'div'\"\n                    :type=\"hasBody(step) ? 'button' : undefined\"\n                    class=\"pk-chatbot-steps__step-header\"\n                    :aria-expanded=\"\n                        hasBody(step) ? isStepExpanded(step) : undefined\n                    \"\n                    @click=\"hasBody(step) ? toggleStep(step) : undefined\">\n                    <span\n                        class=\"pk-chatbot-steps-marker\"\n                        :class=\"{\n                            'pk-chatbot-steps-marker--active': step.isActive,\n                        }\">\n                        <VvIcon\n                            v-if=\"step.isActive\"\n                            name=\"line-md:loading-loop\" />\n                        <VvIcon v-else-if=\"step.icon\" :name=\"step.icon\" />\n                    </span>\n                    <span class=\"pk-chatbot-steps__step-label\">\n                        {{ step.label }}\n                    </span>\n                    <span class=\"pk-chatbot-steps__step-summary\">\n                        {{ step.summary }}\n                    </span>\n                    <span\n                        v-if=\"formatDuration(step.durationMs)\"\n                        class=\"pk-chatbot-steps__step-duration\">\n                        {{ formatDuration(step.durationMs) }}\n                    </span>\n                    <VvIcon\n                        v-if=\"hasBody(step)\"\n                        :name=\"\n                            isStepExpanded(step)\n                                ? 'ri:arrow-up-s-line'\n                                : 'ri:arrow-down-s-line'\n                        \"\n                        class=\"pk-chatbot-steps__chevron shrink-0 ml-auto\" />\n                </component>\n                <div\n                    v-if=\"hasBody(step) && isStepExpanded(step)\"\n                    class=\"pk-chatbot-steps__step-body\">\n                    <PkStreamingMarkdownAutoscroll\n                        v-if=\"step.text && step.isActive\"\n                        :markdown=\"step.text\"\n                        :is-dark\n                        inner-class=\"wysiwyg\"\n                        class=\"pk-chatbot-steps__step-content pk-chatbot-steps__step-content--scroll\" />\n                    <PkStreamingMarkdown\n                        v-else-if=\"step.text\"\n                        :markdown=\"step.text\"\n                        :is-dark\n                        class=\"wysiwyg pk-chatbot-steps__step-content\" />\n                    <div\n                        v-else-if=\"getStepError(step)\"\n                        class=\"pk-chatbot-steps__step-payload pk-chatbot-steps__step-payload--error\">\n                        <span class=\"pk-chatbot-steps__step-payload-label\">\n                            {{ $t('messagePart.stepError') }}\n                        </span>\n                        <pre>{{ getStepError(step) }}</pre>\n                    </div>\n                    <PkChatbotStepToolDetail\n                        v-else-if=\"hasRichToolDetail(step.part)\"\n                        :part=\"step.part\" />\n                    <template v-else>\n                        <div\n                            v-if=\"stringifyPayload(step.toolInput)\"\n                            class=\"pk-chatbot-steps__step-payload\">\n                            <span class=\"pk-chatbot-steps__step-payload-label\">\n                                {{ $t('messagePart.stepInput') }}\n                            </span>\n                            <pre>{{ stringifyPayload(step.toolInput) }}</pre>\n                        </div>\n                        <div\n                            v-if=\"stringifyPayload(step.toolOutput)\"\n                            class=\"pk-chatbot-steps__step-payload\">\n                            <span class=\"pk-chatbot-steps__step-payload-label\">\n                                {{ $t('messagePart.stepOutput') }}\n                            </span>\n                            <pre>{{ stringifyPayload(step.toolOutput) }}</pre>\n                        </div>\n                    </template>\n                </div>\n            </li>\n        </ol>\n    </div>\n</template>\n\n<style lang=\"scss\">\n    .pk-chatbot-steps {\n        width: 100%;\n        border: var(--spacing-px) solid var(--color-surface-3);\n        border-radius: var(--rounded-lg);\n        background-color: var(--color-surface-1);\n        font-size: var(--text-12);\n        color: var(--color-word-3);\n        overflow: hidden;\n\n        &__header {\n            display: flex;\n            align-items: center;\n            gap: var(--spacing-8);\n            width: 100%;\n            min-height: var(--spacing-40);\n            padding: var(--spacing-8) var(--spacing-sm);\n            text-align: left;\n            cursor: pointer;\n            transition: background-color 0.2s ease;\n\n            &:hover {\n                background-color: var(--color-surface-2);\n            }\n        }\n\n        &__chevron {\n            font-size: var(--text-16);\n        }\n\n        &__title {\n            font-weight: 600;\n            color: var(--color-word-2);\n            flex-grow: 1;\n        }\n\n        &__meta {\n            color: var(--color-word-4);\n            font-variant-numeric: tabular-nums;\n            white-space: nowrap;\n        }\n\n        &__list {\n            background-color: var(--color-surface);\n            border-top: var(--spacing-px) solid var(--color-surface-3);\n            padding: var(--spacing-8) var(--spacing-sm);\n            display: flex;\n            flex-direction: column;\n        }\n\n        &__step {\n            position: relative;\n\n            // Vertical connector between step markers\n            &:not(:last-child)::before {\n                content: '';\n                position: absolute;\n                left: var(--spacing-10);\n                top: var(--spacing-28);\n                bottom: calc(var(--spacing-8) * -1);\n                width: var(--spacing-px);\n                background-color: var(--color-surface-4);\n            }\n        }\n\n        &__step-header {\n            display: flex;\n            align-items: center;\n            gap: var(--spacing-8);\n            width: calc(100% + var(--spacing-16));\n            min-height: var(--spacing-36);\n            margin-inline: calc(var(--spacing-8) * -1);\n            padding: var(--spacing-4) var(--spacing-8);\n            text-align: left;\n\n            &:is(button) {\n                cursor: pointer;\n                border-radius: var(--rounded);\n                transition: background-color 0.2s ease;\n\n                &:hover {\n                    background-color: var(--color-surface-2);\n                }\n            }\n        }\n\n        &-marker {\n            display: inline-flex;\n            align-items: center;\n            justify-content: center;\n            width: var(--spacing-20);\n            height: var(--spacing-20);\n            flex-shrink: 0;\n            position: relative;\n            z-index: 1;\n            background-color: var(--color-surface-1);\n            border-radius: var(--rounded-full);\n            border: var(--spacing-px) solid var(--color-surface-4);\n\n            &--active {\n                background-color: var(\n                    --chatbot-main-color,\n                    var(--color-surface-4)\n                );\n                border-color: transparent;\n                color: var(--chatbot-contrast-color, var(--color-word-1));\n            }\n        }\n\n        &__step-label {\n            min-width: 0;\n            overflow: hidden;\n            text-overflow: ellipsis;\n            white-space: nowrap;\n            color: var(--color-word-2);\n        }\n\n        &__step-summary {\n            flex: 1 1 0;\n            min-width: 0;\n            overflow: hidden;\n            text-overflow: ellipsis;\n            white-space: nowrap;\n            color: var(--color-word-4);\n        }\n\n        &__step-duration {\n            color: var(--color-word-4);\n            font-variant-numeric: tabular-nums;\n            white-space: nowrap;\n        }\n\n        &__step--active &__step-label {\n            color: var(--color-word-1);\n        }\n\n        &__step-body {\n            margin-left: var(--spacing-28);\n            margin-block: var(--spacing-4) var(--spacing-8);\n        }\n\n        &__step-content {\n            border: var(--spacing-px) solid var(--color-surface-4);\n            border-radius: var(--rounded);\n            padding: var(--spacing-8);\n            background-color: var(--color-surface-1);\n\n            &--scroll {\n                max-height: var(--spacing-256);\n            }\n        }\n\n        &__step-payload {\n            display: flex;\n            flex-direction: column;\n            gap: var(--spacing-2);\n\n            & + & {\n                margin-top: var(--spacing-8);\n            }\n\n            pre {\n                border: var(--spacing-px) solid var(--color-surface-4);\n                border-radius: var(--rounded);\n                padding: var(--spacing-8);\n                font-size: var(--text-10);\n                max-height: var(--spacing-160);\n                overflow: auto;\n                white-space: pre-wrap;\n                word-break: break-word;\n                font-family: var(--font-mono);\n                background-color: var(--color-surface-1);\n            }\n        }\n\n        &__step-payload-label {\n            font-weight: 600;\n            color: var(--color-word-3);\n            text-transform: uppercase;\n            font-size: var(--text-10);\n            letter-spacing: 0.05em;\n        }\n\n        &__step-payload--error {\n            .pk-chatbot-steps__step-payload-label,\n            pre {\n                color: var(--color-danger);\n            }\n\n            pre {\n                border-color: var(--color-danger-lighten-5);\n            }\n        }\n    }\n</style>\n","<script lang=\"ts\" setup>\n    import { computed, reactive, ref, watch } from 'vue'\n    import { useI18n } from 'vue-i18n'\n    import type { UIChatMessage } from 'models'\n    import PkStreamingMarkdown from './PkStreamingMarkdown.vue'\n    import PkStreamingMarkdownAutoscroll from './PkStreamingMarkdownAutoscroll.vue'\n    import PkChatbotStepToolDetail from './PkChatbotStepToolDetail.vue'\n    import {\n        isReasoningPart,\n        isToolPart,\n        getPartIcon,\n        getPartState,\n        getToolPartLabel,\n        getToolPartSummary,\n        hasRichToolDetail,\n        stringifyPayload,\n        formatDuration as formatDurationWith,\n    } from './utils'\n\n    const props = defineProps<{\n        message: UIChatMessage\n        isStreaming?: boolean\n        isDark?: boolean\n    }>()\n\n    const { t: $t, n: $n } = useI18n({\n        useScope: 'global',\n    })\n\n    type MessagePart = UIChatMessage['parts'][number]\n\n    interface Step {\n        key: string\n        part: MessagePart\n        icon?: string\n        label?: string\n        summary?: string\n        durationMs?: number\n        isActive: boolean\n        text?: string\n        toolInput?: unknown\n        toolOutput?: unknown\n    }\n\n    const steps = computed<Step[]>(() => {\n        const parts = props.message.parts\n        const partTimings = props.message.metadata?.partTimings\n        const result: Step[] = []\n        for (const [index, part] of parts.entries()) {\n            const isReasoning = isReasoningPart(part)\n            const isTool = isToolPart(part)\n            if (!isReasoning && !isTool) {\n                continue\n            }\n            const toolCallId =\n                'toolCallId' in part ? (part.toolCallId as string) : undefined\n            result.push({\n                key: toolCallId ?? `${part.type}-${index}`,\n                part,\n                icon: getPartIcon(part),\n                label: getToolPartLabel($t, part),\n                summary: getToolPartSummary(part),\n                durationMs: toolCallId ? partTimings?.[toolCallId] : undefined,\n                isActive:\n                    Boolean(props.isStreaming) && index === parts.length - 1,\n                text: isReasoning && part.text.trim() ? part.text : undefined,\n                toolInput: isTool && 'input' in part ? part.input : undefined,\n                toolOutput:\n                    isTool && 'output' in part ? part.output : undefined,\n            })\n        }\n        return result\n    })\n\n    const totalDurationMs = computed(() => {\n        const { createdAt, completedAt } = props.message.metadata ?? {}\n        if (!createdAt || !completedAt) {\n            return undefined\n        }\n        return completedAt - createdAt\n    })\n\n    const formatDuration = (ms?: number) => formatDurationWith($n, ms)\n\n    const getStepError = (step: Step) =>\n        getPartState(step.part) === 'output-error' &&\n        'errorText' in step.part &&\n        typeof step.part.errorText === 'string'\n            ? step.part.errorText\n            : undefined\n\n    const hasBody = (step: Step) => {\n        if (step.text || getStepError(step)) {\n            return true\n        }\n        if (hasRichToolDetail(step.part)) {\n            return step.toolInput !== undefined || step.toolOutput !== undefined\n        }\n        return Boolean(\n            stringifyPayload(step.toolInput) ??\n            stringifyPayload(step.toolOutput),\n        )\n    }\n\n    // --- Expand / collapse ---\n    // The active (streaming) step is auto-expanded; a manual toggle always\n    // wins over the automatic behavior.\n    const manualSteps = reactive(new Map<string, boolean>())\n    const isStepExpanded = (step: Step) =>\n        manualSteps.get(step.key) ?? step.isActive\n    const toggleStep = (step: Step) => {\n        manualSteps.set(step.key, !isStepExpanded(step))\n    }\n\n    // The group is open while streaming and collapses to its header once the\n    // answer is complete, unless the user toggled it manually.\n    const manualGroup = ref<boolean | undefined>(undefined)\n    const isGroupExpanded = computed(\n        () => manualGroup.value ?? Boolean(props.isStreaming),\n    )\n    // Reset the manual override when a new stream starts so the timeline\n    // opens again on regenerate.\n    watch(\n        () => props.isStreaming,\n        (streaming) => {\n            if (streaming) {\n                manualGroup.value = undefined\n                manualSteps.clear()\n            }\n        },\n    )\n</script>\n\n<template>\n    <div v-if=\"steps.length\" class=\"pk-chatbot-steps\">\n        <button\n            type=\"button\"\n            class=\"pk-chatbot-steps__header\"\n            :aria-expanded=\"isGroupExpanded\"\n            @click=\"manualGroup = !isGroupExpanded\">\n            <VvIcon\n                v-if=\"isStreaming\"\n                name=\"line-md:loading-loop\"\n                class=\"shrink-0\" />\n            <VvIcon v-else name=\"ri:route-line\" class=\"shrink-0\" />\n            <span class=\"pk-chatbot-steps__title\">\n                {{ $t('messagePart.steps') }}\n            </span>\n            <span class=\"pk-chatbot-steps__meta\">\n                {{ $t('messagePart.stepCount', steps.length) }}\n                <template v-if=\"formatDuration(totalDurationMs)\">\n                    · {{ formatDuration(totalDurationMs) }}\n                </template>\n            </span>\n            <VvIcon\n                :name=\"\n                    isGroupExpanded\n                        ? 'ri:arrow-up-s-line'\n                        : 'ri:arrow-down-s-line'\n                \"\n                class=\"pk-chatbot-steps__chevron shrink-0 ml-auto\" />\n        </button>\n        <ol v-if=\"isGroupExpanded\" class=\"pk-chatbot-steps__list\">\n            <li\n                v-for=\"step in steps\"\n                :key=\"step.key\"\n                class=\"pk-chatbot-steps__step\"\n                :class=\"{\n                    'pk-chatbot-steps__step--active': step.isActive,\n                }\">\n                <component\n                    :is=\"hasBody(step) ? 'button' : 'div'\"\n                    :type=\"hasBody(step) ? 'button' : undefined\"\n                    class=\"pk-chatbot-steps__step-header\"\n                    :aria-expanded=\"\n                        hasBody(step) ? isStepExpanded(step) : undefined\n                    \"\n                    @click=\"hasBody(step) ? toggleStep(step) : undefined\">\n                    <span\n                        class=\"pk-chatbot-steps-marker\"\n                        :class=\"{\n                            'pk-chatbot-steps-marker--active': step.isActive,\n                        }\">\n                        <VvIcon\n                            v-if=\"step.isActive\"\n                            name=\"line-md:loading-loop\" />\n                        <VvIcon v-else-if=\"step.icon\" :name=\"step.icon\" />\n                    </span>\n                    <span class=\"pk-chatbot-steps__step-label\">\n                        {{ step.label }}\n                    </span>\n                    <span class=\"pk-chatbot-steps__step-summary\">\n                        {{ step.summary }}\n                    </span>\n                    <span\n                        v-if=\"formatDuration(step.durationMs)\"\n                        class=\"pk-chatbot-steps__step-duration\">\n                        {{ formatDuration(step.durationMs) }}\n                    </span>\n                    <VvIcon\n                        v-if=\"hasBody(step)\"\n                        :name=\"\n                            isStepExpanded(step)\n                                ? 'ri:arrow-up-s-line'\n                                : 'ri:arrow-down-s-line'\n                        \"\n                        class=\"pk-chatbot-steps__chevron shrink-0 ml-auto\" />\n                </component>\n                <div\n                    v-if=\"hasBody(step) && isStepExpanded(step)\"\n                    class=\"pk-chatbot-steps__step-body\">\n                    <PkStreamingMarkdownAutoscroll\n                        v-if=\"step.text && step.isActive\"\n                        :markdown=\"step.text\"\n                        :is-dark\n                        inner-class=\"wysiwyg\"\n                        class=\"pk-chatbot-steps__step-content pk-chatbot-steps__step-content--scroll\" />\n                    <PkStreamingMarkdown\n                        v-else-if=\"step.text\"\n                        :markdown=\"step.text\"\n                        :is-dark\n                        class=\"wysiwyg pk-chatbot-steps__step-content\" />\n                    <div\n                        v-else-if=\"getStepError(step)\"\n                        class=\"pk-chatbot-steps__step-payload pk-chatbot-steps__step-payload--error\">\n                        <span class=\"pk-chatbot-steps__step-payload-label\">\n                            {{ $t('messagePart.stepError') }}\n                        </span>\n                        <pre>{{ getStepError(step) }}</pre>\n                    </div>\n                    <PkChatbotStepToolDetail\n                        v-else-if=\"hasRichToolDetail(step.part)\"\n                        :part=\"step.part\" />\n                    <template v-else>\n                        <div\n                            v-if=\"stringifyPayload(step.toolInput)\"\n                            class=\"pk-chatbot-steps__step-payload\">\n                            <span class=\"pk-chatbot-steps__step-payload-label\">\n                                {{ $t('messagePart.stepInput') }}\n                            </span>\n                            <pre>{{ stringifyPayload(step.toolInput) }}</pre>\n                        </div>\n                        <div\n                            v-if=\"stringifyPayload(step.toolOutput)\"\n                            class=\"pk-chatbot-steps__step-payload\">\n                            <span class=\"pk-chatbot-steps__step-payload-label\">\n                                {{ $t('messagePart.stepOutput') }}\n                            </span>\n                            <pre>{{ stringifyPayload(step.toolOutput) }}</pre>\n                        </div>\n                    </template>\n                </div>\n            </li>\n        </ol>\n    </div>\n</template>\n\n<style lang=\"scss\">\n    .pk-chatbot-steps {\n        width: 100%;\n        border: var(--spacing-px) solid var(--color-surface-3);\n        border-radius: var(--rounded-lg);\n        background-color: var(--color-surface-1);\n        font-size: var(--text-12);\n        color: var(--color-word-3);\n        overflow: hidden;\n\n        &__header {\n            display: flex;\n            align-items: center;\n            gap: var(--spacing-8);\n            width: 100%;\n            min-height: var(--spacing-40);\n            padding: var(--spacing-8) var(--spacing-sm);\n            text-align: left;\n            cursor: pointer;\n            transition: background-color 0.2s ease;\n\n            &:hover {\n                background-color: var(--color-surface-2);\n            }\n        }\n\n        &__chevron {\n            font-size: var(--text-16);\n        }\n\n        &__title {\n            font-weight: 600;\n            color: var(--color-word-2);\n            flex-grow: 1;\n        }\n\n        &__meta {\n            color: var(--color-word-4);\n            font-variant-numeric: tabular-nums;\n            white-space: nowrap;\n        }\n\n        &__list {\n            background-color: var(--color-surface);\n            border-top: var(--spacing-px) solid var(--color-surface-3);\n            padding: var(--spacing-8) var(--spacing-sm);\n            display: flex;\n            flex-direction: column;\n        }\n\n        &__step {\n            position: relative;\n\n            // Vertical connector between step markers\n            &:not(:last-child)::before {\n                content: '';\n                position: absolute;\n                left: var(--spacing-10);\n                top: var(--spacing-28);\n                bottom: calc(var(--spacing-8) * -1);\n                width: var(--spacing-px);\n                background-color: var(--color-surface-4);\n            }\n        }\n\n        &__step-header {\n            display: flex;\n            align-items: center;\n            gap: var(--spacing-8);\n            width: calc(100% + var(--spacing-16));\n            min-height: var(--spacing-36);\n            margin-inline: calc(var(--spacing-8) * -1);\n            padding: var(--spacing-4) var(--spacing-8);\n            text-align: left;\n\n            &:is(button) {\n                cursor: pointer;\n                border-radius: var(--rounded);\n                transition: background-color 0.2s ease;\n\n                &:hover {\n                    background-color: var(--color-surface-2);\n                }\n            }\n        }\n\n        &-marker {\n            display: inline-flex;\n            align-items: center;\n            justify-content: center;\n            width: var(--spacing-20);\n            height: var(--spacing-20);\n            flex-shrink: 0;\n            position: relative;\n            z-index: 1;\n            background-color: var(--color-surface-1);\n            border-radius: var(--rounded-full);\n            border: var(--spacing-px) solid var(--color-surface-4);\n\n            &--active {\n                background-color: var(\n                    --chatbot-main-color,\n                    var(--color-surface-4)\n                );\n                border-color: transparent;\n                color: var(--chatbot-contrast-color, var(--color-word-1));\n            }\n        }\n\n        &__step-label {\n            min-width: 0;\n            overflow: hidden;\n            text-overflow: ellipsis;\n            white-space: nowrap;\n            color: var(--color-word-2);\n        }\n\n        &__step-summary {\n            flex: 1 1 0;\n            min-width: 0;\n            overflow: hidden;\n            text-overflow: ellipsis;\n            white-space: nowrap;\n            color: var(--color-word-4);\n        }\n\n        &__step-duration {\n            color: var(--color-word-4);\n            font-variant-numeric: tabular-nums;\n            white-space: nowrap;\n        }\n\n        &__step--active &__step-label {\n            color: var(--color-word-1);\n        }\n\n        &__step-body {\n            margin-left: var(--spacing-28);\n            margin-block: var(--spacing-4) var(--spacing-8);\n        }\n\n        &__step-content {\n            border: var(--spacing-px) solid var(--color-surface-4);\n            border-radius: var(--rounded);\n            padding: var(--spacing-8);\n            background-color: var(--color-surface-1);\n\n            &--scroll {\n                max-height: var(--spacing-256);\n            }\n        }\n\n        &__step-payload {\n            display: flex;\n            flex-direction: column;\n            gap: var(--spacing-2);\n\n            & + & {\n                margin-top: var(--spacing-8);\n            }\n\n            pre {\n                border: var(--spacing-px) solid var(--color-surface-4);\n                border-radius: var(--rounded);\n                padding: var(--spacing-8);\n                font-size: var(--text-10);\n                max-height: var(--spacing-160);\n                overflow: auto;\n                white-space: pre-wrap;\n                word-break: break-word;\n                font-family: var(--font-mono);\n                background-color: var(--color-surface-1);\n            }\n        }\n\n        &__step-payload-label {\n            font-weight: 600;\n            color: var(--color-word-3);\n            text-transform: uppercase;\n            font-size: var(--text-10);\n            letter-spacing: 0.05em;\n        }\n\n        &__step-payload--error {\n            .pk-chatbot-steps__step-payload-label,\n            pre {\n                color: var(--color-danger);\n            }\n\n            pre {\n                border-color: var(--color-danger-lighten-5);\n            }\n        }\n    }\n</style>\n"],"mappings":"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"}

package/dist-vue/_chunks/{PkChatbotViewChat-CAqvbbfN.js → PkChatbotViewChat-c0Ecpzoc.js}

@@ -1,9 +1,9 @@
-import { t as e } from "./useChatbotStore-DZiorgLW.js";
+import { t as e } from "./useChatbotStore-C3uKi2FS.js";
 import { t } from "./useLocalizedString-PfaKjIQY.js";
 import { t as n } from "./PkAvatar-CyIgsndA.js";
-import { t as r } from "./PkChatbotMessages-BrufA7o1.js";
-import { t as i } from "./PkChatbotInput-DTazYlPd.js";
-import { t as a } from "./PkChatbotEmptyState-BGOC6vxr.js";
+import { t as r } from "./PkChatbotMessages-B3G12zah.js";
+import { t as i } from "./PkChatbotInput-jvb0vuak.js";
+import { t as a } from "./PkChatbotEmptyState-CPqLqXek.js";
 import { VvIcon as o } from "@volverjs/ui-vue/components";
 import { Transition as s, computed as c, createBlock as l, createCommentVNode as u, createElementBlock as d, createElementVNode as f, createSlots as p, createVNode as m, defineAsyncComponent as h, defineComponent as g, isRef as _, normalizeClass as v, onBeforeUnmount as y, onMounted as b, onUnmounted as x, openBlock as S, ref as C, toDisplayString as w, toValue as T, unref as E, useTemplateRef as D, withCtx as O } from "vue";
 import { useI18n as k } from "vue-i18n";
@@ -128,7 +128,7 @@ var j = {
 	},
 	emits: ["show-info", "revise"],
 	setup(g, { emit: y }) {
-		let b = h(() => import("./PkToolShowForm-CQuX08lk.js").then((e) => e.n)), x = h(() => import("./PkToolShowContactForm-B6-MsExL.js").then((e) => e.n)), C = h(() => import("./PkToolShowSuggestedReply-DoCHIEzz.js").then((e) => e.n)), T = h(() => import("./PkToolShowSources-CFh-i60o.js").then((e) => e.n)), A = h(() => import("./PkToolRequestGeolocation-aw2-ecEn.js")), j = h(() => import("./PkToolRequestOAuthConnection-lo7hCSBC.js")), M = h(() => import("./PkToolShowLocation-5G8p9mED.js").then((e) => e.n)), N = h(() => import("./PkToolShowDiagram-G0hdi_Vf.js")), P = g, I = y, L = e(P.agentId), { agentInterface: R, agentFileUpload: z, actions: ce, revisedAnswers: le, messages: B, chat: V, messageFeedbacks: ue, feedbackDialogMessage: H, isFeedbackSubmitting: de, isFeedbackSubmitted: fe, feedbackSubmitError: pe, isLeadSubmitted: me, isLoadingSubmitLead: he, submitLeadError: ge, input: U, inputMessagePlaceholder: _e, isConversationBlocked: ve, baseUrl: ye, pendingAttachments: W, isAttachmentLimitReached: be, fileLimitError: xe, apiClient: G, isDark: K } = te(L), { handleSubmit: q, stopGeneration: Se, regenerate: J, onUpvote: Ce, onDownvote: we, onFeedback: Te, onFeedbackSubmit: Ee, onLeadSubmit: De, startNewChat: Oe, addToolOutput: Y, addToolApprovalResponse: ke, handleFileSelect: X, clearFileLimitError: Ae } = L, { t: Z } = k({ useScope: "global" }), je = c(() => {
+		let b = h(() => import("./PkToolShowForm-j7Ha-0X3.js").then((e) => e.n)), x = h(() => import("./PkToolShowContactForm-DRRtCCxB.js").then((e) => e.n)), C = h(() => import("./PkToolShowSuggestedReply-DoCHIEzz.js").then((e) => e.n)), T = h(() => import("./PkToolShowSources-BVLw4W5l.js").then((e) => e.n)), A = h(() => import("./PkToolRequestGeolocation-aw2-ecEn.js")), j = h(() => import("./PkToolRequestOAuthConnection-lo7hCSBC.js")), M = h(() => import("./PkToolShowLocation-5G8p9mED.js").then((e) => e.n)), N = h(() => import("./PkToolShowDiagram-G0hdi_Vf.js")), P = g, I = y, L = e(P.agentId), { agentInterface: R, agentFileUpload: z, actions: ce, revisedAnswers: le, messages: B, chat: V, messageFeedbacks: ue, feedbackDialogMessage: H, isFeedbackSubmitting: de, isFeedbackSubmitted: fe, feedbackSubmitError: pe, isLeadSubmitted: me, isLoadingSubmitLead: he, submitLeadError: ge, input: U, inputMessagePlaceholder: _e, isConversationBlocked: ve, baseUrl: ye, pendingAttachments: W, isAttachmentLimitReached: be, fileLimitError: xe, apiClient: G, isDark: K } = te(L), { handleSubmit: q, stopGeneration: Se, regenerate: J, onUpvote: Ce, onDownvote: we, onFeedback: Te, onFeedbackSubmit: Ee, onLeadSubmit: De, startNewChat: Oe, addToolOutput: Y, addToolApprovalResponse: ke, handleFileSelect: X, clearFileLimitError: Ae } = L, { t: Z } = k({ useScope: "global" }), je = c(() => {
 			let e = xe.value;
 			if (e) return e.reason === "per-chat" ? Z("message.fileLimitPerChat", { max: e.max }) : Z("message.fileLimitPerMessage", { max: e.max });
 		}), Q = t(() => R.value?.dismissableNotice), Me = c(() => B.value.some((e) => e.role === "user")), $ = c(() => P.modifier === "fullscreen" && !Me.value), Ne = ne(R, () => P.userName), Pe = D("chatViewEl"), Fe = async (e) => (await G.value.expandSourceContext(P.agentId, e.documentId, e.chunkIndex)).content, Ie = async (e) => {
@@ -383,4 +383,4 @@ var j = {
 //#endregion
 export { F as n, I as t };
 
-//# sourceMappingURL=PkChatbotViewChat-CAqvbbfN.js.map
+//# sourceMappingURL=PkChatbotViewChat-c0Ecpzoc.js.map