@meistrari/chat-nuxt 1.0.0

package/dist/runtime/components/chat/reasoning-message.vue

@@ -0,0 +1,341 @@
+<script setup>
+import ChatReasoningStepItem from "./reasoning-step-item.vue";
+import ChatTelaSkillWidget from "./tela-skill-widget.vue";
+import ChatDocSdkWidget from "./doc-sdk-widget.vue";
+import ChatWebSearchWidget from "./web-search-widget.vue";
+import ChatWorkstationQueryWidget from "./workstation-query-widget.vue";
+import ChatBashWidget from "./bash-widget.vue";
+import ChatWriteWidget from "./write-widget.vue";
+import ChatReadWidget from "./read-widget.vue";
+import ChatGrepWidget from "./grep-widget.vue";
+import ChatGenericToolWidget from "./generic-tool-widget.vue";
+import ChatThinkingWidget from "./thinking-widget.vue";
+const props = defineProps({
+  step: { type: [String, Object], required: true },
+  stepNumber: { type: Number, required: true },
+  isFirst: { type: Boolean, required: false },
+  isLast: { type: Boolean, required: false },
+  isActive: { type: Boolean, required: false },
+  isPreviewMode: { type: Boolean, required: false },
+  completed: { type: Boolean, required: false }
+});
+const { conjugateText } = useVerbConjugation();
+const { settings: workspaceSettings } = useWorkspaceSettings();
+const canvasToolNames = computed(() => {
+  const names = /* @__PURE__ */ new Set();
+  if (workspaceSettings.value?.canvasTools) {
+    for (const t of workspaceSettings.value.canvasTools)
+      names.add(t.name);
+  }
+  return names;
+});
+const isTelaSkill = computed(() => {
+  if (typeof props.step === "string")
+    return false;
+  return props.step.toolUse.name === "Skill";
+});
+const isDocSdk = computed(() => {
+  if (typeof props.step === "string")
+    return false;
+  if (props.step.toolUse.name !== "Skill")
+    return false;
+  const skill = props.step.toolUse.input?.skill;
+  return typeof skill === "string" && skill.toLowerCase() === "doc-sdk";
+});
+const isWorkstationQuery = computed(() => {
+  if (typeof props.step === "string")
+    return false;
+  if (props.step.toolUse.name !== "Skill")
+    return false;
+  const skill = props.step.toolUse.input?.skill;
+  return typeof skill === "string" && skill.toLowerCase() === "workstation-query";
+});
+const isWebSearch = computed(() => {
+  if (typeof props.step === "string")
+    return false;
+  return props.step.toolUse.name === "WebSearch";
+});
+const isBash = computed(() => {
+  if (typeof props.step === "string")
+    return false;
+  return props.step.toolUse.name === "Bash";
+});
+const isBashWorkstationQuery = computed(() => {
+  if (typeof props.step === "string")
+    return false;
+  if (props.step.toolUse.name !== "Bash")
+    return false;
+  const command = props.step.toolUse.input?.command;
+  return typeof command === "string" && command.includes("workstation-query");
+});
+const isWrite = computed(() => {
+  if (typeof props.step === "string")
+    return false;
+  return props.step.toolUse.name === "Write";
+});
+const isRead = computed(() => {
+  if (typeof props.step === "string")
+    return false;
+  return props.step.toolUse.name === "Read";
+});
+const isGrep = computed(() => {
+  if (typeof props.step === "string")
+    return false;
+  return props.step.toolUse.name === "Grep";
+});
+const searchQuery = computed(() => {
+  if (typeof props.step === "string")
+    return "";
+  const query = props.step.toolUse.input?.query;
+  return typeof query === "string" ? query : "";
+});
+const stepWasExecuted = computed(() => {
+  if (typeof props.step === "string") {
+    return !props.isActive;
+  }
+  return props.step.toolResult !== void 0 && !props.isActive;
+});
+const stepIcon = computed(() => {
+  if (typeof props.step === "string") {
+    return "i-ph-brain";
+  }
+  const name = props.step.toolUse.name.toLowerCase();
+  if (name === "websearch") {
+    return "i-ph-globe";
+  }
+  if (name === "skill") {
+    if (isDocSdk.value)
+      return "i-ph-file-text";
+    if (isWorkstationQuery.value)
+      return "i-ph-database";
+    return "i-ph-puzzle-piece";
+  }
+  if (name.includes("search") || name.includes("grep") || name.includes("find")) {
+    return "i-ph-magnifying-glass";
+  }
+  if (name === "write") {
+    return "i-ph-file-plus";
+  }
+  if (name === "read") {
+    return "i-ph-file-magnifying-glass";
+  }
+  if (name.includes("file") || name.includes("dir")) {
+    return "i-ph-file-code";
+  }
+  if (name === "bash" || name.includes("terminal") || name.includes("cmd")) {
+    if (isBashWorkstationQuery.value)
+      return "i-ph-database";
+    return "i-ph-terminal-window";
+  }
+  if (name.includes("browser")) {
+    return "i-ph-browser";
+  }
+  if (name.includes("figma")) {
+    return "i-ph-figma-logo";
+  }
+  if (name.includes("todo")) {
+    return "i-ph-list-checks";
+  }
+  return "i-ph-wrench";
+});
+const telaSkillName = computed(() => {
+  if (typeof props.step === "string")
+    return "";
+  const skill = props.step.toolUse.input?.skill;
+  return typeof skill === "string" ? skill : "Canvas";
+});
+const stepTitle = computed(() => {
+  if (typeof props.step === "string") {
+    if (stepWasExecuted.value) {
+      return "Pensou";
+    }
+    return "Pensando...";
+  }
+  const name = props.step.toolUse.name;
+  let title = "";
+  if (name === "WebSearch") {
+    const query = searchQuery.value;
+    const verb = stepWasExecuted.value ? "Buscou" : "Buscando";
+    title = query.length > 40 ? `${verb}: ${query.slice(0, 40)}...` : `${verb}: ${query}`;
+  } else if (name === "Skill") {
+    const verb = stepWasExecuted.value ? "Executou" : "Executando";
+    if (isDocSdk.value) {
+      title = stepWasExecuted.value ? "Processou documento" : "Processando documento";
+    } else if (isWorkstationQuery.value) {
+      title = stepWasExecuted.value ? "Consultou dados do workstation" : "Consultando dados do workstation";
+    } else {
+      const skillLabel = canvasToolNames.value.has(telaSkillName.value) ? "canvas" : "skill";
+      title = `${verb} ${skillLabel}: ${telaSkillName.value}`;
+    }
+  } else if (name === "Bash") {
+    if (isBashWorkstationQuery.value) {
+      return "Consultando dados do workstation";
+    }
+    const desc = props.step.toolUse.input?.description;
+    if (typeof desc === "string" && desc.length > 0) {
+      const truncatedDesc = desc.length > 50 ? `${desc.slice(0, 50)}...` : desc;
+      title = conjugateText(truncatedDesc, stepWasExecuted.value);
+    } else {
+      const verb = stepWasExecuted.value ? "Executou" : "Executando";
+      title = `${verb} comando no terminal`;
+    }
+  } else if (name === "Write") {
+    const filePath = props.step.toolUse.input?.file_path;
+    const verb = stepWasExecuted.value ? "Criou" : "Criando";
+    if (typeof filePath === "string") {
+      const fileName = filePath.split("/").pop() || "arquivo";
+      title = `${verb}: ${fileName.length > 40 ? `${fileName.slice(0, 40)}...` : fileName}`;
+    } else {
+      title = `${verb} arquivo`;
+    }
+  } else if (name === "Read") {
+    const filePath = props.step.toolUse.input?.file_path;
+    const verb = stepWasExecuted.value ? "Leu" : "Lendo";
+    if (typeof filePath === "string") {
+      const fileName = filePath.split("/").pop() || "arquivo";
+      title = `${verb}: ${fileName.length > 40 ? `${fileName.slice(0, 40)}...` : fileName}`;
+    } else {
+      title = `${verb} arquivo`;
+    }
+  } else if (name === "Grep") {
+    const pattern = props.step.toolUse.input?.pattern;
+    const verb = stepWasExecuted.value ? "Buscou" : "Buscando";
+    if (typeof pattern === "string") {
+      title = `${verb}: ${pattern.length > 35 ? `${pattern.slice(0, 35)}...` : pattern}`;
+    } else {
+      title = `${verb} no c\xF3digo`;
+    }
+  } else {
+    const verb = stepWasExecuted.value ? "Executou" : "Executando";
+    title = `${verb} ferramenta: ${name}`;
+  }
+  return title;
+});
+const isTitleSameAsContent = computed(() => {
+  if (typeof props.step !== "string") {
+    return false;
+  }
+  const content = props.step.trim();
+  const title = stepTitle.value;
+  const titleWithoutEllipsis = title.replace("...", "");
+  return content === title || content === titleWithoutEllipsis;
+});
+</script>
+
+<template>
+    <ChatReasoningStepItem
+        :title="stepTitle"
+        :icon="stepIcon"
+        :is-first="isFirst"
+        :is-last="isLast"
+        :default-expanded="isActive && !isPreviewMode"
+        :has-result="typeof step !== 'string' && !!step.toolResult"
+        :is-error="typeof step !== 'string' && !!step.toolResult?.isError"
+        :is-text-step="typeof step === 'string'"
+        :hide-expand="isTitleSameAsContent"
+        :is-active="isActive"
+        :completed="completed"
+    >
+        <div class="reasoning-content-wrapper">
+            <!-- Thinking/Text Widget -->
+            <div v-if="typeof step === 'string'">
+                <ChatThinkingWidget
+                    :content="step"
+                    :is-active="isActive"
+                    :completed="completed"
+                />
+            </div>
+
+            <!-- Web Search Widget -->
+            <div v-else-if="step.type === 'tool_group' && isWebSearch">
+                <ChatWebSearchWidget
+                    :tool-use="step.toolUse"
+                    :tool-result="step.toolResult"
+                    :is-active="isActive"
+                />
+            </div>
+
+            <!-- Doc SDK Widget -->
+            <div v-else-if="step.type === 'tool_group' && isDocSdk">
+                <ChatDocSdkWidget
+                    :tool-use="step.toolUse"
+                    :tool-result="step.toolResult"
+                    :is-active="isActive"
+                />
+            </div>
+
+            <!-- Workstation Query Widget -->
+            <div v-else-if="step.type === 'tool_group' && isWorkstationQuery">
+                <ChatWorkstationQueryWidget
+                    :tool-use="step.toolUse"
+                    :tool-result="step.toolResult"
+                    :is-active="isActive"
+                />
+            </div>
+
+            <!-- Special Tela Skill Widget -->
+            <div v-else-if="step.type === 'tool_group' && isTelaSkill">
+                <ChatTelaSkillWidget
+                    :tool-use="step.toolUse"
+                    :tool-result="step.toolResult"
+                    :is-active="isActive"
+                />
+            </div>
+
+            <!-- Bash Workstation Query Widget -->
+            <div v-else-if="step.type === 'tool_group' && isBashWorkstationQuery">
+                <ChatWorkstationQueryWidget
+                    :tool-use="step.toolUse"
+                    :tool-result="step.toolResult"
+                    :is-active="isActive"
+                    :is-bash-execution="true"
+                />
+            </div>
+
+            <!-- Bash/Terminal Widget -->
+            <div v-else-if="step.type === 'tool_group' && isBash">
+                <ChatBashWidget
+                    :tool-use="step.toolUse"
+                    :tool-result="step.toolResult"
+                    :is-active="isActive"
+                />
+            </div>
+
+            <!-- Write/File Widget -->
+            <div v-else-if="step.type === 'tool_group' && isWrite">
+                <ChatWriteWidget
+                    :tool-use="step.toolUse"
+                    :tool-result="step.toolResult"
+                    :is-active="isActive"
+                />
+            </div>
+
+            <!-- Read/File Widget -->
+            <div v-else-if="step.type === 'tool_group' && isRead">
+                <ChatReadWidget
+                    :tool-use="step.toolUse"
+                    :tool-result="step.toolResult"
+                    :is-active="isActive"
+                />
+            </div>
+
+            <!-- Grep/Search Widget -->
+            <div v-else-if="step.type === 'tool_group' && isGrep">
+                <ChatGrepWidget
+                    :tool-use="step.toolUse"
+                    :tool-result="step.toolResult"
+                    :is-active="isActive"
+                />
+            </div>
+
+            <!-- Generic tool display -->
+            <div v-else-if="step.type === 'tool_group'">
+                <ChatGenericToolWidget
+                    :tool-use="step.toolUse"
+                    :tool-result="step.toolResult"
+                    :is-active="isActive"
+                />
+            </div>
+        </div>
+    </ChatReasoningStepItem>
+</template>

