www

www/next.config.mjs

@@ -1,5 +1,5 @@
 import remarkGithubAlerts from "remark-github-alerts";
-import { remarkCodeHike } from "@code-hike/mdx";
+import { recmaCodeHike, remarkCodeHike } from "codehike/mdx";
 import remarkGfm from "remark-gfm";
 import rehypeSlug from "rehype-slug";
 import { default as mdx } from "@next/mdx";
@@ -74,19 +74,27 @@ const nextConfig = {
   },
 };
 
+/** @type {import('codehike/mdx').CodeHikeConfig} */
+const opts = {
+  components: { code: "Code" },
+  syntaxHighlighting: {
+    theme: "github-dark",
+  },
+  lineNumbers: false,
+  showCopyButton: true,
+};
+
 export default mdx({
   options: {
     remarkPlugins: [
       remarkGfm,
       remarkGithubAlerts,
       [
         remarkCodeHike,
-        {
-          lineNumbers: false,
-          showCopyButton: true,
-        },
+        opts,
       ],
     ],
+    recmaCodeHike: [[recmaCodeHike, opts]],
     rehypePlugins: [rehypeSlug],
   },
 })(nextConfig);

www/package.json

@@ -30,6 +30,7 @@
     "@vercel/analytics": "^1.4.1",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
+    "codehike": "^1.0.4",
     "cookie": "^1.0.2",
     "lucide-react": "^0.468.0",
     "next": "15.0.4",

www/src/app/docs/ffremote/reference/cli/page.mdx

@@ -35,6 +35,7 @@ ffremote <ffmpeg-args>...
 ffremote execute -- -i "test.mov" -t 30 -c:v libx264 -c:a aac -strict experimental "test.mp4"
 ffremote --size=lg -- -i "test.mov" -t 30 -c:v libx264 -c:a aac -strict experimental "test.mp4"
 ffremote -i "test.mov" -t 30 -c:v libx264 -c:a aac -strict experimental "test.mp4"
+ffremote --matrix="s:0" --matrix"s:30" -- -i "test.mov" -t $s -c:v libx264 -c:a aac -strict experimental "test.mp4"
 ```
 
 #### Options
@@ -51,6 +52,10 @@ Files to upload to the remote server that aren't used as input (`-i`). You can s
 
 Files to exclude from the final output archive. Input files are automatically excluded from the output. You can specify multiple files by repeating the option. Glob paths are also supported.
 
+##### `--matrix=<matrix>`
+
+##### `--parallel=<parallel>`
+
 ### create
 
 Ask our AI robot to generate an FFmpeg command for you

www/src/components/code.tsx

@@ -0,0 +1,8 @@
+import {Pre, RawCode, highlight} from 'codehike/code';
+
+export async function Code({codeblock}: {codeblock: RawCode}) {
+  const highlighted = await highlight(codeblock, 'github-dark');
+  return (
+    <Pre code={highlighted} handlers={[]} className="border border-zinc-800" />
+  );
+}

www/src/mdx-components.tsx

@@ -1,8 +1,10 @@
 import type {MDXComponents} from 'mdx/types';
+import {Code} from './components/code';
 
 export function useMDXComponents(components: MDXComponents): MDXComponents {
   return {
     ...components,
+    Code,
     h1({children, id}) {
       return (
         <h1 id={id} className="font-extrabold text-3xl mb-6">