@vx-oss/docs-satteri 1.0.3

package/dist/remark-code-tab.js

@@ -0,0 +1,170 @@
+import { defineMdastPlugin, mdxToMdast } from "satteri";
+import { generateCodeBlockTabs, parseCodeBlockAttributes } from "@vx-oss/docs-core/mdx-plugins/codeblock-utils";
+//#region src/remark-code-tab.ts
+function parseTabAttributes(node) {
+	if (!node || node.type !== "code" || !node.meta) return;
+	const parsed = parseCodeBlockAttributes(node.meta, ["tab", "tab-group"]);
+	if (!parsed.attributes.tab) return;
+	return parsed;
+}
+function parseTabName(name) {
+	try {
+		const children = (mdxToMdast(name, { position: false }).children ?? []).flatMap((child) => child.type === "paragraph" ? child.children : child);
+		if (children.length > 0) return children;
+	} catch {}
+	return [{
+		type: "text",
+		value: name
+	}];
+}
+function buildTabs(entries, mode, withMdx) {
+	if (mode === "CodeBlockTabs") {
+		const options = {
+			triggers: [],
+			tabs: [],
+			defaultValue: entries[0].name
+		};
+		if (entries[0].tabGroup) options.persist = { id: entries[0].tabGroup };
+		for (const { name, codes } of entries) {
+			options.triggers.push({
+				value: name,
+				children: withMdx ? parseTabName(name) : [{
+					type: "text",
+					value: name
+				}]
+			});
+			options.tabs.push({
+				value: name,
+				children: codes
+			});
+		}
+		return generateCodeBlockTabs(options);
+	}
+	if (!withMdx) return {
+		type: "mdxJsxFlowElement",
+		name: "Tabs",
+		attributes: [{
+			type: "mdxJsxAttribute",
+			name: "items",
+			value: {
+				type: "mdxJsxAttributeValueExpression",
+				value: JSON.stringify(entries.map(({ name }) => name))
+			}
+		}],
+		children: entries.map(({ name, codes }) => ({
+			type: "mdxJsxFlowElement",
+			name: "Tab",
+			attributes: [{
+				type: "mdxJsxAttribute",
+				name: "value",
+				value: name
+			}],
+			children: codes
+		}))
+	};
+	const children = [{
+		type: "mdxJsxFlowElement",
+		name: "TabsList",
+		attributes: [],
+		children: entries.map(({ name }) => ({
+			type: "mdxJsxFlowElement",
+			name: "TabsTrigger",
+			attributes: [{
+				type: "mdxJsxAttribute",
+				name: "value",
+				value: name
+			}],
+			children: parseTabName(name)
+		}))
+	}];
+	for (const { name, codes } of entries) children.push({
+		type: "mdxJsxFlowElement",
+		name: "TabsContent",
+		attributes: [{
+			type: "mdxJsxAttribute",
+			name: "value",
+			value: name
+		}],
+		children: codes
+	});
+	return {
+		type: "mdxJsxFlowElement",
+		name: "Tabs",
+		attributes: [{
+			type: "mdxJsxAttribute",
+			name: "defaultValue",
+			value: entries[0].name
+		}],
+		children
+	};
+}
+/** author-written tab containers whose code blocks are already grouped */
+const TAB_CONTAINERS = /* @__PURE__ */ new Set([
+	"CodeBlockTabs",
+	"CodeBlockTab",
+	"CodeBlockTabsList",
+	"CodeBlockTabsTrigger"
+]);
+function collectEntries(children, start, end) {
+	const entries = [];
+	for (let i = start; i < end; i++) {
+		const item = children[i];
+		const parsed = parseTabAttributes(item);
+		const name = typeof parsed.attributes.tab === "string" ? parsed.attributes.tab : `Tab ${i - start + 1}`;
+		const copy = {
+			...item,
+			meta: parsed.rest || void 0
+		};
+		const existing = entries.find((entry) => entry.name === name);
+		if (existing) existing.codes.push(copy);
+		else entries.push({
+			name,
+			tabGroup: typeof parsed.attributes["tab-group"] === "string" ? parsed.attributes["tab-group"] : void 0,
+			codes: [copy]
+		});
+	}
+	return entries;
+}
+function isInsideTabContainer(node, ctx) {
+	let parent = ctx.parent(node);
+	while (parent) {
+		if (parent.type === "mdxJsxFlowElement" && TAB_CONTAINERS.has(parent.name ?? "")) return true;
+		parent = ctx.parent(parent);
+	}
+	return false;
+}
+function remarkCodeTab({ parseMdx = false, Tabs = "CodeBlockTabs" } = {}) {
+	return () => {
+		const parents = /* @__PURE__ */ new Set();
+		return defineMdastPlugin({
+			name: "remark-code-tab",
+			code(node, ctx) {
+				if (!parseTabAttributes(node) || isInsideTabContainer(node, ctx)) return;
+				const parent = ctx.parent(node);
+				if (parent && "children" in parent) parents.add(parent);
+			},
+			after(_root, ctx) {
+				for (const parent of parents) {
+					const children = parent.children;
+					let rebuilt;
+					for (let i = 0; i < children.length;) {
+						const node = children[i];
+						if (!parseTabAttributes(node)) {
+							rebuilt?.push(node);
+							i++;
+							continue;
+						}
+						let end = i + 1;
+						while (end < children.length && parseTabAttributes(children[end])) end++;
+						rebuilt ??= children.slice(0, i);
+						rebuilt.push(buildTabs(collectEntries(children, i, end), Tabs, parseMdx));
+						i = end;
+					}
+					if (rebuilt) ctx.setProperty(parent, "children", rebuilt);
+				}
+			}
+		});
+	};
+}
+//#endregion
+export { remarkCodeTab };