package/dist/runtime/components/chat/reasoning-message.vue.d.ts

@@ -0,0 +1,13 @@
+import type { ReasoningStep } from '../../types/reasoning.js';
+type __VLS_Props = {
+    step: ReasoningStep;
+    stepNumber: number;
+    isFirst?: boolean;
+    isLast?: boolean;
+    isActive?: boolean;
+    isPreviewMode?: boolean;
+    completed?: boolean;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/chat/reasoning-step-item.d.vue.ts

@@ -0,0 +1,37 @@
+interface Props {
+    title: string;
+    icon?: string;
+    isLast?: boolean;
+    isFirst?: boolean;
+    defaultExpanded?: boolean;
+    hasResult?: boolean;
+    isError?: boolean;
+    isTextStep?: boolean;
+    hideExpand?: boolean;
+    isActive?: boolean;
+    completed?: boolean;
+}
+declare var __VLS_7: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_7) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {
+    completed: boolean;
+    icon: string;
+    isActive: boolean;
+    isError: boolean;
+    isLast: boolean;
+    isFirst: boolean;
+    defaultExpanded: boolean;
+    hasResult: boolean;
+    isTextStep: boolean;
+    hideExpand: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/chat/reasoning-step-item.vue

@@ -0,0 +1,125 @@
+<script setup>
+const props = defineProps({
+  title: { type: String, required: true },
+  icon: { type: String, required: false, default: "i-ph-info" },
+  isLast: { type: Boolean, required: false, default: false },
+  isFirst: { type: Boolean, required: false, default: false },
+  defaultExpanded: { type: Boolean, required: false, default: false },
+  hasResult: { type: Boolean, required: false, default: false },
+  isError: { type: Boolean, required: false, default: false },
+  isTextStep: { type: Boolean, required: false, default: false },
+  hideExpand: { type: Boolean, required: false, default: false },
+  isActive: { type: Boolean, required: false, default: false },
+  completed: { type: Boolean, required: false, default: false }
+});
+const isWaitingForNext = computed(() => {
+  return props.isLast && props.hasResult && !props.completed;
+});
+const isExpanded = ref(props.defaultExpanded);
+watch(() => props.defaultExpanded, (newVal) => {
+  isExpanded.value = newVal;
+});
+function toggle() {
+  isExpanded.value = !isExpanded.value;
+}
+</script>
+
+<template>
+    <div class="relative flex gap-12px group/step">
+        <!-- Status Icon -->
+        <div class="flex flex-col items-center flex-shrink-0" :class="{ 'pb-8px': !isLast || !completed }">
+            <div class="z-10 flex items-center justify-center w-24px h-24px group-hover/step:text-gray-700 transition-colors">
+                <!-- COMPLETED STATE: Show specific type icons -->
+                <template v-if="completed">
+                    <!-- Show error icon if there's an error -->
+                    <div
+                        v-if="isError"
+                        class="text-14px text-tertiary i-ph-x-circle"
+                    />
+                    <!-- Show specific icon for the step type -->
+                    <div
+                        v-else
+                        class="text-14px text-tertiary"
+                        :class="icon"
+                    />
+                </template>
+
+                <!-- EXECUTING STATE: Show loading/check icons -->
+                <template v-else>
+                    <!-- Active step: loading spinner -->
+                    <div
+                        v-if="isActive || isWaitingForNext"
+                        class="text-14px text-tertiary animate-spin i-ph-circle-notch"
+                    />
+                    <!-- Tool without result yet: loading spinner -->
+                    <div
+                        v-else-if="!isTextStep && !hasResult"
+                        class="text-14px text-tertiary animate-spin i-ph-circle-notch"
+                    />
+                    <!-- Text step completed: check icon -->
+                    <div
+                        v-else-if="isTextStep"
+                        class="text-14px text-tertiary i-ph-check-circle"
+                    />
+                    <!-- Tool completed with error: x icon -->
+                    <div
+                        v-else-if="isError"
+                        class="text-14px text-tertiary i-ph-x-circle"
+                    />
+                    <!-- Tool completed successfully: check icon -->
+                    <div
+                        v-else
+                        class="text-14px text-tertiary i-ph-check-circle"
+                    />
+                </template>
+            </div>
+        </div>
+
+        <!-- Content Area -->
+        <div class="flex-1 min-w-0" :class="{ 'pb-8px': !isLast || !completed }">
+            <!-- Non-expandable title (when content is same as title) -->
+            <div v-if="hideExpand" class="h-24px flex items-center">
+                <span class="text-14px font-medium text-tertiary leading-18px">
+                    {{ title }}
+                </span>
+            </div>
+
+            <!-- Expandable title (default) -->
+            <template v-else>
+                <!-- Trigger (Header) -->
+                <button
+                    type="button"
+                    class="h-24px flex items-center gap-4px w-full text-left focus:outline-none group/title"
+                    @click="toggle"
+                >
+                    <span class="text-14px font-medium text-tertiary group-hover/title:text-gray-700 transition-colors truncate leading-18px">
+                        {{ title }}
+                    </span>
+                    <div
+                        i-ph-caret-right
+                        class="text-12px text-tertiary group-hover/title:text-gray-700 transition-all duration-200 flex-shrink-0"
+                        :class="{ 'rotate-90': isExpanded }"
+                    />
+                </button>
+
+                <!-- Content (Body) -->
+                <Transition
+                    enter-active-class="transition-all duration-300 ease-out"
+                    leave-active-class="transition-all duration-200 ease-in"
+                    enter-from-class="opacity-0 -translate-y-4px"
+                    leave-to-class="opacity-0 -translate-y-4px"
+                >
+                    <div v-if="isExpanded" class="mt-8px overflow-hidden">
+                        <div class="text-14px text-tertiary leading-relaxed">
+                            <slot />
+                        </div>
+                    </div>
+                </Transition>
+            </template>
+        </div>
+    </div>
+</template>
+
+<style scoped>
+.v-enter-active,.v-leave-active{transition:opacity .3s ease,transform .3s ease}.v-enter-from,.v-leave-to{opacity:0;transform:translateY(-4px)}
+</style>

package/dist/runtime/components/chat/reasoning-step-item.vue.d.ts

@@ -0,0 +1,37 @@
+interface Props {
+    title: string;
+    icon?: string;
+    isLast?: boolean;
+    isFirst?: boolean;
+    defaultExpanded?: boolean;
+    hasResult?: boolean;
+    isError?: boolean;
+    isTextStep?: boolean;
+    hideExpand?: boolean;
+    isActive?: boolean;
+    completed?: boolean;
+}
+declare var __VLS_7: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_7) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {
+    completed: boolean;
+    icon: string;
+    isActive: boolean;
+    isError: boolean;
+    isLast: boolean;
+    isFirst: boolean;
+    defaultExpanded: boolean;
+    hasResult: boolean;
+    isTextStep: boolean;
+    hideExpand: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/chat/reasoning-steps.d.vue.ts

@@ -0,0 +1,12 @@
+import type { ReasoningStep } from '../../types/reasoning.js';
+type __VLS_Props = {
+    reasoningData: ReasoningStep[];
+    animate?: boolean;
+    completed?: boolean;
+    isPreviewMode?: boolean;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {
+    sentinelRef: any;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/chat/reasoning-steps.vue

@@ -0,0 +1,47 @@
+<script setup>
+import ChatReasoningMessage from "./reasoning-message.vue";
+const props = defineProps({
+  reasoningData: { type: Array, required: true },
+  animate: { type: Boolean, required: false },
+  completed: { type: Boolean, required: false },
+  isPreviewMode: { type: Boolean, required: false }
+});
+const groupedReasoning = computed(() => {
+  if (!props.reasoningData || !Array.isArray(props.reasoningData))
+    return [];
+  return props.reasoningData;
+});
+const sentinelRef = ref(null);
+function getStepKey(step, index) {
+  if (typeof step === "string") {
+    return `text-${index}-${step.slice(0, 50)}`;
+  }
+  return `tool-${step.toolUse.id}`;
+}
+defineExpose({
+  sentinelRef
+});
+</script>
+
+<template>
+    <div v-if="groupedReasoning.length > 0" flex="~ col" w-full p-16px>
+        <ChatReasoningMessage
+            v-for="(step, index) in groupedReasoning"
+            :key="getStepKey(step, index)"
+            :class="animate ? 'step-fade-in' : ''"
+            :step="step"
+            :step-number="index + 1"
+            :is-first="index === 0"
+            :is-last="index === groupedReasoning.length - 1"
+            :is-active="!completed && index === groupedReasoning.length - 1"
+            :is-preview-mode="isPreviewMode"
+            :completed="completed"
+        />
+        <!-- Sentinel div for scroll tracking -->
+        <div ref="sentinelRef" class="scroll-sentinel" />
+    </div>
+</template>
+
+<style scoped>
+.step-fade-in{animation:fadeIn .6s ease-in-out both}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.scroll-sentinel{height:0;pointer-events:none;width:0}
+</style>

package/dist/runtime/components/chat/reasoning-steps.vue.d.ts

@@ -0,0 +1,12 @@
+import type { ReasoningStep } from '../../types/reasoning.js';
+type __VLS_Props = {
+    reasoningData: ReasoningStep[];
+    animate?: boolean;
+    completed?: boolean;
+    isPreviewMode?: boolean;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {
+    sentinelRef: any;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/chat/reasoning-thought.d.vue.ts

@@ -0,0 +1,11 @@
+import type { ReasoningStep } from '../../types/reasoning.js';
+type __VLS_Props = {
+    reasoningData: ReasoningStep[];
+    completed: boolean;
+    animate?: boolean;
+    createdAt: Date | string;
+    updatedAt?: Date | string | null;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;