@vx-oss/docs-satteri 1.0.3

package/dist/remark-include.js

@@ -0,0 +1,336 @@
+import { i as replaceSource } from "./stringifier-COIWcXys.js";
+import { t as flattenNode } from "./utils-I3DkmAkd.js";
+import Slugger from "github-slugger";
+import { defineMdastPlugin, markdownToMdast, mdxToMdast } from "satteri";
+import * as path$1 from "node:path";
+import { fileURLToPath } from "node:url";
+import { frontmatter } from "@vx-oss/docs-core/content/md/frontmatter";
+import { readFile } from "node:fs/promises";
+//#region src/remark-include.ts
+const INCLUDE_TYPES = /* @__PURE__ */ new Set([
+	"mdxJsxFlowElement",
+	"mdxJsxTextElement",
+	"containerDirective",
+	"leafDirective",
+	"textDirective"
+]);
+const PARSE_FEATURES = {
+	gfm: true,
+	directive: true,
+	headingAttributes: true
+};
+/**
+* Sätteri port of @vx-oss/docs-mdx's `remark-include`: embed other documents with
+* `<include>./file.mdx</include>` (or the `:::include` / `::include`
+* directives), sections with `<include>./file.mdx#section</include>`, and
+* non-markdown files as code blocks — with VS Code-style `#region` extraction.
+*
+* Nested includes are resolved recursively, relative to the file they appear in.
+*/
+function remarkInclude({ cwd } = {}) {
+	async function visit(node, ctx) {
+		if (node.name !== "include") return;
+		const result = await replaceInclude(node, ctx, cwd);
+		if (!result) return;
+		replaceSource(ctx, node, result.markdown);
+		return result.replacement;
+	}
+	async function visitInline(node, ctx) {
+		if (node.name !== "include") return;
+		const result = await replaceInclude(node, ctx, cwd);
+		if (!result) return;
+		const parent = ctx.parent(node);
+		if (parent?.type === "paragraph") {
+			replaceSource(ctx, parent, result.markdown);
+			ctx.replaceNode(parent, result.replacement);
+			return;
+		}
+		replaceSource(ctx, node, result.markdown);
+		return result.replacement;
+	}
+	return defineMdastPlugin({
+		name: "remark-include",
+		mdxJsxFlowElement: visit,
+		containerDirective: visit,
+		leafDirective: visit,
+		mdxJsxTextElement: visitInline,
+		textDirective: visitInline
+	});
+}
+async function replaceInclude(node, ctx, cwdOption) {
+	const specifier = ctx.textContent(node).trim();
+	if (!specifier) return;
+	const attributes = parseElementAttributes(node);
+	const { file: relativePath, section } = parseSpecifier(specifier);
+	const filePath = ctx.fileURL ? fileURLToPath(ctx.fileURL) : void 0;
+	const cwd = cwdOption ?? process.cwd();
+	const baseDir = "cwd" in attributes || !filePath ? cwd : path$1.dirname(filePath);
+	const targetPath = path$1.resolve(baseDir, relativePath);
+	const state = {
+		cwd,
+		addDependency: (file) => ctx.data._compiler?.addDependency(file),
+		stack: filePath ? [filePath] : []
+	};
+	if (isCodeInclude(targetPath, attributes)) {
+		const code = await readCodeInclude(targetPath, section, attributes, state);
+		return {
+			replacement: code,
+			markdown: () => toCodeFence(code)
+		};
+	}
+	const raw = await readMarkdownInclude(targetPath, section, state);
+	return {
+		replacement: { raw },
+		markdown: () => stripEsm(raw, path$1.extname(targetPath))
+	};
+}
+/**
+* Drop top-level ESM nodes from included content: they stay in the compiled
+* document, but are noise in Markdown output.
+*/
+function stripEsm(text, ext) {
+	if (ext !== ".mdx") return text;
+	let out = "";
+	let cursor = 0;
+	for (const node of parseTree(text, ext).children) {
+		if (node.type !== "mdxjsEsm") continue;
+		const start = node.position?.start.offset;
+		const end = node.position?.end.offset;
+		if (start === void 0 || end === void 0) continue;
+		out += text.slice(cursor, start);
+		cursor = end;
+		while (text[cursor] === "\n" && (out === "" || out.endsWith("\n\n"))) cursor++;
+	}
+	return out + text.slice(cursor);
+}
+function isCodeInclude(targetPath, attributes) {
+	if (attributes.lang) return true;
+	const ext = path$1.extname(targetPath);
+	return ext !== ".md" && ext !== ".mdx";
+}
+async function readCodeInclude(targetPath, section, attributes, state) {
+	const content = await readInclude(targetPath, state);
+	let value = content;
+	if (section) value = extractCodeRegion(content, section.trim(), targetPath);
+	return {
+		type: "code",
+		lang: attributes.lang ?? path$1.extname(targetPath).slice(1),
+		meta: attributes.meta ?? void 0,
+		value
+	};
+}
+async function readMarkdownInclude(targetPath, section, state) {
+	if (state.stack.includes(targetPath)) throw new Error(`Circular include detected: ${[...state.stack, targetPath].join(" -> ")}`);
+	const content = await readInclude(targetPath, state);
+	const body = frontmatter(content).content;
+	const ext = path$1.extname(targetPath);
+	let raw;
+	if (section) {
+		const extracted = extractSectionRaw(parseTree(body, ext).children, section, body);
+		if (extracted === void 0) throw new Error(`Cannot find section ${section} in ${targetPath}, make sure you have encapsulated the section in a <section id="${section}"> tag, or a :::section directive with remark-directive configured.`);
+		raw = extracted;
+	} else raw = body.trimEnd();
+	state.stack.push(targetPath);
+	try {
+		return await expandNestedIncludes(raw, targetPath, state);
+	} finally {
+		state.stack.pop();
+	}
+}
+async function readInclude(file, state) {
+	state.addDependency(file);
+	try {
+		return await readFile(file, "utf-8");
+	} catch (e) {
+		const from = state.stack.at(-1);
+		throw new Error(`failed to read file ${file}${from ? ` (included from ${from})` : ""}\n${e instanceof Error ? e.message : String(e)}`, { cause: e });
+	}
+}
+/**
+* The visitor pass only sees the entry document, so includes inside included
+* content must be expanded here: parse the content, then splice each nested
+* include's replacement text over its source span (back to front, so earlier
+* offsets stay valid).
+*/
+async function expandNestedIncludes(text, file, state) {
+	const tree = parseTree(text, path$1.extname(file));
+	const targets = [];
+	collectIncludes(tree.children, targets);
+	if (targets.length === 0) return text;
+	let out = text;
+	for (let i = targets.length - 1; i >= 0; i--) {
+		const target = targets[i];
+		const replacement = await resolveNestedInclude(target.node, file, state);
+		if (replacement === void 0) continue;
+		out = out.slice(0, target.start) + replacement + out.slice(target.end);
+	}
+	return out;
+}
+function collectIncludes(nodes, targets) {
+	for (const node of nodes) {
+		if (INCLUDE_TYPES.has(node.type) && node.name === "include") {
+			const start = node.position?.start.offset;
+			const end = node.position?.end.offset;
+			if (start !== void 0 && end !== void 0) targets.push({
+				node,
+				start,
+				end
+			});
+			continue;
+		}
+		if (Array.isArray(node.children)) collectIncludes(node.children, targets);
+	}
+}
+async function resolveNestedInclude(node, fromFile, state) {
+	const specifier = flattenNode(node).trim();
+	if (!specifier) return;
+	const attributes = parseElementAttributes(node);
+	const { file: relativePath, section } = parseSpecifier(specifier);
+	const baseDir = "cwd" in attributes ? state.cwd : path$1.dirname(fromFile);
+	const targetPath = path$1.resolve(baseDir, relativePath);
+	if (isCodeInclude(targetPath, attributes)) return toCodeFence(await readCodeInclude(targetPath, section, attributes, state));
+	return readMarkdownInclude(targetPath, section, state);
+}
+function toCodeFence(code) {
+	const longestRun = (code.value.match(/`+/g) ?? []).reduce((max, run) => {
+		return Math.max(max, run.length);
+	}, 2);
+	const fence = "`".repeat(longestRun + 1);
+	return `${fence}${[code.lang ?? "", code.meta ?? ""].filter(Boolean).join(" ")}\n${code.value}\n${fence}`;
+}
+function parseTree(source, ext) {
+	return (ext === ".mdx" ? mdxToMdast : markdownToMdast)(source, { features: PARSE_FEATURES });
+}
+function parseElementAttributes(element) {
+	if (!element.attributes) return {};
+	if (Array.isArray(element.attributes)) {
+		const attributes = {};
+		for (const attr of element.attributes) if (attr.type === "mdxJsxAttribute" && (typeof attr.value === "string" || attr.value === null)) attributes[attr.name] = attr.value;
+		return attributes;
+	}
+	return element.attributes;
+}
+function parseSpecifier(specifier) {
+	const idx = specifier.lastIndexOf("#");
+	if (idx === -1) return { file: specifier };
+	return {
+		file: specifier.slice(0, idx),
+		section: specifier.slice(idx + 1)
+	};
+}
+function sliceByPosition(source, start, end) {
+	if (start === void 0 || end === void 0) return void 0;
+	return source.slice(start, end);
+}
+const customIdRegex = /\s*\[#(?<slug>[^]+?)]\s*$/;
+function headingId(node, slugger) {
+	const dataId = node.data?.hProperties?.id;
+	if (dataId) return dataId;
+	const text = flattenNode(node);
+	const match = customIdRegex.exec(text);
+	if (match?.[1]) return match[1];
+	return slugger.slug(text);
+}
+function findSectionElement(nodes, section) {
+	for (const node of nodes) {
+		if ((node.type === "mdxJsxFlowElement" || node.type === "containerDirective") && node.name === "section" && parseElementAttributes(node).id === section) return node;
+		if (Array.isArray(node.children)) {
+			const found = findSectionElement(node.children, section);
+			if (found) return found;
+		}
+	}
+}
+function extractSectionRaw(children, section, source) {
+	const element = findSectionElement(children, section);
+	if (element) {
+		const kids = element.children ?? [];
+		if (kids.length === 0) return "";
+		return sliceByPosition(source, kids[0]?.position?.start.offset, kids[kids.length - 1]?.position?.end.offset);
+	}
+	const slugger = new Slugger();
+	let capturing = false;
+	let start;
+	let end;
+	for (const node of children) {
+		if (node.type === "heading") {
+			if (capturing) break;
+			if (headingId(node, slugger) === section) {
+				capturing = true;
+				start = node.position?.start.offset;
+				end = node.position?.end.offset;
+			}
+			continue;
+		}
+		if (capturing) end = node.position?.end.offset ?? end;
+	}
+	return sliceByPosition(source, start, end);
+}
+const REGION_MARKERS = [
+	{
+		start: /^\s*\/\/\s*#?region\b\s*(.*?)\s*$/,
+		end: /^\s*\/\/\s*#?endregion\b\s*(.*?)\s*$/
+	},
+	{
+		start: /^\s*<!--\s*#?region\b\s*(.*?)\s*-->/,
+		end: /^\s*<!--\s*#?endregion\b\s*(.*?)\s*-->/
+	},
+	{
+		start: /^\s*\/\*\s*#region\b\s*(.*?)\s*\*\//,
+		end: /^\s*\/\*\s*#endregion\b\s*(.*?)\s*\*\//
+	},
+	{
+		start: /^\s*#[rR]egion\b\s*(.*?)\s*$/,
+		end: /^\s*#[eE]nd ?[rR]egion\b\s*(.*?)\s*$/
+	},
+	{
+		start: /^\s*#\s*#?region\b\s*(.*?)\s*$/,
+		end: /^\s*#\s*#?endregion\b\s*(.*?)\s*$/
+	},
+	{
+		start: /^\s*(?:--|::|@?REM)\s*#region\b\s*(.*?)\s*$/,
+		end: /^\s*(?:--|::|@?REM)\s*#endregion\b\s*(.*?)\s*$/
+	},
+	{
+		start: /^\s*#pragma\s+region\b\s*(.*?)\s*$/,
+		end: /^\s*#pragma\s+endregion\b\s*(.*?)\s*$/
+	},
+	{
+		start: /^\s*\(\*\s*#region\b\s*(.*?)\s*\*\)/,
+		end: /^\s*\(\*\s*#endregion\b\s*(.*?)\s*\*\)/
+	}
+];
+function dedent(lines) {
+	const minIndent = lines.reduce((min, line) => {
+		const match = line.match(/^(\s*)\S/);
+		return match ? Math.min(min, match[1].length) : min;
+	}, Infinity);
+	return minIndent === Infinity ? lines.join("\n") : lines.map((l) => l.slice(minIndent)).join("\n");
+}
+function extractCodeRegion(content, regionName, file) {
+	const lines = content.split("\n");
+	for (let i = 0; i < lines.length; i++) for (const re of REGION_MARKERS) {
+		let match = re.start.exec(lines[i]);
+		if (match?.[1] !== regionName) continue;
+		let depth = 1;
+		const extractedLines = [];
+		for (let j = i + 1; j < lines.length; j++) {
+			match = re.start.exec(lines[j]);
+			if (match) {
+				depth++;
+				continue;
+			}
+			match = re.end.exec(lines[j]);
+			if (match) {
+				if (match[1] === regionName) depth = 0;
+				else if (match[1] === "") depth--;
+				else continue;
+				if (depth > 0) continue;
+				return dedent(extractedLines);
+			}
+			extractedLines.push(lines[j]);
+		}
+	}
+	throw new Error(`Region "${regionName}" not found in ${file}`);
+}
+//#endregion
+export { remarkInclude };

package/dist/remark-llms.d.ts

@@ -0,0 +1,36 @@
+import { o as ExtraPluginHooks } from "./compile-SBpZsgmI.js";
+import { MdastPluginEntry } from "satteri";
+//#region src/remark-llms.d.ts
+interface LLMsOptions {
+  /**
+   * export name for output Markdown.
+   *
+   * @default _markdown
+   */
+  as?: string;
+  /**
+   * Explicit heading IDs in output.
+   *
+   * @default true
+   */
+  headingIds?: boolean;
+  /**
+   * Form of the export:
+   *
+   * - `string`: the output Markdown.
+   * - `function`: a component: Markdown content is kept as authored source, while JSX elements
+   *   stay as JSX, receiving their original props and resolving from `props.components`.
+   *   Render it with `renderToMarkdown` from `@vx-oss/docs-core/server`, where a component
+   *   can call `asMarkdown()` to define its own Markdown form.
+   *
+   * @default string
+   */
+  output?: 'function' | 'string';
+}
+/**
+ * Export the document as Markdown, sliced from the authored source: heading IDs are added,
+ * frontmatter & ESM nodes are dropped, and includes are replaced with their content.
+ */
+declare function remarkLlms({ as, headingIds, output }?: LLMsOptions): MdastPluginEntry & ExtraPluginHooks;
+//#endregion
+export { LLMsOptions, remarkLlms };

package/dist/remark-llms.js

@@ -0,0 +1,191 @@
+import { r as offsets, t as createStringifier } from "./stringifier-COIWcXys.js";
+import { defineMdastPlugin } from "satteri";
+//#region src/remark-llms.ts
+const customIdRegex = /\s*\[#[^]+?]\s*$/;
+const componentNameRegex = /^[A-Z][\w$]*$/;
+/**
+* Export the document as Markdown, sliced from the authored source: heading IDs are added,
+* frontmatter & ESM nodes are dropped, and includes are replaced with their content.
+*/
+function remarkLlms({ as = "_markdown", headingIds = true, output = "string" } = {}) {
+	const jsx = output === "function";
+	const factory = () => {
+		const spans = [];
+		let s;
+		const drop = (node) => s.remove(node);
+		const collectJsx = (node) => {
+			if (!jsx || !node.name || !componentNameRegex.test(node.name)) return;
+			const pos = offsets(node);
+			if (!pos) return;
+			spans.push({
+				...pos,
+				name: node.name,
+				inline: node.type === "mdxJsxTextElement",
+				children: []
+			});
+		};
+		return defineMdastPlugin({
+			name: "remark-llms",
+			options: { position: true },
+			before(_root, ctx) {
+				s = createStringifier(ctx);
+			},
+			mdxjsEsm: drop,
+			yaml: drop,
+			toml: drop,
+			heading(node) {
+				const pos = offsets(node);
+				if (!pos) return;
+				const slice = s.source.slice(pos.start, pos.end);
+				const marker = customIdRegex.exec(slice);
+				if (!headingIds) {
+					if (marker) s.edit(pos.start + marker.index, pos.end, "");
+					return;
+				}
+				const id = node.data?.hProperties?.id;
+				if (typeof id === "string" && !marker) s.edit(pos.end, pos.end, ` [#${id}]`);
+			},
+			mdxJsxFlowElement: collectJsx,
+			mdxJsxTextElement: collectJsx,
+			after(root, ctx) {
+				const end = root.position?.end.offset ?? s.source.length;
+				if (!jsx) {
+					ctx.data.markdown ??= `${s.slice(0, end).trim()}\n`;
+					return;
+				}
+				if (!as) return;
+				const roots = buildTree(spans, s.edits);
+				ctx.prependChild(root, {
+					type: "mdxjsEsm",
+					value: toComponentCode(as, childrenToCode(s, 0, end, roots), roots.length > 0)
+				});
+			}
+		});
+	};
+	return Object.assign(factory, { collectExports({ data, addExport }) {
+		if (as && !jsx) addExport(as, JSON.stringify(data.markdown ?? ""));
+	} });
+}
+/**
+* Nest the pre-order span list by containment, dropping spans that overlap an edit
+* (e.g. a JSX element inside an include-replaced paragraph).
+*/
+function buildTree(spans, edits) {
+	const roots = [];
+	const stack = [];
+	let e = 0;
+	for (const span of spans) {
+		while (e < edits.length && edits[e].end <= span.start) e++;
+		if (e < edits.length && edits[e].start < span.end && edits[e].end > span.start) continue;
+		while (stack.length > 0 && stack[stack.length - 1].end <= span.start) stack.pop();
+		const parent = stack[stack.length - 1];
+		(parent ? parent.children : roots).push(span);
+		stack.push(span);
+	}
+	return roots;
+}
+function toComponentCode(as, body, hasJsx) {
+	return [
+		`import { asMarkdown as _asMarkdown${hasJsx ? ", jsxComponents as _jsxComponents" : ""} } from "@vx-oss/docs-core/server";`,
+		`export function ${as}(props) {`,
+		"  if (!_asMarkdown()) return null;",
+		...hasJsx ? ["  const _c = _jsxComponents(props.components);"] : [],
+		`  return ${body};`,
+		"}"
+	].join("\n");
+}
+/**
+* Generate the JSX for the document: Markdown becomes string literals, kept
+* elements stay as JSX with `_c.`-prefixed names and their attributes verbatim.
+*/
+function childrenToCode(s, start, end, spans) {
+	if (spans.length === 0) {
+		const text = s.slice(start, end).trim();
+		return text ? JSON.stringify(`${text}\n`) : "\"\"";
+	}
+	return `<>${innerToCode(s, start, end, spans)}</>`;
+}
+function elementToCode(s, span) {
+	const tagEnd = scanTagEnd(s.source, span.start, span.end);
+	const open = `<_c.${s.source.slice(span.start + 1, tagEnd + 1)}`;
+	let out;
+	if (s.source[tagEnd - 1] === "/") out = open;
+	else {
+		const closeStart = s.source.lastIndexOf("</", span.end);
+		out = `${open}${innerToCode(s, tagEnd + 1, closeStart, span.children)}</_c.${span.name}>`;
+	}
+	return span.inline ? `<span>${out}</span>` : out;
+}
+function innerToCode(s, start, end, children) {
+	const indent = commonIndent(s.source.slice(start, end));
+	const parts = [];
+	let cursor = start;
+	const pushText = (text) => {
+		if (text.trim()) parts.push(`{${JSON.stringify(dedent(text, indent))}}`);
+	};
+	for (const child of children) {
+		pushText(s.slice(cursor, child.start));
+		parts.push(elementToCode(s, child));
+		cursor = child.end;
+	}
+	pushText(s.slice(cursor, end));
+	return parts.join("");
+}
+/** the authored indentation of an element's children, stripped from their chunks */
+function commonIndent(text) {
+	let min = Infinity;
+	for (const line of text.split("\n")) {
+		if (line.trim().length === 0) continue;
+		let i = 0;
+		while (line[i] === " ") i++;
+		min = Math.min(min, i);
+	}
+	return min === Infinity ? 0 : min;
+}
+function dedent(text, indent) {
+	if (indent === 0) return text;
+	const lines = text.split("\n");
+	let out = "";
+	for (let j = 0; j < lines.length; j++) {
+		if (j > 0) out += "\n";
+		let i = 0;
+		while (i < indent && lines[j][i] === " ") i++;
+		out += lines[j].slice(i);
+	}
+	return out;
+}
+/**
+* Index of the `>` ending the opening tag. Quotes at brace depth 0 are JSX attribute
+* strings (no escapes); quotes inside `{}` follow JavaScript escaping.
+*/
+function scanTagEnd(source, start, end) {
+	let quote = "";
+	let depth = 0;
+	for (let i = start + 1; i < end; i++) {
+		const c = source[i];
+		if (quote) {
+			if (c === "\\" && depth > 0) i++;
+			else if (c === quote) quote = "";
+			continue;
+		}
+		switch (c) {
+			case "\"":
+			case "'":
+				quote = c;
+				break;
+			case "`":
+				if (depth > 0) quote = c;
+				break;
+			case "{":
+				depth++;
+				break;
+			case "}":
+				depth--;
+				break;
+			case ">": if (depth === 0) return i;
+		}
+	}
+	return end - 1;
+}
+//#endregion
+export { remarkLlms };

package/dist/remark-mdx-mermaid.d.ts

@@ -0,0 +1,10 @@
+//#region src/remark-mdx-mermaid.d.ts
+interface RemarkMdxMermaidOptions {
+  lang?: string;
+}
+declare function remarkMdxMermaid({ lang }?: RemarkMdxMermaidOptions): {
+  name: string;
+  code(node: Readonly<import("mdast").Code>, ctx: import("satteri").MdastVisitorContext): undefined;
+};
+//#endregion
+export { RemarkMdxMermaidOptions, remarkMdxMermaid };

package/dist/remark-mdx-mermaid.js

@@ -0,0 +1,22 @@
+import { defineMdastPlugin } from "satteri";
+//#region src/remark-mdx-mermaid.ts
+function remarkMdxMermaid({ lang = "mermaid" } = {}) {
+	return defineMdastPlugin({
+		name: "remark-mdx-mermaid",
+		code(node, ctx) {
+			if (node.lang !== lang || !node.value) return;
+			ctx.replaceNode(node, {
+				type: "mdxJsxFlowElement",
+				name: "Mermaid",
+				attributes: [{
+					type: "mdxJsxAttribute",
+					name: "chart",
+					value: node.value.trim()
+				}],
+				children: []
+			});
+		}
+	});
+}
+//#endregion
+export { remarkMdxMermaid };

package/dist/remark-npm-DdmTKhyi.d.ts

@@ -0,0 +1,18 @@
+//#region src/remark-npm.d.ts
+interface PackageManager {
+  name: string;
+  value?: string;
+  command: (command: string) => string | undefined;
+}
+interface RemarkNpmOptions {
+  persist?: {
+    id: string;
+  } | false;
+  packageManagers?: PackageManager[];
+}
+declare function remarkNpm({ persist, packageManagers }?: RemarkNpmOptions): {
+  name: string;
+  code(node: Readonly<import("mdast").Code>, ctx: import("satteri").MdastVisitorContext): undefined;
+};
+//#endregion
+export { remarkNpm as n, RemarkNpmOptions as t };

package/dist/remark-npm.d.ts

@@ -0,0 +1,2 @@
+import { n as remarkNpm, t as RemarkNpmOptions } from "./remark-npm-DdmTKhyi.js";
+export { RemarkNpmOptions, remarkNpm };

package/dist/remark-npm.js

@@ -0,0 +1,72 @@
+import { defineMdastPlugin } from "satteri";
+import { generateCodeBlockTabs } from "@vx-oss/docs-core/mdx-plugins/codeblock-utils";
+import convert from "npm-to-yarn";
+//#region src/remark-npm.ts
+function convertLines(cmd, to) {
+	return cmd.split("\n").map((l) => convert(l, to)).join("\n");
+}
+function remarkNpm({ persist = false, packageManagers = [
+	{
+		command: (cmd) => cmd,
+		name: "npm"
+	},
+	{
+		command: (cmd) => convertLines(cmd, "pnpm"),
+		name: "pnpm"
+	},
+	{
+		command: (cmd) => convertLines(cmd, "yarn"),
+		name: "yarn"
+	},
+	{
+		command: (cmd) => convertLines(cmd, "bun"),
+		name: "bun"
+	}
+] } = {}) {
+	return defineMdastPlugin({
+		name: "remark-npm",
+		code(node, ctx) {
+			let code;
+			switch (node.lang) {
+				case "package-install":
+					code = node.value;
+					if (!code.startsWith("npm") && !code.startsWith("npx")) code = `npm install ${code}`;
+					break;
+				case "npm":
+					code = node.value;
+					break;
+				default: return;
+			}
+			const options = {
+				persist,
+				tabs: [],
+				triggers: []
+			};
+			for (const manager of packageManagers) {
+				const value = manager.value ?? manager.name;
+				const command = manager.command(code);
+				if (!command || command.length === 0) continue;
+				options.defaultValue ??= value;
+				options.triggers.push({
+					value,
+					children: [{
+						type: "text",
+						value: manager.name
+					}]
+				});
+				options.tabs.push({
+					value,
+					children: [{
+						type: "code",
+						lang: "bash",
+						meta: node.meta,
+						value: command
+					}]
+				});
+			}
+			ctx.replaceNode(node, generateCodeBlockTabs(options));
+		}
+	});
+}
+//#endregion
+export { remarkNpm };