@oro.ad/nuxt-claude-devtools 1.3.0 → 1.5.0

package/dist/runtime/overlay/components/ChatOverlay.vue.d.ts

@@ -1,5 +1,4 @@
 type __VLS_Props = {
-    /** Custom socket URL (for tunnel) */
     socketUrl?: string;
 };
 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>;

package/dist/runtime/overlay/components/MarkdownContent.vue

@@ -27,5 +27,5 @@ const renderedContent = computed(() => {
 </template>
 
 <style>
-.markdown-content{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:14px;line-height:1.625;word-break:break-word}.markdown-content h1{font-size:1.25rem;font-weight:700;margin-bottom:.5rem;margin-top:1rem}.markdown-content h2{font-size:1.125rem;font-weight:700;margin-bottom:.5rem;margin-top:.75rem}.markdown-content h3{font-size:1rem;font-weight:600;margin-bottom:.25rem;margin-top:.5rem}.markdown-content p{margin:.5rem 0}.markdown-content ol,.markdown-content ul{margin:.5rem 0 .5rem 1rem}.markdown-content ul{list-style-type:disc}.markdown-content ol{list-style-type:decimal}.markdown-content li{margin:.25rem 0}.markdown-content code{background:hsla(0,0%,100%,.1);border-radius:4px;font-family:SF Mono,Monaco,Cascadia Code,Consolas,monospace;font-size:.75rem;padding:.125rem .375rem}.markdown-content pre{background:rgba(0,0,0,.3);border-radius:8px;margin:.5rem 0;overflow-x:auto;padding:.75rem}.markdown-content pre code{background:transparent;font-size:.8rem;line-height:1.5;padding:0}.markdown-content blockquote{border-left:4px solid hsla(0,0%,100%,.2);color:var(--claude-text-muted,#a0a0a0);font-style:italic;margin:.5rem 0;padding-left:1rem}.markdown-content a{color:#3b82f6;text-decoration:none}.markdown-content a:hover{text-decoration:underline}.markdown-content table{border-collapse:collapse;font-size:.875rem;margin:.5rem 0;width:100%}.markdown-content td,.markdown-content th{border:1px solid hsla(0,0%,100%,.15);padding:.5rem .75rem;text-align:left}.markdown-content th{background:hsla(0,0%,100%,.05);font-weight:600}.markdown-content tr:nth-child(2n){background:hsla(0,0%,100%,.02)}.markdown-content hr{border:none;border-top:1px solid hsla(0,0%,100%,.15);margin:1rem 0}.markdown-content img{border-radius:8px;height:auto;max-width:100%}.markdown-content>:first-child{margin-top:0}.markdown-content>:last-child{margin-bottom:0}
+.markdown-content{color:hsla(0,0%,100%,.92);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:14px;line-height:1.7;word-break:break-word}.markdown-content h1{background:linear-gradient(135deg,#fff,hsla(0,0%,100%,.75));-webkit-background-clip:text;background-clip:text;font-size:1.35rem;margin-bottom:.625rem;margin-top:1.25rem}.markdown-content h1,.markdown-content h2{font-weight:700;-webkit-text-fill-color:transparent}.markdown-content h2{background:linear-gradient(135deg,#fff,hsla(0,0%,100%,.8));-webkit-background-clip:text;background-clip:text;font-size:1.2rem;margin-bottom:.5rem;margin-top:1rem}.markdown-content h3{color:hsla(0,0%,100%,.95);font-size:1.05rem;font-weight:600;margin-bottom:.375rem;margin-top:.75rem}.markdown-content p{margin:.625rem 0}.markdown-content ol,.markdown-content ul{margin:.625rem 0 .625rem 1.25rem}.markdown-content ul{list-style-type:disc}.markdown-content ol{list-style-type:decimal}.markdown-content li{color:hsla(0,0%,100%,.88);margin:.375rem 0}.markdown-content li::marker{color:rgba(254,154,0,.7)}.markdown-content code{background:rgba(254,154,0,.12);border:1px solid rgba(254,154,0,.2);border-radius:6px;color:#fcd34d;font-family:JetBrains Mono,Fira Code,SF Mono,Monaco,monospace;font-size:.8rem;padding:.15rem .45rem}.markdown-content pre{backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);background:rgba(0,0,0,.35);border:1px solid hsla(0,0%,100%,.08);border-radius:12px;box-shadow:inset 0 1px 0 hsla(0,0%,100%,.05);margin:.75rem 0;overflow-x:auto;padding:1rem 1.125rem}.markdown-content pre code{background:transparent;border:none;color:#e2e8f0;font-size:.825rem;line-height:1.6;padding:0}.markdown-content blockquote{background:rgba(254,154,0,.08);border-left:3px solid rgba(254,154,0,.5);border-radius:0 10px 10px 0;color:hsla(0,0%,100%,.7);font-style:italic;margin:.75rem 0;padding:.75rem 1rem .75rem 1.25rem}.markdown-content blockquote p{margin:0}.markdown-content a{border-bottom:1px solid transparent;color:#fbbf24;text-decoration:none;transition:all .2s ease}.markdown-content a:hover{border-bottom-color:rgba(254,154,0,.5);color:#fcd34d;text-shadow:0 0 12px rgba(254,154,0,.4)}.markdown-content table{border:1px solid hsla(0,0%,100%,.1);border-collapse:separate;border-radius:10px;border-spacing:0;font-size:.875rem;margin:.75rem 0;overflow:hidden;width:100%}.markdown-content td,.markdown-content th{border:none;border-bottom:1px solid hsla(0,0%,100%,.08);padding:.625rem .875rem;text-align:left}.markdown-content th{background:rgba(254,154,0,.15);color:hsla(0,0%,100%,.95);font-size:.8rem;font-weight:600;letter-spacing:.03em;text-transform:uppercase}.markdown-content tr:last-child td{border-bottom:none}.markdown-content tr:nth-child(2n){background:hsla(0,0%,100%,.03)}.markdown-content tr:hover{background:rgba(254,154,0,.08)}.markdown-content hr{background:linear-gradient(90deg,transparent,rgba(254,154,0,.4) 20%,rgba(59,130,246,.4) 80%,transparent);border:none;height:1px;margin:1.25rem 0}.markdown-content img{border:1px solid hsla(0,0%,100%,.1);border-radius:12px;box-shadow:0 8px 25px rgba(0,0,0,.3);height:auto;max-width:100%}.markdown-content strong{color:hsla(0,0%,100%,.98);font-weight:600}.markdown-content em{color:hsla(0,0%,100%,.85)}.markdown-content>:first-child{margin-top:0}.markdown-content>:last-child{margin-bottom:0}
 </style>

package/dist/runtime/overlay/components/ToolCallBlock.vue

@@ -73,5 +73,5 @@ const resultPreview = computed(() => {
 </template>
 
 <style>
-.claude-tool-block{background:rgba(0,0,0,.2);border-radius:6px;margin:8px 0;overflow:hidden}.claude-tool-header{align-items:center;background:transparent;border:none;color:var(--claude-text);cursor:pointer;display:flex;font-size:13px;gap:8px;padding:8px 12px;text-align:left;transition:background .15s;width:100%}.claude-tool-header:hover{background:hsla(0,0%,100%,.05)}.claude-tool-icon{font-size:12px}.claude-tool-name{color:var(--claude-primary);flex:1;font-family:monospace}.claude-tool-expand{color:var(--claude-text-muted);font-size:10px}.claude-tool-details{padding:0 12px 12px}.claude-tool-section{margin-top:8px}.claude-tool-section-title{align-items:center;color:var(--claude-text-muted);display:flex;font-size:11px;gap:8px;margin-bottom:4px}.claude-tool-error-badge{background:#ef4444;border-radius:4px;color:#fff;font-size:10px;padding:1px 6px}.claude-tool-code{background:#0d0d0d;border-radius:4px;font-family:SF Mono,Monaco,monospace;font-size:11px;margin:0;max-height:200px;overflow-x:auto;overflow-y:auto;padding:8px;white-space:pre-wrap;word-break:break-all}
+.claude-tool-block{backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);background:rgba(0,0,0,.25);border:1px solid hsla(0,0%,100%,.08);border-radius:10px;margin:10px 0;overflow:hidden;transition:all .2s ease}.claude-tool-block:hover{border-color:rgba(254,154,0,.2);box-shadow:0 4px 15px rgba(0,0,0,.2)}.claude-tool-header{align-items:center;background:transparent;border:none;color:hsla(0,0%,100%,.9);cursor:pointer;display:flex;font-size:13px;gap:10px;padding:10px 14px;text-align:left;transition:all .15s ease;width:100%}.claude-tool-header:hover{background:rgba(254,154,0,.1)}.claude-tool-icon{filter:drop-shadow(0 0 6px currentColor);font-size:13px}.claude-tool-name{color:#fbbf24;flex:1;font-family:JetBrains Mono,Fira Code,monospace;font-size:12px;text-shadow:0 0 15px rgba(254,154,0,.4)}.claude-tool-expand{color:hsla(0,0%,100%,.4);font-size:10px;transition:transform .2s ease}.claude-tool-header:hover .claude-tool-expand{color:hsla(0,0%,100%,.6)}.claude-tool-details{animation:tool-details-in .2s ease-out;padding:0 14px 14px}@keyframes tool-details-in{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}.claude-tool-section{margin-top:12px}.claude-tool-section-title{align-items:center;color:hsla(0,0%,100%,.5);display:flex;font-size:11px;font-weight:500;gap:8px;letter-spacing:.04em;margin-bottom:6px;text-transform:uppercase}.claude-tool-error-badge{background:linear-gradient(135deg,#ef4444,#dc2626);border-radius:6px;box-shadow:0 2px 8px rgba(239,68,68,.3);color:#fff;font-size:10px;font-weight:500;letter-spacing:.02em;padding:2px 8px;text-transform:uppercase}.claude-tool-code{background:rgba(0,0,0,.4);border:1px solid hsla(0,0%,100%,.06);border-radius:8px;color:hsla(0,0%,100%,.8);font-family:JetBrains Mono,Fira Code,SF Mono,Monaco,monospace;font-size:11px;line-height:1.5;margin:0;max-height:200px;overflow-x:auto;overflow-y:auto;padding:10px 12px;white-space:pre-wrap;word-break:break-all}.claude-tool-code::-webkit-scrollbar{height:4px;width:4px}.claude-tool-code::-webkit-scrollbar-track{background:transparent}.claude-tool-code::-webkit-scrollbar-thumb{background:hsla(0,0%,100%,.15);border-radius:2px}.claude-tool-code::-webkit-scrollbar-thumb:hover{background:hsla(0,0%,100%,.25)}
 </style>

package/dist/runtime/overlay/components/chat/ChatHeader.d.vue.ts

@@ -0,0 +1,18 @@
+type __VLS_Props = {
+    statusColor: 'green' | 'blue' | 'red';
+    showShareCopied: boolean;
+    isMobile: boolean;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    newChat: () => any;
+    share: () => any;
+    history: () => any;
+    dragStart: (e: MouseEvent) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onNewChat?: (() => any) | undefined;
+    onShare?: (() => any) | undefined;
+    onHistory?: (() => any) | undefined;
+    onDragStart?: ((e: MouseEvent) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/overlay/components/chat/ChatHeader.vue

@@ -0,0 +1,82 @@
+<script setup>
+defineProps({
+  statusColor: { type: String, required: true },
+  showShareCopied: { type: Boolean, required: true },
+  isMobile: { type: Boolean, required: true }
+});
+const emit = defineEmits(["share", "history", "newChat", "dragStart"]);
+</script>
+
+<template>
+  <div class="claude-header">
+    <div
+      :class="['claude-header-left', { 'claude-header-draggable': !isMobile }]"
+      @mousedown="(e) => !isMobile && emit('dragStart', e)"
+    >
+      <span class="claude-header-title">Claude</span>
+      <span :class="['claude-status-dot', `claude-status-dot-${statusColor}`]" />
+    </div>
+    <div class="claude-header-actions">
+      <!-- Share button -->
+      <button
+        :class="{ 'claude-btn-success': showShareCopied }"
+        :title="showShareCopied ? 'Link copied!' : 'Share chat'"
+        class="claude-btn-icon"
+        @click="emit('share')"
+      >
+        <svg
+          v-if="showShareCopied"
+          fill="currentColor"
+          height="18"
+          viewBox="0 0 24 24"
+          width="18"
+        >
+          <path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z" />
+        </svg>
+        <svg
+          v-else
+          fill="currentColor"
+          height="18"
+          viewBox="0 0 24 24"
+          width="18"
+        >
+          <path d="M18 16.08c-.76 0-1.44.3-1.96.77L8.91 12.7c.05-.23.09-.46.09-.7s-.04-.47-.09-.7l7.05-4.11c.54.5 1.25.81 2.04.81 1.66 0 3-1.34 3-3s-1.34-3-3-3-3 1.34-3 3c0 .24.04.47.09.7L8.04 9.81C7.5 9.31 6.79 9 6 9c-1.66 0-3 1.34-3 3s1.34 3 3 3c.79 0 1.5-.31 2.04-.81l7.12 4.16c-.05.21-.08.43-.08.65 0 1.61 1.31 2.92 2.92 2.92s2.92-1.31 2.92-2.92-1.31-2.92-2.92-2.92z" />
+        </svg>
+      </button>
+      <!-- History button -->
+      <button
+        class="claude-btn-icon"
+        title="History"
+        @click="emit('history')"
+      >
+        <svg
+          fill="currentColor"
+          height="18"
+          viewBox="0 0 24 24"
+          width="18"
+        >
+          <path d="M13 3a9 9 0 0 0-9 9H1l3.89 3.89.07.14L9 12H6c0-3.87 3.13-7 7-7s7 3.13 7 7-3.13 7-7 7c-1.93 0-3.68-.79-4.94-2.06l-1.42 1.42A8.954 8.954 0 0 0 13 21a9 9 0 0 0 0-18zm-1 5v5l4.28 2.54.72-1.21-3.5-2.08V8H12z" />
+        </svg>
+      </button>
+      <!-- New chat button -->
+      <button
+        class="claude-btn-icon"
+        title="New chat"
+        @click="emit('newChat')"
+      >
+        <svg
+          fill="currentColor"
+          height="18"
+          viewBox="0 0 24 24"
+          width="18"
+        >
+          <path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z" />
+        </svg>
+      </button>
+    </div>
+  </div>
+</template>
+
+<style>
+.claude-header{align-items:center;background:transparent;display:flex;flex-shrink:0;justify-content:space-between;left:0;padding:16px 20px;pointer-events:none;position:absolute;right:0;top:0;z-index:10}.claude-header>*{pointer-events:auto}.claude-header-draggable{cursor:grab}.claude-header-draggable:active{cursor:grabbing}.claude-header-left{align-items:center;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);background:rgba(0,0,0,.4);border:1px solid hsla(0,0%,100%,.1);border-radius:var(--claude-radius-sm);box-shadow:0 4px 12px rgba(0,0,0,.3);display:flex;gap:10px;padding:8px 14px}.claude-header-title{color:hsla(0,0%,100%,.95);font-size:15px;font-weight:600}.claude-status-dot{border-radius:50%;flex-shrink:0;height:8px;width:8px}.claude-status-dot-green{background:#4ade80;box-shadow:0 0 8px rgba(74,222,128,.6)}.claude-status-dot-blue{animation:claude-status-pulse 1.5s ease-in-out infinite;background:#fbbf24;box-shadow:0 0 8px rgba(251,191,36,.6)}.claude-status-dot-red{background:#f87171;box-shadow:0 0 8px hsla(0,91%,71%,.6)}@keyframes claude-status-pulse{0%,to{opacity:1}50%{opacity:.5}}.claude-header-actions{display:flex;gap:8px}.claude-btn-icon{align-items:center;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);background:rgba(0,0,0,.4);border:1px solid hsla(0,0%,100%,.1);border-radius:var(--claude-radius-sm);box-shadow:0 4px 12px rgba(0,0,0,.3);color:hsla(0,0%,100%,.7);cursor:pointer;display:flex;height:38px;justify-content:center;transition:all .2s ease;width:38px}.claude-btn-icon:hover{background:rgba(0,0,0,.5);border-color:hsla(0,0%,100%,.2);box-shadow:0 6px 16px rgba(0,0,0,.4);color:#fff;transform:translateY(-2px)}.claude-btn-success{background:rgba(74,222,128,.2)!important;border-color:rgba(74,222,128,.3)!important;color:#4ade80!important}@media (max-width:640px){.claude-header{padding:6px 16px;top:36px}.claude-header-left{padding:8px 12px}.claude-btn-icon{height:44px;width:44px}}
+</style>

package/dist/runtime/overlay/components/chat/ChatHeader.vue.d.ts

@@ -0,0 +1,18 @@
+type __VLS_Props = {
+    statusColor: 'green' | 'blue' | 'red';
+    showShareCopied: boolean;
+    isMobile: boolean;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    newChat: () => any;
+    share: () => any;
+    history: () => any;
+    dragStart: (e: MouseEvent) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onNewChat?: (() => any) | undefined;
+    onShare?: (() => any) | undefined;
+    onHistory?: (() => any) | undefined;
+    onDragStart?: ((e: MouseEvent) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/overlay/components/chat/ChatInput.d.vue.ts

@@ -0,0 +1,22 @@
+import type { ImageAttachment, SlashCommand } from '../../../shared/types.js';
+type __VLS_Props = {
+    isConnected: boolean;
+    isProcessing: boolean;
+    isRecording: boolean;
+    isSpeechSupported: boolean;
+    commands: SlashCommand[];
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {
+    focus: () => void | undefined;
+    appendText: (text: string) => void;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    submit: (message: string, attachments?: ImageAttachment[] | undefined) => any;
+    stop: () => any;
+    voiceInput: () => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onSubmit?: ((message: string, attachments?: ImageAttachment[] | undefined) => any) | undefined;
+    onStop?: (() => any) | undefined;
+    onVoiceInput?: (() => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;