@veluai/velu 0.2.18 → 0.2.20

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@veluai/velu",
-  "version": "0.2.18",
+  "version": "0.2.20",
   "type": "module",
   "bin": "./dist/cli.js",
   "publishConfig": {

package/runtime/velu-ui/components/ContextMenu.jsx

@@ -61,11 +61,11 @@ const REGISTRY = {
   aistudio: { icon: Sparkles, label: 'Open in AI Studio', desc: 'Ask questions about this page', kind: 'ai', external: true, url: (q) => `https://aistudio.google.com/app/prompts/new_chat?prompt=${q}` },
   devin: { icon: Bot, label: 'Open in Devin', desc: 'Ask questions about this page', kind: 'ai', external: true, url: (q) => `https://app.devin.ai/?prompt=${q}` },
   windsurf: { icon: Wind, label: 'Open in Windsurf', desc: 'Ask questions about this page', kind: 'ai', external: true, url: (q) => `https://windsurf.com/?q=${q}` },
-  mcp: { icon: Terminal, label: 'Copy MCP install command', desc: 'Copy npx command to install MCP server', kind: 'mcp' },
+  mcp: { icon: Terminal, label: 'Copy MCP install command', desc: 'Copy command to install the MCP server', kind: 'mcp' },
   'add-mcp': { icon: Terminal, label: 'Add MCP server', desc: 'Copy command to add the MCP server', kind: 'mcp' },
   cursor: { icon: CursorIcon, label: 'Connect to Cursor', desc: 'Install MCP Server on Cursor', kind: 'cursor', external: true },
   vscode: { icon: VscodeIcon, label: 'Connect to VS Code', desc: 'Install MCP Server on VS Code', kind: 'vscode', external: true },
-  'devin-mcp': { icon: Terminal, label: 'Connect to Devin', desc: 'Install MCP Server on Devin', kind: 'cursor', external: true },
+  'devin-mcp': { icon: Terminal, label: 'Connect to Devin', desc: 'Copy command to add the MCP server on Devin', kind: 'devin' },
 };
 
 export default function ContextMenu({
@@ -166,6 +166,9 @@ export default function ContextMenu({
     setOpen(false);
     const origin = window.location.origin;
     const absMd = origin + mdUrl;
+    const mcpUrl = `${origin}/mcp`;
+    // CLI-safe server name (siteName may contain spaces).
+    const serverName = (siteName || 'docs').trim().replace(/\s+/g, '-').toLowerCase() || 'docs';
     switch (it.kind) {
       case 'copy':
         return copyPage();
@@ -192,12 +195,12 @@ export default function ContextMenu({
         return void window.open(it.url(q), '_blank', 'noopener');
       }
       case 'mcp':
-        // Stubbed: the Velu MCP server isn't hosted yet — this is the intended
-        // command, wired to <origin>/mcp once it exists.
-        return copyText(`npx -y @veluai/mcp@latest ${origin}/mcp`);
+        // Hosted HTTP MCP server lives at <origin>/mcp. Copy a client-neutral
+        // command: `mcp-remote` bridges the HTTP server to stdio, so it works
+        // in any MCP client config (Claude, Cursor, VS Code, Windsurf, …).
+        return copyText(`npx mcp-remote ${mcpUrl}`);
       case 'cursor': {
-        const cfg =
-          typeof btoa === 'function' ? btoa(JSON.stringify({ url: `${origin}/mcp` })) : '';
+        const cfg = typeof btoa === 'function' ? btoa(JSON.stringify({ url: mcpUrl })) : '';
         return void window.open(
           `cursor://anysphere.cursor-deeplink/mcp/install?name=${encodeURIComponent(siteName)}&config=${cfg}`,
           '_blank',
@@ -205,13 +208,16 @@ export default function ContextMenu({
         );
       }
       case 'vscode': {
-        const cfg = encodeURIComponent(JSON.stringify({ name: siteName, url: `${origin}/mcp` }));
-        return void window.open(
-          `https://insiders.vscode.dev/redirect/mcp/install?${cfg}`,
-          '_blank',
-          'noopener',
+        // Official VS Code install URI: `vscode:mcp/install?<urlencoded JSON>`,
+        // with the transport `type` inside the payload.
+        const cfg = encodeURIComponent(
+          JSON.stringify({ name: siteName, type: 'http', url: mcpUrl }),
         );
+        return void window.open(`vscode:mcp/install?${cfg}`, '_blank', 'noopener');
       }
+      case 'devin':
+        // Devin has no install deep-link — copy its CLI add command instead.
+        return copyText(`devin mcp add ${serverName} ${mcpUrl}`);
       case 'custom':
         return void window.open(it.href, '_blank', 'noopener');
       default:

package/runtime/velu-ui/components/chatbot.css

@@ -510,7 +510,10 @@
   opacity: 0;
   transition: opacity 0.12s ease;
 }
-.velu-chatbot__msg--ai:hover .velu-chatbot__msg-actions {
+.velu-chatbot__msg--ai:hover .velu-chatbot__msg-actions,
+/* Keep the row visible once a vote is cast, so the selection stays
+   confirmed after the pointer leaves the message. */
+.velu-chatbot__msg-actions:has(.is-active) {
   opacity: 1;
 }
 .velu-chatbot__msg-action {
@@ -530,6 +533,11 @@
   background: var(--surface-color);
   color: var(--text-color);
 }
+/* Chosen thumb (up/down) — accent tint so the click is clearly registered. */
+.velu-chatbot__msg-action.is-active {
+  background: color-mix(in srgb, var(--accent-color) 12%, transparent);
+  color: var(--accent-color);
+}
 
 /* ── Composer ───────────────────────────────────────────────────────── */
 .velu-chatbot__composer {

package/runtime/velu-ui/index.js

@@ -45,6 +45,7 @@ export {
 export { default as Search } from './components/Search.jsx';
 export { default as pagefindSearch } from './lib/pagefind.js';
 export { createDocsAssistant } from './lib/docs-assistant.js';
+export { createPageFeedback } from './lib/page-feedback.js';
 export { default as Image } from './components/Image.jsx';
 export {
   default as CodeBlock,

package/runtime/velu-ui/lib/page-feedback.js

@@ -0,0 +1,72 @@
+/**
+ * page-feedback — runtime client for the "Was this page helpful?" widget on a
+ * published docs site. POSTs to the backend's PUBLIC feedback API:
+ *
+ *   POST /api/v1/public/feedback  ({ page_url, helpful, reason_text, details })
+ *
+ * Same contract as docs-assistant: the tenant is resolved from the
+ * `X-Velu-Site-Host` header (falls back to Origin), and the httponly visitor
+ * cookie rides along via `credentials: 'include'` (so the API must be same-site
+ * with the docs — true for *.getvelu.com subdomains).
+ *
+ * `createPageFeedback({ apiBase, host })` returns `{ submit }`, shaped to wire
+ * straight into <PageFeedback onVote onSubmit>. Returns null without an apiBase
+ * (dev preview / unconfigured site) so the widget stays purely visual.
+ */
+
+const trimSlash = (s) => String(s || '').replace(/\/+$/, '');
+
+function siteHost(explicit) {
+  if (explicit) return explicit;
+  return typeof window !== 'undefined' ? window.location.host : '';
+}
+
+// The page the feedback is about. Drop hash + query here; the backend
+// normalizes again server-side so per-page aggregation stays clean.
+function currentPageUrl() {
+  if (typeof window === 'undefined') return '';
+  const { origin, pathname } = window.location;
+  return origin + pathname;
+}
+
+export function createPageFeedback({ apiBase, host } = {}) {
+  const base = trimSlash(apiBase);
+  if (!base) return null;
+  const url = `${base}/api/v1/public/feedback`;
+
+  /**
+   * Send one feedback submission.
+   *  - helpful: boolean (Yes / No)
+   *  - reason:  short label from the "No" form (optional)
+   *  - detail:  free-text elaboration (optional)
+   * Best-effort: a failed request never disrupts the reader.
+   */
+  async function submit({ helpful, reason, detail } = {}) {
+    const body = {
+      page_url: currentPageUrl(),
+      helpful: !!helpful,
+      // reason_text is required by the API (min length 1); fall back to a
+      // sensible default when the reader didn't pick a reason (e.g. on "Yes").
+      reason_text:
+        (reason && String(reason).trim()) || (helpful ? 'Helpful' : 'Not helpful'),
+      details: detail ? String(detail) : null,
+    };
+    try {
+      await fetch(url, {
+        method: 'POST',
+        credentials: 'include',
+        headers: {
+          'Content-Type': 'application/json',
+          'X-Velu-Site-Host': siteHost(host),
+        },
+        body: JSON.stringify(body),
+      });
+    } catch {
+      /* feedback is best-effort — swallow network errors */
+    }
+  }
+
+  return { submit };
+}
+
+export default createPageFeedback;

package/src/runtime/App.jsx

@@ -41,6 +41,7 @@ import {
   Search,
   pagefindSearch,
   createDocsAssistant,
+  createPageFeedback,
   Logo,
   SocialLinks,
   Tree,
@@ -779,6 +780,17 @@ function DocsPage() {
     return createDocsAssistant({ apiBase, host: site.assistant?.host });
   }, []);
 
+  // Page-feedback backend: reuses the same injected apiBase as the assistant
+  // (baked into every published velu.json), so the "Was this page helpful?"
+  // widget can POST to /api/v1/public/feedback. Null in the dev preview, where
+  // the widget stays purely visual.
+  const pageFeedback = React.useMemo(() => {
+    if (IS_DEV_PREVIEW) return null;
+    const apiBase = site.assistant?.apiBase;
+    if (!apiBase) return null;
+    return createPageFeedback({ apiBase, host: site.assistant?.host });
+  }, []);
+
   const frontmatter = entry?.frontmatter ?? {};
   const PageComponent = entry?.Component ?? null;
   const pageToc = entry?.toc ?? [];
@@ -1572,7 +1584,18 @@ function DocsPage() {
           {/* Page-foot feedback widget — ref'd so the sticky AskBar
               above can hide as the user scrolls near it. */}
           <div ref={feedbackRef} style={{ marginTop: 'var(--s3)' }}>
-            <PageFeedback />
+            {/* key resets the widget's vote state on page change. "Yes"
+                submits immediately; "No" submits once its form is sent.
+                Handlers are no-ops in the dev preview (pageFeedback null). */}
+            <PageFeedback
+              key={pathname}
+              onVote={(v) => {
+                if (v === 'yes') pageFeedback?.submit({ helpful: true });
+              }}
+              onSubmit={({ reason, detail }) =>
+                pageFeedback?.submit({ helpful: false, reason, detail })
+              }
+            />
           </div>
           {/* Previous / next page navigation — derived from the
               sidebar reading order of the active section. */}