package/dist/remark-directive-admonition.d.ts

@@ -0,0 +1,13 @@
+import { MdastPluginDefinition } from "satteri";
+//#region src/remark-directive-admonition.d.ts
+interface RemarkDirectiveAdmonitionOptions {
+  tags?: {
+    CalloutContainer?: string;
+    CalloutTitle?: string;
+    CalloutDescription?: string;
+  };
+  types?: Record<string, string>;
+}
+declare function remarkDirectiveAdmonition(options?: RemarkDirectiveAdmonitionOptions): MdastPluginDefinition;
+//#endregion
+export { RemarkDirectiveAdmonitionOptions, remarkDirectiveAdmonition };

package/dist/remark-directive-admonition.js

@@ -0,0 +1,54 @@
+import { defineMdastPlugin } from "satteri";
+//#region src/remark-directive-admonition.ts
+function remarkDirectiveAdmonition(options = {}) {
+	const { tags: { CalloutContainer = "CalloutContainer", CalloutTitle = "CalloutTitle", CalloutDescription = "CalloutDescription" } = {}, types = {
+		note: "info",
+		tip: "info",
+		info: "info",
+		warn: "warning",
+		warning: "warning",
+		danger: "error",
+		success: "success"
+	} } = options;
+	return defineMdastPlugin({
+		name: "remark-directive-admonition",
+		containerDirective(node, ctx) {
+			if (!(node.name in types)) return;
+			const attributes = [{
+				type: "mdxJsxAttribute",
+				name: "type",
+				value: types[node.name]
+			}];
+			for (const [k, v] of Object.entries(node.attributes ?? {})) attributes.push({
+				type: "mdxJsxAttribute",
+				name: k,
+				value: String(v)
+			});
+			const titleNodes = [];
+			const descriptionNodes = [];
+			for (const item of node.children) if (item.type === "paragraph" && item.data?.directiveLabel) titleNodes.push(...item.children);
+			else descriptionNodes.push(item);
+			const children = [];
+			if (titleNodes.length > 0) children.push({
+				type: "mdxJsxFlowElement",
+				name: CalloutTitle,
+				attributes: [],
+				children: titleNodes
+			});
+			if (descriptionNodes.length > 0) children.push({
+				type: "mdxJsxFlowElement",
+				name: CalloutDescription,
+				attributes: [],
+				children: descriptionNodes
+			});
+			ctx.replaceNode(node, {
+				type: "mdxJsxFlowElement",
+				attributes,
+				name: CalloutContainer,
+				children
+			});
+		}
+	});
+}
+//#endregion
+export { remarkDirectiveAdmonition };

package/dist/remark-feedback-block.d.ts

