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

package/dist/_chunks/{PkToolShowContactForm-DtjVW-n6.js.map → PkToolShowContactForm-vZTYDdfX.js.map}

@@ -1 +1 @@
-{"version":3,"file":"PkToolShowContactForm-DtjVW-n6.js","names":[],"sources":["../../../../packages/components/src/chat/PkToolShowContactForm.vue","../../../../packages/components/src/chat/PkToolShowContactForm.vue"],"sourcesContent":["<script setup lang=\"ts\">\n    import { computed, watch } from 'vue'\n    import { useI18n } from 'vue-i18n'\n    import { useForm } from '@volverjs/form-vue'\n    import * as z from 'zod'\n    import { useSafeLocalStorage, useLocalizedString } from 'composables'\n    import type { LocalizedString } from 'models'\n    import PkStreamingMarkdown from './PkStreamingMarkdown.vue'\n\n    const { t: $t } = useI18n({ useScope: 'global' })\n\n    const props = defineProps<{\n        part: unknown\n        submitted?: boolean\n        loading?: boolean\n        error?: string\n        readonly?: boolean\n        privacyPolicyNotice?: LocalizedString\n    }>()\n\n    const toolPart = computed(() => {\n        const part = props.part as {\n            type: string\n            toolCallId: string\n            input?: {\n                name: string\n                email: string\n                phone?: string\n                conversationContext?: Record<string, unknown>\n            }\n        }\n        return part\n    })\n\n    const input = computed(() => toolPart.value.input)\n\n    const localSubmitted = useSafeLocalStorage<boolean>(\n        computed(\n            () =>\n                `${toolPart.value.toolCallId}-${toolPart.value.type}-submitted`,\n        ),\n        false,\n    )\n\n    const LeadFormSchema = z.object({\n        name: z.string().min(1).max(255).default(''),\n        email: z.email().max(255).default(''),\n        phone: z\n            .string()\n            .max(50)\n            .regex(/^[+0-9\\s\\-.()]*$/, $t('validation.invalidPhoneNumber'))\n            .optional(),\n    })\n\n    const emit = defineEmits<{\n        submit: [data: Record<string, unknown>]\n    }>()\n\n    const { VvForm, VvFormField, formData } = useForm(LeadFormSchema, {\n        lazyLoad: true,\n    })\n\n    // Pre-populate form with input values\n    watch(\n        input,\n        (newInput) => {\n            formData.value = {\n                name: newInput?.name || '',\n                email: newInput?.email || '',\n                phone: newInput?.phone || '',\n            }\n        },\n        { immediate: true },\n    )\n\n    watch(\n        () => props.submitted,\n        (submitted) => {\n            if (submitted) {\n                localSubmitted.value = true\n            }\n        },\n        { immediate: true },\n    )\n\n    const isSubmitted = computed(() => {\n        return props.submitted || localSubmitted.value\n    })\n\n    const submitLead = async (data: Record<string, unknown>): Promise<void> => {\n        emit('submit', { ...data, metadata: input.value?.conversationContext })\n    }\n\n    const privacyNotice = useLocalizedString(\n        () => props.privacyPolicyNotice,\n        'message.defaultPrivacyPolicyNotice',\n    )\n</script>\n\n<template>\n    <div\n        class=\"border border-surface-3 rounded-xl w-full overflow-hidden bg-surface\">\n        <div\n            class=\"px-sm py-6 bg-surface-1 min-h-40 text-12 border-b border-surface-3 text-word-3 flex items-center gap-8 min-h-40\">\n            <VvIcon name=\"ri:send-plane-2-line\" class=\"text-16\" />\n            <strong class=\"font-bold\">{{ $t('label.contactUs') }}</strong>\n        </div>\n\n        <Transition mode=\"out-in\">\n            <div v-if=\"!isSubmitted\" class=\"p-sm\">\n                <VvForm v-model=\"formData\" :readonly @submit=\"submitLead\">\n                    <VvFormField\n                        name=\"name\"\n                        type=\"text\"\n                        :label=\"$t('label.name')\"\n                        :placeholder=\"$t('placeholder.name')\"\n                        icon=\"ri:user-line\"\n                        modifiers=\"compact no-label\"\n                        class=\"mb-md\" />\n                    <VvFormField\n                        name=\"email\"\n                        type=\"email\"\n                        :label=\"$t('label.email')\"\n                        :placeholder=\"$t('placeholder.email')\"\n                        icon=\"ri:mail-line\"\n                        modifiers=\"compact no-label\"\n                        class=\"mb-md\" />\n                    <VvFormField\n                        name=\"phone\"\n                        type=\"tel\"\n                        :label=\"$t('label.phone')\"\n                        :placeholder=\"$t('placeholder.phone')\"\n                        icon=\"ri:phone-line\"\n                        class=\"mb-md\"\n                        modifiers=\"compact no-label\" />\n\n                    <div class=\"flex justify-between items-center gap-16 mt-xs\">\n                        <div\n                            class=\"text-smaller text-word-3 flex items-center gap-8\">\n                            <VvIcon\n                                name=\"ri:shield-check-line\"\n                                class=\"text-16 shrink-0\" />\n                            <PkStreamingMarkdown\n                                :markdown=\"privacyNotice\"\n                                class=\"wysiwyg\" />\n                        </div>\n                        <VvButton\n                            type=\"submit\"\n                            modifiers=\"primary\"\n                            :loading\n                            :disabled=\"loading || readonly\"\n                            icon-position=\"right\"\n                            class=\"shrink-0\"\n                            :label=\"$t('action.submit')\" />\n                    </div>\n                </VvForm>\n            </div>\n            <div v-else class=\"p-sm\">\n                <div class=\"flex items-center gap-sm\">\n                    <VvIcon\n                        name=\"ri:mail-check-line\"\n                        class=\"text-24 text-success\" />\n                    <div>\n                        <strong class=\"font-semibold block text-success\">\n                            {{ $t('message.leadSubmittedTitle') }}\n                        </strong>\n                        <p class=\"text-word-3\">\n                            {{ $t('message.leadSubmittedMessage') }}\n                        </p>\n                    </div>\n                </div>\n            </div>\n        </Transition>\n    </div>\n</template>\n","<script setup lang=\"ts\">\n    import { computed, watch } from 'vue'\n    import { useI18n } from 'vue-i18n'\n    import { useForm } from '@volverjs/form-vue'\n    import * as z from 'zod'\n    import { useSafeLocalStorage, useLocalizedString } from 'composables'\n    import type { LocalizedString } from 'models'\n    import PkStreamingMarkdown from './PkStreamingMarkdown.vue'\n\n    const { t: $t } = useI18n({ useScope: 'global' })\n\n    const props = defineProps<{\n        part: unknown\n        submitted?: boolean\n        loading?: boolean\n        error?: string\n        readonly?: boolean\n        privacyPolicyNotice?: LocalizedString\n    }>()\n\n    const toolPart = computed(() => {\n        const part = props.part as {\n            type: string\n            toolCallId: string\n            input?: {\n                name: string\n                email: string\n                phone?: string\n                conversationContext?: Record<string, unknown>\n            }\n        }\n        return part\n    })\n\n    const input = computed(() => toolPart.value.input)\n\n    const localSubmitted = useSafeLocalStorage<boolean>(\n        computed(\n            () =>\n                `${toolPart.value.toolCallId}-${toolPart.value.type}-submitted`,\n        ),\n        false,\n    )\n\n    const LeadFormSchema = z.object({\n        name: z.string().min(1).max(255).default(''),\n        email: z.email().max(255).default(''),\n        phone: z\n            .string()\n            .max(50)\n            .regex(/^[+0-9\\s\\-.()]*$/, $t('validation.invalidPhoneNumber'))\n            .optional(),\n    })\n\n    const emit = defineEmits<{\n        submit: [data: Record<string, unknown>]\n    }>()\n\n    const { VvForm, VvFormField, formData } = useForm(LeadFormSchema, {\n        lazyLoad: true,\n    })\n\n    // Pre-populate form with input values\n    watch(\n        input,\n        (newInput) => {\n            formData.value = {\n                name: newInput?.name || '',\n                email: newInput?.email || '',\n                phone: newInput?.phone || '',\n            }\n        },\n        { immediate: true },\n    )\n\n    watch(\n        () => props.submitted,\n        (submitted) => {\n            if (submitted) {\n                localSubmitted.value = true\n            }\n        },\n        { immediate: true },\n    )\n\n    const isSubmitted = computed(() => {\n        return props.submitted || localSubmitted.value\n    })\n\n    const submitLead = async (data: Record<string, unknown>): Promise<void> => {\n        emit('submit', { ...data, metadata: input.value?.conversationContext })\n    }\n\n    const privacyNotice = useLocalizedString(\n        () => props.privacyPolicyNotice,\n        'message.defaultPrivacyPolicyNotice',\n    )\n</script>\n\n<template>\n    <div\n        class=\"border border-surface-3 rounded-xl w-full overflow-hidden bg-surface\">\n        <div\n            class=\"px-sm py-6 bg-surface-1 min-h-40 text-12 border-b border-surface-3 text-word-3 flex items-center gap-8 min-h-40\">\n            <VvIcon name=\"ri:send-plane-2-line\" class=\"text-16\" />\n            <strong class=\"font-bold\">{{ $t('label.contactUs') }}</strong>\n        </div>\n\n        <Transition mode=\"out-in\">\n            <div v-if=\"!isSubmitted\" class=\"p-sm\">\n                <VvForm v-model=\"formData\" :readonly @submit=\"submitLead\">\n                    <VvFormField\n                        name=\"name\"\n                        type=\"text\"\n                        :label=\"$t('label.name')\"\n                        :placeholder=\"$t('placeholder.name')\"\n                        icon=\"ri:user-line\"\n                        modifiers=\"compact no-label\"\n                        class=\"mb-md\" />\n                    <VvFormField\n                        name=\"email\"\n                        type=\"email\"\n                        :label=\"$t('label.email')\"\n                        :placeholder=\"$t('placeholder.email')\"\n                        icon=\"ri:mail-line\"\n                        modifiers=\"compact no-label\"\n                        class=\"mb-md\" />\n                    <VvFormField\n                        name=\"phone\"\n                        type=\"tel\"\n                        :label=\"$t('label.phone')\"\n                        :placeholder=\"$t('placeholder.phone')\"\n                        icon=\"ri:phone-line\"\n                        class=\"mb-md\"\n                        modifiers=\"compact no-label\" />\n\n                    <div class=\"flex justify-between items-center gap-16 mt-xs\">\n                        <div\n                            class=\"text-smaller text-word-3 flex items-center gap-8\">\n                            <VvIcon\n                                name=\"ri:shield-check-line\"\n                                class=\"text-16 shrink-0\" />\n                            <PkStreamingMarkdown\n                                :markdown=\"privacyNotice\"\n                                class=\"wysiwyg\" />\n                        </div>\n                        <VvButton\n                            type=\"submit\"\n                            modifiers=\"primary\"\n                            :loading\n                            :disabled=\"loading || readonly\"\n                            icon-position=\"right\"\n                            class=\"shrink-0\"\n                            :label=\"$t('action.submit')\" />\n                    </div>\n                </VvForm>\n            </div>\n            <div v-else class=\"p-sm\">\n                <div class=\"flex items-center gap-sm\">\n                    <VvIcon\n                        name=\"ri:mail-check-line\"\n                        class=\"text-24 text-success\" />\n                    <div>\n                        <strong class=\"font-semibold block text-success\">\n                            {{ $t('message.leadSubmittedTitle') }}\n                        </strong>\n                        <p class=\"text-word-3\">\n                            {{ $t('message.leadSubmittedMessage') }}\n                        </p>\n                    </div>\n                </div>\n            </div>\n        </Transition>\n    </div>\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"PkToolShowContactForm-vZTYDdfX.js","names":[],"sources":["../../../../packages/components/src/chat/PkToolShowContactForm.vue","../../../../packages/components/src/chat/PkToolShowContactForm.vue"],"sourcesContent":["<script setup lang=\"ts\">\n    import { computed, watch } from 'vue'\n    import { useI18n } from 'vue-i18n'\n    import { useForm } from '@volverjs/form-vue'\n    import * as z from 'zod'\n    import { useSafeLocalStorage, useLocalizedString } from 'composables'\n    import type { LocalizedString } from 'models'\n    import PkStreamingMarkdown from './PkStreamingMarkdown.vue'\n\n    const { t: $t } = useI18n({ useScope: 'global' })\n\n    const props = defineProps<{\n        part: unknown\n        submitted?: boolean\n        loading?: boolean\n        error?: string\n        readonly?: boolean\n        privacyPolicyNotice?: LocalizedString\n    }>()\n\n    const toolPart = computed(() => {\n        const part = props.part as {\n            type: string\n            toolCallId: string\n            input?: {\n                name: string\n                email: string\n                phone?: string\n                conversationContext?: Record<string, unknown>\n            }\n        }\n        return part\n    })\n\n    const input = computed(() => toolPart.value.input)\n\n    const localSubmitted = useSafeLocalStorage<boolean>(\n        computed(\n            () =>\n                `${toolPart.value.toolCallId}-${toolPart.value.type}-submitted`,\n        ),\n        false,\n    )\n\n    const LeadFormSchema = z.object({\n        name: z.string().min(1).max(255).default(''),\n        email: z.email().max(255).default(''),\n        phone: z\n            .string()\n            .max(50)\n            .regex(/^[+0-9\\s\\-.()]*$/, $t('validation.invalidPhoneNumber'))\n            .optional(),\n    })\n\n    const emit = defineEmits<{\n        submit: [data: Record<string, unknown>]\n    }>()\n\n    const { VvForm, VvFormField, formData } = useForm(LeadFormSchema, {\n        lazyLoad: true,\n    })\n\n    // Pre-populate form with input values\n    watch(\n        input,\n        (newInput) => {\n            formData.value = {\n                name: newInput?.name || '',\n                email: newInput?.email || '',\n                phone: newInput?.phone || '',\n            }\n        },\n        { immediate: true },\n    )\n\n    watch(\n        () => props.submitted,\n        (submitted) => {\n            if (submitted) {\n                localSubmitted.value = true\n            }\n        },\n        { immediate: true },\n    )\n\n    const isSubmitted = computed(() => {\n        return props.submitted || localSubmitted.value\n    })\n\n    const submitLead = async (data: Record<string, unknown>): Promise<void> => {\n        emit('submit', { ...data, metadata: input.value?.conversationContext })\n    }\n\n    const privacyNotice = useLocalizedString(\n        () => props.privacyPolicyNotice,\n        'message.defaultPrivacyPolicyNotice',\n    )\n</script>\n\n<template>\n    <div\n        class=\"border border-surface-3 rounded-xl w-full overflow-hidden bg-surface\">\n        <div\n            class=\"px-sm py-6 bg-surface-1 min-h-40 text-12 border-b border-surface-3 text-word-3 flex items-center gap-8 min-h-40\">\n            <VvIcon name=\"ri:send-plane-2-line\" class=\"text-16\" />\n            <strong class=\"font-bold\">{{ $t('label.contactUs') }}</strong>\n        </div>\n\n        <Transition mode=\"out-in\">\n            <div v-if=\"!isSubmitted\" class=\"p-sm\">\n                <VvForm v-model=\"formData\" :readonly @submit=\"submitLead\">\n                    <VvFormField\n                        name=\"name\"\n                        type=\"text\"\n                        :label=\"$t('label.name')\"\n                        :placeholder=\"$t('placeholder.name')\"\n                        icon=\"ri:user-line\"\n                        modifiers=\"compact no-label\"\n                        class=\"mb-md\" />\n                    <VvFormField\n                        name=\"email\"\n                        type=\"email\"\n                        :label=\"$t('label.email')\"\n                        :placeholder=\"$t('placeholder.email')\"\n                        icon=\"ri:mail-line\"\n                        modifiers=\"compact no-label\"\n                        class=\"mb-md\" />\n                    <VvFormField\n                        name=\"phone\"\n                        type=\"tel\"\n                        :label=\"$t('label.phone')\"\n                        :placeholder=\"$t('placeholder.phone')\"\n                        icon=\"ri:phone-line\"\n                        class=\"mb-md\"\n                        modifiers=\"compact no-label\" />\n\n                    <div class=\"flex justify-between items-center gap-16 mt-xs\">\n                        <div\n                            class=\"text-smaller text-word-3 flex items-center gap-8\">\n                            <VvIcon\n                                name=\"ri:shield-check-line\"\n                                class=\"text-16 shrink-0\" />\n                            <PkStreamingMarkdown\n                                :markdown=\"privacyNotice\"\n                                class=\"wysiwyg\" />\n                        </div>\n                        <VvButton\n                            type=\"submit\"\n                            modifiers=\"primary\"\n                            :loading\n                            :disabled=\"loading || readonly\"\n                            icon-position=\"right\"\n                            class=\"shrink-0\"\n                            :label=\"$t('action.submit')\" />\n                    </div>\n                </VvForm>\n            </div>\n            <div v-else class=\"p-sm\">\n                <div class=\"flex items-center gap-sm\">\n                    <VvIcon\n                        name=\"ri:mail-check-line\"\n                        class=\"text-24 text-success\" />\n                    <div>\n                        <strong class=\"font-semibold block text-success\">\n                            {{ $t('message.leadSubmittedTitle') }}\n                        </strong>\n                        <p class=\"text-word-3\">\n                            {{ $t('message.leadSubmittedMessage') }}\n                        </p>\n                    </div>\n                </div>\n            </div>\n        </Transition>\n    </div>\n</template>\n","<script setup lang=\"ts\">\n    import { computed, watch } from 'vue'\n    import { useI18n } from 'vue-i18n'\n    import { useForm } from '@volverjs/form-vue'\n    import * as z from 'zod'\n    import { useSafeLocalStorage, useLocalizedString } from 'composables'\n    import type { LocalizedString } from 'models'\n    import PkStreamingMarkdown from './PkStreamingMarkdown.vue'\n\n    const { t: $t } = useI18n({ useScope: 'global' })\n\n    const props = defineProps<{\n        part: unknown\n        submitted?: boolean\n        loading?: boolean\n        error?: string\n        readonly?: boolean\n        privacyPolicyNotice?: LocalizedString\n    }>()\n\n    const toolPart = computed(() => {\n        const part = props.part as {\n            type: string\n            toolCallId: string\n            input?: {\n                name: string\n                email: string\n                phone?: string\n                conversationContext?: Record<string, unknown>\n            }\n        }\n        return part\n    })\n\n    const input = computed(() => toolPart.value.input)\n\n    const localSubmitted = useSafeLocalStorage<boolean>(\n        computed(\n            () =>\n                `${toolPart.value.toolCallId}-${toolPart.value.type}-submitted`,\n        ),\n        false,\n    )\n\n    const LeadFormSchema = z.object({\n        name: z.string().min(1).max(255).default(''),\n        email: z.email().max(255).default(''),\n        phone: z\n            .string()\n            .max(50)\n            .regex(/^[+0-9\\s\\-.()]*$/, $t('validation.invalidPhoneNumber'))\n            .optional(),\n    })\n\n    const emit = defineEmits<{\n        submit: [data: Record<string, unknown>]\n    }>()\n\n    const { VvForm, VvFormField, formData } = useForm(LeadFormSchema, {\n        lazyLoad: true,\n    })\n\n    // Pre-populate form with input values\n    watch(\n        input,\n        (newInput) => {\n            formData.value = {\n                name: newInput?.name || '',\n                email: newInput?.email || '',\n                phone: newInput?.phone || '',\n            }\n        },\n        { immediate: true },\n    )\n\n    watch(\n        () => props.submitted,\n        (submitted) => {\n            if (submitted) {\n                localSubmitted.value = true\n            }\n        },\n        { immediate: true },\n    )\n\n    const isSubmitted = computed(() => {\n        return props.submitted || localSubmitted.value\n    })\n\n    const submitLead = async (data: Record<string, unknown>): Promise<void> => {\n        emit('submit', { ...data, metadata: input.value?.conversationContext })\n    }\n\n    const privacyNotice = useLocalizedString(\n        () => props.privacyPolicyNotice,\n        'message.defaultPrivacyPolicyNotice',\n    )\n</script>\n\n<template>\n    <div\n        class=\"border border-surface-3 rounded-xl w-full overflow-hidden bg-surface\">\n        <div\n            class=\"px-sm py-6 bg-surface-1 min-h-40 text-12 border-b border-surface-3 text-word-3 flex items-center gap-8 min-h-40\">\n            <VvIcon name=\"ri:send-plane-2-line\" class=\"text-16\" />\n            <strong class=\"font-bold\">{{ $t('label.contactUs') }}</strong>\n        </div>\n\n        <Transition mode=\"out-in\">\n            <div v-if=\"!isSubmitted\" class=\"p-sm\">\n                <VvForm v-model=\"formData\" :readonly @submit=\"submitLead\">\n                    <VvFormField\n                        name=\"name\"\n                        type=\"text\"\n                        :label=\"$t('label.name')\"\n                        :placeholder=\"$t('placeholder.name')\"\n                        icon=\"ri:user-line\"\n                        modifiers=\"compact no-label\"\n                        class=\"mb-md\" />\n                    <VvFormField\n                        name=\"email\"\n                        type=\"email\"\n                        :label=\"$t('label.email')\"\n                        :placeholder=\"$t('placeholder.email')\"\n                        icon=\"ri:mail-line\"\n                        modifiers=\"compact no-label\"\n                        class=\"mb-md\" />\n                    <VvFormField\n                        name=\"phone\"\n                        type=\"tel\"\n                        :label=\"$t('label.phone')\"\n                        :placeholder=\"$t('placeholder.phone')\"\n                        icon=\"ri:phone-line\"\n                        class=\"mb-md\"\n                        modifiers=\"compact no-label\" />\n\n                    <div class=\"flex justify-between items-center gap-16 mt-xs\">\n                        <div\n                            class=\"text-smaller text-word-3 flex items-center gap-8\">\n                            <VvIcon\n                                name=\"ri:shield-check-line\"\n                                class=\"text-16 shrink-0\" />\n                            <PkStreamingMarkdown\n                                :markdown=\"privacyNotice\"\n                                class=\"wysiwyg\" />\n                        </div>\n                        <VvButton\n                            type=\"submit\"\n                            modifiers=\"primary\"\n                            :loading\n                            :disabled=\"loading || readonly\"\n                            icon-position=\"right\"\n                            class=\"shrink-0\"\n                            :label=\"$t('action.submit')\" />\n                    </div>\n                </VvForm>\n            </div>\n            <div v-else class=\"p-sm\">\n                <div class=\"flex items-center gap-sm\">\n                    <VvIcon\n                        name=\"ri:mail-check-line\"\n                        class=\"text-24 text-success\" />\n                    <div>\n                        <strong class=\"font-semibold block text-success\">\n                            {{ $t('message.leadSubmittedTitle') }}\n                        </strong>\n                        <p class=\"text-word-3\">\n                            {{ $t('message.leadSubmittedMessage') }}\n                        </p>\n                    </div>\n                </div>\n            </div>\n        </Transition>\n    </div>\n</template>\n"],"mappings":"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"}

