specra 0.2.60 → 0.2.61

package/dist/components/docs/CodeBlock.svelte

@@ -6,9 +6,14 @@
     language: string;
     filename?: string;
     showLineNumbers?: boolean;
+    diff?: boolean;
   }
 
-  let { code, language, filename, showLineNumbers = false }: Props = $props();
+  let { code, language, filename, showLineNumbers = false, diff = false }: Props = $props();
+
+  // Diff add/remove markers apply either to a `diff` language or to any block
+  // explicitly opted in via the `diff` fence-meta flag.
+  let diffEnabled = $derived(diff || language === 'diff');
 
   // Languages whose syntax the JS/TS-oriented tokenizer below does NOT model.
   // Highlighting these would mis-colour prose markup (e.g. a markdown list `-`
@@ -125,7 +130,7 @@
 
   <!-- Code content -->
   <div class="bg-muted/30 dark:bg-muted/20 rounded-b-xl overflow-x-auto border border-border/50">
-    <pre class="p-2 text-[13px] font-mono leading-relaxed text-gray-800 dark:text-gray-200"><code class="table w-full">{#each lines as line, i}{@const isDeletion = language === 'diff' && line.startsWith('-') && !line.startsWith('--')}{@const isAddition = language === 'diff' && line.startsWith('+') && !line.startsWith('++')}{@const isDiff = isDeletion || isAddition}{@const diffBgClass = isDeletion ? 'bg-red-500/5 dark:bg-red-500/10' : isAddition ? 'bg-green-500/5 dark:bg-green-500/10' : ''}{@const diffMarkerClass = isDeletion ? 'text-red-600 dark:text-red-400' : isAddition ? 'text-green-600 dark:text-green-400' : ''}{@const tokens = isPlain ? [] : tokenizeLine(line)}<div class="table-row {diffBgClass}">{#if showLineNumbers}<span class="table-cell pr-4 text-right select-none text-muted-foreground/40 w-8 align-top">{i + 1}</span>{/if}<span class="table-cell align-top">{#if isPlain}{#if line}{line}{:else}&nbsp;{/if}{:else}{#if tokens.length === 0}&nbsp;{:else}{#each tokens as token, j}{#if j === 0 && isDiff && token.value.length > 0 && (token.value[0] === '+' || token.value[0] === '-')}<span class="{diffMarkerClass} font-bold">{token.value[0]}</span>{#if token.value.length > 1}<span class="token-{token.type}">{token.value.slice(1)}</span>{/if}{:else}<span class="token-{token.type}">{token.value}</span>{/if}{/each}{/if}{/if}</span></div>{/each}</code></pre>
+    <pre class="p-2 text-[13px] font-mono leading-relaxed text-gray-800 dark:text-gray-200"><code class="table w-full">{#each lines as line, i}{@const isDeletion = diffEnabled && line.startsWith('-') && !line.startsWith('--')}{@const isAddition = diffEnabled && line.startsWith('+') && !line.startsWith('++')}{@const isDiff = isDeletion || isAddition}{@const diffBgClass = isDeletion ? 'bg-red-500/5 dark:bg-red-500/10' : isAddition ? 'bg-green-500/5 dark:bg-green-500/10' : ''}{@const diffMarkerClass = isDeletion ? 'text-red-600 dark:text-red-400' : isAddition ? 'text-green-600 dark:text-green-400' : ''}{@const tokens = isPlain ? [] : tokenizeLine(line)}<div class="table-row {diffBgClass}">{#if showLineNumbers}<span class="table-cell pr-4 text-right select-none text-muted-foreground/40 w-8 align-top">{i + 1}</span>{/if}<span class="table-cell align-top">{#if isPlain}{#if isDiff}<span class="{diffMarkerClass} font-bold">{line[0]}</span>{line.slice(1)}{:else}{#if line}{line}{:else}&nbsp;{/if}{/if}{:else}{#if tokens.length === 0}&nbsp;{:else}{#each tokens as token, j}{#if j === 0 && isDiff && token.value.length > 0 && (token.value[0] === '+' || token.value[0] === '-')}<span class="{diffMarkerClass} font-bold">{token.value[0]}</span>{#if token.value.length > 1}<span class="token-{token.type}">{token.value.slice(1)}</span>{/if}{:else}<span class="token-{token.type}">{token.value}</span>{/if}{/each}{/if}{/if}</span></div>{/each}</code></pre>
   </div>
 </div>
 

package/dist/components/docs/CodeBlock.svelte.d.ts

@@ -3,6 +3,7 @@ interface Props {
     language: string;
     filename?: string;
     showLineNumbers?: boolean;
+    diff?: boolean;
 }
 declare const CodeBlock: import("svelte").Component<Props, {}, "">;
 type CodeBlock = ReturnType<typeof CodeBlock>;

package/dist/mdx.js

@@ -585,11 +585,14 @@ function extractCodeBlockProps(node) {
     const filename = readDataAttr('dataFilename', 'data-filename');
     const lineNumbers = readDataAttr('dataLineNumbers', 'data-line-numbers');
     const showLineNumbers = lineNumbers === 'true' || lineNumbers === true || lineNumbers === '';
+    const diffAttr = readDataAttr('dataDiff', 'data-diff');
+    const diff = diffAttr === 'true' || diffAttr === true || diffAttr === '';
     return {
         code,
         language,
         ...(filename ? { filename } : {}),
         ...(showLineNumbers ? { showLineNumbers: true } : {}),
+        ...(diff ? { diff: true } : {}),
     };
 }
 /**

package/dist/remark-code-meta.d.ts

@@ -7,8 +7,10 @@
  *   ```ts title='src/index.ts'    -> data-filename="src/index.ts"
  *   ```js showLineNumbers         -> data-line-numbers="true"
  *   ```js showLineNumbers=true    -> data-line-numbers="true"
+ *   ```html diff                  -> data-diff="true"
  *
- * Line numbers are opt-in: only an explicit `showLineNumbers` (or
- * `showLineNumbers=true`) turns them on; absence (or `=false`) leaves them off.
+ * Line numbers and diff markers are opt-in: only an explicit flag turns them on.
+ * `diff` lets a syntax-highlighted block (any language) render leading `-`/`+`
+ * lines as removed/added without auto-detecting them across every language.
  */
 export declare function remarkCodeMeta(): (tree: any) => void;

package/dist/remark-code-meta.js

@@ -7,28 +7,40 @@
  *   ```ts title='src/index.ts'    -> data-filename="src/index.ts"
  *   ```js showLineNumbers         -> data-line-numbers="true"
  *   ```js showLineNumbers=true    -> data-line-numbers="true"
+ *   ```html diff                  -> data-diff="true"
  *
- * Line numbers are opt-in: only an explicit `showLineNumbers` (or
- * `showLineNumbers=true`) turns them on; absence (or `=false`) leaves them off.
+ * Line numbers and diff markers are opt-in: only an explicit flag turns them on.
+ * `diff` lets a syntax-highlighted block (any language) render leading `-`/`+`
+ * lines as removed/added without auto-detecting them across every language.
  */
 export function remarkCodeMeta() {
     return (tree) => {
         const visit = (node) => {
             if (node.type === 'code' && node.meta) {
+                const meta = node.meta;
                 const hProperties = {};
                 // title="..." / title='...' -> filename shown in the code block header.
-                const titleMatch = node.meta.match(/\btitle\s*=\s*"([^"]*)"/i) ||
-                    node.meta.match(/\btitle\s*=\s*'([^']*)'/i);
+                const titleMatch = meta.match(/\btitle\s*=\s*"([^"]*)"/i) ||
+                    meta.match(/\btitle\s*=\s*'([^']*)'/i);
                 if (titleMatch) {
                     hProperties['data-filename'] = titleMatch[1];
                 }
+                // Strip quoted `key="..."` / `key='...'` values before scanning for bare
+                // flags, so a value like title="my diff notes" can't false-match below.
+                const flags = meta
+                    .replace(/\b\w+\s*=\s*"[^"]*"/g, ' ')
+                    .replace(/\b\w+\s*=\s*'[^']*'/g, ' ');
                 // showLineNumbers (opt-in). Bare flag or `=true` enables; `=false` keeps off.
-                const lineNumbersMatch = node.meta.match(/\bshowLineNumbers(?:\s*=\s*(true|false))?\b/i);
+                const lineNumbersMatch = flags.match(/\bshowLineNumbers(?:\s*=\s*(true|false))?\b/i);
                 if (lineNumbersMatch &&
                     (lineNumbersMatch[1] === undefined ||
                         lineNumbersMatch[1].toLowerCase() === 'true')) {
                     hProperties['data-line-numbers'] = 'true';
                 }
+                // diff (opt-in): treat leading -/+ lines as removed/added.
+                if (/\bdiff\b/i.test(flags)) {
+                    hProperties['data-diff'] = 'true';
+                }
                 if (Object.keys(hProperties).length > 0) {
                     node.data = node.data || {};
                     node.data.hProperties = { ...(node.data.hProperties || {}), ...hProperties };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "specra",
-  "version": "0.2.60",
+  "version": "0.2.61",
   "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",