@@ -0,0 +1,18 @@
+import { MdastNode, MdastVisitorContext } from "satteri";
+//#region src/remark-feedback-block.d.ts
+interface RemarkFeedbackBlockOptions {
+  generateHash?: (ctx: {
+    body: string;
+  }) => string;
+  tagName?: string;
+  resolve?: (node: MdastNode) => boolean | 'skip';
+  generateBody?: boolean;
+}
+declare function remarkFeedbackBlock({ generateHash, tagName, resolve, generateBody }?: RemarkFeedbackBlockOptions): () => {
+  name: string;
+  paragraph: (node: MdastNode, ctx: MdastVisitorContext) => void;
+  image: (node: MdastNode, ctx: MdastVisitorContext) => void;
+  listItem: (node: MdastNode, ctx: MdastVisitorContext) => void;
+};
+//#endregion
+export { RemarkFeedbackBlockOptions, remarkFeedbackBlock };

package/dist/remark-feedback-block.js

@@ -0,0 +1,51 @@
+import { defineMdastPlugin } from "satteri";
+import { createHash } from "node:crypto";
+//#region src/remark-feedback-block.ts
+function remarkFeedbackBlock({ generateHash = ({ body }) => createHash("md5").update(body).digest("hex").substring(0, 16), tagName = "FeedbackBlock", resolve = (node) => {
+	switch (node.type) {
+		case "mdxJsxFlowElement": return "skip";
+		case "paragraph":
+		case "image":
+		case "listItem": return true;
+		default: return false;
+	}
+}, generateBody = true } = {}) {
+	return () => {
+		const counts = /* @__PURE__ */ new Map();
+		function visit(node, ctx) {
+			const resolved = resolve(node);
+			if (resolved === false || resolved === "skip") return;
+			const text = ctx.textContent(node, { includeImageAlt: false }).trim();
+			if (text.length === 0) return;
+			let id = generateHash({ body: text });
+			const count = counts.get(id) ?? 0;
+			if (count > 0) id = `${id}-${count}`;
+			counts.set(id, count + 1);
+			const attributes = [{
+				type: "mdxJsxAttribute",
+				name: "id",
+				value: id
+			}];
+			if (generateBody) attributes.push({
+				type: "mdxJsxAttribute",
+				name: "body",
+				value: text
+			});
+			ctx.wrapNode(node, {
+				type: "mdxJsxFlowElement",
+				name: tagName,
+				attributes,
+				data: { _stringify: "children-only" },
+				children: []
+			});
+		}
+		return defineMdastPlugin({
+			name: "remark-feedback-block",
+			paragraph: visit,
+			image: visit,
+			listItem: visit
+		});
+	};
+}
+//#endregion
+export { remarkFeedbackBlock };

package/dist/remark-heading-CYhI2Dkg.d.ts

@@ -0,0 +1,15 @@
+import { MdastVisitorContext } from "satteri";
+import { Heading } from "mdast";
+//#region src/remark-heading.d.ts
+interface RemarkHeadingOptions {
+  slug?: (heading: Heading, text: string) => string;
+  customId?: boolean;
+  generateToc?: boolean;
+}
+declare function remarkHeading({ slug, customId, generateToc }?: RemarkHeadingOptions): () => {
+  name: string;
+  before(_root: Readonly<import("mdast").Root>, ctx: MdastVisitorContext): void;
+  heading(node: Readonly<Heading>, ctx: MdastVisitorContext): undefined;
+};
+//#endregion
+export { remarkHeading as n, RemarkHeadingOptions as t };

package/dist/remark-heading.d.ts

@@ -0,0 +1,2 @@
+import { n as remarkHeading, t as RemarkHeadingOptions } from "./remark-heading-CYhI2Dkg.js";
+export { RemarkHeadingOptions, remarkHeading };

package/dist/remark-heading.js