package/dist/_chunks/{PkToolShowForm-BP8asXtz.js → PkToolShowForm-DMmZ34is.js}

@@ -1,6 +1,6 @@
 import { A as e, C as t, H as n, Ht as r, J as i, N as a, P as o, Q as s, S as c, T as l, V as u, Wt as ee, _ as d, at as f, b as p, d as te, et as m, f as h, ft as ne, g, i as _, kt as v, mt as y, p as b, qt as x, v as S, x as C, xt as w, y as T, z as E } from "./vue.runtime.esm-bundler-DbhD_IvR.js";
 import { r as re } from "./vue-i18n-kZs9Hfey.js";
-import { t as ie } from "./PkStreamingMarkdown-6Xx9n1ue.js";
+import { t as ie } from "./PkStreamingMarkdown-CHhH4FdH.js";
 import { c as D, d as ae, f as oe, n as O, o as se, p as k, s as A } from "./index.es-_oXVRjHy.js";
 e(), v();
 //#endregion
@@ -358,4 +358,4 @@ var ue = {
 //#endregion
 export { V as default };
 
-//# sourceMappingURL=PkToolShowForm-BP8asXtz.js.map
+//# sourceMappingURL=PkToolShowForm-DMmZ34is.js.map

package/dist/_chunks/{PkToolShowForm-BP8asXtz.js.map → PkToolShowForm-DMmZ34is.js.map}

@@ -1 +1 @@
-{"version":3,"file":"PkToolShowForm-BP8asXtz.js","names":[],"sources":["../../../../packages/components/src/PkEditorRadioButtons.vue","../../../../packages/components/src/PkEditorRadioButtons.vue","../../../../packages/components/src/PkEditorCheckboxButtons.vue","../../../../packages/components/src/PkEditorCheckboxButtons.vue","../../../../packages/components/src/chat/PkToolShowForm.vue","../../../../packages/components/src/chat/PkToolShowForm.vue"],"sourcesContent":["<script setup lang=\"ts\">\n    import type { Option } from '@volverjs/ui-vue'\n    import { computed } from 'vue'\n\n    const props = defineProps<{\n        name: string\n        required?: boolean\n        options: Option[]\n        readonly?: boolean\n        disabled?: boolean\n        modifiers?: string | string[]\n    }>()\n\n    const modelValue = defineModel<\n        string | number | boolean | symbol | unknown[] | undefined\n    >()\n\n    const radioModifiers = computed(() => {\n        const toReturn = props.modifiers\n            ? Array.isArray(props.modifiers)\n                ? props.modifiers\n                : [props.modifiers]\n            : []\n        return [...toReturn, 'button']\n    })\n</script>\n\n<template>\n    <VvRadioGroup v-model=\"modelValue\" :name modifiers=\"buttons\">\n        <VvRadio\n            v-for=\"(option, key) in options\"\n            :key\n            :name\n            :required\n            :readonly\n            :disabled\n            :value=\"option.value\"\n            :modifiers=\"radioModifiers\">\n            <slot :name=\"option.value\" v-bind=\"{ option }\">\n                {{ option.label }}\n            </slot>\n        </VvRadio>\n    </VvRadioGroup>\n</template>\n","<script setup lang=\"ts\">\n    import type { Option } from '@volverjs/ui-vue'\n    import { computed } from 'vue'\n\n    const props = defineProps<{\n        name: string\n        required?: boolean\n        options: Option[]\n        readonly?: boolean\n        disabled?: boolean\n        modifiers?: string | string[]\n    }>()\n\n    const modelValue = defineModel<\n        string | number | boolean | symbol | unknown[] | undefined\n    >()\n\n    const radioModifiers = computed(() => {\n        const toReturn = props.modifiers\n            ? Array.isArray(props.modifiers)\n                ? props.modifiers\n                : [props.modifiers]\n            : []\n        return [...toReturn, 'button']\n    })\n</script>\n\n<template>\n    <VvRadioGroup v-model=\"modelValue\" :name modifiers=\"buttons\">\n        <VvRadio\n            v-for=\"(option, key) in options\"\n            :key\n            :name\n            :required\n            :readonly\n            :disabled\n            :value=\"option.value\"\n            :modifiers=\"radioModifiers\">\n            <slot :name=\"option.value\" v-bind=\"{ option }\">\n                {{ option.label }}\n            </slot>\n        </VvRadio>\n    </VvRadioGroup>\n</template>\n","<script setup lang=\"ts\">\n    import type { Option } from '@volverjs/ui-vue'\n\n    defineProps<{\n        name: string\n        required?: boolean\n        options: Option[]\n        readonly?: boolean\n        disabled?: boolean\n    }>()\n\n    const modelValue = defineModel<unknown[] | undefined>()\n</script>\n\n<template>\n    <VvCheckboxGroup v-model=\"modelValue\" :name modifiers=\"buttons\">\n        <VvCheckbox\n            v-for=\"(option, key) in options\"\n            :key\n            :name\n            :required\n            :readonly\n            :disabled\n            :value=\"option.value\"\n            modifiers=\"button\">\n            <slot :name=\"String(option.value)\" v-bind=\"{ option }\">\n                {{ option.label }}\n            </slot>\n        </VvCheckbox>\n    </VvCheckboxGroup>\n</template>\n","<script setup lang=\"ts\">\n    import type { Option } from '@volverjs/ui-vue'\n\n    defineProps<{\n        name: string\n        required?: boolean\n        options: Option[]\n        readonly?: boolean\n        disabled?: boolean\n    }>()\n\n    const modelValue = defineModel<unknown[] | undefined>()\n</script>\n\n<template>\n    <VvCheckboxGroup v-model=\"modelValue\" :name modifiers=\"buttons\">\n        <VvCheckbox\n            v-for=\"(option, key) in options\"\n            :key\n            :name\n            :required\n            :readonly\n            :disabled\n            :value=\"option.value\"\n            modifiers=\"button\">\n            <slot :name=\"String(option.value)\" v-bind=\"{ option }\">\n                {{ option.label }}\n            </slot>\n        </VvCheckbox>\n    </VvCheckboxGroup>\n</template>\n","<script setup lang=\"ts\">\n    import { computed, ref, reactive, watch } from 'vue'\n    import { useI18n } from 'vue-i18n'\n    import PkStreamingMarkdown from './PkStreamingMarkdown.vue'\n    import PkEditorRadioButtons from '../PkEditorRadioButtons.vue'\n    import PkEditorCheckboxButtons from '../PkEditorCheckboxButtons.vue'\n\n    // --- Types ---\n\n    interface FormOption {\n        label: string\n        description?: string\n    }\n\n    interface FormStep {\n        id: string\n        question: string\n        message?: string\n        type?: 'text' | 'number' | 'date'\n        options?: FormOption[]\n        multiSelect?: boolean\n        allowFreeformInput?: boolean\n        placeholder?: string\n    }\n\n    interface FormAnswer {\n        id: string\n        value: string | string[] | number | null\n    }\n\n    interface ToolPartShape {\n        state?: 'input-available' | 'output-available'\n        toolCallId?: string\n        // AI SDK v5 encodes the tool name in `type` (e.g. 'tool-showMultipleChoice').\n        // `toolName` is kept for backward compatibility but is normally absent.\n        type?: string\n        toolName?: string\n        input?: {\n            title?: string\n            steps?: FormStep[]\n            // Legacy showMultipleChoice fields\n            question?: string\n            options?: (string | FormOption)[]\n        }\n        // The web card submits `{ answers: [...] }`; the platform channels\n        // (Teams modal) submit a flat record keyed by step id.\n        output?: string | { answers: FormAnswer[] } | Record<string, unknown>\n    }\n\n    type AnswerValue = string | string[] | number | null\n\n    // --- Props & Emits ---\n\n    const props = defineProps<{\n        part: unknown\n        allowCustomAnswer?: boolean\n    }>()\n\n    const emit = defineEmits<{\n        select: [answer: string | { answers: FormAnswer[] }]\n    }>()\n\n    const { t: $t, d: $d } = useI18n({ useScope: 'global' })\n\n    // --- Parsed tool part ---\n\n    const toolPart = computed(\n        () => JSON.parse(JSON.stringify(props.part)) as ToolPartShape,\n    )\n\n    const isLegacy = computed(\n        () =>\n            toolPart.value.toolName === 'showMultipleChoice' ||\n            toolPart.value.type === 'tool-showMultipleChoice',\n    )\n\n    const isInteractive = computed(\n        () => toolPart.value.state === 'input-available',\n    )\n\n    /** Single-step with no custom-answer and no freeform → auto-submit on option pick */\n    const isAutoSubmitStep = computed(() => {\n        const step = currentStep.value\n        if (!step) return false\n        return (\n            steps.value.length === 1 &&\n            !step.allowFreeformInput &&\n            !props.allowCustomAnswer\n        )\n    })\n\n    /** Legacy tool should auto-submit on option pick regardless of allowCustomAnswer */\n    const isLegacyAutoSubmit = computed(\n        () =>\n            isLegacy.value &&\n            steps.value.length === 1 &&\n            !currentStep.value?.multiSelect,\n    )\n\n    /**\n     * True only for the steps that send themselves as soon as an option is\n     * picked: the single case where the footer button would be redundant.\n     * Every other shape needs it, single-step forms included: with\n     * `allowFreeformInput` (or `allowCustomAnswer`) the radio pick no longer\n     * auto-submits, so without the footer the user was left with a chosen\n     * option and no way to send it.\n     */\n    const isSelfSubmitting = computed(\n        () =>\n            Boolean(currentStep.value?.options) &&\n            !currentStep.value?.multiSelect &&\n            (isAutoSubmitStep.value || isLegacyAutoSubmit.value),\n    )\n\n    // --- Steps ---\n\n    const steps = computed<FormStep[]>(() => {\n        const input = toolPart.value.input\n        if (input?.steps?.length) {\n            return input.steps\n        }\n        // Legacy showMultipleChoice → normalize into a single step\n        if (input?.question && input?.options) {\n            return [\n                {\n                    id: 'legacy',\n                    question: input.question,\n                    options: input.options.map((o) =>\n                        typeof o === 'string' ? { label: o } : o,\n                    ),\n                },\n            ]\n        }\n        return []\n    })\n\n    // --- Navigation state ---\n\n    const currentStepIndex = ref(0)\n    const currentStep = computed(() => steps.value[currentStepIndex.value])\n    const canGoBack = computed(() => currentStepIndex.value > 0)\n    const canGoNext = computed(\n        () => currentStepIndex.value < steps.value.length - 1,\n    )\n    const isMultiStep = computed(() => steps.value.length > 1)\n\n    const progress = computed(() => {\n        if (!isMultiStep.value) return null\n        return Math.round(\n            ((currentStepIndex.value + 1) / steps.value.length) * 100,\n        )\n    })\n\n    // --- Answers ---\n\n    const answers = reactive<Record<string, AnswerValue>>({})\n    const customAnswer = ref('')\n\n    // The freeform field belongs to the step showing it: text left behind\n    // (unsubmitted, or arriving from a late input update) must not follow the\n    // user to the next or previous question.\n    watch(currentStepIndex, () => {\n        customAnswer.value = ''\n    })\n\n    // Single scalar answer shared by radio buttons and freeform text/number/date inputs.\n    const scalarValue = computed<string | number | undefined>({\n        get: () => {\n            const val = currentStep.value\n                ? answers[currentStep.value.id]\n                : undefined\n            if (val == null || Array.isArray(val)) return undefined\n            return val\n        },\n        set: (val) => {\n            if (currentStep.value) {\n                answers[currentStep.value.id] = val ?? null\n            }\n        },\n    })\n\n    const activeCheckboxValue = computed<unknown[] | undefined>({\n        get: () => {\n            const val = currentStep.value\n                ? answers[currentStep.value.id]\n                : undefined\n            return Array.isArray(val) ? val : []\n        },\n        set: (val) => {\n            if (currentStep.value) {\n                answers[currentStep.value.id] = (val as string[]) ?? []\n            }\n        },\n    })\n\n    // --- Initialize answers from existing output ---\n\n    /** The `{ answers: [...] }` list, when the output carries one. */\n    function outputAnswers(output: ToolPartShape['output']) {\n        if (!output || typeof output === 'string') return undefined\n        const list = (output as { answers?: unknown }).answers\n        return Array.isArray(list) ? (list as FormAnswer[]) : undefined\n    }\n\n    watch(\n        () => toolPart.value.output,\n        (output) => {\n            if (!output) return\n            if (typeof output === 'string') {\n                if (steps.value.length === 1) {\n                    answers[steps.value[0].id] = output\n                }\n                return\n            }\n            const list = outputAnswers(output)\n            if (list) {\n                for (const a of list) {\n                    answers[a.id] = a.value\n                }\n                return\n            }\n            // Forms answered on a platform channel come back as a flat record\n            // keyed by step id: without this the read-only summary showed every\n            // answer as a placeholder.\n            const record = output as Record<string, unknown>\n            for (const step of steps.value) {\n                const value = record[step.id]\n                if (value !== undefined) {\n                    answers[step.id] = value as AnswerValue\n                }\n            }\n        },\n        { immediate: true },\n    )\n\n    // --- Restore custom answer from output when it doesn't match any option ---\n\n    const normalizedOutput = computed(() => {\n        const out = toolPart.value.output\n        if (!out) return undefined\n        if (typeof out === 'string') return out\n        const list = outputAnswers(out)\n        if (list?.length === 1) {\n            const val = list[0].value\n            return Array.isArray(val) ? val.join(', ') : String(val)\n        }\n        return undefined\n    })\n\n    watch(\n        normalizedOutput,\n        (value) => {\n            if (!value || !currentStep.value) return\n            const optionLabels = (currentStep.value.options ?? []).map(\n                (o) => o.label,\n            )\n            if (!optionLabels.includes(value)) {\n                customAnswer.value = value\n            }\n        },\n        { immediate: true },\n    )\n\n    // --- Option mapping for radio/checkbox components ---\n\n    const radioOptions = computed(() => {\n        if (!currentStep.value?.options) return []\n        return currentStep.value.options.map((option) => ({\n            label: option.label,\n            value: option.label,\n            description: option.description,\n        }))\n    })\n\n    // --- Navigation & Submission ---\n\n    /** Footer button, and Enter on a pure freeform step. */\n    function goNext() {\n        // A typed freeform answer wins over the picked option: it is the more\n        // recent intent, and the footer button is now the visible way to send\n        // it (the freeform field only submits on Enter).\n        if (customAnswer.value.trim()) {\n            submitCustomAnswer()\n            return\n        }\n        if (canGoNext.value) {\n            currentStepIndex.value++\n        } else {\n            submitForm()\n        }\n    }\n\n    function goBack() {\n        if (canGoBack.value) {\n            currentStepIndex.value--\n        }\n    }\n\n    function submitForm() {\n        if (!isInteractive.value) return\n\n        const finalAnswers: FormAnswer[] = steps.value.map((step) => ({\n            id: step.id,\n            value: answers[step.id] ?? null,\n        }))\n\n        // Legacy backward compatibility: single-step, single-select → return plain string\n        if (\n            isLegacyAutoSubmit.value &&\n            !currentStep.value?.allowFreeformInput\n        ) {\n            const val = finalAnswers[0].value\n            emit('select', Array.isArray(val) ? val[0] : (val as string))\n        } else {\n            emit('select', { answers: finalAnswers })\n        }\n    }\n\n    /** Enter inside the freeform field shown alongside the options. */\n    function submitCustomAnswer() {\n        const value = customAnswer.value.trim()\n        if (!value) return\n\n        answers[currentStep.value.id] = value\n        // Cleared before navigating: `goNext()` reads it back to route a typed\n        // answer here, so leaving it set would recurse.\n        customAnswer.value = ''\n        if (steps.value.length === 1) {\n            submitForm()\n        } else {\n            goNext()\n        }\n    }\n\n    function onRadioChange() {\n        if (!isInteractive.value) return\n        if (isAutoSubmitStep.value || isLegacyAutoSubmit.value) {\n            submitForm()\n        }\n    }\n\n    // --- Summary helpers ---\n\n    function getSummaryValue(step: FormStep) {\n        const val = answers[step.id]\n        if (val == null) return '—'\n        if (Array.isArray(val)) return val.join(', ')\n        if (step.type === 'date') return $d(new Date(val), 'short')\n        return val\n    }\n</script>\n\n<template>\n    <div\n        v-if=\"steps.length\"\n        class=\"border border-surface-3 rounded-xl w-full overflow-hidden flex flex-col transition-all bg-surface\">\n        <!-- Header -->\n        <div\n            v-if=\"toolPart.input?.title || (isInteractive && steps.length > 1)\"\n            class=\"text-12 border-b border-surface-3 text-word-3 bg-surface-1\">\n            <div\n                v-if=\"toolPart.input?.title\"\n                class=\"px-sm py-10 font-bold\"\n                :class=\"{\n                    'border-b border-surface-3':\n                        isInteractive && steps.length > 1,\n                }\">\n                {{ toolPart.input?.title }}\n            </div>\n            <!-- Progress for multi-step -->\n            <div\n                v-if=\"isInteractive && steps.length > 1\"\n                class=\"flex flex-col gap-4 p-sm\">\n                <div class=\"flex justify-between text-10 text-word-3\">\n                    <span>\n                        {{\n                            $t('showForm.step', {\n                                current: currentStepIndex + 1,\n                                total: steps.length,\n                            })\n                        }}\n                    </span>\n                    <span>{{ progress }}%</span>\n                </div>\n                <div class=\"h-4 bg-surface-3 rounded-full overflow-hidden\">\n                    <div\n                        class=\"h-full bg-word-4 transition-all duration-300\"\n                        :style=\"{ width: `${progress}%` }\"></div>\n                </div>\n            </div>\n        </div>\n\n        <!-- Input Available State -->\n        <template v-if=\"isInteractive\">\n            <!-- Current Step Content -->\n            <div class=\"px-sm py-16 flex flex-col gap-12\">\n                <div class=\"leading-normal text-12\">\n                    <strong class=\"font-semibold\">\n                        {{ currentStep.question }}\n                    </strong>\n                    <PkStreamingMarkdown\n                        v-if=\"currentStep.message\"\n                        :markdown=\"currentStep.message\"\n                        class=\"text-word-2 mt-4\" />\n                </div>\n\n                <!-- Checkbox list for multi-select -->\n                <PkEditorCheckboxButtons\n                    v-if=\"currentStep.options && currentStep.multiSelect\"\n                    v-model=\"activeCheckboxValue\"\n                    :name=\"currentStep.id\"\n                    :options=\"radioOptions\"\n                    :readonly=\"!isInteractive\"\n                    class=\"mb-0\"\n                    vertical>\n                    <template\n                        v-for=\"option in radioOptions\"\n                        :key=\"option.value\"\n                        #[option.value]>\n                        <!-- Shared option layout: label + optional description -->\n                        <div class=\"text-12\">\n                            <div class=\"font-semibold\">{{ option.label }}</div>\n                            <div v-if=\"option.description\" class=\"text-word-3\">\n                                {{ option.description }}\n                            </div>\n                        </div>\n                    </template>\n                </PkEditorCheckboxButtons>\n\n                <!-- Radio buttons for single-select -->\n                <PkEditorRadioButtons\n                    v-else-if=\"currentStep.options && !currentStep.multiSelect\"\n                    v-model=\"scalarValue\"\n                    :name=\"currentStep.id\"\n                    :options=\"radioOptions\"\n                    :readonly=\"!isInteractive\"\n                    vertical\n                    class=\"mb-0\"\n                    @update:model-value=\"onRadioChange\">\n                    <template\n                        v-for=\"option in radioOptions\"\n                        :key=\"option.value\"\n                        #[option.value]>\n                        <!-- Shared option layout: label + optional description -->\n                        <div class=\"text-12\">\n                            <div class=\"font-semibold\">{{ option.label }}</div>\n                            <div v-if=\"option.description\" class=\"text-word-3\">\n                                {{ option.description }}\n                            </div>\n                        </div>\n                    </template>\n                </PkEditorRadioButtons>\n\n                <!-- Pure Freeform Input (text, number, date) -->\n                <div\n                    v-else-if=\"!currentStep.options\"\n                    class=\"flex flex-col gap-6 w-full\">\n                    <VvInputText\n                        :key=\"currentStep.id\"\n                        v-model=\"scalarValue\"\n                        :placeholder=\"\n                            currentStep.placeholder || $t('placeholder.insert')\n                        \"\n                        :type=\"currentStep.type\"\n                        class=\"w-full\"\n                        :name=\"currentStep.id\"\n                        modifiers=\"compact rounded\"\n                        :disabled=\"!isInteractive\"\n                        @keyup.enter=\"goNext\" />\n                </div>\n            </div>\n\n            <!-- Custom footer freeform input (shown alongside options when allowFreeformInput) -->\n            <div\n                v-if=\"currentStep.allowFreeformInput && currentStep.options\"\n                class=\"px-sm pb-sm border-t border-surface-3\">\n                <form\n                    class=\"flex gap-xs pt-sm\"\n                    @submit.prevent=\"submitCustomAnswer\">\n                    <VvInputText\n                        :key=\"`${currentStep.id}-custom`\"\n                        v-model=\"customAnswer\"\n                        class=\"flex-1\"\n                        :name=\"`${currentStep.id}-custom`\"\n                        modifiers=\"compact rounded\"\n                        :disabled=\"!isInteractive\"\n                        :placeholder=\"\n                            currentStep.placeholder ||\n                            $t('showForm.otherPlaceholder')\n                        \" />\n                </form>\n            </div>\n\n            <!-- Footer navigation: shown for every step that does not submit\n                 itself on option pick (see `isSelfSubmitting`). -->\n            <div\n                v-if=\"!isSelfSubmitting\"\n                class=\"px-sm py-10 bg-surface border-t border-surface-3 flex justify-between gap-12\">\n                <VvButton\n                    v-if=\"canGoBack\"\n                    modifiers=\"action-quiet\"\n                    icon=\"ri:arrow-left-s-line\"\n                    :label=\"$t('action.back')\"\n                    @click.stop=\"goBack\" />\n                <div v-else></div>\n\n                <VvButton\n                    :modifiers=\"canGoNext ? 'action-quiet' : 'action-primary'\"\n                    :icon=\"\n                        canGoNext\n                            ? 'ri:arrow-right-s-line'\n                            : 'ri:send-plane-2-line'\n                    \"\n                    icon-position=\"right\"\n                    :label=\"canGoNext ? $t('action.next') : $t('action.submit')\"\n                    @click.stop=\"goNext\" />\n            </div>\n        </template>\n\n        <!-- Output Available State (Multi-step Summary) -->\n        <template v-else>\n            <div class=\"px-sm py-12 bg-surface space-y-10\">\n                <ul class=\"flex flex-col gap-8\">\n                    <li\n                        v-for=\"step in steps\"\n                        :key=\"step.id\"\n                        class=\"leading-normal\">\n                        <div class=\"text-12 text-word-3\">\n                            {{ step.question }}\n                        </div>\n                        <span class=\"text-12 text-word-2 font-semibold\">\n                            {{ getSummaryValue(step) }}\n                        </span>\n                    </li>\n                </ul>\n            </div>\n            <div\n                class=\"px-sm py-12 bg-surface border-t border-surface-3 flex items-center gap-10\">\n                <div\n                    class=\"w-20 h-20 rounded-full border border-success text-success flex items-center justify-center\">\n                    <VvIcon name=\"ri:check-line\" class=\"text-12\" />\n                </div>\n                <div class=\"flex flex-col\">\n                    <span\n                        class=\"font-semibold text-12 text-word-1 leading-tight\">\n                        {{ $t('showForm.completed') }}\n                    </span>\n                </div>\n            </div>\n        </template>\n    </div>\n</template>\n","<script setup lang=\"ts\">\n    import { computed, ref, reactive, watch } from 'vue'\n    import { useI18n } from 'vue-i18n'\n    import PkStreamingMarkdown from './PkStreamingMarkdown.vue'\n    import PkEditorRadioButtons from '../PkEditorRadioButtons.vue'\n    import PkEditorCheckboxButtons from '../PkEditorCheckboxButtons.vue'\n\n    // --- Types ---\n\n    interface FormOption {\n        label: string\n        description?: string\n    }\n\n    interface FormStep {\n        id: string\n        question: string\n        message?: string\n        type?: 'text' | 'number' | 'date'\n        options?: FormOption[]\n        multiSelect?: boolean\n        allowFreeformInput?: boolean\n        placeholder?: string\n    }\n\n    interface FormAnswer {\n        id: string\n        value: string | string[] | number | null\n    }\n\n    interface ToolPartShape {\n        state?: 'input-available' | 'output-available'\n        toolCallId?: string\n        // AI SDK v5 encodes the tool name in `type` (e.g. 'tool-showMultipleChoice').\n        // `toolName` is kept for backward compatibility but is normally absent.\n        type?: string\n        toolName?: string\n        input?: {\n            title?: string\n            steps?: FormStep[]\n            // Legacy showMultipleChoice fields\n            question?: string\n            options?: (string | FormOption)[]\n        }\n        // The web card submits `{ answers: [...] }`; the platform channels\n        // (Teams modal) submit a flat record keyed by step id.\n        output?: string | { answers: FormAnswer[] } | Record<string, unknown>\n    }\n\n    type AnswerValue = string | string[] | number | null\n\n    // --- Props & Emits ---\n\n    const props = defineProps<{\n        part: unknown\n        allowCustomAnswer?: boolean\n    }>()\n\n    const emit = defineEmits<{\n        select: [answer: string | { answers: FormAnswer[] }]\n    }>()\n\n    const { t: $t, d: $d } = useI18n({ useScope: 'global' })\n\n    // --- Parsed tool part ---\n\n    const toolPart = computed(\n        () => JSON.parse(JSON.stringify(props.part)) as ToolPartShape,\n    )\n\n    const isLegacy = computed(\n        () =>\n            toolPart.value.toolName === 'showMultipleChoice' ||\n            toolPart.value.type === 'tool-showMultipleChoice',\n    )\n\n    const isInteractive = computed(\n        () => toolPart.value.state === 'input-available',\n    )\n\n    /** Single-step with no custom-answer and no freeform → auto-submit on option pick */\n    const isAutoSubmitStep = computed(() => {\n        const step = currentStep.value\n        if (!step) return false\n        return (\n            steps.value.length === 1 &&\n            !step.allowFreeformInput &&\n            !props.allowCustomAnswer\n        )\n    })\n\n    /** Legacy tool should auto-submit on option pick regardless of allowCustomAnswer */\n    const isLegacyAutoSubmit = computed(\n        () =>\n            isLegacy.value &&\n            steps.value.length === 1 &&\n            !currentStep.value?.multiSelect,\n    )\n\n    /**\n     * True only for the steps that send themselves as soon as an option is\n     * picked: the single case where the footer button would be redundant.\n     * Every other shape needs it, single-step forms included: with\n     * `allowFreeformInput` (or `allowCustomAnswer`) the radio pick no longer\n     * auto-submits, so without the footer the user was left with a chosen\n     * option and no way to send it.\n     */\n    const isSelfSubmitting = computed(\n        () =>\n            Boolean(currentStep.value?.options) &&\n            !currentStep.value?.multiSelect &&\n            (isAutoSubmitStep.value || isLegacyAutoSubmit.value),\n    )\n\n    // --- Steps ---\n\n    const steps = computed<FormStep[]>(() => {\n        const input = toolPart.value.input\n        if (input?.steps?.length) {\n            return input.steps\n        }\n        // Legacy showMultipleChoice → normalize into a single step\n        if (input?.question && input?.options) {\n            return [\n                {\n                    id: 'legacy',\n                    question: input.question,\n                    options: input.options.map((o) =>\n                        typeof o === 'string' ? { label: o } : o,\n                    ),\n                },\n            ]\n        }\n        return []\n    })\n\n    // --- Navigation state ---\n\n    const currentStepIndex = ref(0)\n    const currentStep = computed(() => steps.value[currentStepIndex.value])\n    const canGoBack = computed(() => currentStepIndex.value > 0)\n    const canGoNext = computed(\n        () => currentStepIndex.value < steps.value.length - 1,\n    )\n    const isMultiStep = computed(() => steps.value.length > 1)\n\n    const progress = computed(() => {\n        if (!isMultiStep.value) return null\n        return Math.round(\n            ((currentStepIndex.value + 1) / steps.value.length) * 100,\n        )\n    })\n\n    // --- Answers ---\n\n    const answers = reactive<Record<string, AnswerValue>>({})\n    const customAnswer = ref('')\n\n    // The freeform field belongs to the step showing it: text left behind\n    // (unsubmitted, or arriving from a late input update) must not follow the\n    // user to the next or previous question.\n    watch(currentStepIndex, () => {\n        customAnswer.value = ''\n    })\n\n    // Single scalar answer shared by radio buttons and freeform text/number/date inputs.\n    const scalarValue = computed<string | number | undefined>({\n        get: () => {\n            const val = currentStep.value\n                ? answers[currentStep.value.id]\n                : undefined\n            if (val == null || Array.isArray(val)) return undefined\n            return val\n        },\n        set: (val) => {\n            if (currentStep.value) {\n                answers[currentStep.value.id] = val ?? null\n            }\n        },\n    })\n\n    const activeCheckboxValue = computed<unknown[] | undefined>({\n        get: () => {\n            const val = currentStep.value\n                ? answers[currentStep.value.id]\n                : undefined\n            return Array.isArray(val) ? val : []\n        },\n        set: (val) => {\n            if (currentStep.value) {\n                answers[currentStep.value.id] = (val as string[]) ?? []\n            }\n        },\n    })\n\n    // --- Initialize answers from existing output ---\n\n    /** The `{ answers: [...] }` list, when the output carries one. */\n    function outputAnswers(output: ToolPartShape['output']) {\n        if (!output || typeof output === 'string') return undefined\n        const list = (output as { answers?: unknown }).answers\n        return Array.isArray(list) ? (list as FormAnswer[]) : undefined\n    }\n\n    watch(\n        () => toolPart.value.output,\n        (output) => {\n            if (!output) return\n            if (typeof output === 'string') {\n                if (steps.value.length === 1) {\n                    answers[steps.value[0].id] = output\n                }\n                return\n            }\n            const list = outputAnswers(output)\n            if (list) {\n                for (const a of list) {\n                    answers[a.id] = a.value\n                }\n                return\n            }\n            // Forms answered on a platform channel come back as a flat record\n            // keyed by step id: without this the read-only summary showed every\n            // answer as a placeholder.\n            const record = output as Record<string, unknown>\n            for (const step of steps.value) {\n                const value = record[step.id]\n                if (value !== undefined) {\n                    answers[step.id] = value as AnswerValue\n                }\n            }\n        },\n        { immediate: true },\n    )\n\n    // --- Restore custom answer from output when it doesn't match any option ---\n\n    const normalizedOutput = computed(() => {\n        const out = toolPart.value.output\n        if (!out) return undefined\n        if (typeof out === 'string') return out\n        const list = outputAnswers(out)\n        if (list?.length === 1) {\n            const val = list[0].value\n            return Array.isArray(val) ? val.join(', ') : String(val)\n        }\n        return undefined\n    })\n\n    watch(\n        normalizedOutput,\n        (value) => {\n            if (!value || !currentStep.value) return\n            const optionLabels = (currentStep.value.options ?? []).map(\n                (o) => o.label,\n            )\n            if (!optionLabels.includes(value)) {\n                customAnswer.value = value\n            }\n        },\n        { immediate: true },\n    )\n\n    // --- Option mapping for radio/checkbox components ---\n\n    const radioOptions = computed(() => {\n        if (!currentStep.value?.options) return []\n        return currentStep.value.options.map((option) => ({\n            label: option.label,\n            value: option.label,\n            description: option.description,\n        }))\n    })\n\n    // --- Navigation & Submission ---\n\n    /** Footer button, and Enter on a pure freeform step. */\n    function goNext() {\n        // A typed freeform answer wins over the picked option: it is the more\n        // recent intent, and the footer button is now the visible way to send\n        // it (the freeform field only submits on Enter).\n        if (customAnswer.value.trim()) {\n            submitCustomAnswer()\n            return\n        }\n        if (canGoNext.value) {\n            currentStepIndex.value++\n        } else {\n            submitForm()\n        }\n    }\n\n    function goBack() {\n        if (canGoBack.value) {\n            currentStepIndex.value--\n        }\n    }\n\n    function submitForm() {\n        if (!isInteractive.value) return\n\n        const finalAnswers: FormAnswer[] = steps.value.map((step) => ({\n            id: step.id,\n            value: answers[step.id] ?? null,\n        }))\n\n        // Legacy backward compatibility: single-step, single-select → return plain string\n        if (\n            isLegacyAutoSubmit.value &&\n            !currentStep.value?.allowFreeformInput\n        ) {\n            const val = finalAnswers[0].value\n            emit('select', Array.isArray(val) ? val[0] : (val as string))\n        } else {\n            emit('select', { answers: finalAnswers })\n        }\n    }\n\n    /** Enter inside the freeform field shown alongside the options. */\n    function submitCustomAnswer() {\n        const value = customAnswer.value.trim()\n        if (!value) return\n\n        answers[currentStep.value.id] = value\n        // Cleared before navigating: `goNext()` reads it back to route a typed\n        // answer here, so leaving it set would recurse.\n        customAnswer.value = ''\n        if (steps.value.length === 1) {\n            submitForm()\n        } else {\n            goNext()\n        }\n    }\n\n    function onRadioChange() {\n        if (!isInteractive.value) return\n        if (isAutoSubmitStep.value || isLegacyAutoSubmit.value) {\n            submitForm()\n        }\n    }\n\n    // --- Summary helpers ---\n\n    function getSummaryValue(step: FormStep) {\n        const val = answers[step.id]\n        if (val == null) return '—'\n        if (Array.isArray(val)) return val.join(', ')\n        if (step.type === 'date') return $d(new Date(val), 'short')\n        return val\n    }\n</script>\n\n<template>\n    <div\n        v-if=\"steps.length\"\n        class=\"border border-surface-3 rounded-xl w-full overflow-hidden flex flex-col transition-all bg-surface\">\n        <!-- Header -->\n        <div\n            v-if=\"toolPart.input?.title || (isInteractive && steps.length > 1)\"\n            class=\"text-12 border-b border-surface-3 text-word-3 bg-surface-1\">\n            <div\n                v-if=\"toolPart.input?.title\"\n                class=\"px-sm py-10 font-bold\"\n                :class=\"{\n                    'border-b border-surface-3':\n                        isInteractive && steps.length > 1,\n                }\">\n                {{ toolPart.input?.title }}\n            </div>\n            <!-- Progress for multi-step -->\n            <div\n                v-if=\"isInteractive && steps.length > 1\"\n                class=\"flex flex-col gap-4 p-sm\">\n                <div class=\"flex justify-between text-10 text-word-3\">\n                    <span>\n                        {{\n                            $t('showForm.step', {\n                                current: currentStepIndex + 1,\n                                total: steps.length,\n                            })\n                        }}\n                    </span>\n                    <span>{{ progress }}%</span>\n                </div>\n                <div class=\"h-4 bg-surface-3 rounded-full overflow-hidden\">\n                    <div\n                        class=\"h-full bg-word-4 transition-all duration-300\"\n                        :style=\"{ width: `${progress}%` }\"></div>\n                </div>\n            </div>\n        </div>\n\n        <!-- Input Available State -->\n        <template v-if=\"isInteractive\">\n            <!-- Current Step Content -->\n            <div class=\"px-sm py-16 flex flex-col gap-12\">\n                <div class=\"leading-normal text-12\">\n                    <strong class=\"font-semibold\">\n                        {{ currentStep.question }}\n                    </strong>\n                    <PkStreamingMarkdown\n                        v-if=\"currentStep.message\"\n                        :markdown=\"currentStep.message\"\n                        class=\"text-word-2 mt-4\" />\n                </div>\n\n                <!-- Checkbox list for multi-select -->\n                <PkEditorCheckboxButtons\n                    v-if=\"currentStep.options && currentStep.multiSelect\"\n                    v-model=\"activeCheckboxValue\"\n                    :name=\"currentStep.id\"\n                    :options=\"radioOptions\"\n                    :readonly=\"!isInteractive\"\n                    class=\"mb-0\"\n                    vertical>\n                    <template\n                        v-for=\"option in radioOptions\"\n                        :key=\"option.value\"\n                        #[option.value]>\n                        <!-- Shared option layout: label + optional description -->\n                        <div class=\"text-12\">\n                            <div class=\"font-semibold\">{{ option.label }}</div>\n                            <div v-if=\"option.description\" class=\"text-word-3\">\n                                {{ option.description }}\n                            </div>\n                        </div>\n                    </template>\n                </PkEditorCheckboxButtons>\n\n                <!-- Radio buttons for single-select -->\n                <PkEditorRadioButtons\n                    v-else-if=\"currentStep.options && !currentStep.multiSelect\"\n                    v-model=\"scalarValue\"\n                    :name=\"currentStep.id\"\n                    :options=\"radioOptions\"\n                    :readonly=\"!isInteractive\"\n                    vertical\n                    class=\"mb-0\"\n                    @update:model-value=\"onRadioChange\">\n                    <template\n                        v-for=\"option in radioOptions\"\n                        :key=\"option.value\"\n                        #[option.value]>\n                        <!-- Shared option layout: label + optional description -->\n                        <div class=\"text-12\">\n                            <div class=\"font-semibold\">{{ option.label }}</div>\n                            <div v-if=\"option.description\" class=\"text-word-3\">\n                                {{ option.description }}\n                            </div>\n                        </div>\n                    </template>\n                </PkEditorRadioButtons>\n\n                <!-- Pure Freeform Input (text, number, date) -->\n                <div\n                    v-else-if=\"!currentStep.options\"\n                    class=\"flex flex-col gap-6 w-full\">\n                    <VvInputText\n                        :key=\"currentStep.id\"\n                        v-model=\"scalarValue\"\n                        :placeholder=\"\n                            currentStep.placeholder || $t('placeholder.insert')\n                        \"\n                        :type=\"currentStep.type\"\n                        class=\"w-full\"\n                        :name=\"currentStep.id\"\n                        modifiers=\"compact rounded\"\n                        :disabled=\"!isInteractive\"\n                        @keyup.enter=\"goNext\" />\n                </div>\n            </div>\n\n            <!-- Custom footer freeform input (shown alongside options when allowFreeformInput) -->\n            <div\n                v-if=\"currentStep.allowFreeformInput && currentStep.options\"\n                class=\"px-sm pb-sm border-t border-surface-3\">\n                <form\n                    class=\"flex gap-xs pt-sm\"\n                    @submit.prevent=\"submitCustomAnswer\">\n                    <VvInputText\n                        :key=\"`${currentStep.id}-custom`\"\n                        v-model=\"customAnswer\"\n                        class=\"flex-1\"\n                        :name=\"`${currentStep.id}-custom`\"\n                        modifiers=\"compact rounded\"\n                        :disabled=\"!isInteractive\"\n                        :placeholder=\"\n                            currentStep.placeholder ||\n                            $t('showForm.otherPlaceholder')\n                        \" />\n                </form>\n            </div>\n\n            <!-- Footer navigation: shown for every step that does not submit\n                 itself on option pick (see `isSelfSubmitting`). -->\n            <div\n                v-if=\"!isSelfSubmitting\"\n                class=\"px-sm py-10 bg-surface border-t border-surface-3 flex justify-between gap-12\">\n                <VvButton\n                    v-if=\"canGoBack\"\n                    modifiers=\"action-quiet\"\n                    icon=\"ri:arrow-left-s-line\"\n                    :label=\"$t('action.back')\"\n                    @click.stop=\"goBack\" />\n                <div v-else></div>\n\n                <VvButton\n                    :modifiers=\"canGoNext ? 'action-quiet' : 'action-primary'\"\n                    :icon=\"\n                        canGoNext\n                            ? 'ri:arrow-right-s-line'\n                            : 'ri:send-plane-2-line'\n                    \"\n                    icon-position=\"right\"\n                    :label=\"canGoNext ? $t('action.next') : $t('action.submit')\"\n                    @click.stop=\"goNext\" />\n            </div>\n        </template>\n\n        <!-- Output Available State (Multi-step Summary) -->\n        <template v-else>\n            <div class=\"px-sm py-12 bg-surface space-y-10\">\n                <ul class=\"flex flex-col gap-8\">\n                    <li\n                        v-for=\"step in steps\"\n                        :key=\"step.id\"\n                        class=\"leading-normal\">\n                        <div class=\"text-12 text-word-3\">\n                            {{ step.question }}\n                        </div>\n                        <span class=\"text-12 text-word-2 font-semibold\">\n                            {{ getSummaryValue(step) }}\n                        </span>\n                    </li>\n                </ul>\n            </div>\n            <div\n                class=\"px-sm py-12 bg-surface border-t border-surface-3 flex items-center gap-10\">\n                <div\n                    class=\"w-20 h-20 rounded-full border border-success text-success flex items-center justify-center\">\n                    <VvIcon name=\"ri:check-line\" class=\"text-12\" />\n                </div>\n                <div class=\"flex flex-col\">\n                    <span\n                        class=\"font-semibold text-12 text-word-1 leading-tight\">\n                        {{ $t('showForm.completed') }}\n                    </span>\n                </div>\n            </div>\n        </template>\n    </div>\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"PkToolShowForm-DMmZ34is.js","names":[],"sources":["../../../../packages/components/src/PkEditorRadioButtons.vue","../../../../packages/components/src/PkEditorRadioButtons.vue","../../../../packages/components/src/PkEditorCheckboxButtons.vue","../../../../packages/components/src/PkEditorCheckboxButtons.vue","../../../../packages/components/src/chat/PkToolShowForm.vue","../../../../packages/components/src/chat/PkToolShowForm.vue"],"sourcesContent":["<script setup lang=\"ts\">\n    import type { Option } from '@volverjs/ui-vue'\n    import { computed } from 'vue'\n\n    const props = defineProps<{\n        name: string\n        required?: boolean\n        options: Option[]\n        readonly?: boolean\n        disabled?: boolean\n        modifiers?: string | string[]\n    }>()\n\n    const modelValue = defineModel<\n        string | number | boolean | symbol | unknown[] | undefined\n    >()\n\n    const radioModifiers = computed(() => {\n        const toReturn = props.modifiers\n            ? Array.isArray(props.modifiers)\n                ? props.modifiers\n                : [props.modifiers]\n            : []\n        return [...toReturn, 'button']\n    })\n</script>\n\n<template>\n    <VvRadioGroup v-model=\"modelValue\" :name modifiers=\"buttons\">\n        <VvRadio\n            v-for=\"(option, key) in options\"\n            :key\n            :name\n            :required\n            :readonly\n            :disabled\n            :value=\"option.value\"\n            :modifiers=\"radioModifiers\">\n            <slot :name=\"option.value\" v-bind=\"{ option }\">\n                {{ option.label }}\n            </slot>\n        </VvRadio>\n    </VvRadioGroup>\n</template>\n","<script setup lang=\"ts\">\n    import type { Option } from '@volverjs/ui-vue'\n    import { computed } from 'vue'\n\n    const props = defineProps<{\n        name: string\n        required?: boolean\n        options: Option[]\n        readonly?: boolean\n        disabled?: boolean\n        modifiers?: string | string[]\n    }>()\n\n    const modelValue = defineModel<\n        string | number | boolean | symbol | unknown[] | undefined\n    >()\n\n    const radioModifiers = computed(() => {\n        const toReturn = props.modifiers\n            ? Array.isArray(props.modifiers)\n                ? props.modifiers\n                : [props.modifiers]\n            : []\n        return [...toReturn, 'button']\n    })\n</script>\n\n<template>\n    <VvRadioGroup v-model=\"modelValue\" :name modifiers=\"buttons\">\n        <VvRadio\n            v-for=\"(option, key) in options\"\n            :key\n            :name\n            :required\n            :readonly\n            :disabled\n            :value=\"option.value\"\n            :modifiers=\"radioModifiers\">\n            <slot :name=\"option.value\" v-bind=\"{ option }\">\n                {{ option.label }}\n            </slot>\n        </VvRadio>\n    </VvRadioGroup>\n</template>\n","<script setup lang=\"ts\">\n    import type { Option } from '@volverjs/ui-vue'\n\n    defineProps<{\n        name: string\n        required?: boolean\n        options: Option[]\n        readonly?: boolean\n        disabled?: boolean\n    }>()\n\n    const modelValue = defineModel<unknown[] | undefined>()\n</script>\n\n<template>\n    <VvCheckboxGroup v-model=\"modelValue\" :name modifiers=\"buttons\">\n        <VvCheckbox\n            v-for=\"(option, key) in options\"\n            :key\n            :name\n            :required\n            :readonly\n            :disabled\n            :value=\"option.value\"\n            modifiers=\"button\">\n            <slot :name=\"String(option.value)\" v-bind=\"{ option }\">\n                {{ option.label }}\n            </slot>\n        </VvCheckbox>\n    </VvCheckboxGroup>\n</template>\n","<script setup lang=\"ts\">\n    import type { Option } from '@volverjs/ui-vue'\n\n    defineProps<{\n        name: string\n        required?: boolean\n        options: Option[]\n        readonly?: boolean\n        disabled?: boolean\n    }>()\n\n    const modelValue = defineModel<unknown[] | undefined>()\n</script>\n\n<template>\n    <VvCheckboxGroup v-model=\"modelValue\" :name modifiers=\"buttons\">\n        <VvCheckbox\n            v-for=\"(option, key) in options\"\n            :key\n            :name\n            :required\n            :readonly\n            :disabled\n            :value=\"option.value\"\n            modifiers=\"button\">\n            <slot :name=\"String(option.value)\" v-bind=\"{ option }\">\n                {{ option.label }}\n            </slot>\n        </VvCheckbox>\n    </VvCheckboxGroup>\n</template>\n","<script setup lang=\"ts\">\n    import { computed, ref, reactive, watch } from 'vue'\n    import { useI18n } from 'vue-i18n'\n    import PkStreamingMarkdown from './PkStreamingMarkdown.vue'\n    import PkEditorRadioButtons from '../PkEditorRadioButtons.vue'\n    import PkEditorCheckboxButtons from '../PkEditorCheckboxButtons.vue'\n\n    // --- Types ---\n\n    interface FormOption {\n        label: string\n        description?: string\n    }\n\n    interface FormStep {\n        id: string\n        question: string\n        message?: string\n        type?: 'text' | 'number' | 'date'\n        options?: FormOption[]\n        multiSelect?: boolean\n        allowFreeformInput?: boolean\n        placeholder?: string\n    }\n\n    interface FormAnswer {\n        id: string\n        value: string | string[] | number | null\n    }\n\n    interface ToolPartShape {\n        state?: 'input-available' | 'output-available'\n        toolCallId?: string\n        // AI SDK v5 encodes the tool name in `type` (e.g. 'tool-showMultipleChoice').\n        // `toolName` is kept for backward compatibility but is normally absent.\n        type?: string\n        toolName?: string\n        input?: {\n            title?: string\n            steps?: FormStep[]\n            // Legacy showMultipleChoice fields\n            question?: string\n            options?: (string | FormOption)[]\n        }\n        // The web card submits `{ answers: [...] }`; the platform channels\n        // (Teams modal) submit a flat record keyed by step id.\n        output?: string | { answers: FormAnswer[] } | Record<string, unknown>\n    }\n\n    type AnswerValue = string | string[] | number | null\n\n    // --- Props & Emits ---\n\n    const props = defineProps<{\n        part: unknown\n        allowCustomAnswer?: boolean\n    }>()\n\n    const emit = defineEmits<{\n        select: [answer: string | { answers: FormAnswer[] }]\n    }>()\n\n    const { t: $t, d: $d } = useI18n({ useScope: 'global' })\n\n    // --- Parsed tool part ---\n\n    const toolPart = computed(\n        () => JSON.parse(JSON.stringify(props.part)) as ToolPartShape,\n    )\n\n    const isLegacy = computed(\n        () =>\n            toolPart.value.toolName === 'showMultipleChoice' ||\n            toolPart.value.type === 'tool-showMultipleChoice',\n    )\n\n    const isInteractive = computed(\n        () => toolPart.value.state === 'input-available',\n    )\n\n    /** Single-step with no custom-answer and no freeform → auto-submit on option pick */\n    const isAutoSubmitStep = computed(() => {\n        const step = currentStep.value\n        if (!step) return false\n        return (\n            steps.value.length === 1 &&\n            !step.allowFreeformInput &&\n            !props.allowCustomAnswer\n        )\n    })\n\n    /** Legacy tool should auto-submit on option pick regardless of allowCustomAnswer */\n    const isLegacyAutoSubmit = computed(\n        () =>\n            isLegacy.value &&\n            steps.value.length === 1 &&\n            !currentStep.value?.multiSelect,\n    )\n\n    /**\n     * True only for the steps that send themselves as soon as an option is\n     * picked: the single case where the footer button would be redundant.\n     * Every other shape needs it, single-step forms included: with\n     * `allowFreeformInput` (or `allowCustomAnswer`) the radio pick no longer\n     * auto-submits, so without the footer the user was left with a chosen\n     * option and no way to send it.\n     */\n    const isSelfSubmitting = computed(\n        () =>\n            Boolean(currentStep.value?.options) &&\n            !currentStep.value?.multiSelect &&\n            (isAutoSubmitStep.value || isLegacyAutoSubmit.value),\n    )\n\n    // --- Steps ---\n\n    const steps = computed<FormStep[]>(() => {\n        const input = toolPart.value.input\n        if (input?.steps?.length) {\n            return input.steps\n        }\n        // Legacy showMultipleChoice → normalize into a single step\n        if (input?.question && input?.options) {\n            return [\n                {\n                    id: 'legacy',\n                    question: input.question,\n                    options: input.options.map((o) =>\n                        typeof o === 'string' ? { label: o } : o,\n                    ),\n                },\n            ]\n        }\n        return []\n    })\n\n    // --- Navigation state ---\n\n    const currentStepIndex = ref(0)\n    const currentStep = computed(() => steps.value[currentStepIndex.value])\n    const canGoBack = computed(() => currentStepIndex.value > 0)\n    const canGoNext = computed(\n        () => currentStepIndex.value < steps.value.length - 1,\n    )\n    const isMultiStep = computed(() => steps.value.length > 1)\n\n    const progress = computed(() => {\n        if (!isMultiStep.value) return null\n        return Math.round(\n            ((currentStepIndex.value + 1) / steps.value.length) * 100,\n        )\n    })\n\n    // --- Answers ---\n\n    const answers = reactive<Record<string, AnswerValue>>({})\n    const customAnswer = ref('')\n\n    // The freeform field belongs to the step showing it: text left behind\n    // (unsubmitted, or arriving from a late input update) must not follow the\n    // user to the next or previous question.\n    watch(currentStepIndex, () => {\n        customAnswer.value = ''\n    })\n\n    // Single scalar answer shared by radio buttons and freeform text/number/date inputs.\n    const scalarValue = computed<string | number | undefined>({\n        get: () => {\n            const val = currentStep.value\n                ? answers[currentStep.value.id]\n                : undefined\n            if (val == null || Array.isArray(val)) return undefined\n            return val\n        },\n        set: (val) => {\n            if (currentStep.value) {\n                answers[currentStep.value.id] = val ?? null\n            }\n        },\n    })\n\n    const activeCheckboxValue = computed<unknown[] | undefined>({\n        get: () => {\n            const val = currentStep.value\n                ? answers[currentStep.value.id]\n                : undefined\n            return Array.isArray(val) ? val : []\n        },\n        set: (val) => {\n            if (currentStep.value) {\n                answers[currentStep.value.id] = (val as string[]) ?? []\n            }\n        },\n    })\n\n    // --- Initialize answers from existing output ---\n\n    /** The `{ answers: [...] }` list, when the output carries one. */\n    function outputAnswers(output: ToolPartShape['output']) {\n        if (!output || typeof output === 'string') return undefined\n        const list = (output as { answers?: unknown }).answers\n        return Array.isArray(list) ? (list as FormAnswer[]) : undefined\n    }\n\n    watch(\n        () => toolPart.value.output,\n        (output) => {\n            if (!output) return\n            if (typeof output === 'string') {\n                if (steps.value.length === 1) {\n                    answers[steps.value[0].id] = output\n                }\n                return\n            }\n            const list = outputAnswers(output)\n            if (list) {\n                for (const a of list) {\n                    answers[a.id] = a.value\n                }\n                return\n            }\n            // Forms answered on a platform channel come back as a flat record\n            // keyed by step id: without this the read-only summary showed every\n            // answer as a placeholder.\n            const record = output as Record<string, unknown>\n            for (const step of steps.value) {\n                const value = record[step.id]\n                if (value !== undefined) {\n                    answers[step.id] = value as AnswerValue\n                }\n            }\n        },\n        { immediate: true },\n    )\n\n    // --- Restore custom answer from output when it doesn't match any option ---\n\n    const normalizedOutput = computed(() => {\n        const out = toolPart.value.output\n        if (!out) return undefined\n        if (typeof out === 'string') return out\n        const list = outputAnswers(out)\n        if (list?.length === 1) {\n            const val = list[0].value\n            return Array.isArray(val) ? val.join(', ') : String(val)\n        }\n        return undefined\n    })\n\n    watch(\n        normalizedOutput,\n        (value) => {\n            if (!value || !currentStep.value) return\n            const optionLabels = (currentStep.value.options ?? []).map(\n                (o) => o.label,\n            )\n            if (!optionLabels.includes(value)) {\n                customAnswer.value = value\n            }\n        },\n        { immediate: true },\n    )\n\n    // --- Option mapping for radio/checkbox components ---\n\n    const radioOptions = computed(() => {\n        if (!currentStep.value?.options) return []\n        return currentStep.value.options.map((option) => ({\n            label: option.label,\n            value: option.label,\n            description: option.description,\n        }))\n    })\n\n    // --- Navigation & Submission ---\n\n    /** Footer button, and Enter on a pure freeform step. */\n    function goNext() {\n        // A typed freeform answer wins over the picked option: it is the more\n        // recent intent, and the footer button is now the visible way to send\n        // it (the freeform field only submits on Enter).\n        if (customAnswer.value.trim()) {\n            submitCustomAnswer()\n            return\n        }\n        if (canGoNext.value) {\n            currentStepIndex.value++\n        } else {\n            submitForm()\n        }\n    }\n\n    function goBack() {\n        if (canGoBack.value) {\n            currentStepIndex.value--\n        }\n    }\n\n    function submitForm() {\n        if (!isInteractive.value) return\n\n        const finalAnswers: FormAnswer[] = steps.value.map((step) => ({\n            id: step.id,\n            value: answers[step.id] ?? null,\n        }))\n\n        // Legacy backward compatibility: single-step, single-select → return plain string\n        if (\n            isLegacyAutoSubmit.value &&\n            !currentStep.value?.allowFreeformInput\n        ) {\n            const val = finalAnswers[0].value\n            emit('select', Array.isArray(val) ? val[0] : (val as string))\n        } else {\n            emit('select', { answers: finalAnswers })\n        }\n    }\n\n    /** Enter inside the freeform field shown alongside the options. */\n    function submitCustomAnswer() {\n        const value = customAnswer.value.trim()\n        if (!value) return\n\n        answers[currentStep.value.id] = value\n        // Cleared before navigating: `goNext()` reads it back to route a typed\n        // answer here, so leaving it set would recurse.\n        customAnswer.value = ''\n        if (steps.value.length === 1) {\n            submitForm()\n        } else {\n            goNext()\n        }\n    }\n\n    function onRadioChange() {\n        if (!isInteractive.value) return\n        if (isAutoSubmitStep.value || isLegacyAutoSubmit.value) {\n            submitForm()\n        }\n    }\n\n    // --- Summary helpers ---\n\n    function getSummaryValue(step: FormStep) {\n        const val = answers[step.id]\n        if (val == null) return '—'\n        if (Array.isArray(val)) return val.join(', ')\n        if (step.type === 'date') return $d(new Date(val), 'short')\n        return val\n    }\n</script>\n\n<template>\n    <div\n        v-if=\"steps.length\"\n        class=\"border border-surface-3 rounded-xl w-full overflow-hidden flex flex-col transition-all bg-surface\">\n        <!-- Header -->\n        <div\n            v-if=\"toolPart.input?.title || (isInteractive && steps.length > 1)\"\n            class=\"text-12 border-b border-surface-3 text-word-3 bg-surface-1\">\n            <div\n                v-if=\"toolPart.input?.title\"\n                class=\"px-sm py-10 font-bold\"\n                :class=\"{\n                    'border-b border-surface-3':\n                        isInteractive && steps.length > 1,\n                }\">\n                {{ toolPart.input?.title }}\n            </div>\n            <!-- Progress for multi-step -->\n            <div\n                v-if=\"isInteractive && steps.length > 1\"\n                class=\"flex flex-col gap-4 p-sm\">\n                <div class=\"flex justify-between text-10 text-word-3\">\n                    <span>\n                        {{\n                            $t('showForm.step', {\n                                current: currentStepIndex + 1,\n                                total: steps.length,\n                            })\n                        }}\n                    </span>\n                    <span>{{ progress }}%</span>\n                </div>\n                <div class=\"h-4 bg-surface-3 rounded-full overflow-hidden\">\n                    <div\n                        class=\"h-full bg-word-4 transition-all duration-300\"\n                        :style=\"{ width: `${progress}%` }\"></div>\n                </div>\n            </div>\n        </div>\n\n        <!-- Input Available State -->\n        <template v-if=\"isInteractive\">\n            <!-- Current Step Content -->\n            <div class=\"px-sm py-16 flex flex-col gap-12\">\n                <div class=\"leading-normal text-12\">\n                    <strong class=\"font-semibold\">\n                        {{ currentStep.question }}\n                    </strong>\n                    <PkStreamingMarkdown\n                        v-if=\"currentStep.message\"\n                        :markdown=\"currentStep.message\"\n                        class=\"text-word-2 mt-4\" />\n                </div>\n\n                <!-- Checkbox list for multi-select -->\n                <PkEditorCheckboxButtons\n                    v-if=\"currentStep.options && currentStep.multiSelect\"\n                    v-model=\"activeCheckboxValue\"\n                    :name=\"currentStep.id\"\n                    :options=\"radioOptions\"\n                    :readonly=\"!isInteractive\"\n                    class=\"mb-0\"\n                    vertical>\n                    <template\n                        v-for=\"option in radioOptions\"\n                        :key=\"option.value\"\n                        #[option.value]>\n                        <!-- Shared option layout: label + optional description -->\n                        <div class=\"text-12\">\n                            <div class=\"font-semibold\">{{ option.label }}</div>\n                            <div v-if=\"option.description\" class=\"text-word-3\">\n                                {{ option.description }}\n                            </div>\n                        </div>\n                    </template>\n                </PkEditorCheckboxButtons>\n\n                <!-- Radio buttons for single-select -->\n                <PkEditorRadioButtons\n                    v-else-if=\"currentStep.options && !currentStep.multiSelect\"\n                    v-model=\"scalarValue\"\n                    :name=\"currentStep.id\"\n                    :options=\"radioOptions\"\n                    :readonly=\"!isInteractive\"\n                    vertical\n                    class=\"mb-0\"\n                    @update:model-value=\"onRadioChange\">\n                    <template\n                        v-for=\"option in radioOptions\"\n                        :key=\"option.value\"\n                        #[option.value]>\n                        <!-- Shared option layout: label + optional description -->\n                        <div class=\"text-12\">\n                            <div class=\"font-semibold\">{{ option.label }}</div>\n                            <div v-if=\"option.description\" class=\"text-word-3\">\n                                {{ option.description }}\n                            </div>\n                        </div>\n                    </template>\n                </PkEditorRadioButtons>\n\n                <!-- Pure Freeform Input (text, number, date) -->\n                <div\n                    v-else-if=\"!currentStep.options\"\n                    class=\"flex flex-col gap-6 w-full\">\n                    <VvInputText\n                        :key=\"currentStep.id\"\n                        v-model=\"scalarValue\"\n                        :placeholder=\"\n                            currentStep.placeholder || $t('placeholder.insert')\n                        \"\n                        :type=\"currentStep.type\"\n                        class=\"w-full\"\n                        :name=\"currentStep.id\"\n                        modifiers=\"compact rounded\"\n                        :disabled=\"!isInteractive\"\n                        @keyup.enter=\"goNext\" />\n                </div>\n            </div>\n\n            <!-- Custom footer freeform input (shown alongside options when allowFreeformInput) -->\n            <div\n                v-if=\"currentStep.allowFreeformInput && currentStep.options\"\n                class=\"px-sm pb-sm border-t border-surface-3\">\n                <form\n                    class=\"flex gap-xs pt-sm\"\n                    @submit.prevent=\"submitCustomAnswer\">\n                    <VvInputText\n                        :key=\"`${currentStep.id}-custom`\"\n                        v-model=\"customAnswer\"\n                        class=\"flex-1\"\n                        :name=\"`${currentStep.id}-custom`\"\n                        modifiers=\"compact rounded\"\n                        :disabled=\"!isInteractive\"\n                        :placeholder=\"\n                            currentStep.placeholder ||\n                            $t('showForm.otherPlaceholder')\n                        \" />\n                </form>\n            </div>\n\n            <!-- Footer navigation: shown for every step that does not submit\n                 itself on option pick (see `isSelfSubmitting`). -->\n            <div\n                v-if=\"!isSelfSubmitting\"\n                class=\"px-sm py-10 bg-surface border-t border-surface-3 flex justify-between gap-12\">\n                <VvButton\n                    v-if=\"canGoBack\"\n                    modifiers=\"action-quiet\"\n                    icon=\"ri:arrow-left-s-line\"\n                    :label=\"$t('action.back')\"\n                    @click.stop=\"goBack\" />\n                <div v-else></div>\n\n                <VvButton\n                    :modifiers=\"canGoNext ? 'action-quiet' : 'action-primary'\"\n                    :icon=\"\n                        canGoNext\n                            ? 'ri:arrow-right-s-line'\n                            : 'ri:send-plane-2-line'\n                    \"\n                    icon-position=\"right\"\n                    :label=\"canGoNext ? $t('action.next') : $t('action.submit')\"\n                    @click.stop=\"goNext\" />\n            </div>\n        </template>\n\n        <!-- Output Available State (Multi-step Summary) -->\n        <template v-else>\n            <div class=\"px-sm py-12 bg-surface space-y-10\">\n                <ul class=\"flex flex-col gap-8\">\n                    <li\n                        v-for=\"step in steps\"\n                        :key=\"step.id\"\n                        class=\"leading-normal\">\n                        <div class=\"text-12 text-word-3\">\n                            {{ step.question }}\n                        </div>\n                        <span class=\"text-12 text-word-2 font-semibold\">\n                            {{ getSummaryValue(step) }}\n                        </span>\n                    </li>\n                </ul>\n            </div>\n            <div\n                class=\"px-sm py-12 bg-surface border-t border-surface-3 flex items-center gap-10\">\n                <div\n                    class=\"w-20 h-20 rounded-full border border-success text-success flex items-center justify-center\">\n                    <VvIcon name=\"ri:check-line\" class=\"text-12\" />\n                </div>\n                <div class=\"flex flex-col\">\n                    <span\n                        class=\"font-semibold text-12 text-word-1 leading-tight\">\n                        {{ $t('showForm.completed') }}\n                    </span>\n                </div>\n            </div>\n        </template>\n    </div>\n</template>\n","<script setup lang=\"ts\">\n    import { computed, ref, reactive, watch } from 'vue'\n    import { useI18n } from 'vue-i18n'\n    import PkStreamingMarkdown from './PkStreamingMarkdown.vue'\n    import PkEditorRadioButtons from '../PkEditorRadioButtons.vue'\n    import PkEditorCheckboxButtons from '../PkEditorCheckboxButtons.vue'\n\n    // --- Types ---\n\n    interface FormOption {\n        label: string\n        description?: string\n    }\n\n    interface FormStep {\n        id: string\n        question: string\n        message?: string\n        type?: 'text' | 'number' | 'date'\n        options?: FormOption[]\n        multiSelect?: boolean\n        allowFreeformInput?: boolean\n        placeholder?: string\n    }\n\n    interface FormAnswer {\n        id: string\n        value: string | string[] | number | null\n    }\n\n    interface ToolPartShape {\n        state?: 'input-available' | 'output-available'\n        toolCallId?: string\n        // AI SDK v5 encodes the tool name in `type` (e.g. 'tool-showMultipleChoice').\n        // `toolName` is kept for backward compatibility but is normally absent.\n        type?: string\n        toolName?: string\n        input?: {\n            title?: string\n            steps?: FormStep[]\n            // Legacy showMultipleChoice fields\n            question?: string\n            options?: (string | FormOption)[]\n        }\n        // The web card submits `{ answers: [...] }`; the platform channels\n        // (Teams modal) submit a flat record keyed by step id.\n        output?: string | { answers: FormAnswer[] } | Record<string, unknown>\n    }\n\n    type AnswerValue = string | string[] | number | null\n\n    // --- Props & Emits ---\n\n    const props = defineProps<{\n        part: unknown\n        allowCustomAnswer?: boolean\n    }>()\n\n    const emit = defineEmits<{\n        select: [answer: string | { answers: FormAnswer[] }]\n    }>()\n\n    const { t: $t, d: $d } = useI18n({ useScope: 'global' })\n\n    // --- Parsed tool part ---\n\n    const toolPart = computed(\n        () => JSON.parse(JSON.stringify(props.part)) as ToolPartShape,\n    )\n\n    const isLegacy = computed(\n        () =>\n            toolPart.value.toolName === 'showMultipleChoice' ||\n            toolPart.value.type === 'tool-showMultipleChoice',\n    )\n\n    const isInteractive = computed(\n        () => toolPart.value.state === 'input-available',\n    )\n\n    /** Single-step with no custom-answer and no freeform → auto-submit on option pick */\n    const isAutoSubmitStep = computed(() => {\n        const step = currentStep.value\n        if (!step) return false\n        return (\n            steps.value.length === 1 &&\n            !step.allowFreeformInput &&\n            !props.allowCustomAnswer\n        )\n    })\n\n    /** Legacy tool should auto-submit on option pick regardless of allowCustomAnswer */\n    const isLegacyAutoSubmit = computed(\n        () =>\n            isLegacy.value &&\n            steps.value.length === 1 &&\n            !currentStep.value?.multiSelect,\n    )\n\n    /**\n     * True only for the steps that send themselves as soon as an option is\n     * picked: the single case where the footer button would be redundant.\n     * Every other shape needs it, single-step forms included: with\n     * `allowFreeformInput` (or `allowCustomAnswer`) the radio pick no longer\n     * auto-submits, so without the footer the user was left with a chosen\n     * option and no way to send it.\n     */\n    const isSelfSubmitting = computed(\n        () =>\n            Boolean(currentStep.value?.options) &&\n            !currentStep.value?.multiSelect &&\n            (isAutoSubmitStep.value || isLegacyAutoSubmit.value),\n    )\n\n    // --- Steps ---\n\n    const steps = computed<FormStep[]>(() => {\n        const input = toolPart.value.input\n        if (input?.steps?.length) {\n            return input.steps\n        }\n        // Legacy showMultipleChoice → normalize into a single step\n        if (input?.question && input?.options) {\n            return [\n                {\n                    id: 'legacy',\n                    question: input.question,\n                    options: input.options.map((o) =>\n                        typeof o === 'string' ? { label: o } : o,\n                    ),\n                },\n            ]\n        }\n        return []\n    })\n\n    // --- Navigation state ---\n\n    const currentStepIndex = ref(0)\n    const currentStep = computed(() => steps.value[currentStepIndex.value])\n    const canGoBack = computed(() => currentStepIndex.value > 0)\n    const canGoNext = computed(\n        () => currentStepIndex.value < steps.value.length - 1,\n    )\n    const isMultiStep = computed(() => steps.value.length > 1)\n\n    const progress = computed(() => {\n        if (!isMultiStep.value) return null\n        return Math.round(\n            ((currentStepIndex.value + 1) / steps.value.length) * 100,\n        )\n    })\n\n    // --- Answers ---\n\n    const answers = reactive<Record<string, AnswerValue>>({})\n    const customAnswer = ref('')\n\n    // The freeform field belongs to the step showing it: text left behind\n    // (unsubmitted, or arriving from a late input update) must not follow the\n    // user to the next or previous question.\n    watch(currentStepIndex, () => {\n        customAnswer.value = ''\n    })\n\n    // Single scalar answer shared by radio buttons and freeform text/number/date inputs.\n    const scalarValue = computed<string | number | undefined>({\n        get: () => {\n            const val = currentStep.value\n                ? answers[currentStep.value.id]\n                : undefined\n            if (val == null || Array.isArray(val)) return undefined\n            return val\n        },\n        set: (val) => {\n            if (currentStep.value) {\n                answers[currentStep.value.id] = val ?? null\n            }\n        },\n    })\n\n    const activeCheckboxValue = computed<unknown[] | undefined>({\n        get: () => {\n            const val = currentStep.value\n                ? answers[currentStep.value.id]\n                : undefined\n            return Array.isArray(val) ? val : []\n        },\n        set: (val) => {\n            if (currentStep.value) {\n                answers[currentStep.value.id] = (val as string[]) ?? []\n            }\n        },\n    })\n\n    // --- Initialize answers from existing output ---\n\n    /** The `{ answers: [...] }` list, when the output carries one. */\n    function outputAnswers(output: ToolPartShape['output']) {\n        if (!output || typeof output === 'string') return undefined\n        const list = (output as { answers?: unknown }).answers\n        return Array.isArray(list) ? (list as FormAnswer[]) : undefined\n    }\n\n    watch(\n        () => toolPart.value.output,\n        (output) => {\n            if (!output) return\n            if (typeof output === 'string') {\n                if (steps.value.length === 1) {\n                    answers[steps.value[0].id] = output\n                }\n                return\n            }\n            const list = outputAnswers(output)\n            if (list) {\n                for (const a of list) {\n                    answers[a.id] = a.value\n                }\n                return\n            }\n            // Forms answered on a platform channel come back as a flat record\n            // keyed by step id: without this the read-only summary showed every\n            // answer as a placeholder.\n            const record = output as Record<string, unknown>\n            for (const step of steps.value) {\n                const value = record[step.id]\n                if (value !== undefined) {\n                    answers[step.id] = value as AnswerValue\n                }\n            }\n        },\n        { immediate: true },\n    )\n\n    // --- Restore custom answer from output when it doesn't match any option ---\n\n    const normalizedOutput = computed(() => {\n        const out = toolPart.value.output\n        if (!out) return undefined\n        if (typeof out === 'string') return out\n        const list = outputAnswers(out)\n        if (list?.length === 1) {\n            const val = list[0].value\n            return Array.isArray(val) ? val.join(', ') : String(val)\n        }\n        return undefined\n    })\n\n    watch(\n        normalizedOutput,\n        (value) => {\n            if (!value || !currentStep.value) return\n            const optionLabels = (currentStep.value.options ?? []).map(\n                (o) => o.label,\n            )\n            if (!optionLabels.includes(value)) {\n                customAnswer.value = value\n            }\n        },\n        { immediate: true },\n    )\n\n    // --- Option mapping for radio/checkbox components ---\n\n    const radioOptions = computed(() => {\n        if (!currentStep.value?.options) return []\n        return currentStep.value.options.map((option) => ({\n            label: option.label,\n            value: option.label,\n            description: option.description,\n        }))\n    })\n\n    // --- Navigation & Submission ---\n\n    /** Footer button, and Enter on a pure freeform step. */\n    function goNext() {\n        // A typed freeform answer wins over the picked option: it is the more\n        // recent intent, and the footer button is now the visible way to send\n        // it (the freeform field only submits on Enter).\n        if (customAnswer.value.trim()) {\n            submitCustomAnswer()\n            return\n        }\n        if (canGoNext.value) {\n            currentStepIndex.value++\n        } else {\n            submitForm()\n        }\n    }\n\n    function goBack() {\n        if (canGoBack.value) {\n            currentStepIndex.value--\n        }\n    }\n\n    function submitForm() {\n        if (!isInteractive.value) return\n\n        const finalAnswers: FormAnswer[] = steps.value.map((step) => ({\n            id: step.id,\n            value: answers[step.id] ?? null,\n        }))\n\n        // Legacy backward compatibility: single-step, single-select → return plain string\n        if (\n            isLegacyAutoSubmit.value &&\n            !currentStep.value?.allowFreeformInput\n        ) {\n            const val = finalAnswers[0].value\n            emit('select', Array.isArray(val) ? val[0] : (val as string))\n        } else {\n            emit('select', { answers: finalAnswers })\n        }\n    }\n\n    /** Enter inside the freeform field shown alongside the options. */\n    function submitCustomAnswer() {\n        const value = customAnswer.value.trim()\n        if (!value) return\n\n        answers[currentStep.value.id] = value\n        // Cleared before navigating: `goNext()` reads it back to route a typed\n        // answer here, so leaving it set would recurse.\n        customAnswer.value = ''\n        if (steps.value.length === 1) {\n            submitForm()\n        } else {\n            goNext()\n        }\n    }\n\n    function onRadioChange() {\n        if (!isInteractive.value) return\n        if (isAutoSubmitStep.value || isLegacyAutoSubmit.value) {\n            submitForm()\n        }\n    }\n\n    // --- Summary helpers ---\n\n    function getSummaryValue(step: FormStep) {\n        const val = answers[step.id]\n        if (val == null) return '—'\n        if (Array.isArray(val)) return val.join(', ')\n        if (step.type === 'date') return $d(new Date(val), 'short')\n        return val\n    }\n</script>\n\n<template>\n    <div\n        v-if=\"steps.length\"\n        class=\"border border-surface-3 rounded-xl w-full overflow-hidden flex flex-col transition-all bg-surface\">\n        <!-- Header -->\n        <div\n            v-if=\"toolPart.input?.title || (isInteractive && steps.length > 1)\"\n            class=\"text-12 border-b border-surface-3 text-word-3 bg-surface-1\">\n            <div\n                v-if=\"toolPart.input?.title\"\n                class=\"px-sm py-10 font-bold\"\n                :class=\"{\n                    'border-b border-surface-3':\n                        isInteractive && steps.length > 1,\n                }\">\n                {{ toolPart.input?.title }}\n            </div>\n            <!-- Progress for multi-step -->\n            <div\n                v-if=\"isInteractive && steps.length > 1\"\n                class=\"flex flex-col gap-4 p-sm\">\n                <div class=\"flex justify-between text-10 text-word-3\">\n                    <span>\n                        {{\n                            $t('showForm.step', {\n                                current: currentStepIndex + 1,\n                                total: steps.length,\n                            })\n                        }}\n                    </span>\n                    <span>{{ progress }}%</span>\n                </div>\n                <div class=\"h-4 bg-surface-3 rounded-full overflow-hidden\">\n                    <div\n                        class=\"h-full bg-word-4 transition-all duration-300\"\n                        :style=\"{ width: `${progress}%` }\"></div>\n                </div>\n            </div>\n        </div>\n\n        <!-- Input Available State -->\n        <template v-if=\"isInteractive\">\n            <!-- Current Step Content -->\n            <div class=\"px-sm py-16 flex flex-col gap-12\">\n                <div class=\"leading-normal text-12\">\n                    <strong class=\"font-semibold\">\n                        {{ currentStep.question }}\n                    </strong>\n                    <PkStreamingMarkdown\n                        v-if=\"currentStep.message\"\n                        :markdown=\"currentStep.message\"\n                        class=\"text-word-2 mt-4\" />\n                </div>\n\n                <!-- Checkbox list for multi-select -->\n                <PkEditorCheckboxButtons\n                    v-if=\"currentStep.options && currentStep.multiSelect\"\n                    v-model=\"activeCheckboxValue\"\n                    :name=\"currentStep.id\"\n                    :options=\"radioOptions\"\n                    :readonly=\"!isInteractive\"\n                    class=\"mb-0\"\n                    vertical>\n                    <template\n                        v-for=\"option in radioOptions\"\n                        :key=\"option.value\"\n                        #[option.value]>\n                        <!-- Shared option layout: label + optional description -->\n                        <div class=\"text-12\">\n                            <div class=\"font-semibold\">{{ option.label }}</div>\n                            <div v-if=\"option.description\" class=\"text-word-3\">\n                                {{ option.description }}\n                            </div>\n                        </div>\n                    </template>\n                </PkEditorCheckboxButtons>\n\n                <!-- Radio buttons for single-select -->\n                <PkEditorRadioButtons\n                    v-else-if=\"currentStep.options && !currentStep.multiSelect\"\n                    v-model=\"scalarValue\"\n                    :name=\"currentStep.id\"\n                    :options=\"radioOptions\"\n                    :readonly=\"!isInteractive\"\n                    vertical\n                    class=\"mb-0\"\n                    @update:model-value=\"onRadioChange\">\n                    <template\n                        v-for=\"option in radioOptions\"\n                        :key=\"option.value\"\n                        #[option.value]>\n                        <!-- Shared option layout: label + optional description -->\n                        <div class=\"text-12\">\n                            <div class=\"font-semibold\">{{ option.label }}</div>\n                            <div v-if=\"option.description\" class=\"text-word-3\">\n                                {{ option.description }}\n                            </div>\n                        </div>\n                    </template>\n                </PkEditorRadioButtons>\n\n                <!-- Pure Freeform Input (text, number, date) -->\n                <div\n                    v-else-if=\"!currentStep.options\"\n                    class=\"flex flex-col gap-6 w-full\">\n                    <VvInputText\n                        :key=\"currentStep.id\"\n                        v-model=\"scalarValue\"\n                        :placeholder=\"\n                            currentStep.placeholder || $t('placeholder.insert')\n                        \"\n                        :type=\"currentStep.type\"\n                        class=\"w-full\"\n                        :name=\"currentStep.id\"\n                        modifiers=\"compact rounded\"\n                        :disabled=\"!isInteractive\"\n                        @keyup.enter=\"goNext\" />\n                </div>\n            </div>\n\n            <!-- Custom footer freeform input (shown alongside options when allowFreeformInput) -->\n            <div\n                v-if=\"currentStep.allowFreeformInput && currentStep.options\"\n                class=\"px-sm pb-sm border-t border-surface-3\">\n                <form\n                    class=\"flex gap-xs pt-sm\"\n                    @submit.prevent=\"submitCustomAnswer\">\n                    <VvInputText\n                        :key=\"`${currentStep.id}-custom`\"\n                        v-model=\"customAnswer\"\n                        class=\"flex-1\"\n                        :name=\"`${currentStep.id}-custom`\"\n                        modifiers=\"compact rounded\"\n                        :disabled=\"!isInteractive\"\n                        :placeholder=\"\n                            currentStep.placeholder ||\n                            $t('showForm.otherPlaceholder')\n                        \" />\n                </form>\n            </div>\n\n            <!-- Footer navigation: shown for every step that does not submit\n                 itself on option pick (see `isSelfSubmitting`). -->\n            <div\n                v-if=\"!isSelfSubmitting\"\n                class=\"px-sm py-10 bg-surface border-t border-surface-3 flex justify-between gap-12\">\n                <VvButton\n                    v-if=\"canGoBack\"\n                    modifiers=\"action-quiet\"\n                    icon=\"ri:arrow-left-s-line\"\n                    :label=\"$t('action.back')\"\n                    @click.stop=\"goBack\" />\n                <div v-else></div>\n\n                <VvButton\n                    :modifiers=\"canGoNext ? 'action-quiet' : 'action-primary'\"\n                    :icon=\"\n                        canGoNext\n                            ? 'ri:arrow-right-s-line'\n                            : 'ri:send-plane-2-line'\n                    \"\n                    icon-position=\"right\"\n                    :label=\"canGoNext ? $t('action.next') : $t('action.submit')\"\n                    @click.stop=\"goNext\" />\n            </div>\n        </template>\n\n        <!-- Output Available State (Multi-step Summary) -->\n        <template v-else>\n            <div class=\"px-sm py-12 bg-surface space-y-10\">\n                <ul class=\"flex flex-col gap-8\">\n                    <li\n                        v-for=\"step in steps\"\n                        :key=\"step.id\"\n                        class=\"leading-normal\">\n                        <div class=\"text-12 text-word-3\">\n                            {{ step.question }}\n                        </div>\n                        <span class=\"text-12 text-word-2 font-semibold\">\n                            {{ getSummaryValue(step) }}\n                        </span>\n                    </li>\n                </ul>\n            </div>\n            <div\n                class=\"px-sm py-12 bg-surface border-t border-surface-3 flex items-center gap-10\">\n                <div\n                    class=\"w-20 h-20 rounded-full border border-success text-success flex items-center justify-center\">\n                    <VvIcon name=\"ri:check-line\" class=\"text-12\" />\n                </div>\n                <div class=\"flex flex-col\">\n                    <span\n                        class=\"font-semibold text-12 text-word-1 leading-tight\">\n                        {{ $t('showForm.completed') }}\n                    </span>\n                </div>\n            </div>\n        </template>\n    </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;EAII,IAAM,IAAQ,GASR,IAAa,EAElB,GAAA,YAAC,GAEI,IAAiB,QAMZ,CAAC,GALS,EAAM,YACjB,MAAM,QAAQ,EAAM,SAAS,IACzB,EAAM,YACN,CAAC,EAAM,SAAS,IACpB,CAAC,GACc,QAAQ,CAChC;;;eAID,EAce,GAAA;gBAdQ,EAAA;6CAAU,QAAA;IAAG,MAAA,EAAA;IAAK,WAAU;;qBAEX,EAAA,EAAA,EAAA,GADpC,EAYU,GAAA,MAAA,EAXkB,EAAA,UAAhB,GAAQ,YADpB,EAYU,GAAA;KAVL;KACA,MAAA,EAAA;KACA,UAAA,EAAA;KACA,UAAA,EAAA;KACA,UAAA,EAAA;KACA,OAAO,EAAO;KACd,WAAW,EAAA;;sBAGL,CAFP,EAEO,EAAA,QAFM,EAAO,OAApB,EAEO,EAAA,SAAA,GAAA,GAAA,EAF8B,UAAM,CAAA,SAEpC,CAAA,EAAA,EADA,EAAO,KAAK,GAAA,CAAA,CAAA,CAAA,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EE5B3B,IAAM,IAAa,EAAkC,GAAA,YAAC;;;eAItD,EAckB,GAAA;gBAdQ,EAAA;6CAAU,QAAA;IAAG,MAAA,EAAA;IAAK,WAAU;;qBAEd,EAAA,EAAA,EAAA,GADpC,EAYa,GAAA,MAAA,EAXe,EAAA,UAAhB,GAAQ,YADpB,EAYa,GAAA;KAVR;KACA,MAAA,EAAA;KACA,UAAA,EAAA;KACA,UAAA,EAAA;KACA,UAAA,EAAA;KACA,OAAO,EAAO;KACf,WAAU;;sBAGH,CAFP,EAEO,EAAA,QAFM,OAAO,EAAO,KAAK,GAAhC,EAEO,EAAA,SAAA,GAAA,GAAA,EAFsC,UAAM,CAAA,SAE5C,CAAA,EAAA,EADA,EAAO,KAAK,GAAA,CAAA,CAAA,CAAA,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EE2B3B,IAAM,IAAQ,GAKR,IAAO,GAIP,EAAE,GAAG,GAAI,GAAG,MAAO,GAAQ,EAAE,UAAU,SAAS,CAAC,GAIjD,IAAW,QACP,KAAK,MAAM,KAAK,UAAU,EAAM,IAAI,CAAC,CAC/C,GAEM,IAAW,QAET,EAAS,MAAM,aAAa,wBAC5B,EAAS,MAAM,SAAS,yBAChC,GAEM,IAAgB,QACZ,EAAS,MAAM,UAAU,iBACnC,GAGM,IAAmB,QAAe;GACpC,IAAM,IAAO,EAAY;GAEzB,OADK,IAED,EAAM,MAAM,WAAW,KACvB,CAAC,EAAK,sBACN,CAAC,EAAM,oBAJO;EAMtB,CAAC,GAGK,IAAqB,QAEnB,EAAS,SACT,EAAM,MAAM,WAAW,KACvB,CAAC,EAAY,OAAO,WAC5B,GAUM,IAAmB,QAEjB,EAAQ,EAAY,OAAO,WAC3B,CAAC,EAAY,OAAO,gBACnB,EAAiB,SAAS,EAAmB,MACtD,GAIM,IAAQ,QAA2B;GACrC,IAAM,IAAQ,EAAS,MAAM;GAgB7B,OAfI,GAAO,OAAO,SACP,EAAM,QAGb,GAAO,YAAY,GAAO,UACnB,CACH;IACI,IAAI;IACJ,UAAU,EAAM;IAChB,SAAS,EAAM,QAAQ,KAAK,MACxB,OAAO,KAAM,WAAW,EAAE,OAAO,EAAE,IAAI,CAC3C;GACJ,CACJ,IAEG,CAAC;EACZ,CAAC,GAIK,IAAmB,EAAI,CAAC,GACxB,IAAc,QAAe,EAAM,MAAM,EAAiB,MAAM,GAChE,IAAY,QAAe,EAAiB,QAAQ,CAAC,GACrD,IAAY,QACR,EAAiB,QAAQ,EAAM,MAAM,SAAS,CACxD,GACM,KAAc,QAAe,EAAM,MAAM,SAAS,CAAC,GAEnD,IAAW,QACR,GAAY,QACV,KAAK,OACN,EAAiB,QAAQ,KAAK,EAAM,MAAM,SAAU,GAC1D,IAH+B,IAIlC,GAIK,IAAU,GAAsC,CAAC,CAAC,GAClD,IAAe,EAAI,EAAE;EAK3B,EAAM,SAAwB;GAC1B,EAAa,QAAQ;EACzB,CAAC;EAGD,IAAM,IAAc,EAAsC;GACtD,WAAW;IACP,IAAM,IAAM,EAAY,QAClB,EAAQ,EAAY,MAAM,MAC1B,KAAA;IACF,WAAO,QAAQ,MAAM,QAAQ,CAAG,IACpC,OAAO;GACX;GACA,MAAM,MAAQ;IACV,AAAI,EAAY,UACZ,EAAQ,EAAY,MAAM,MAAM,KAAO;GAE/C;EACJ,CAAC,GAEK,IAAsB,EAAgC;GACxD,WAAW;IACP,IAAM,IAAM,EAAY,QAClB,EAAQ,EAAY,MAAM,MAC1B,KAAA;IACN,OAAO,MAAM,QAAQ,CAAG,IAAI,IAAM,CAAC;GACvC;GACA,MAAM,MAAQ;IACV,AAAI,EAAY,UACZ,EAAQ,EAAY,MAAM,MAAO,KAAoB,CAAC;GAE9D;EACJ,CAAC;EAKD,SAAS,EAAc,GAAiC;GACpD,IAAI,CAAC,KAAU,OAAO,KAAW,UAAU;GAC3C,IAAM,IAAQ,EAAiC;GAC/C,OAAO,MAAM,QAAQ,CAAI,IAAK,IAAwB,KAAA;EAC1D;EA+CA,AA7CA,QACU,EAAS,MAAM,SACpB,MAAW;GACR,IAAI,CAAC,GAAQ;GACb,IAAI,OAAO,KAAW,UAAU;IAC5B,AAAI,EAAM,MAAM,WAAW,MACvB,EAAQ,EAAM,MAAM,EAAE,CAAC,MAAM;IAEjC;GACJ;GACA,IAAM,IAAO,EAAc,CAAM;GACjC,IAAI,GAAM;IACN,KAAK,IAAM,KAAK,GACZ,EAAQ,EAAE,MAAM,EAAE;IAEtB;GACJ;GAIA,IAAM,IAAS;GACf,KAAK,IAAM,KAAQ,EAAM,OAAO;IAC5B,IAAM,IAAQ,EAAO,EAAK;IAC1B,AAAI,MAAU,KAAA,MACV,EAAQ,EAAK,MAAM;GAE3B;EACJ,GACA,EAAE,WAAW,GAAK,CACtB,GAgBA,EAZyB,QAAe;GACpC,IAAM,IAAM,EAAS,MAAM;GAC3B,IAAI,CAAC,GAAK;GACV,IAAI,OAAO,KAAQ,UAAU,OAAO;GACpC,IAAM,IAAO,EAAc,CAAG;GAC9B,IAAI,GAAM,WAAW,GAAG;IACpB,IAAM,IAAM,EAAK,EAAE,CAAC;IACpB,OAAO,MAAM,QAAQ,CAAG,IAAI,EAAI,KAAK,IAAI,IAAI,OAAO,CAAG;GAC3D;EAEJ,CAGI,IACC,MAAU;GACH,CAAC,KAAS,CAAC,EAAY,UACL,EAAY,MAAM,WAAW,CAAC,EAAA,CAAG,KAClD,MAAM,EAAE,KAER,CAAA,CAAa,SAAS,CAAK,MAC5B,EAAa,QAAQ;EAE7B,GACA,EAAE,WAAW,GAAK,CACtB;EAIA,IAAM,IAAe,QACZ,EAAY,OAAO,UACjB,EAAY,MAAM,QAAQ,KAAK,OAAY;GAC9C,OAAO,EAAO;GACd,OAAO,EAAO;GACd,aAAa,EAAO;EACxB,EAAE,IALsC,CAAC,CAM5C;EAKD,SAAS,IAAS;GAId,IAAI,EAAa,MAAM,KAAK,GAAG;IAC3B,EAAmB;IACnB;GACJ;GACA,AAAI,EAAU,QACV,EAAiB,UAEjB,EAAW;EAEnB;EAEA,SAAS,KAAS;GACd,AAAI,EAAU,SACV,EAAiB;EAEzB;EAEA,SAAS,IAAa;GAClB,IAAI,CAAC,EAAc,OAAO;GAE1B,IAAM,IAA6B,EAAM,MAAM,KAAK,OAAU;IAC1D,IAAI,EAAK;IACT,OAAO,EAAQ,EAAK,OAAO;GAC/B,EAAE;GAGF,IACI,EAAmB,SACnB,CAAC,EAAY,OAAO,oBACtB;IACE,IAAM,IAAM,EAAa,EAAE,CAAC;IAC5B,EAAK,UAAU,MAAM,QAAQ,CAAG,IAAI,EAAI,KAAM,CAAc;GAChE,OACI,EAAK,UAAU,EAAE,SAAS,EAAa,CAAC;EAEhD;EAGA,SAAS,IAAqB;GAC1B,IAAM,IAAQ,EAAa,MAAM,KAAK;GACjC,MAEL,EAAQ,EAAY,MAAM,MAAM,GAGhC,EAAa,QAAQ,IACjB,EAAM,MAAM,WAAW,IACvB,EAAW,IAEX,EAAO;EAEf;EAEA,SAAS,KAAgB;GAChB,EAAc,UACf,EAAiB,SAAS,EAAmB,UAC7C,EAAW;EAEnB;EAIA,SAAS,GAAgB,GAAgB;GACrC,IAAM,IAAM,EAAQ,EAAK;GAIzB,OAHI,KAAO,OAAa,MACpB,MAAM,QAAQ,CAAG,IAAU,EAAI,KAAK,IAAI,IACxC,EAAK,SAAS,SAAe,EAAG,IAAI,KAAK,CAAG,GAAG,OAAO,IACnD;EACX;;;UAKU,EAAA,MAAM,UAAA,EAAA,GADhB,EAqMM,OArMN,IAqMM,CAhMQ,EAAA,MAAS,OAAO,SAAU,EAAA,SAAiB,EAAA,MAAM,SAAM,KAAA,EAAA,GADjE,EAiCM,OAjCN,IAiCM,CA7BQ,EAAA,MAAS,OAAO,SAAA,EAAA,GAD1B,EAQM,OAAA;;IANF,OAAK,EAAA,CAAC,yBAAuB,EAAA,6BACsD,EAAA,SAAiB,EAAA,MAAM,SAAM,EAAA,CAAA,CAAA;QAI7G,EAAA,MAAS,OAAO,KAAK,GAAA,CAAA,KAAA,EAAA,IAAA,EAAA,GAIlB,EAAA,SAAiB,EAAA,MAAM,SAAM,KAAA,EAAA,GADvC,EAmBM,OAnBN,IAmBM,CAhBF,EAUM,OAVN,IAUM,CATF,EAOO,QAAA,MAAA,EALC,EAAA,CAAA,CAAE,CAAA,iBAAA;aAA6D,EAAA,QAAgB;WAA6C,EAAA,MAAM;YAM1I,EAA4B,QAAA,MAAA,EAAnB,EAAA,KAAQ,IAAG,KAAC,CAAA,CAAA,CAAA,GAEzB,EAIM,OAJN,IAIM,CAHF,EAE6C,OAAA;IADzC,OAAM;IACL,OAAK,GAAA,EAAA,OAAA,GAAc,EAAA,MAAQ,GAAA,CAAA;gDAM5B,EAAA,SAAA,EAAA,GAAhB,EA4HW,GAAA,EAAA,KAAA,EAAA,GAAA;IA1HP,EA2EM,OA3EN,GA2EM,CA1EF,EAQM,OARN,GAQM,CAPF,EAES,UAFT,GAES,EADF,EAAA,MAAY,QAAQ,GAAA,CAAA,GAGjB,EAAA,MAAY,WAAA,EAAA,GADtB,EAG+B,IAAA;;KAD1B,UAAU,EAAA,MAAY;KACvB,OAAM;8CAKJ,EAAA,MAAY,WAAW,EAAA,MAAY,eAAA,EAAA,GAD7C,EAoB0B,IAAA;;iBAlBb,EAAA;8CAAmB,QAAA;KAC3B,MAAM,EAAA,MAAY;KAClB,SAAS,EAAA;KACT,UAAQ,CAAG,EAAA;KACZ,OAAM;KACN,UAAA;sBAEqB,EAAA,QAAV;WAEN,EAAO;iBAOF,CALN,EAKM,OALN,GAKM,CAJF,EAAmD,OAAnD,GAAmD,EAArB,EAAO,KAAK,GAAA,CAAA,GAC/B,EAAO,eAAA,EAAA,GAAlB,EAEM,OAFN,GAEM,EADC,EAAO,WAAW,GAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,CAAA,CAAA,CAAA;;;;;;UAQtB,EAAA,MAAY,WAAO,CAAK,EAAA,MAAY,eAAA,EAAA,GADnD,EAqBuB,IAAA;;iBAnBV,EAAA;+CAAW,QAAA,GAMC,EAAA;KALpB,MAAM,EAAA,MAAY;KAClB,SAAS,EAAA;KACT,UAAQ,CAAG,EAAA;KACZ,UAAA;KACA,OAAM;sBAGe,EAAA,QAAV;WAEN,EAAO;iBAOF,CALN,EAKM,OALN,GAKM,CAJF,EAAmD,OAAnD,GAAmD,EAArB,EAAO,KAAK,GAAA,CAAA,GAC/B,EAAO,eAAA,EAAA,GAAlB,EAEM,OAFN,GAEM,EADC,EAAO,WAAW,GAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,CAAA,CAAA,CAAA;;;;;;UAQrB,EAAA,MAAY,uBAAA,EAAA,GAD5B,EAeM,OAfN,IAeM,EAAA,EAAA,GAZF,EAW4B,GAAA;KAVvB,KAAK,EAAA,MAAY;iBACT,EAAA;8CAAW,QAAA;KACnB,aAA0C,EAAA,MAAY,eAAe,EAAA,CAAA,CAAE,CAAA,oBAAA;KAGvE,MAAM,EAAA,MAAY;KACnB,OAAM;KACL,MAAM,EAAA,MAAY;KACnB,WAAU;KACT,UAAQ,CAAG,EAAA;KACX,SAAK,GAAQ,GAAM,CAAA,OAAA,CAAA;;;;;;;;IAMtB,EAAA,MAAY,sBAAsB,EAAA,MAAY,WAAA,EAAA,GADxD,EAkBM,OAlBN,GAkBM,CAfF,EAcO,QAAA;KAbH,OAAM;KACL,UAAM,EAAU,GAAkB,CAAA,SAAA,CAAA;cACnC,EAUQ,GAAA;KATH,KAAG,GAAK,EAAA,MAAY,GAAE;iBACd,EAAA;8CAAY,QAAA;KACrB,OAAM;KACL,MAAI,GAAK,EAAA,MAAY,GAAE;KACxB,WAAU;KACT,UAAQ,CAAG,EAAA;KACX,aAA0C,EAAA,MAAY,eAA2C,EAAA,CAAA,CAAE,CAAA,2BAAA;;;;;;;IAUrG,EAAA,qBAAA,EAAA,GADX,EAqBM,OArBN,IAqBM,CAjBQ,EAAA,SAAA,EAAA,GADV,EAK2B,GAAA;;KAHvB,WAAU;KACV,MAAK;KACJ,OAAO,EAAA,CAAA,CAAE,CAAA,aAAA;KACT,SAAK,EAAO,IAAM,CAAA,MAAA,CAAA;oCACvB,EAAkB,OAAA,EAAA,IAElB,EAS2B,GAAA;KARtB,WAAW,EAAA,QAAS,iBAAA;KACpB,MAA+B,EAAA,QAAA,0BAAA;KAKhC,iBAAc;KACb,OAAO,EAAA,QAAY,EAAA,CAAA,CAAE,CAAA,aAAA,IAAkB,EAAA,CAAA,CAAE,CAAA,eAAA;KACzC,SAAK,EAAO,GAAM,CAAA,MAAA,CAAA;;;;;;mBAK/B,EA6BW,GAAA,EAAA,KAAA,EAAA,GAAA,CA5BP,EAcM,OAdN,IAcM,CAbF,EAYK,MAZL,IAYK,EAAA,EAAA,EAAA,GAXD,EAUK,GAAA,MAAA,EATc,EAAA,QAAR,YADX,EAUK,MAAA;IARA,KAAK,EAAK;IACX,OAAM;OACN,EAEM,OAFN,IAEM,EADC,EAAK,QAAQ,GAAA,CAAA,GAEpB,EAEO,QAFP,IAEO,EADA,GAAgB,CAAI,CAAA,GAAA,CAAA,CAAA,CAAA,gBAKvC,EAYM,OAZN,IAYM,CAVF,EAGM,OAHN,IAGM,CADF,EAA+C,GAAA;IAAvC,MAAK;IAAgB,OAAM;SAEvC,EAKM,OALN,IAKM,CAJF,EAGO,QAHP,IAGO,EADA,EAAA,CAAA,CAAE,CAAA,oBAAA,CAAA,GAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,GAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA"}

package/dist/_chunks/{PkToolShowImageGallery-WQL3T4Hr.js → PkToolShowImageGallery-B7dClMBr.js}

@@ -2,12 +2,13 @@ import { A as e, C as t, Ht as n, L as r, T as i, V as a, _ as o, at as s, b as
 import "./src-BGqVtumX.js";
 import { n as _ } from "./url-validation-uLMZ5-AU.js";
 import { f as v } from "./index.es-_oXVRjHy.js";
-import { n as y, t as b } from "./useLightbox-WFuKhn8l.js";
+import { t as y } from "./useImageFallback-CaxDKce2.js";
+import { n as b, t as x } from "./useLightbox-WFuKhn8l.js";
 e(), u(), s();
-var x = {
+var S = {
 	key: 0,
 	class: "border border-surface-3 rounded-xl w-full overflow-hidden bg-surface"
-}, S = { class: "px-sm py-6 bg-surface-1 min-h-40 text-12 border-b border-surface-3 text-word-3 flex items-center gap-8 min-h-40" }, C = { class: "font-bold" }, w = { class: "p-sm" }, T = [
+}, C = { class: "px-sm py-6 bg-surface-1 min-h-40 text-12 border-b border-surface-3 text-word-3 flex items-center gap-8 min-h-40" }, w = { class: "font-bold" }, T = { class: "p-sm" }, E = [
 	"href",
 	"data-pswp-src",
 	"data-pswp-width",
@@ -16,58 +17,58 @@ var x = {
 	"title",
 	"target",
 	"rel"
-], E = [
+], D = [
 	"src",
 	"alt",
 	"onError"
-], D = {
+], O = {
 	key: 1,
 	class: "w-full h-full flex flex-col items-center justify-center gap-4 bg-surface-1 text-word-3"
-}, O = { class: "text-12" }, k = /* @__PURE__ */ i({
+}, k = { class: "text-12" }, A = /* @__PURE__ */ i({
 	__name: "PkToolShowImageGallery",
 	props: { part: { type: null } },
 	setup(e) {
-		let i = e, s = l(() => i.part), u = d(), { preload: k, getSize: A } = b(), j = l(() => s.value.input?.images ?? []), M = d(/* @__PURE__ */ new Set()), N = (e) => M.value.add(e), P = l(() => {
-			let e = j.value.length;
+		let i = e, s = l(() => i.part), u = d(), { preload: A, getSize: j } = x(), M = l(() => s.value.input?.images ?? []), { canShowImage: N, onImageError: P } = y(), F = l(() => {
+			let e = M.value.length;
 			return e === 1 ? "grid-cols-1 justify-items-center" : e === 2 ? "grid-cols-2" : "grid-cols-3";
-		}), { init: F } = y({ gallery: u });
+		}), { init: I } = b({ gallery: u });
 		return r(async () => {
-			k(j.value), await F();
+			A(M.value), await I();
 		}), (e, r) => {
 			let i = v;
-			return j.value.length ? (g(), c("div", x, [o("div", S, [t(i, {
+			return M.value.length ? (g(), c("div", S, [o("div", C, [t(i, {
 				name: "ri:image-line",
 				class: "text-16"
-			}), o("strong", C, p(e.$t("label.gallery", { count: j.value.length })), 1)]), o("div", w, [o("div", {
+			}), o("strong", w, p(e.$t("label.gallery", { count: M.value.length })), 1)]), o("div", T, [o("div", {
 				ref_key: "galleryRef",
 				ref: u,
-				class: n(["grid gap-8", P.value])
-			}, [(g(!0), c(f, null, a(j.value, (r) => (g(), c("a", {
+				class: n(["grid gap-8", F.value])
+			}, [(g(!0), c(f, null, a(M.value, (r) => (g(), c("a", {
 				key: r.url,
-				href: M.value.has(r.url) ? void 0 : r.url,
-				"data-pswp-src": M.value.has(r.url) ? void 0 : r.url,
-				"data-pswp-width": m(A)(r.url).width,
-				"data-pswp-height": m(A)(r.url).height,
+				href: m(N)(r.url) ? r.url : void 0,
+				"data-pswp-src": m(N)(r.url) ? r.url : void 0,
+				"data-pswp-width": m(j)(r.url).width,
+				"data-pswp-height": m(j)(r.url).height,
 				"data-pswp-caption": r.caption ?? r.alt ?? "",
 				"data-cropped": !0,
-				class: n(["relative block aspect-square overflow-hidden rounded-xl group max-h-384", [{ "w-384 max-w-full": j.value.length === 1 }, M.value.has(r.url) ? "pointer-events-none" : "cursor-pointer"]]),
+				class: n(["relative block aspect-square overflow-hidden rounded-xl group max-h-384", [{ "w-384 max-w-full": M.value.length === 1 }, m(N)(r.url) ? "cursor-pointer" : "pointer-events-none"]]),
 				title: r.caption ?? r.alt ?? "",
 				target: m(_)(r.url) ? void 0 : "_blank",
 				rel: m(_)(r.url) ? void 0 : "noopener noreferrer"
-			}, [M.value.has(r.url) ? (g(), c("div", D, [t(i, {
-				name: "ri:camera-off-line",
-				class: "text-24"
-			}), o("span", O, p(e.$t("label.imageLoadError")), 1)])) : (g(), c("img", {
+			}, [m(N)(r.url) ? (g(), c("img", {
 				key: 0,
 				src: r.url,
 				alt: r.alt ?? r.caption ?? "",
 				class: "w-full h-full object-cover transition-opacity group-hover:opacity-80",
-				onError: (e) => N(r.url)
-			}, null, 40, E))], 10, T))), 128))], 2)])])) : h("", !0);
+				onError: (e) => m(P)(r.url)
+			}, null, 40, D)) : (g(), c("div", O, [t(i, {
+				name: "ri:camera-off-line",
+				class: "text-24"
+			}), o("span", k, p(e.$t("label.imageLoadError")), 1)]))], 10, E))), 128))], 2)])])) : h("", !0);
 		};
 	}
 });
 //#endregion
-export { k as default };
+export { A as default };
 
-//# sourceMappingURL=PkToolShowImageGallery-WQL3T4Hr.js.map
+//# sourceMappingURL=PkToolShowImageGallery-B7dClMBr.js.map

package/dist/_chunks/PkToolShowImageGallery-B7dClMBr.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PkToolShowImageGallery-B7dClMBr.js","names":["$t"],"sources":["../../../../packages/components/src/chat/PkToolShowImageGallery.vue","../../../../packages/components/src/chat/PkToolShowImageGallery.vue"],"sourcesContent":["<script setup lang=\"ts\">\n    import { computed, ref, onMounted } from 'vue'\n    import { isSameSite } from 'utils'\n    import { useImageFallback } from 'composables'\n    import { useLightbox, useImageSizes } from '../composables/useLightbox'\n\n    const props = defineProps<{\n        part: unknown\n    }>()\n\n    const toolPart = computed(() => {\n        const part = props.part as {\n            input?: {\n                images: Array<{\n                    url: string\n                    caption?: string\n                    alt?: string\n                }>\n            }\n        }\n        return part\n    })\n\n    const galleryRef = ref<HTMLElement>()\n    const { preload, getSize } = useImageSizes()\n\n    const images = computed(() => toolPart.value.input?.images ?? [])\n\n    const { canShowImage, onImageError } = useImageFallback()\n\n    const gridCols = computed(() => {\n        const count = images.value.length\n        if (count === 1) {\n            return 'grid-cols-1 justify-items-center'\n        }\n        if (count === 2) {\n            return 'grid-cols-2'\n        }\n        return 'grid-cols-3'\n    })\n\n    const { init } = useLightbox({ gallery: galleryRef })\n\n    onMounted(async () => {\n        preload(images.value)\n        await init()\n    })\n</script>\n\n<template>\n    <div\n        v-if=\"images.length\"\n        class=\"border border-surface-3 rounded-xl w-full overflow-hidden bg-surface\">\n        <div\n            class=\"px-sm py-6 bg-surface-1 min-h-40 text-12 border-b border-surface-3 text-word-3 flex items-center gap-8 min-h-40\">\n            <VvIcon name=\"ri:image-line\" class=\"text-16\" />\n            <strong class=\"font-bold\">\n                {{ $t('label.gallery', { count: images.length }) }}\n            </strong>\n        </div>\n        <div class=\"p-sm\">\n            <div ref=\"galleryRef\" class=\"grid gap-8\" :class=\"gridCols\">\n                <a\n                    v-for=\"image in images\"\n                    :key=\"image.url\"\n                    :href=\"canShowImage(image.url) ? image.url : undefined\"\n                    :data-pswp-src=\"\n                        canShowImage(image.url) ? image.url : undefined\n                    \"\n                    :data-pswp-width=\"getSize(image.url).width\"\n                    :data-pswp-height=\"getSize(image.url).height\"\n                    :data-pswp-caption=\"image.caption ?? image.alt ?? ''\"\n                    :data-cropped=\"true\"\n                    class=\"relative block aspect-square overflow-hidden rounded-xl group max-h-384\"\n                    :class=\"[\n                        { 'w-384 max-w-full': images.length === 1 },\n                        canShowImage(image.url)\n                            ? 'cursor-pointer'\n                            : 'pointer-events-none',\n                    ]\"\n                    :title=\"image.caption ?? image.alt ?? ''\"\n                    :target=\"isSameSite(image.url) ? undefined : '_blank'\"\n                    :rel=\"\n                        isSameSite(image.url)\n                            ? undefined\n                            : 'noopener noreferrer'\n                    \">\n                    <img\n                        v-if=\"canShowImage(image.url)\"\n                        :src=\"image.url\"\n                        :alt=\"image.alt ?? image.caption ?? ''\"\n                        class=\"w-full h-full object-cover transition-opacity group-hover:opacity-80\"\n                        @error=\"onImageError(image.url)\" />\n                    <div\n                        v-else\n                        class=\"w-full h-full flex flex-col items-center justify-center gap-4 bg-surface-1 text-word-3\">\n                        <VvIcon name=\"ri:camera-off-line\" class=\"text-24\" />\n                        <span class=\"text-12\">{{\n                            $t('label.imageLoadError')\n                        }}</span>\n                    </div>\n                </a>\n            </div>\n        </div>\n    </div>\n</template>\n","<script setup lang=\"ts\">\n    import { computed, ref, onMounted } from 'vue'\n    import { isSameSite } from 'utils'\n    import { useImageFallback } from 'composables'\n    import { useLightbox, useImageSizes } from '../composables/useLightbox'\n\n    const props = defineProps<{\n        part: unknown\n    }>()\n\n    const toolPart = computed(() => {\n        const part = props.part as {\n            input?: {\n                images: Array<{\n                    url: string\n                    caption?: string\n                    alt?: string\n                }>\n            }\n        }\n        return part\n    })\n\n    const galleryRef = ref<HTMLElement>()\n    const { preload, getSize } = useImageSizes()\n\n    const images = computed(() => toolPart.value.input?.images ?? [])\n\n    const { canShowImage, onImageError } = useImageFallback()\n\n    const gridCols = computed(() => {\n        const count = images.value.length\n        if (count === 1) {\n            return 'grid-cols-1 justify-items-center'\n        }\n        if (count === 2) {\n            return 'grid-cols-2'\n        }\n        return 'grid-cols-3'\n    })\n\n    const { init } = useLightbox({ gallery: galleryRef })\n\n    onMounted(async () => {\n        preload(images.value)\n        await init()\n    })\n</script>\n\n<template>\n    <div\n        v-if=\"images.length\"\n        class=\"border border-surface-3 rounded-xl w-full overflow-hidden bg-surface\">\n        <div\n            class=\"px-sm py-6 bg-surface-1 min-h-40 text-12 border-b border-surface-3 text-word-3 flex items-center gap-8 min-h-40\">\n            <VvIcon name=\"ri:image-line\" class=\"text-16\" />\n            <strong class=\"font-bold\">\n                {{ $t('label.gallery', { count: images.length }) }}\n            </strong>\n        </div>\n        <div class=\"p-sm\">\n            <div ref=\"galleryRef\" class=\"grid gap-8\" :class=\"gridCols\">\n                <a\n                    v-for=\"image in images\"\n                    :key=\"image.url\"\n                    :href=\"canShowImage(image.url) ? image.url : undefined\"\n                    :data-pswp-src=\"\n                        canShowImage(image.url) ? image.url : undefined\n                    \"\n                    :data-pswp-width=\"getSize(image.url).width\"\n                    :data-pswp-height=\"getSize(image.url).height\"\n                    :data-pswp-caption=\"image.caption ?? image.alt ?? ''\"\n                    :data-cropped=\"true\"\n                    class=\"relative block aspect-square overflow-hidden rounded-xl group max-h-384\"\n                    :class=\"[\n                        { 'w-384 max-w-full': images.length === 1 },\n                        canShowImage(image.url)\n                            ? 'cursor-pointer'\n                            : 'pointer-events-none',\n                    ]\"\n                    :title=\"image.caption ?? image.alt ?? ''\"\n                    :target=\"isSameSite(image.url) ? undefined : '_blank'\"\n                    :rel=\"\n                        isSameSite(image.url)\n                            ? undefined\n                            : 'noopener noreferrer'\n                    \">\n                    <img\n                        v-if=\"canShowImage(image.url)\"\n                        :src=\"image.url\"\n                        :alt=\"image.alt ?? image.caption ?? ''\"\n                        class=\"w-full h-full object-cover transition-opacity group-hover:opacity-80\"\n                        @error=\"onImageError(image.url)\" />\n                    <div\n                        v-else\n                        class=\"w-full h-full flex flex-col items-center justify-center gap-4 bg-surface-1 text-word-3\">\n                        <VvIcon name=\"ri:camera-off-line\" class=\"text-24\" />\n                        <span class=\"text-12\">{{\n                            $t('label.imageLoadError')\n                        }}</span>\n                    </div>\n                </a>\n            </div>\n        </div>\n    </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAMI,IAAM,IAAQ,GAIR,IAAW,QACA,EAAM,IAUtB,GAEK,IAAa,EAAiB,GAC9B,EAAE,YAAS,eAAY,EAAc,GAErC,IAAS,QAAe,EAAS,MAAM,OAAO,UAAU,CAAC,CAAC,GAE1D,EAAE,iBAAc,oBAAiB,EAAiB,GAElD,IAAW,QAAe;GAC5B,IAAM,IAAQ,EAAO,MAAM;GAO3B,OANI,MAAU,IACH,qCAEP,MAAU,IACH,gBAEJ;EACX,CAAC,GAEK,EAAE,YAAS,EAAY,EAAE,SAAS,EAAW,CAAC;SAEpD,EAAU,YAAY;GAElB,AADA,EAAQ,EAAO,KAAK,GACpB,MAAM,EAAK;EACf,CAAC;;UAKS,EAAA,MAAO,UAAA,EAAA,GADjB,EAsDM,OAtDN,GAsDM,CAnDF,EAMM,OANN,GAMM,CAJF,EAA+C,GAAA;IAAvC,MAAK;IAAgB,OAAM;OACnC,EAES,UAFT,GAES,EADFA,EAAAA,GAAE,iBAAA,EAAA,OAA2B,EAAA,MAAO,OAAM,CAAA,CAAA,GAAA,CAAA,CAAA,CAAA,GAGrD,EA2CM,OA3CN,GA2CM,CA1CF,EAyCM,OAAA;aAzCG;IAAJ,KAAI;IAAa,OAAK,EAAA,CAAC,cAAqB,EAAA,KAAQ,CAAA;eACrD,EAuCI,GAAA,MAAA,EAtCgB,EAAA,QAAT,YADX,EAuCI,KAAA;IArCC,KAAK,EAAM;IACX,MAAM,EAAA,CAAA,CAAY,CAAC,EAAM,GAAG,IAAI,EAAM,MAAM,KAAA;IAC5C,iBAAwC,EAAA,CAAA,CAAY,CAAC,EAAM,GAAG,IAAI,EAAM,MAAM,KAAA;IAG9E,mBAAiB,EAAA,CAAA,CAAO,CAAC,EAAM,GAAG,CAAA,CAAE;IACpC,oBAAkB,EAAA,CAAA,CAAO,CAAC,EAAM,GAAG,CAAA,CAAE;IACrC,qBAAmB,EAAM,WAAW,EAAM,OAAG;IAC7C,gBAAc;IACf,OAAK,EAAA,CAAC,2EAAyE,CAAA,EAAA,oBACvB,EAAA,MAAO,WAAM,EAAA,GAAkC,EAAA,CAAA,CAAY,CAAC,EAAM,GAAG,IAAA,mBAAA,qBAAA,CAAA,CAAA;IAM5H,OAAO,EAAM,WAAW,EAAM,OAAG;IACjC,QAAQ,EAAA,CAAA,CAAU,CAAC,EAAM,GAAG,IAAI,KAAA,IAAS;IACzC,KAA8B,EAAA,CAAA,CAAU,CAAC,EAAM,GAAG,IAAgC,KAAA,IAAA;OAMzE,EAAA,CAAA,CAAY,CAAC,EAAM,GAAG,KAAA,EAAA,GADhC,EAKuC,OAAA;;IAHlC,KAAK,EAAM;IACX,KAAK,EAAM,OAAO,EAAM,WAAO;IAChC,OAAM;IACL,UAAK,MAAE,EAAA,CAAA,CAAY,CAAC,EAAM,GAAG;4BAClC,EAOM,OAPN,GAOM,CAJF,EAAoD,GAAA;IAA5C,MAAK;IAAqB,OAAM;OACxC,EAES,QAFT,GAES,EADLA,EAAAA,GAAE,sBAAA,CAAA,GAAA,CAAA,CAAA,CAAA,EAAA,GAAA,IAAA,CAAA"}

package/dist/_chunks/{PkToolShowProductList-BbY4ni7Y.js → PkToolShowProductList-BGqOPGVe.js}

@@ -1,11 +1,12 @@
 import { A as e, C as t, Ht as n, T as r, V as i, W as a, _ as o, b as s, et as c, g as l, kt as u, p as d, qt as f, v as p, y as m, z as h } from "./vue.runtime.esm-bundler-DbhD_IvR.js";
 import { f as g } from "./index.es-_oXVRjHy.js";
-import { t as _ } from "./PkUrl-liCemvcx.js";
+import { t as _ } from "./PkLazyImg-BhLarH2R.js";
+import { t as v } from "./PkUrl-liCemvcx.js";
 e(), u();
-var v = {
+var y = {
 	key: 0,
 	class: "flex flex-col gap-xs w-full"
-}, y = ["src", "alt"], b = { class: "flex flex-col gap-4 min-w-0 flex-1" }, x = { class: "font-bold text-12 text-word-1 truncate" }, S = {
+}, b = { class: "flex flex-col gap-4 min-w-0 flex-1" }, x = { class: "font-bold text-12 text-word-1 truncate" }, S = {
 	key: 0,
 	class: "text-10 text-word-4 truncate flex items-center gap-4"
 }, C = { class: "flex items-center gap-sm flex-wrap text-12" }, w = {
@@ -25,7 +26,7 @@ var v = {
 		};
 		return (e, r) => {
 			let l = g;
-			return u.value?.input?.products?.length ? (h(), s("ul", v, [(h(!0), s(d, null, i(u.value.input.products, (e, r) => (h(), s("li", {
+			return u.value?.input?.products?.length ? (h(), s("ul", y, [(h(!0), s(d, null, i(u.value.input.products, (e, r) => (h(), s("li", {
 				key: r,
 				class: "border border-surface-3 rounded-xl overflow-hidden hover:border-surface-4 transition-colors"
 			}, [(h(), p(a(e.url ? "a" : "div"), {
@@ -34,17 +35,18 @@ var v = {
 				rel: e.url ? "noopener noreferrer" : void 0,
 				class: "flex gap-8 p-8 hover:bg-surface-1 transition-colors"
 			}, {
-				default: c(() => [e.image ? (h(), s("img", {
+				default: c(() => [e.image ? (h(), p(_, {
 					key: 0,
 					src: e.image,
 					alt: e.name,
+					"fallback-icon": "ri:image-off-line",
 					class: "w-48 h-48 object-contain rounded shrink-0 border border-surface-3 bg-surface"
-				}, null, 8, y)) : m("", !0), o("div", b, [
+				}, null, 8, ["src", "alt"])) : m("", !0), o("div", b, [
 					o("strong", x, f(e.name), 1),
 					e.url ? (h(), s("span", S, [t(l, {
 						name: "ri:link",
 						class: "shrink-0 text-12"
-					}), t(_, { url: e.url }, null, 8, ["url"])])) : m("", !0),
+					}), t(v, { url: e.url }, null, 8, ["url"])])) : m("", !0),
 					o("div", C, [e.price ? (h(), s("span", w, f(e.price), 1)) : m("", !0), e.availability ? (h(), s("span", {
 						key: 1,
 						class: n(["text-10 font-medium", E(e.availability)])
@@ -63,4 +65,4 @@ var v = {
 //#endregion
 export { E as default };
 
-//# sourceMappingURL=PkToolShowProductList-BbY4ni7Y.js.map
+//# sourceMappingURL=PkToolShowProductList-BGqOPGVe.js.map

package/dist/_chunks/PkToolShowProductList-BGqOPGVe.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PkToolShowProductList-BGqOPGVe.js","names":[],"sources":["../../../../packages/components/src/chat/PkToolShowProductList.vue","../../../../packages/components/src/chat/PkToolShowProductList.vue"],"sourcesContent":["<script setup lang=\"ts\">\n    import { computed } from 'vue'\n    import PkLazyImg from '../PkLazyImg.vue'\n    import PkUrl from '../PkUrl.vue'\n\n    const props = defineProps<{\n        part: unknown\n    }>()\n\n    const toolPart = computed(() => {\n        const part = props.part as {\n            input?: {\n                products: Array<{\n                    name: string\n                    url?: string\n                    image?: string\n                    price?: string\n                    availability?: string\n                    description?: string\n                }>\n            }\n        }\n        return part\n    })\n\n    const getAvailabilityColor = (availability?: string) => {\n        if (!availability) {\n            return ''\n        }\n        const lower = availability.toLowerCase()\n        if (\n            lower.includes('in stock') ||\n            lower.includes('available') ||\n            lower.includes('disponibile')\n        ) {\n            return 'text-success'\n        }\n        if (\n            lower.includes('out of stock') ||\n            lower.includes('unavailable') ||\n            lower.includes('non disponibile')\n        ) {\n            return 'text-danger'\n        }\n        if (\n            lower.includes('limited') ||\n            lower.includes('low stock') ||\n            lower.includes('limitato')\n        ) {\n            return 'text-warning'\n        }\n        return 'text-word-3'\n    }\n</script>\n\n<template>\n    <ul\n        v-if=\"toolPart?.input?.products?.length\"\n        class=\"flex flex-col gap-xs w-full\">\n        <li\n            v-for=\"(product, index) in toolPart.input.products\"\n            :key=\"index\"\n            class=\"border border-surface-3 rounded-xl overflow-hidden hover:border-surface-4 transition-colors\">\n            <component\n                :is=\"product.url ? 'a' : 'div'\"\n                :href=\"product.url\"\n                :target=\"product.url ? '_blank' : undefined\"\n                :rel=\"product.url ? 'noopener noreferrer' : undefined\"\n                class=\"flex gap-8 p-8 hover:bg-surface-1 transition-colors\">\n                <!-- Merchant images rot over time: a dead one degrades to an icon\n                     so the row keeps its thumbnail slot -->\n                <PkLazyImg\n                    v-if=\"product.image\"\n                    :src=\"product.image\"\n                    :alt=\"product.name\"\n                    fallback-icon=\"ri:image-off-line\"\n                    class=\"w-48 h-48 object-contain rounded shrink-0 border border-surface-3 bg-surface\" />\n                <div class=\"flex flex-col gap-4 min-w-0 flex-1\">\n                    <strong class=\"font-bold text-12 text-word-1 truncate\">\n                        {{ product.name }}\n                    </strong>\n                    <span\n                        v-if=\"product.url\"\n                        class=\"text-10 text-word-4 truncate flex items-center gap-4\">\n                        <VvIcon name=\"ri:link\" class=\"shrink-0 text-12\" />\n                        <PkUrl :url=\"product.url\" />\n                    </span>\n                    <div class=\"flex items-center gap-sm flex-wrap text-12\">\n                        <span\n                            v-if=\"product.price\"\n                            class=\"font-semibold text-word-1\">\n                            {{ product.price }}\n                        </span>\n                        <span\n                            v-if=\"product.availability\"\n                            class=\"text-10 font-medium\"\n                            :class=\"getAvailabilityColor(product.availability)\">\n                            {{ product.availability }}\n                        </span>\n                    </div>\n                    <p\n                        v-if=\"product.description\"\n                        class=\"text-12 text-word-3 line-clamp-2\">\n                        {{ product.description }}\n                    </p>\n                </div>\n            </component>\n        </li>\n    </ul>\n</template>\n","<script setup lang=\"ts\">\n    import { computed } from 'vue'\n    import PkLazyImg from '../PkLazyImg.vue'\n    import PkUrl from '../PkUrl.vue'\n\n    const props = defineProps<{\n        part: unknown\n    }>()\n\n    const toolPart = computed(() => {\n        const part = props.part as {\n            input?: {\n                products: Array<{\n                    name: string\n                    url?: string\n                    image?: string\n                    price?: string\n                    availability?: string\n                    description?: string\n                }>\n            }\n        }\n        return part\n    })\n\n    const getAvailabilityColor = (availability?: string) => {\n        if (!availability) {\n            return ''\n        }\n        const lower = availability.toLowerCase()\n        if (\n            lower.includes('in stock') ||\n            lower.includes('available') ||\n            lower.includes('disponibile')\n        ) {\n            return 'text-success'\n        }\n        if (\n            lower.includes('out of stock') ||\n            lower.includes('unavailable') ||\n            lower.includes('non disponibile')\n        ) {\n            return 'text-danger'\n        }\n        if (\n            lower.includes('limited') ||\n            lower.includes('low stock') ||\n            lower.includes('limitato')\n        ) {\n            return 'text-warning'\n        }\n        return 'text-word-3'\n    }\n</script>\n\n<template>\n    <ul\n        v-if=\"toolPart?.input?.products?.length\"\n        class=\"flex flex-col gap-xs w-full\">\n        <li\n            v-for=\"(product, index) in toolPart.input.products\"\n            :key=\"index\"\n            class=\"border border-surface-3 rounded-xl overflow-hidden hover:border-surface-4 transition-colors\">\n            <component\n                :is=\"product.url ? 'a' : 'div'\"\n                :href=\"product.url\"\n                :target=\"product.url ? '_blank' : undefined\"\n                :rel=\"product.url ? 'noopener noreferrer' : undefined\"\n                class=\"flex gap-8 p-8 hover:bg-surface-1 transition-colors\">\n                <!-- Merchant images rot over time: a dead one degrades to an icon\n                     so the row keeps its thumbnail slot -->\n                <PkLazyImg\n                    v-if=\"product.image\"\n                    :src=\"product.image\"\n                    :alt=\"product.name\"\n                    fallback-icon=\"ri:image-off-line\"\n                    class=\"w-48 h-48 object-contain rounded shrink-0 border border-surface-3 bg-surface\" />\n                <div class=\"flex flex-col gap-4 min-w-0 flex-1\">\n                    <strong class=\"font-bold text-12 text-word-1 truncate\">\n                        {{ product.name }}\n                    </strong>\n                    <span\n                        v-if=\"product.url\"\n                        class=\"text-10 text-word-4 truncate flex items-center gap-4\">\n                        <VvIcon name=\"ri:link\" class=\"shrink-0 text-12\" />\n                        <PkUrl :url=\"product.url\" />\n                    </span>\n                    <div class=\"flex items-center gap-sm flex-wrap text-12\">\n                        <span\n                            v-if=\"product.price\"\n                            class=\"font-semibold text-word-1\">\n                            {{ product.price }}\n                        </span>\n                        <span\n                            v-if=\"product.availability\"\n                            class=\"text-10 font-medium\"\n                            :class=\"getAvailabilityColor(product.availability)\">\n                            {{ product.availability }}\n                        </span>\n                    </div>\n                    <p\n                        v-if=\"product.description\"\n                        class=\"text-12 text-word-3 line-clamp-2\">\n                        {{ product.description }}\n                    </p>\n                </div>\n            </component>\n        </li>\n    </ul>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;EAKI,IAAM,IAAQ,GAIR,IAAW,QACA,EAAM,IAatB,GAEK,KAAwB,MAA0B;GACpD,IAAI,CAAC,GACD,OAAO;GAEX,IAAM,IAAQ,EAAa,YAAY;GAsBvC,OApBI,EAAM,SAAS,UAAU,KACzB,EAAM,SAAS,WAAW,KAC1B,EAAM,SAAS,aAAa,IAErB,iBAGP,EAAM,SAAS,cAAc,KAC7B,EAAM,SAAS,aAAa,KAC5B,EAAM,SAAS,iBAAiB,IAEzB,gBAGP,EAAM,SAAS,SAAS,KACxB,EAAM,SAAS,WAAW,KAC1B,EAAM,SAAS,UAAU,IAElB,iBAEJ;EACX;;;UAKU,EAAA,OAAU,OAAO,UAAU,UAAA,EAAA,GADrC,EAoDK,MApDL,GAoDK,EAAA,EAAA,EAAA,GAjDD,EAgDK,GAAA,MAAA,EA/C0B,EAAA,MAAS,MAAM,WAAlC,GAAS,YADrB,EAgDK,MAAA;IA9CA,KAAK;IACN,OAAM;aACN,EA2CY,EA1CH,EAAQ,MAAG,MAAA,KAAA,GAAA;IACf,MAAM,EAAQ;IACd,QAAQ,EAAQ,MAAG,WAAc,KAAA;IACjC,KAAK,EAAQ,MAAG,wBAA2B,KAAA;IAC5C,OAAM;;qBAQqF,CAJjF,EAAQ,SAAA,EAAA,GADlB,EAK2F,GAAA;;KAHtF,KAAK,EAAQ;KACb,KAAK,EAAQ;KACd,iBAAc;KACd,OAAM;8CACV,EA4BM,OA5BN,GA4BM;KA3BF,EAES,UAFT,GAES,EADF,EAAQ,IAAI,GAAA,CAAA;KAGT,EAAQ,OAAA,EAAA,GADlB,EAKO,QALP,GAKO,CAFH,EAAkD,GAAA;MAA1C,MAAK;MAAU,OAAM;SAC7B,EAA4B,GAAA,EAApB,KAAK,EAAQ,IAAA,GAAA,MAAA,GAAA,CAAA,KAAA,CAAA,CAAA,CAAA,KAAA,EAAA,IAAA,EAAA;KAEzB,EAYM,OAZN,GAYM,CAVQ,EAAQ,SAAA,EAAA,GADlB,EAIO,QAJP,GAIO,EADA,EAAQ,KAAK,GAAA,CAAA,KAAA,EAAA,IAAA,EAAA,GAGV,EAAQ,gBAAA,EAAA,GADlB,EAKO,QAAA;;MAHH,OAAK,EAAA,CAAC,uBACE,EAAqB,EAAQ,YAAY,CAAA,CAAA;UAC9C,EAAQ,YAAY,GAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,CAAA;KAIrB,EAAQ,eAAA,EAAA,GADlB,EAII,KAJJ,GAII,EADG,EAAQ,WAAW,GAAA,CAAA,KAAA,EAAA,IAAA,EAAA"}