specra 0.2.63 → 0.2.65

package/config/svelte-config.js

@@ -166,6 +166,12 @@ export function specraConfig(options = {}) {
     kit: {
       ...options.kit,
       paths: {
+        // Absolute (base-prefixed) links rather than relative ones. Under a
+        // subpath deployment, relative links (the SvelteKit default) interact
+        // badly with the prerender crawler and produce wrong targets; absolute
+        // `${base}/...` links resolve and crawl correctly. Override via
+        // options.kit.paths.relative if a site truly needs relative output.
+        relative: false,
         ...options.kit?.paths,
         base: basePath,
       },

package/dist/components/docs/Card.svelte

@@ -2,6 +2,7 @@
   import { ArrowRight, ExternalLink } from 'lucide-svelte';
   import type { Snippet } from 'svelte';
   import Icon from './Icon.svelte';
+  import { link } from '../../links.js';
 
   interface Props {
     title: string;
@@ -13,6 +14,10 @@
   }
 
   let { title, description, href, icon, external = false, children }: Props = $props();
+
+  // Apply the deployment base path to internal absolute hrefs (e.g. /docs/...),
+  // since rehype only rewrites plain markdown links, not component props.
+  const resolvedHref = $derived(href && href.startsWith('/') ? link(href) : href);
 </script>
 
 {#snippet cardContent(isLink: boolean)}
@@ -49,7 +54,7 @@
 
 {#if href}
   <a
-    {href}
+    href={resolvedHref}
     class="card-link group block h-full p-4 rounded-xl border border-border hover:border-primary/50 hover:bg-muted/50 transition-all"
     target={external ? '_blank' : undefined}
     rel={external ? 'noopener noreferrer' : undefined}

package/dist/components/docs/MdxContent.svelte

@@ -2,6 +2,7 @@
   import MdxContent from './MdxContent.svelte';
   import type { Component } from 'svelte';
   import type { MdxNode } from '../../mdx.js';
+  import { base } from '$app/paths';
 
   interface Props {
     nodes: MdxNode[];
@@ -9,11 +10,26 @@
   }
 
   let { nodes, components }: Props = $props();
+
+  // Prefix absolute href/src in raw content HTML with the deployment base path.
+  // The content nodes are pre-rendered HTML emitted via {@html}, which bypasses
+  // rehypeBasePath, so links like /docs/... would otherwise be base-less under a
+  // subpath deployment. Skips protocol-relative (//) and already-based URLs.
+  function withBase(html: string): string {
+    if (!base || !html) return html;
+    return html.replace(
+      /(href|src)="(\/[^"]*)"/g,
+      (m, attr, p) =>
+        p.startsWith('//') || p === base || p.startsWith(base + '/')
+          ? m
+          : `${attr}="${base}${p}"`
+    );
+  }
 </script>
 
 {#each nodes as node}
   {#if node.type === 'html'}
-    {@html node.content}
+    {@html withBase(node.content)}
   {:else if node.type === 'component' && node.name}
     {@const Comp = components[node.name]}
     {#if Comp}

package/dist/components/docs/SidebarMenuItems.svelte

@@ -5,6 +5,7 @@
   import type { SpecraConfig } from '../../config.types.js';
   import Icon from './Icon.svelte';
   import { sortSidebarItems, sortSidebarGroups } from '../../sidebar-utils.js';
+  import { renderInlineCode } from '../../inline.js';
 
   interface DocItem {
     title: string;
@@ -302,7 +303,7 @@
         {#if group.icon}
           <Icon icon={group.icon} size={16} className="shrink-0" />
         {/if}
-        {group.label}
+        {@html renderInlineCode(group.label)}
       </a>
 
       {#if hasContent && group.collapsible && config.navigation?.collapsibleSidebar}
@@ -342,7 +343,7 @@
               {#if item.doc.meta?.icon}
                 <Icon icon={item.doc.meta.icon} size={16} className="shrink-0" />
               {/if}
-              {item.doc.title}
+              {@html renderInlineCode(item.doc.title)}
               {#if item.doc.meta?.isProtected}
                 <Lock size={14} class="shrink-0 text-muted-foreground ml-auto" />
               {/if}
@@ -369,7 +370,7 @@
         {#if doc.meta?.icon}
           <Icon icon={doc.meta.icon} size={16} className="shrink-0" />
         {/if}
-        {doc.title}
+        {@html renderInlineCode(doc.title)}
         {#if doc.meta?.isProtected}
           <Lock size={14} class="shrink-0 text-muted-foreground ml-auto" />
         {/if}

package/dist/components/docs/TableOfContents.svelte

@@ -2,6 +2,7 @@
   import { browser } from '$app/environment';
   import type { SpecraConfig } from '../../config.types.js';
   import type { TOCItem } from '../../toc.js';
+  import { renderInlineCode } from '../../inline.js';
 
   interface Props {
     items: TOCItem[];
@@ -84,7 +85,7 @@
               ? 'text-primary font-medium'
               : 'text-foreground hover:bg-accent/50'}"
           >
-            {item.title}
+            {@html renderInlineCode(item.title)}
           </a>
         {/each}
       </nav>

package/dist/index.d.ts

@@ -12,6 +12,7 @@ export type * from './api.types.js';
 export type { ApiParam, ApiHeader, ApiResponse as SpecraApiResponse, ApiEndpointSpec, SpecraApiSpec } from './api-parser.types.js';
 export * from './utils.js';
 export * from './links.js';
+export * from './inline.js';
 export * from './sidebar-utils.js';
 export * from './category.js';
 export * from './redirects.js';

package/dist/index.js

@@ -16,6 +16,7 @@ export * from './parsers/index.js';
 // Utilities
 export * from './utils.js';
 export * from './links.js';
+export * from './inline.js';
 export * from './sidebar-utils.js';
 export * from './category.js';
 export * from './redirects.js';

package/dist/inline.d.ts

@@ -0,0 +1 @@
+export declare function renderInlineCode(text: string): string;

package/dist/inline.js

@@ -0,0 +1,32 @@
+/**
+ * Render a plain label string that may contain inline-code markdown
+ * (backtick-delimited spans) into safe HTML, turning `` `code` `` into
+ * `<code>code</code>`. Used for TOC entries and sidebar labels, which come from
+ * headings / frontmatter titles as raw text - without this they show the literal
+ * backticks instead of formatted code.
+ *
+ * Everything is HTML-escaped (both the surrounding text and the code content),
+ * so the result is safe to use with `{@html}`. Only inline code is handled; no
+ * other markdown is interpreted.
+ */
+function escapeHtml(s) {
+    return s
+        .replace(/&/g, '&amp;')
+        .replace(/</g, '&lt;')
+        .replace(/>/g, '&gt;');
+}
+export function renderInlineCode(text) {
+    if (!text)
+        return '';
+    let out = '';
+    let last = 0;
+    const re = /`([^`]+)`/g;
+    let m;
+    while ((m = re.exec(text)) !== null) {
+        out += escapeHtml(text.slice(last, m.index));
+        out += `<code>${escapeHtml(m[1])}</code>`;
+        last = m.index + m[0].length;
+    }
+    out += escapeHtml(text.slice(last));
+    return out;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "specra",
-  "version": "0.2.63",
+  "version": "0.2.65",
   "description": "A modern documentation library for SvelteKit with built-in versioning, API reference generation, full-text search, and MDX support",
   "svelte": "./dist/index.js",
   "types": "./dist/index.d.ts",