@@ -0,0 +1,43 @@
+import Slugger from "github-slugger";
+import { defineMdastPlugin } from "satteri";
+//#region src/remark-heading.ts
+const regex = /\s*\[#(?<slug>[^]+?)]\s*$/;
+function remarkHeading({ slug, customId = true, generateToc = true } = {}) {
+	return () => {
+		let resolveSlug = slug;
+		if (!resolveSlug) {
+			const slugger = new Slugger();
+			resolveSlug = (_, v) => slugger.slug(v);
+		}
+		return defineMdastPlugin({
+			name: "remark-heading",
+			before(_root, ctx) {
+				if (generateToc) ctx.data.toc ??= [];
+			},
+			heading(node, ctx) {
+				const data = { ...node.data };
+				const hProperties = data.hProperties = { ...data.hProperties };
+				let title = ctx.textContent(node);
+				const lastNode = node.children.at(-1);
+				if (lastNode?.type === "text" && customId) {
+					const match = regex.exec(lastNode.value);
+					if (match?.[1]) {
+						hProperties.id = match[1];
+						const stripped = lastNode.value.slice(0, match.index);
+						title = title.slice(0, title.length - lastNode.value.length) + stripped;
+						ctx.setProperty(lastNode, "value", stripped);
+					}
+				}
+				if (!hProperties.id) hProperties.id = resolveSlug(node, title);
+				ctx.setProperty(node, "data", data);
+				ctx.data.toc?.push({
+					title,
+					url: `#${hProperties.id}`,
+					depth: node.depth
+				});
+			}
+		});
+	};
+}
+//#endregion
+export { remarkHeading };

package/dist/remark-image-C28nbosW.d.ts

@@ -0,0 +1,29 @@
+import { o as ExtraPluginHooks } from "./compile-SBpZsgmI.js";
+import { MdastPluginDefinition } from "satteri";
+//#region src/remark-image.d.ts
+type ExternalImageOptions = {
+  timeout?: number;
+} | boolean;
+type ImageSize = {
+  width: number;
+  height: number;
+};
+interface RemarkImageOptions {
+  publicDir?: string;
+  placeholder?: 'blur' | 'none';
+  onError?: 'error' | 'hide' | 'ignore' | ((error: Error) => void);
+  useImport?: boolean;
+  external?: ExternalImageOptions;
+}
+type Source = {
+  type: 'url';
+  url: URL;
+} | {
+  type: 'file';
+  file: string;
+};
+declare function remarkImage({ placeholder, external, useImport, onError, publicDir }?: RemarkImageOptions): MdastPluginDefinition & ExtraPluginHooks;
+declare function parseSrc(src: string, publicDir: string, dir?: string): Source | undefined;
+declare function getImageSize(src: Source, onExternal: ExternalImageOptions, cache?: Map<string, Promise<ImageSize | undefined>>): Promise<ImageSize | undefined>;
+//#endregion
+export { remarkImage as i, getImageSize as n, parseSrc as r, RemarkImageOptions as t };

package/dist/remark-image.d.ts

@@ -0,0 +1,2 @@
+import { i as remarkImage, n as getImageSize, r as parseSrc, t as RemarkImageOptions } from "./remark-image-C28nbosW.js";
+export { RemarkImageOptions, getImageSize, parseSrc, remarkImage };

package/dist/remark-image.js

@@ -0,0 +1,141 @@
+import * as path$1 from "node:path";
+import { fileURLToPath } from "node:url";
+//#region src/remark-image.ts
+const VALID_BLUR_EXT = [
+	".jpeg",
+	".png",
+	".webp",
+	".avif",
+	".jpg"
+];
+const EXTERNAL_URL_REGEX = /^https?:\/\//;
+function remarkImage({ placeholder = "none", external = true, useImport = true, onError = "error", publicDir = path$1.join(process.cwd(), "public") } = {}) {
+	const sizeCache = /* @__PURE__ */ new Map();
+	return {
+		name: "remark-image",
+		afterToJs({ result, outputFormat }) {
+			if (outputFormat === "program" && result.data._imageImports) result.code += `\n${result.data._imageImports.join("\n")}`;
+		},
+		async image(node, ctx) {
+			const dir = ctx.fileURL ? path$1.dirname(fileURLToPath(ctx.fileURL)) : void 0;
+			const src = parseSrc(decodeURI(node.url), publicDir, dir);
+			if (!src) return;
+			try {
+				await updateImage(src, node, ctx, {
+					placeholder,
+					useImport,
+					external,
+					dir,
+					sizeCache
+				});
+			} catch (error) {
+				if (onError === "ignore" || node.url.endsWith(".svg")) return;
+				else if (onError === "hide") ctx.removeNode(node);
+				else if (typeof onError === "function") onError(error);
+				else throw error;
+			}
+		}
+	};
+}
+async function updateImage(src, node, ctx, options) {
+	if (src.type === "file" && options.useImport) {
+		if (!options.dir) throw new Error("When `useImport` is enabled, pass `fileURL` to the compiler so image paths can be resolved.");
+		const imports = ctx.data._imageImports ??= [];
+		const variableName = `__img${imports.length}`;
+		const importPath = getImportPath(src.file, options.dir);
+		imports.push(`import ${variableName} from ${JSON.stringify(importPath)};`);
+		const out = {
+			type: "mdxJsxFlowElement",
+			name: "img",
+			children: [],
+			attributes: [{
+				type: "mdxJsxAttribute",
+				name: "alt",
+				value: node.alt ?? "image"
+			}, {
+				type: "mdxJsxAttribute",
+				name: "src",
+				value: {
+					type: "mdxJsxAttributeValueExpression",
+					value: variableName
+				}
+			}]
+		};
+		if (node.title) out.attributes.push({
+			type: "mdxJsxAttribute",
+			name: "title",
+			value: node.title
+		});
+		if (options.placeholder === "blur" && VALID_BLUR_EXT.some((ext) => src.file.endsWith(ext))) out.attributes.push({
+			type: "mdxJsxAttribute",
+			name: "placeholder",
+			value: "blur"
+		});
+		ctx.replaceNode(node, out);
+		return;
+	}
+	const size = await getImageSize(src, options.external, options.sizeCache);
+	if (!size) return;
+	const data = { ...node.data };
+	const props = { ...data.hProperties };
+	props.src = src.type === "url" ? src.url.href : node.url;
+	props.width = size.width.toString();
+	props.height = size.height.toString();
+	data.hProperties = props;
+	ctx.setProperty(node, "data", data);
+}
+function getImportPath(file, dir) {
+	const relative = path$1.relative(dir, file).replaceAll(path$1.sep, "/");
+	return relative.startsWith("../") ? relative : `./${relative}`;
+}
+function parseSrc(src, publicDir, dir) {
+	if (src.startsWith("file:///")) return {
+		type: "file",
+		file: fileURLToPath(src)
+	};
+	if (EXTERNAL_URL_REGEX.test(src)) return {
+		type: "url",
+		url: new URL(src)
+	};
+	if (src.startsWith("/")) {
+		if (EXTERNAL_URL_REGEX.test(publicDir)) {
+			const url = new URL(publicDir);
+			url.pathname = `/${[...url.pathname.split("/"), ...src.split("/")].filter((v) => v.length > 0).join("/")}`;
+			return {
+				type: "url",
+				url
+			};
+		}
+		return {
+			type: "file",
+			file: path$1.join(publicDir, src)
+		};
+	}
+	if (!dir) return;
+	return {
+		type: "file",
+		file: path$1.join(dir, src)
+	};
+}
+function getSizeCacheKey(src, onExternal) {
+	if (src.type === "file") return `file:${src.file}`;
+	return `url:${(typeof onExternal === "object" ? onExternal.timeout : void 0) ?? ""}:${src.url.href}`;
+}
+async function getImageSize(src, onExternal, cache) {
+	if (!cache) return loadImageSize(src, onExternal);
+	const key = getSizeCacheKey(src, onExternal);
+	const cached = cache.get(key);
+	if (cached) return cached;
+	const result = loadImageSize(src, onExternal);
+	cache.set(key, result);
+	return result;
+}
+async function loadImageSize(src, onExternal) {
+	const { probe } = await import("@vx-oss/docs-image-size");
+	if (src.type === "file") return probe(src.file);
+	if (onExternal === false) return;
+	const { timeout } = typeof onExternal === "object" ? onExternal : {};
+	return probe(src.url, { timeout });
+}
+//#endregion
+export { getImageSize, parseSrc, remarkImage };

package/dist/remark-include.d.ts

@@ -0,0 +1,22 @@
+import { MdastPluginDefinition } from "satteri";
+//#region src/remark-include.d.ts
+interface RemarkIncludeOptions {
+  /**
+   * Base directory for includes with the `cwd` attribute, and the fallback
+   * when the document has no `fileURL`.
+   *
+   * @defaultValue process.cwd()
+   */
+  cwd?: string;
+}
+/**
+ * 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.
+ */
+declare function remarkInclude({ cwd }?: RemarkIncludeOptions): MdastPluginDefinition;
+//#endregion
+export { RemarkIncludeOptions, remarkInclude };