@meistrari/chat-nuxt 1.0.0

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

@@ -0,0 +1,287 @@
+<script setup>
+import ChatReasoningSteps from "./reasoning-steps.vue";
+const props = defineProps({
+  reasoningData: { type: Array, required: true },
+  completed: { type: Boolean, required: true },
+  animate: { type: Boolean, required: false },
+  createdAt: { type: [Date, String], required: true },
+  updatedAt: { type: [Date, String, null], required: false }
+});
+const SUCCESS_ANIMATION_DURATION_MS = 1e3;
+const DOT_ANIMATION_INTERVAL_MS = 500;
+const AUTO_COLLAPSE_DELAY_MS = 1500;
+const TEXT_TRUNCATE_LENGTH = 40;
+const isExpanded = ref(false);
+const userHasExpanded = ref(false);
+const showingSuccess = ref(false);
+const wasEverPending = ref(!props.completed);
+const previewContainer = ref(null);
+const dotCount = ref(0);
+const elapsedTime = ref(0);
+let dotInterval;
+let timerInterval;
+const storageKey = computed(() => `reasoning-timer-${new Date(props.createdAt).getTime()}`);
+const { getDisplayName } = useToolFormatting();
+const showGradient = computed(() => !props.completed && !isExpanded.value);
+const groupedReasoning = computed(() => {
+  if (!props.reasoningData || !Array.isArray(props.reasoningData))
+    return [];
+  return props.reasoningData;
+});
+const hasReasoning = computed(() => groupedReasoning.value.length > 0);
+const lastStep = computed(() => {
+  const steps = groupedReasoning.value;
+  return steps.length > 0 ? steps[steps.length - 1] : null;
+});
+const currentStepName = computed(() => {
+  if (!hasReasoning.value)
+    return null;
+  const step = lastStep.value;
+  if (step && typeof step !== "string" && step.type === "tool_group") {
+    return getDisplayName(step.toolUse.name);
+  }
+  if (step && typeof step === "string") {
+    const truncated = step.length > TEXT_TRUNCATE_LENGTH ? `${step.slice(0, TEXT_TRUNCATE_LENGTH)}...` : step;
+    return truncated;
+  }
+  return "Trabalhando";
+});
+const thinkingDuration = computed(() => {
+  if (!props.updatedAt)
+    return null;
+  const start = new Date(props.createdAt).getTime();
+  const end = new Date(props.updatedAt).getTime();
+  return end - start;
+});
+const formattedDuration = computed(() => {
+  if (!thinkingDuration.value)
+    return null;
+  const seconds = Math.round(thinkingDuration.value / 1e3);
+  if (seconds < 60)
+    return `${seconds}s`;
+  const minutes = Math.floor(seconds / 60);
+  const remainingSeconds = seconds % 60;
+  if (remainingSeconds === 0)
+    return `${minutes}m`;
+  return `${minutes}m ${remainingSeconds}s`;
+});
+const liveFormattedDuration = computed(() => {
+  const seconds = Math.round(elapsedTime.value / 1e3);
+  return seconds > 0 ? `${seconds}s` : "";
+});
+const loadingText = computed(() => {
+  const dots = ".".repeat(dotCount.value);
+  return `${currentStepName.value}${dots}`;
+});
+function toggleExpanded() {
+  userHasExpanded.value = true;
+  isExpanded.value = !isExpanded.value;
+}
+function scheduleScroll() {
+  requestAnimationFrame(() => {
+    if (!previewContainer.value)
+      return;
+    previewContainer.value.scrollTop = previewContainer.value.scrollHeight;
+  });
+}
+watch(() => groupedReasoning.value.length, () => {
+  if (props.completed || isExpanded.value || !previewContainer.value) {
+    return;
+  }
+  scheduleScroll();
+});
+watch(() => props.completed, (newCompleted, oldCompleted) => {
+  if (!newCompleted) {
+    wasEverPending.value = true;
+  }
+  if (newCompleted && !oldCompleted && wasEverPending.value) {
+    showingSuccess.value = true;
+    setTimeout(() => {
+      showingSuccess.value = false;
+      if (!userHasExpanded.value) {
+        setTimeout(() => {
+          isExpanded.value = false;
+        }, AUTO_COLLAPSE_DELAY_MS);
+      }
+    }, SUCCESS_ANIMATION_DURATION_MS);
+  }
+});
+watch(isExpanded, (newExpanded, oldExpanded) => {
+  if (!newExpanded && oldExpanded) {
+    nextTick(() => {
+      scheduleScroll();
+    });
+  }
+});
+watch(() => props.completed, (isCompleted) => {
+  if (!isCompleted && !dotInterval) {
+    dotInterval = setInterval(() => {
+      dotCount.value = (dotCount.value + 1) % 4;
+    }, DOT_ANIMATION_INTERVAL_MS);
+  } else if (isCompleted && dotInterval) {
+    clearInterval(dotInterval);
+    dotInterval = void 0;
+  }
+}, { immediate: true });
+watch(() => props.completed, (isCompleted) => {
+  if (!isCompleted && !timerInterval) {
+    const startTime = new Date(props.createdAt).getTime();
+    if (typeof window !== "undefined") {
+      localStorage.setItem(storageKey.value, startTime.toString());
+    }
+    elapsedTime.value = Date.now() - startTime;
+    timerInterval = setInterval(() => {
+      elapsedTime.value = Date.now() - startTime;
+    }, 1e3);
+  } else if (isCompleted && timerInterval) {
+    clearInterval(timerInterval);
+    timerInterval = void 0;
+    if (typeof window !== "undefined") {
+      localStorage.removeItem(storageKey.value);
+    }
+  }
+}, { immediate: true });
+onMounted(() => {
+  if (!props.completed && typeof window !== "undefined") {
+    const storedStartTime = localStorage.getItem(storageKey.value);
+    if (storedStartTime) {
+      const startTime = Number.parseInt(storedStartTime, 10);
+      elapsedTime.value = Date.now() - startTime;
+    }
+  }
+  if (hasReasoning.value && !isExpanded.value) {
+    nextTick(() => {
+      scheduleScroll();
+    });
+  }
+});
+onUnmounted(() => {
+  if (dotInterval)
+    clearInterval(dotInterval);
+  if (timerInterval)
+    clearInterval(timerInterval);
+});
+</script>
+
+<template>
+    <div flex="~ col" w-full>
+        <!-- Sem reasoning ainda: ChatThinkingIndicator padrão -->
+        <ChatThinkingIndicator v-if="!completed && !hasReasoning" key="thinking" />
+
+        <!-- Com reasoning (loading ou completo): header clicável + steps colapsáveis -->
+        <div v-else-if="hasReasoning" key="reasoning">
+            <button
+                type="button"
+                class="group"
+                flex
+                items-center
+                gap-4px
+                px-16px
+                pt-16px
+                pb-8px
+                w-full
+                text-left
+                transition-colors
+                rounded-8px
+                cursor-pointer
+                :aria-expanded="isExpanded"
+                :aria-busy="!completed"
+                aria-label="Toggle reasoning steps"
+                @click="toggleExpanded"
+            >
+                <span
+                    v-if="completed && showingSuccess"
+                    key="success-text"
+                    class="text-16px static-gradient-text"
+                >
+                    Trabalho concluído
+                </span>
+                <div
+                    v-else-if="completed"
+                    key="completed-text"
+                    class="text-16px flex items-center gap-4px"
+                >
+                    <span class="text-secondary group-hover:text-gray-900 transition-colors">Trabalhou por</span>
+                    <span class="text-tertiary group-hover:text-gray-900 transition-colors">{{ formattedDuration || "alguns momentos" }}</span>
+                </div>
+                <div
+                    v-else
+                    key="loading-text"
+                    class="text-16px flex items-center gap-8px"
+                >
+                    <span
+                        :class="hasReasoning ? 'text-gray-700' : 'running-gradient-text'"
+                    >
+                        {{ hasReasoning ? currentStepName : loadingText }}
+                    </span>
+                    <span
+                        v-if="liveFormattedDuration"
+                        class="text-12px text-gray-500 timer-mono"
+                    >
+                        ({{ liveFormattedDuration }})
+                    </span>
+                </div>
+
+                <div
+                    i-ph-caret-right
+                    text-12px
+                    text-gray-500
+                    group-hover:text-gray-700
+                    transition-all
+                    duration-200
+                    :class="{ 'rotate-90': isExpanded }"
+                />
+            </button>
+
+            <!-- Preview mode: Always visible during loading, with gradient -->
+            <div
+                v-if="!completed && !isExpanded"
+                border="~ 0.5 default rounded-16px"
+                m-16px
+                cursor-pointer
+                @click="toggleExpanded"
+            >
+                <div
+                    ref="previewContainer"
+                    class="preview-container"
+                    :class="{ 'with-gradient': showGradient }"
+                >
+                    <ChatReasoningSteps
+                        :reasoning-data="reasoningData"
+                        :animate="animate && !completed"
+                        :completed="completed"
+                        :is-preview-mode="true"
+                    />
+                </div>
+            </div>
+
+            <!-- Expanded mode: Full content without gradient -->
+            <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-8px max-h-0"
+                enter-to-class="opacity-100 translate-y-0 max-h-[2000px]"
+                leave-from-class="opacity-100 translate-y-0 max-h-[2000px]"
+                leave-to-class="opacity-0 -translate-y-8px max-h-0"
+            >
+                <div
+                    v-if="isExpanded"
+                    overflow-hidden
+                    border="~ 0.5 default rounded-16px"
+                    mx-16px
+                    mb-16px
+                >
+                    <ChatReasoningSteps
+                        :reasoning-data="reasoningData"
+                        :animate="animate && !completed"
+                        :completed="completed"
+                    />
+                </div>
+            </Transition>
+        </div>
+    </div>
+</template>
+
+<style scoped>
+.running-gradient-text{background:linear-gradient(90deg,#9da2aa,#f4f5f7 50%,#9da2aa);background-clip:text;-webkit-background-clip:text;background-size:200% 100%;-webkit-text-fill-color:transparent;animation:gradientAnimation 1.5s linear infinite}.static-gradient-text{color:#9da2aa}.preview-container{max-height:153px;overflow-x:hidden;overflow-y:auto;position:relative;scrollbar-width:none;-ms-overflow-style:none}.preview-container.with-gradient{mask-image:linear-gradient(180deg,transparent 0,#000 60%,#000);-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 60%,#000)}.preview-container::-webkit-scrollbar{display:none}@keyframes gradientAnimation{0%{background-position:200% 50%}to{background-position:0 50%}}.loading-dot{animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.85)}}.success-check{animation:successFade .2s ease-out}@keyframes successFade{0%{opacity:0}to{opacity:1}}.timer-mono{font-family:ui-monospace,SFMono-Regular,SF Mono,Monaco,Cascadia Mono,Segoe UI Mono,Roboto Mono,Oxygen Mono,"Ubuntu Monospace",Source Code Pro,Fira Mono,Droid Sans Mono,Courier New,monospace;font-variant-numeric:tabular-nums}
+</style>

package/dist/runtime/components/chat/reasoning-thought.vue.d.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;

package/dist/runtime/components/chat/tela-skill-widget.d.vue.ts

@@ -0,0 +1,9 @@
+import type { ToolUse, ToolResult } from '../../types/reasoning.js';
+type __VLS_Props = {
+    toolUse: ToolUse;
+    toolResult?: ToolResult;
+    isActive?: 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/tela-skill-widget.vue

@@ -0,0 +1,94 @@
+<script setup>
+import { isCodeLike } from "../../utils/code-detection";
+const props = defineProps({
+  toolUse: { type: Object, required: true },
+  toolResult: { type: Object, required: false },
+  isActive: { type: Boolean, required: false }
+});
+const skillName = computed(() => {
+  const skill = props.toolUse.input?.skill;
+  return typeof skill === "string" ? skill : "Canvas";
+});
+const statusVariant = computed(() => {
+  if (props.toolResult) {
+    return props.toolResult.isError ? "error" : "completed";
+  }
+  return "executing";
+});
+const statusLabel = computed(() => {
+  if (props.toolResult) {
+    return props.toolResult.isError ? "Erro na execu\xE7\xE3o" : "Conclu\xEDdo";
+  }
+  return "Executando...";
+});
+const isLogsCode = computed(() => {
+  if (!props.toolResult?.output)
+    return false;
+  return isCodeLike(props.toolResult.output);
+});
+const hasArgs = computed(() => {
+  const args = props.toolUse.input?.args;
+  return args && typeof args === "string" && args.trim().length > 0;
+});
+const argsValue = computed(() => {
+  const args = props.toolUse.input?.args;
+  return typeof args === "string" ? args : "";
+});
+</script>
+
+<template>
+    <div class="bg-subtle rounded-16px border border-gray-200">
+        <!-- Header -->
+        <div class="px-24px py-24px flex items-center justify-between">
+            <h3 class="text-20px font-580 leading-24px tracking-[-0.5px] text-primary truncate">
+                {{ skillName }}
+            </h3>
+            <TelaStatus :variant="statusVariant" :label="statusLabel" />
+        </div>
+
+        <!-- Content -->
+        <div v-if="toolResult" class="px-24px pb-24px space-y-16px">
+            <!-- Arguments section -->
+            <div v-if="hasArgs">
+                <div class="text-14px font-580 leading-16px tracking-[-0.15px] text-gray-700 mb-2">
+                    Argumentos
+                </div>
+                <div class="bg-white rounded-xl border-0.5px border-gray-200 px-3 py-2">
+                    <p class="text-14px text-primary font-mono break-words m-0">
+                        {{ argsValue }}
+                    </p>
+                </div>
+            </div>
+
+            <!-- Logs section -->
+            <div>
+                <div class="text-14px font-580 leading-16px tracking-[-0.15px] text-gray-700 mb-2">
+                    Logs
+                </div>
+                <div
+                    v-if="isLogsCode"
+                    class="bg-[#1e1e1e] rounded-8px p-12px overflow-auto max-h-200px"
+                >
+                    <pre class="font-mono text-12px text-gray-300 whitespace-pre-wrap break-words m-0"><code>{{ toolResult.output }}</code></pre>
+                </div>
+                <div
+                    v-else-if="!toolResult.output || toolResult.output.trim().length === 0"
+                    class="bg-white rounded-xl border-0.5px border-gray-200 px-3 py-2"
+                >
+                    <p class="text-14px text-tertiary m-0">
+                        Nenhum log disponível
+                    </p>
+                </div>
+                <div
+                    v-else
+                    class="bg-white rounded-xl border-0.5px border-gray-200 px-3 py-2"
+                    :class="toolResult.isError ? 'text-red-600' : 'text-primary'"
+                >
+                    <p class="text-14px whitespace-pre-wrap break-words m-0">
+                        {{ toolResult.output }}
+                    </p>
+                </div>
+            </div>
+        </div>
+    </div>
+</template>

package/dist/runtime/components/chat/tela-skill-widget.vue.d.ts

@@ -0,0 +1,9 @@
+import type { ToolUse, ToolResult } from '../../types/reasoning.js';
+type __VLS_Props = {
+    toolUse: ToolUse;
+    toolResult?: ToolResult;
+    isActive?: 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/thinking-indicator.d.vue.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/chat/thinking-indicator.vue

@@ -0,0 +1,52 @@
+<script setup>
+const loadingTexts = [
+  "Analisando sua pergunta",
+  "Processando informa\xE7\xF5es",
+  "Consultando base de conhecimento",
+  "Organizando ideias",
+  "Elaborando resposta",
+  "Refinando detalhes",
+  "Verificando contexto",
+  "Conectando conceitos",
+  "Preparando resultado",
+  "Quase l\xE1",
+  "Finalizando an\xE1lise",
+  "Estruturando resposta"
+];
+const currentTextIndex = ref(0);
+const dotCount = ref(0);
+const currentText = computed(() => {
+  const base = loadingTexts[currentTextIndex.value];
+  const dots = ".".repeat(dotCount.value);
+  return `${base}${dots}`;
+});
+let dotInterval;
+let textInterval;
+onMounted(() => {
+  dotInterval = setInterval(() => {
+    dotCount.value = (dotCount.value + 1) % 4;
+  }, 500);
+  textInterval = setInterval(() => {
+    currentTextIndex.value = (currentTextIndex.value + 1) % loadingTexts.length;
+    dotCount.value = 0;
+  }, 7e3);
+});
+onUnmounted(() => {
+  if (dotInterval)
+    clearInterval(dotInterval);
+  if (textInterval)
+    clearInterval(textInterval);
+});
+</script>
+
+<template>
+    <div flex justify-start pl-16px py-16px>
+        <span class="running-gradient-text" body-16-regular>
+            {{ currentText }}
+        </span>
+    </div>
+</template>
+
+<style scoped>
+.running-gradient-text{background:linear-gradient(90deg,#9da2aa,#f4f5f7 50%,#9da2aa);background-clip:text;-webkit-background-clip:text;background-size:200% 100%;-webkit-text-fill-color:transparent;animation:gradientAnimation 1.5s linear infinite}@keyframes gradientAnimation{0%{background-position:200% 50%}to{background-position:0 50%}}
+</style>

package/dist/runtime/components/chat/thinking-indicator.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/chat/thinking-widget.d.vue.ts

@@ -0,0 +1,8 @@
+type __VLS_Props = {
+    content: string;
+    isActive?: 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/thinking-widget.vue

@@ -0,0 +1,53 @@
+<script setup>
+const props = defineProps({
+  content: { type: String, required: true },
+  isActive: { type: Boolean, required: false },
+  completed: { type: Boolean, required: false }
+});
+const statusVariant = computed(() => {
+  if (props.completed) {
+    return "completed";
+  }
+  return "processing";
+});
+const statusLabel = computed(() => {
+  if (props.completed) {
+    return "Conclu\xEDdo";
+  }
+  return "Executando...";
+});
+const title = computed(() => {
+  return "Pensando";
+});
+</script>
+
+<template>
+    <div class="bg-subtle rounded-16px border border-gray-200">
+        <!-- Header -->
+        <div class="px-24px py-24px flex items-center justify-between">
+            <h3 class="text-20px font-580 leading-24px tracking-[-0.5px] text-primary truncate">
+                {{ title }}
+            </h3>
+            <TelaStatus :variant="statusVariant" :label="statusLabel" />
+        </div>
+
+        <!-- Content -->
+        <div class="px-24px pb-24px">
+            <div class="bg-white rounded-xl border-0.5px border-gray-200 px-3 py-2">
+                <div class="reasoning-markdown text-14px text-primary">
+                    <ClientOnly>
+                        <AppMarkdownRender
+                            :content="content"
+                            :render-code-blocks-as-pre="true"
+                            :typewriter="false"
+                        />
+                    </ClientOnly>
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+
+<style scoped>
+.reasoning-markdown :deep(p){font-size:14px;margin-bottom:8px}.reasoning-markdown :deep(p:last-child){margin-bottom:0}.reasoning-markdown :deep(*){font-size:14px}
+</style>

package/dist/runtime/components/chat/thinking-widget.vue.d.ts

@@ -0,0 +1,8 @@
+type __VLS_Props = {
+    content: string;
+    isActive?: 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/topbar.d.vue.ts

@@ -0,0 +1,43 @@
+import type { TopbarTab } from '../../types/chat.js';
+type __VLS_Props = {
+    title: string;
+    creatorName?: string;
+    creatorEmail?: string;
+    creatorImage?: string;
+    updatedAt: string | Date;
+    isEditing: boolean;
+    editTitle: string;
+    generatingTitle?: boolean;
+    filesCount?: number;
+    activeTab?: TopbarTab;
+    showOutdatedBadge?: boolean;
+    showUsageTab?: boolean;
+    showDebugOption?: boolean;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    saveTitle: () => any;
+    cancelEditing: () => any;
+    "update:isEditing": (value: boolean) => any;
+    "update:editTitle": (value: string) => any;
+    rename: () => any;
+    duplicate: () => any;
+    export: () => any;
+    copyLink: () => any;
+    debug: () => any;
+    delete: () => any;
+    tabChange: (tab: TopbarTab) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onSaveTitle?: (() => any) | undefined;
+    onCancelEditing?: (() => any) | undefined;
+    "onUpdate:isEditing"?: ((value: boolean) => any) | undefined;
+    "onUpdate:editTitle"?: ((value: string) => any) | undefined;
+    onRename?: (() => any) | undefined;
+    onDuplicate?: (() => any) | undefined;
+    onExport?: (() => any) | undefined;
+    onCopyLink?: (() => any) | undefined;
+    onDebug?: (() => any) | undefined;
+    onDelete?: (() => any) | undefined;
+    onTabChange?: ((tab: TopbarTab) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;