comark-table 0.7.6 → 0.8.1

package/README.md

@@ -42,7 +42,7 @@ The plugin adds every problem to `meta.issues`, so a host can reject a document
 
 | Renderer | Import |
 | --- | --- |
-| `@comark/html` | `comark-table/html`: the script and styles are inlined once per document |
+| `@comark/html` | `comark-table/html`: the script and styles are inlined |
 | `@comark/vue` | `comark-table/vue` |
 | `@comark/react` | `comark-table/react` |
 | `@comark/svelte` | `comark-table/svelte` |

package/dist/{client-C5bRu9NG.mjs → client-CDdgxJF0.mjs}

@@ -1,60 +1,4 @@
-//#region ../zoom/dist/theme.mjs
-const tokens = [
-	[
-		"background",
-		"ui-bg",
-		"background",
-		"#fff",
-		"#0a0a0a"
-	],
-	[
-		"foreground",
-		"ui-text-highlighted",
-		"foreground",
-		"#0a0a0a",
-		"#fafafa"
-	],
-	[
-		"muted",
-		"ui-text-muted",
-		"muted-foreground",
-		"#737373",
-		"#a1a1a1"
-	],
-	[
-		"border",
-		"ui-border",
-		"border",
-		"#e5e5e5",
-		"rgb(255 255 255/.1)"
-	],
-	[
-		"accent",
-		"ui-bg-elevated",
-		"accent",
-		"#f5f5f5",
-		"#262626"
-	],
-	[
-		"ring",
-		"ui-primary",
-		"ring",
-		"#a1a1a1",
-		"#737373"
-	]
-];
-const resolve = (scheme) => tokens.map((token) => `--_comark-${token[0]}:var(--comark-${token[0]},var(--${token[1]},var(--${token[2]},${token[scheme]})))`).join(";");
-/**
-* Resolves the `--comark-*` tokens on `selector`, falling back to Nuxt UI's variables, then shadcn/ui's, then shadcn's
-* neutral theme. Nuxt UI's corners are twice its `--ui-radius`, so the radius halves shadcn's to double it back.
-* They resolve on the component rather than `:root`, so a `.dark` class anywhere above it switches the theme, and a
-* `--comark-*` set on any ancestor still inherits down. `:where()` keeps them at zero specificity.
-*/
-function theme(selector) {
-	const where = `:where(${selector})`;
-	return `${where}{${resolve(3)};--_comark-radius:var(--comark-radius,calc(var(--ui-radius,calc(var(--radius,.625rem)/2))*2));--_comark-font:var(--comark-font,var(--font-sans,ui-sans-serif,system-ui,sans-serif))}@media (prefers-color-scheme:dark){${where}{${resolve(4)}}}`;
-}
-//#endregion
+import { n as theme } from "./theme-WGjRIAmX.mjs";
 //#region src/styles.ts
 /**
 * A table that scrolls sideways in place, with a Copy button and a menu of formats above it and headers that sort, on the shared
@@ -62,7 +6,7 @@ function theme(selector) {
 * so any unlayered rule of the host's wins.
 */
 const css = `@layer comark{${[
-	theme(".ctb"),
+	theme(".ctb", "shadow"),
 	".ctb{margin:1.5rem 0}",
 	".ctb-scroll{overflow-x:auto}",
 	".ctb-scroll>table{margin:0}",
@@ -77,7 +21,7 @@ const css = `@layer comark{${[
 	"@media (hover:hover){.ctb-copy>button:hover,.ctb-menu button:hover{background:var(--_comark-accent);color:var(--_comark-foreground)}}",
 	".ctb-copy-main svg+svg,.ctb-copy-main[data-state=done] svg:first-child{display:none}",
 	".ctb-copy-main[data-state=done] svg+svg{display:block}",
-	".ctb-menu{position:absolute;top:calc(100% + .25rem);right:-1px;z-index:10;display:grid;min-width:15rem;padding:.25rem;border:1px solid var(--_comark-border);border-radius:var(--_comark-radius);background:var(--_comark-background);box-shadow:0 4px 16px rgb(0 0 0/.12),0 1px 3px rgb(0 0 0/.08)}",
+	".ctb-menu{position:absolute;top:calc(100% + .25rem);right:-1px;z-index:10;display:grid;min-width:15rem;padding:.25rem;border:1px solid var(--_comark-border);border-radius:var(--_comark-radius);background:var(--_comark-background);box-shadow:var(--_comark-shadow)}",
 	".ctb-menu[hidden]{display:none}",
 	".ctb-menu button{display:grid;grid-template-columns:.875rem 1fr;gap:.5rem;align-items:start;padding:.375rem .5rem;border:0;border-radius:calc(var(--_comark-radius) - 4px);background:none;color:var(--_comark-foreground);font:inherit;text-align:start;cursor:pointer}",
 	".ctb-menu button:focus-visible{outline:none;background:var(--_comark-accent)}",
@@ -91,7 +35,7 @@ const css = `@layer comark{${[
 	"html[data-table-ready] .ctb-sort::after{content:'↕';color:var(--_comark-muted);font-weight:400}",
 	"html[data-table-ready] [aria-sort='ascending']>.ctb-sort::after{content:'↑';color:inherit}",
 	"html[data-table-ready] [aria-sort='descending']>.ctb-sort::after{content:'↓';color:inherit}",
-	".ctb-copy>button:focus-visible{outline:none;box-shadow:0 0 0 3px color-mix(in srgb,var(--_comark-ring) 50%,transparent)}",
+	".ctb-copy>button:focus-visible{outline:none;box-shadow:0 0 0 3px color-mix(in srgb,var(--_comark-ring) 50%,transparent)!important}",
 	".ctb-sort:focus-visible{outline:none;border-radius:calc(var(--_comark-radius) - 4px);box-shadow:0 0 0 3px color-mix(in srgb,var(--_comark-ring) 50%,transparent)!important}",
 	"@media print{.ctb-bar{display:none}.ctb-sort::after{content:none!important}}"
 ].join("")}}`;

package/dist/client.mjs

@@ -1 +1 @@
-export { t as bar, r as css, n as start } from "./client-C5bRu9NG.mjs";
+export { t as bar, r as css, n as start } from "./client-CDdgxJF0.mjs";

package/dist/html.mjs

@@ -1,5 +1,5 @@
-import src_default, { TABLE_TAG } from "./index.mjs";
-import { n as start, r as css, t as bar } from "./client-C5bRu9NG.mjs";
+import { n as src_default, t as TABLE_TAG } from "./src-BV7IF9ld.mjs";
+import { n as start, r as css, t as bar } from "./client-CDdgxJF0.mjs";
 //#region src/html.ts
 const started = /* @__PURE__ */ new WeakSet();
 /** The table script as one inline `<script>`, once per render. */

package/dist/index.mjs

@@ -1,433 +1 @@
-import { defineComarkPlugin } from "comark";
-import { resolveAttributes } from "comark/render";
-//#region src/index.ts
-/** The tag the plugin's tables carry, since `::table` shares its name with every Markdown table. */
-const TABLE_TAG = "data-table";
-const FORMATS = /* @__PURE__ */ new Set([
-	"csv",
-	"tsv",
-	"json"
-]);
-const NUMBER = /^[+-]?(?:\d[\d,]*(?:\.\d+)?|\.\d+)(?:\s*\S{1,4})?$/;
-const isElement = (node) => Array.isArray(node) && node[0] !== null;
-const childrenOf = ([, , ...rest]) => rest;
-const isContent = (node) => Array.isArray(node) ? node[0] !== null : node.trim() !== "";
-const textOf = (node) => !Array.isArray(node) ? node : isElement(node) ? childrenOf(node).map(textOf).join("") : "";
-const text = (value) => value === void 0 || value === null || value instanceof Object ? "" : String(value).trim();
-const on = (value) => value !== void 0 && value !== false && text(value) !== "false";
-const errorText = (error) => error instanceof Error ? error.message : String(error);
-const isMarkdownTable = (node) => node[0] === "table" && childrenOf(node).some((child) => isElement(child) && child[0] === "thead");
-const PROPS = [
-	"src",
-	"format",
-	"sort",
-	"copy"
-];
-const isBlock = (node) => node[0] === "table" && (!isMarkdownTable(node) || Object.keys(node[1]).some((key) => PROPS.includes(key.replace(/^:/, ""))));
-const TONES = {
-	success: "var(--ui-success,#16a34a)",
-	warning: "var(--ui-warning,#ca8a04)",
-	error: "var(--ui-error,var(--destructive,#dc2626))",
-	info: "var(--ui-info,#2563eb)"
-};
-const isKnownTone = (tone) => Object.hasOwn(TONES, tone);
-const TONED = /^\[(.*)\]\{\s*tone=(?:"([^"]*)"|'([^']*)'|([^\s}]*))\s*\}$/;
-const isTone = (node) => isElement(node) && node[0] === "span" && Object.hasOwn(node[1], "tone");
-const cellNode = (cell) => {
-	const toned = TONED.exec(cell);
-	return toned ? [
-		"span",
-		{ tone: toned[2] ?? toned[3] ?? toned[4] },
-		toned[1] ?? ""
-	] : cell;
-};
-const cellText = (cell) => TONED.exec(cell)?.[1] ?? cell;
-/** RFC 4180: quoted cells may hold the separator, line breaks, and `""` for a quote. */
-function delimited(source, separator) {
-	const rows = [];
-	let row = [];
-	let cell = "";
-	let quoted = false;
-	for (let index = 0; index < source.length; index++) {
-		const char = source[index];
-		if (quoted) {
-			if (char !== "\"") cell += char;
-			else if (source[index + 1] === "\"") {
-				cell += "\"";
-				index++;
-			} else quoted = false;
-		} else if (char === "\"" && !cell.trim()) {
-			quoted = true;
-			cell = "";
-		} else if (char === separator) {
-			row.push(cell.trim());
-			cell = "";
-		} else if (char === "\n") {
-			row.push(cell.trim());
-			rows.push(row);
-			row = [];
-			cell = "";
-		} else if (char !== "\r") cell += char;
-	}
-	if (quoted) return void 0;
-	row.push(cell.trim());
-	rows.push(row);
-	return rows.filter((cells) => cells.some(Boolean));
-}
-/** TSV is tab-separated text without CSV's quote syntax; quotes are data. */
-function tsv(source) {
-	return source.split("\n").map((line) => line.split("	").map((cell) => cell.trim())).filter((cells) => cells.some(Boolean));
-}
-const value = (item) => item === null || item === void 0 ? "" : item instanceof Object ? JSON.stringify(item) : text(item);
-/** The header and rows of a file or a fence, or why there are none. */
-function rowsOf(source, format) {
-	if (format === "json") {
-		let parsed;
-		try {
-			parsed = JSON.parse(source);
-		} catch (error) {
-			return { issue: {
-				rule: "comark/table/invalid-json",
-				message: `its JSON doesn't parse: ${errorText(error)}. Fix the JSON.`
-			} };
-		}
-		if (!Array.isArray(parsed) || !parsed.every((item) => item instanceof Object && !Array.isArray(item))) return { issue: {
-			rule: "comark/table/json-not-rows",
-			message: "its JSON must be an array of objects, one per row, such as `[{\"name\": \"a\", \"size\": 1}]`."
-		} };
-		const items = parsed;
-		const columns = [...new Set(items.flatMap((item) => Object.keys(item)))];
-		return { rows: [columns, ...items.map((item) => columns.map((column) => value(item[column])))] };
-	}
-	const normalized = source.replace(/\r\n?/g, "\n");
-	const rows = format === "tsv" ? tsv(normalized) : delimited(normalized, ",");
-	return rows ? { rows } : { issue: {
-		rule: "comark/table/unclosed-quote",
-		message: "a quoted cell never ends. Close it with `\"`, and write a quote inside one as `\"\"`."
-	} };
-}
-function build(rows, sort, name, issues) {
-	const [header = [], ...body] = rows;
-	if (!header.length || !body.length) {
-		issues.push({
-			rule: "comark/table/no-rows",
-			message: `${name} has no rows. Give it a header row and at least one row of data.`
-		});
-		return;
-	}
-	const uneven = body.findIndex((row) => row.length !== header.length);
-	if (uneven !== -1) issues.push({
-		rule: "comark/table/uneven-row",
-		message: `${name}: row ${uneven + 1} has ${body[uneven]?.length} cells, but the header has ${header.length}. Give every row one cell per column.`
-	});
-	const numeric = header.map((_, column) => body.every((row) => !row[column] || NUMBER.test(cellText(row[column]))));
-	const style = (column) => numeric[column] ? { style: "text-align:right" } : {};
-	const table = [
-		"table",
-		{},
-		[
-			"thead",
-			{},
-			[
-				"tr",
-				{},
-				...header.map((label, column) => [
-					"th",
-					style(column),
-					cellNode(label)
-				])
-			]
-		],
-		[
-			"tbody",
-			{},
-			...body.map((row) => [
-				"tr",
-				{},
-				...header.map((_, column) => [
-					"td",
-					style(column),
-					cellNode(row[column] ?? "")
-				])
-			])
-		]
-	];
-	color(table, name, issues);
-	if (sort) sortable(table);
-	return table;
-}
-/** Takes `tone` off every span under `node`, unwrapping a span it leaves bare, and returns those spans. */
-function takeTones(node) {
-	const spans = [];
-	const children = childrenOf(node).flatMap((child) => {
-		if (!isElement(child)) return [child];
-		spans.push(...takeTones(child));
-		if (!isTone(child)) return [child];
-		spans.push(child);
-		const { tone: _, ...rest } = child[1];
-		return Object.keys(rest).length ? [[
-			child[0],
-			rest,
-			...childrenOf(child)
-		]] : childrenOf(child);
-	});
-	node.splice(2, node.length - 2, ...children);
-	return spans;
-}
-/**
-* Tints each cell that is one `[text]{tone="error"}` span, and each row whose first cell is, so the span itself never
-* renders. The tint goes on every cell rather than the row, since a page's striped rows paint their cells.
-*/
-function color(table, name, issues) {
-	let index = 0;
-	for (const section of childrenOf(table)) {
-		if (!isElement(section) || section[0] !== "thead" && section[0] !== "tbody") continue;
-		for (const row of childrenOf(section)) {
-			if (!isElement(row) || row[0] !== "tr") continue;
-			const where = section[0] === "thead" ? `${name}, header row` : `${name}, row ${++index}`;
-			const cells = childrenOf(row).filter((cell) => isElement(cell) && (cell[0] === "td" || cell[0] === "th"));
-			const tones = cells.map((cell) => {
-				const content = childrenOf(cell).filter(isContent);
-				const [only] = content;
-				const filling = content.length === 1 && only && isTone(only) ? only : void 0;
-				let found;
-				let invalid = false;
-				for (const span of takeTones(cell)) {
-					const tone = text(span[1].tone);
-					if (span !== filling) {
-						invalid = true;
-						issues.push({
-							rule: "comark/table/partial-tone",
-							message: `${where}: the \`tone\` span "[${textOf(span)}]" doesn't fill its cell, so the cell isn't colored. Put the whole cell in the brackets, as \`[${textOf(cell)}]{tone="${tone}"}\`, or drop \`{tone}\`.`
-						});
-					} else if (!isKnownTone(tone)) {
-						invalid = true;
-						issues.push({
-							rule: "comark/table/unknown-tone",
-							message: `${where}: "${tone}" isn't a tone, so the cell isn't colored. Use \`success\`, \`warning\`, \`error\`, or \`info\`.`
-						});
-					} else found = tone;
-				}
-				return invalid ? null : found;
-			});
-			cells.forEach((cell, column) => {
-				const tone = tones[column] === void 0 ? tones[0] : tones[column];
-				if (!tone) return;
-				const tint = `background-color:color-mix(in srgb,${TONES[tone]} 20%,transparent)`;
-				cell[1] = {
-					...cell[1],
-					style: [text(cell[1].style), tint].filter(Boolean).join(";")
-				};
-			});
-		}
-	}
-}
-/** Makes a Markdown table's headers sort buttons. */
-function sortable(table) {
-	for (const section of childrenOf(table)) if (isElement(section) && section[0] === "thead") {
-		for (const row of childrenOf(section)) if (isElement(row)) {
-			for (const th of childrenOf(row)) if (isElement(th) && th[0] === "th") th.splice(2, th.length - 2, [
-				"button",
-				{
-					type: "button",
-					class: "ctb-sort"
-				},
-				...childrenOf(th)
-			]);
-		}
-	}
-}
-function resolvePath(folder, src) {
-	const parts = folder ? folder.split("/") : [];
-	for (const part of src.split(/[/\\]/)) {
-		if (part === "" || part === ".") continue;
-		if (part !== "..") parts.push(part);
-		else if (parts.pop() === void 0) return void 0;
-	}
-	return parts.join("/");
-}
-var OutsideRoot = class extends Error {};
-const isMissing = (error) => error instanceof Error && "code" in error && (error.code === "ENOENT" || error.code === "ENOTDIR");
-function diskReader(root) {
-	const folder = (root || ".").replace(/[/\\]+$/, "");
-	return async (path) => {
-		const { readFile, realpath } = await import("node:fs/promises");
-		const paths = await import("node:path");
-		try {
-			const [base, target] = await Promise.all([realpath(folder), realpath(`${folder}/${path}`)]);
-			const inside = paths.relative(base, target);
-			if (inside === ".." || inside.startsWith(`..${paths.sep}`) || paths.isAbsolute(inside)) throw new OutsideRoot();
-			return await readFile(target, "utf8");
-		} catch (error) {
-			if (isMissing(error)) return void 0;
-			throw error;
-		}
-	};
-}
-async function fromFile(src, name, run) {
-	const fail = (rule, issue) => void run.issues.push({
-		rule,
-		message: `${name}: ${issue}`
-	});
-	if (/^[a-z][a-z\d+.-]*:/i.test(src)) return fail("comark/table/remote-src", "`src` must be a local file; a table can't read a URL.");
-	const path = resolvePath(src.startsWith("/") ? "" : run.base, src);
-	const leaves = "the path leaves the root. Move the file under the root or widen `root`.";
-	if (path === void 0) return fail("comark/table/path-outside-root", leaves);
-	let source;
-	try {
-		source = await run.read(path);
-	} catch (error) {
-		if (error instanceof OutsideRoot) return fail("comark/table/path-outside-root", leaves);
-		return fail("comark/table/read-failed", `reading "${path}" failed: ${errorText(error)}. Check the file or the \`read\` option.`);
-	}
-	if (source === void 0) return fail("comark/table/file-not-found", `file not found. It resolved to "${path}" under the root; check the path or \`base\`.`);
-	return {
-		source,
-		format: path.slice(path.lastIndexOf(".") + 1).toLowerCase()
-	};
-}
-async function block(node, number, data, run) {
-	const attrs = resolveAttributes(node[1], data, { parseJson: true });
-	const src = text(attrs.src);
-	const name = `\`::table\` ${number}${src ? ` ("${src}")` : ""}`;
-	for (const key of Object.keys(node[1])) {
-		const prop = key.replace(/^:/, "");
-		if (!PROPS.includes(prop) && prop !== "id" && prop !== "class") run.issues.push({
-			rule: "comark/table/unknown-prop",
-			message: `${name}: \`${prop}\` isn't a prop of \`::table\`, so it's ignored. Use \`src\`, \`format\`, \`sort\`, or \`copy\`.`
-		});
-	}
-	const sort = on(attrs.sort);
-	const result = (table) => table ? [
-		TABLE_TAG,
-		{
-			sort,
-			copy: attrs.copy === void 0 || on(attrs.copy)
-		},
-		table
-	] : ["div", {}];
-	if (!src && isMarkdownTable(node)) {
-		const inner = [
-			"table",
-			{},
-			...childrenOf(node)
-		];
-		if (sort) sortable(inner);
-		return result(inner);
-	}
-	const content = childrenOf(node).filter(isContent);
-	if (src && content.length) run.issues.push({
-		rule: "comark/table/content-dropped",
-		message: `${name} drops what's inside it, since it reads \`src\`. Use one or the other.`
-	});
-	let source;
-	let format = text(attrs.format).toLowerCase();
-	if (src) {
-		const file = await fromFile(src, name, run);
-		if (!file) return result(void 0);
-		source = file.source;
-		format ||= file.format;
-	} else {
-		const [inner] = content;
-		const fence = content.length === 1 && isElement(inner) && inner[0] === "pre" ? inner : void 0;
-		if (!fence) {
-			run.issues.push({
-				rule: "comark/table/empty-block",
-				message: `${name} has nothing to show. Give it \`src="data.csv"\`, or put one Markdown table or one csv, tsv, or json fence inside it.`
-			});
-			return result(void 0);
-		}
-		source = textOf(fence);
-		format ||= text(fence[1].language).toLowerCase();
-	}
-	if (!FORMATS.has(format)) {
-		run.issues.push({
-			rule: "comark/table/unknown-format",
-			message: `${name}: can't read ${format ? `"${format}"` : "data without a format"}. Use a .csv, .tsv, or .json file or fence, or set \`format\`.`
-		});
-		return result(void 0);
-	}
-	const read = rowsOf(source, format);
-	if ("issue" in read) {
-		run.issues.push({
-			rule: read.issue.rule,
-			message: `${name}: ${read.issue.message}`
-		});
-		return result(void 0);
-	}
-	return result(build(read.rows, sort, name, run.issues));
-}
-/**
-* Turns `::table{src="bench.csv"}`, a `::table` around a csv, tsv, or json fence or a Markdown table, and every bare
-* ` ```csv ` or ` ```tsv ` fence into a table while parsing, with buttons that copy it as CSV or Markdown and, with
-* `sort`, headers that sort it. Problems are added to `meta.issues`.
-*/
-var src_default = defineComarkPlugin((options = {}) => ({
-	name: "comark-table",
-	async post(state) {
-		const { tree } = state;
-		const data = {
-			frontmatter: tree.frontmatter,
-			meta: tree.meta,
-			data: {},
-			props: {}
-		};
-		const base = resolvePath("", options.base ?? "");
-		const run = {
-			read: options.read ?? diskReader(options.root ?? "."),
-			base: base ?? "",
-			issues: []
-		};
-		if (base === void 0) run.issues.push({
-			rule: "comark/table/base-outside-root",
-			message: `table: \`base\` "${options.base ?? ""}" leaves the root. Set it to the document's folder under \`root\`.`
-		});
-		let tables = 0;
-		const tint = (nodes) => {
-			for (const node of nodes) {
-				if (!isElement(node) || node[0] === "pre" || node[0] === "code") continue;
-				if (isMarkdownTable(node)) color(node, `Markdown table ${++tables}`, run.issues);
-				else tint(childrenOf(node));
-			}
-		};
-		tint(tree.nodes);
-		const count = {
-			block: 0,
-			fence: 0
-		};
-		const walk = async (nodes, start) => {
-			for (let index = start; index < nodes.length; index++) {
-				const node = nodes[index];
-				if (!node || !isElement(node)) continue;
-				const [tag, attrs] = node;
-				const language = text(attrs.language).toLowerCase();
-				if (isBlock(node)) nodes[index] = await block(node, ++count.block, data, run);
-				else if (tag === "pre" && options.fences !== false && (language === "csv" || language === "tsv")) {
-					const name = `The \`\`\`${language} fence ${++count.fence}`;
-					const read = rowsOf(textOf(node), language);
-					if ("issue" in read) run.issues.push({
-						rule: read.issue.rule,
-						message: `${name}: ${read.issue.message}`
-					});
-					const table = "issue" in read ? void 0 : build(read.rows, false, name, run.issues);
-					if (table) nodes[index] = [
-						TABLE_TAG,
-						{
-							sort: false,
-							copy: true
-						},
-						table
-					];
-				} else if (tag !== "pre" && tag !== "code") await walk(node, 2);
-			}
-		};
-		await walk(tree.nodes, 0);
-		tree.meta.issues = [...tree.meta.issues ?? [], ...run.issues.map((issue) => issue.message)];
-		tree.meta.issueRules = {
-			...tree.meta.issueRules,
-			...Object.fromEntries(run.issues.map((issue) => [issue.message, issue.rule]))
-		};
-	}
-}));
-//#endregion
-export { TABLE_TAG, src_default as default };
+export { t as TABLE_TAG, n as default } from "./src-BV7IF9ld.mjs";

package/dist/react.mjs

@@ -1,5 +1,5 @@
-import src_default, { TABLE_TAG } from "./index.mjs";
-import { n as start, r as css, t as bar } from "./client-C5bRu9NG.mjs";
+import { n as src_default, t as TABLE_TAG } from "./src-BV7IF9ld.mjs";
+import { n as start, r as css, t as bar } from "./client-CDdgxJF0.mjs";
 import { createElement, useEffect } from "react";
 //#region src/react.ts
 /** Tables for `@comark/react`. */

package/dist/src-BV7IF9ld.mjs

@@ -0,0 +1,463 @@
+import { t as statusColor } from "./theme-WGjRIAmX.mjs";
+import { defineComarkPlugin } from "comark";
+import { resolveAttributes } from "comark/render";
+//#region ../../shared/text.ts
+/**
+* A prop value as text. Comark writes strings, numbers, and booleans, so an object, array, function, or missing value
+* is no text. The `typeof` check, unlike `instanceof`, can't throw on a revoked proxy.
+*/
+function scalar(value) {
+	switch (typeof value) {
+		case "string": return value;
+		case "number":
+		case "boolean":
+		case "bigint":
+		case "symbol": return String(value);
+		default: return;
+	}
+}
+/** A prop value as text, without its surrounding whitespace, or empty when it has none. */
+const text = (value) => scalar(value)?.trim() ?? "";
+const errorText = (error) => error instanceof Error ? error.message : String(error);
+//#endregion
+//#region ../../shared/nodes.ts
+const isElement = (node) => Array.isArray(node) && node[0] !== null;
+const childrenOf = ([, , ...rest]) => rest;
+//#endregion
+//#region ../../shared/disk.ts
+var OutsideRoot = class extends Error {};
+const isMissing = (error) => error instanceof Error && "code" in error && (error.code === "ENOENT" || error.code === "ENOTDIR");
+/**
+* Joins `src` onto `folder` as strings, so the root check runs the same in Node, browsers, and edge runtimes. Returns
+* undefined when `src` climbs out of the folder.
+*/
+function resolvePath(folder, src) {
+	const parts = folder ? folder.split("/") : [];
+	for (const part of src.split(/[/\\]/)) {
+		if (part === "" || part === ".") continue;
+		if (part !== "..") parts.push(part);
+		else if (parts.pop() === void 0) return void 0;
+	}
+	return parts.join("/");
+}
+/**
+* Reads files under `root` from disk, and undefined for one that isn't there. Throws `OutsideRoot` for one whose real
+* path leaves the root, which the string check in `resolvePath` can't see through a symlink.
+*/
+function diskReader(root) {
+	const folder = (root || ".").replace(/[/\\]+$/, "");
+	return async (path) => {
+		const { readFile, realpath } = await import("node:fs/promises");
+		const paths = await import("node:path");
+		try {
+			const [base, target] = await Promise.all([realpath(folder), realpath(`${folder}/${path}`)]);
+			const inside = paths.relative(base, target);
+			if (inside === ".." || inside.startsWith(`..${paths.sep}`) || paths.isAbsolute(inside)) throw new OutsideRoot();
+			return await readFile(target, "utf8");
+		} catch (error) {
+			if (isMissing(error)) return void 0;
+			throw error;
+		}
+	};
+}
+//#endregion
+//#region src/index.ts
+/** The tag the plugin's tables carry, since `::table` shares its name with every Markdown table. */
+const TABLE_TAG = "data-table";
+const FORMATS = /* @__PURE__ */ new Set([
+	"csv",
+	"tsv",
+	"json"
+]);
+const NUMBER = /^[+-]?(?:\d[\d,]*(?:\.\d+)?|\.\d+)(?:\s*\S{1,4})?$/;
+const isContent = (node) => Array.isArray(node) ? node[0] !== null : node.trim() !== "";
+const textOf = (node) => !Array.isArray(node) ? node : isElement(node) ? childrenOf(node).map(textOf).join("") : "";
+const on = (value) => value !== void 0 && value !== false && text(value) !== "false";
+const isMarkdownTable = (node) => node[0] === "table" && childrenOf(node).some((child) => isElement(child) && child[0] === "thead");
+const PROPS = [
+	"src",
+	"format",
+	"sort",
+	"copy"
+];
+const isBlock = (node) => node[0] === "table" && (!isMarkdownTable(node) || Object.keys(node[1]).some((key) => PROPS.includes(key.replace(/^:/, ""))));
+const TONES = {
+	success: statusColor("success"),
+	warning: statusColor("warning"),
+	error: statusColor("danger"),
+	info: statusColor("info")
+};
+const isKnownTone = (tone) => Object.hasOwn(TONES, tone);
+const TONED = /^\[(.*)\]\{\s*tone=(?:"([^"]*)"|'([^']*)'|([^\s}]*))\s*\}$/;
+const isTone = (node) => isElement(node) && node[0] === "span" && Object.hasOwn(node[1], "tone");
+const cellNode = (cell) => {
+	const toned = TONED.exec(cell);
+	return toned ? [
+		"span",
+		{ tone: toned[2] ?? toned[3] ?? toned[4] },
+		toned[1] ?? ""
+	] : cell;
+};
+const cellText = (cell) => TONED.exec(cell)?.[1] ?? cell;
+/** RFC 4180: quoted cells may hold the separator, line breaks, and `""` for a quote. */
+function delimited(source, separator) {
+	const rows = [];
+	let row = [];
+	let cell = "";
+	let quoted = false;
+	for (let index = 0; index < source.length; index++) {
+		const char = source[index];
+		if (quoted) {
+			if (char !== "\"") cell += char;
+			else if (source[index + 1] === "\"") {
+				cell += "\"";
+				index++;
+			} else quoted = false;
+		} else if (char === "\"" && !cell.trim()) {
+			quoted = true;
+			cell = "";
+		} else if (char === separator) {
+			row.push(cell.trim());
+			cell = "";
+		} else if (char === "\n") {
+			row.push(cell.trim());
+			rows.push(row);
+			row = [];
+			cell = "";
+		} else if (char !== "\r") cell += char;
+	}
+	if (quoted) return void 0;
+	row.push(cell.trim());
+	rows.push(row);
+	return rows.filter((cells) => cells.some(Boolean));
+}
+/** TSV is tab-separated text without CSV's quote syntax; quotes are data. */
+function tsv(source) {
+	return source.split("\n").map((line) => line.split("	").map((cell) => cell.trim())).filter((cells) => cells.some(Boolean));
+}
+const value = (item) => item === null || item === void 0 ? "" : item instanceof Object ? JSON.stringify(item) : text(item);
+/** The header and rows of a file or a fence, or why there are none. */
+function rowsOf(source, format) {
+	if (format === "json") {
+		let parsed;
+		try {
+			parsed = JSON.parse(source);
+		} catch (error) {
+			return { issue: {
+				rule: "comark/table/invalid-json",
+				message: `its JSON doesn't parse: ${errorText(error)}. Fix the JSON.`
+			} };
+		}
+		if (!Array.isArray(parsed) || !parsed.every((item) => item instanceof Object && !Array.isArray(item))) return { issue: {
+			rule: "comark/table/json-not-rows",
+			message: "its JSON must be an array of objects, one per row, such as `[{\"name\": \"a\", \"size\": 1}]`."
+		} };
+		const items = parsed;
+		const columns = [...new Set(items.flatMap((item) => Object.keys(item)))];
+		return { rows: [columns, ...items.map((item) => columns.map((column) => value(item[column])))] };
+	}
+	const normalized = source.replace(/\r\n?/g, "\n");
+	const rows = format === "tsv" ? tsv(normalized) : delimited(normalized, ",");
+	return rows ? { rows } : { issue: {
+		rule: "comark/table/unclosed-quote",
+		message: "a quoted cell never ends. Close it with `\"`, and write a quote inside one as `\"\"`."
+	} };
+}
+function build(rows, sort, name, issues) {
+	const [header = [], ...body] = rows;
+	if (!header.length || !body.length) {
+		issues.push({
+			rule: "comark/table/no-rows",
+			message: `${name} has no rows. Give it a header row and at least one row of data.`
+		});
+		return;
+	}
+	const uneven = body.findIndex((row) => row.length !== header.length);
+	if (uneven !== -1) issues.push({
+		rule: "comark/table/uneven-row",
+		message: `${name}: row ${uneven + 1} has ${body[uneven]?.length} cells, but the header has ${header.length}. Give every row one cell per column.`
+	});
+	const numeric = header.map((_, column) => body.every((row) => !row[column] || NUMBER.test(cellText(row[column]))));
+	const style = (column) => numeric[column] ? { style: "text-align:right" } : {};
+	const table = [
+		"table",
+		{},
+		[
+			"thead",
+			{},
+			[
+				"tr",
+				{},
+				...header.map((label, column) => [
+					"th",
+					style(column),
+					cellNode(label)
+				])
+			]
+		],
+		[
+			"tbody",
+			{},
+			...body.map((row) => [
+				"tr",
+				{},
+				...header.map((_, column) => [
+					"td",
+					style(column),
+					cellNode(row[column] ?? "")
+				])
+			])
+		]
+	];
+	color(table, name, issues);
+	if (sort) sortable(table);
+	return table;
+}
+/** Takes `tone` off every span under `node`, unwrapping a span it leaves bare, and returns those spans. */
+function takeTones(node) {
+	const spans = [];
+	const children = childrenOf(node).flatMap((child) => {
+		if (!isElement(child)) return [child];
+		spans.push(...takeTones(child));
+		if (!isTone(child)) return [child];
+		spans.push(child);
+		const { tone: _, ...rest } = child[1];
+		return Object.keys(rest).length ? [[
+			child[0],
+			rest,
+			...childrenOf(child)
+		]] : childrenOf(child);
+	});
+	node.splice(2, node.length - 2, ...children);
+	return spans;
+}
+/**
+* Tints each cell that is one `[text]{tone="error"}` span, and each row whose first cell is, so the span itself never
+* renders. The tint goes on every cell rather than the row, since a page's striped rows paint their cells.
+*/
+function color(table, name, issues) {
+	let index = 0;
+	for (const section of childrenOf(table)) {
+		if (!isElement(section) || section[0] !== "thead" && section[0] !== "tbody") continue;
+		for (const row of childrenOf(section)) {
+			if (!isElement(row) || row[0] !== "tr") continue;
+			const where = section[0] === "thead" ? `${name}, header row` : `${name}, row ${++index}`;
+			const cells = childrenOf(row).filter((cell) => isElement(cell) && (cell[0] === "td" || cell[0] === "th"));
+			const tones = cells.map((cell) => {
+				const content = childrenOf(cell).filter(isContent);
+				const [only] = content;
+				const filling = content.length === 1 && only && isTone(only) ? only : void 0;
+				let found;
+				let invalid = false;
+				for (const span of takeTones(cell)) {
+					const tone = text(span[1].tone);
+					if (span !== filling) {
+						invalid = true;
+						issues.push({
+							rule: "comark/table/partial-tone",
+							message: `${where}: the \`tone\` span "[${textOf(span)}]" doesn't fill its cell, so the cell isn't colored. Put the whole cell in the brackets, as \`[${textOf(cell)}]{tone="${tone}"}\`, or drop \`{tone}\`.`
+						});
+					} else if (!isKnownTone(tone)) {
+						invalid = true;
+						issues.push({
+							rule: "comark/table/unknown-tone",
+							message: `${where}: "${tone}" isn't a tone, so the cell isn't colored. Use \`success\`, \`warning\`, \`error\`, or \`info\`.`
+						});
+					} else found = tone;
+				}
+				return invalid ? null : found;
+			});
+			cells.forEach((cell, column) => {
+				const tone = tones[column] === void 0 ? tones[0] : tones[column];
+				if (!tone) return;
+				const tint = `background-color:color-mix(in srgb,${TONES[tone]} 20%,transparent)`;
+				cell[1] = {
+					...cell[1],
+					style: [text(cell[1].style), tint].filter(Boolean).join(";")
+				};
+			});
+		}
+	}
+}
+/** Makes a Markdown table's headers sort buttons. */
+function sortable(table) {
+	for (const section of childrenOf(table)) if (isElement(section) && section[0] === "thead") {
+		for (const row of childrenOf(section)) if (isElement(row)) {
+			for (const th of childrenOf(row)) if (isElement(th) && th[0] === "th") th.splice(2, th.length - 2, [
+				"button",
+				{
+					type: "button",
+					class: "ctb-sort"
+				},
+				...childrenOf(th)
+			]);
+		}
+	}
+}
+async function fromFile(src, name, run) {
+	const fail = (rule, issue) => void run.issues.push({
+		rule,
+		message: `${name}: ${issue}`
+	});
+	if (/^[a-z][a-z\d+.-]*:/i.test(src)) return fail("comark/table/remote-src", "`src` must be a local file; a table can't read a URL.");
+	const path = resolvePath(src.startsWith("/") ? "" : run.base, src);
+	const leaves = "the path leaves the root. Move the file under the root or widen `root`.";
+	if (path === void 0) return fail("comark/table/path-outside-root", leaves);
+	let source;
+	try {
+		source = await run.read(path);
+	} catch (error) {
+		if (error instanceof OutsideRoot) return fail("comark/table/path-outside-root", leaves);
+		return fail("comark/table/read-failed", `reading "${path}" failed: ${errorText(error)}. Check the file or the \`read\` option.`);
+	}
+	if (source === void 0) return fail("comark/table/file-not-found", `file not found. It resolved to "${path}" under the root; check the path or \`base\`.`);
+	return {
+		source,
+		format: path.slice(path.lastIndexOf(".") + 1).toLowerCase()
+	};
+}
+async function block(node, number, data, run) {
+	const attrs = resolveAttributes(node[1], data, { parseJson: true });
+	const src = text(attrs.src);
+	const name = `\`::table\` ${number}${src ? ` ("${src}")` : ""}`;
+	for (const key of Object.keys(node[1])) {
+		const prop = key.replace(/^:/, "");
+		if (!PROPS.includes(prop) && prop !== "id" && prop !== "class") run.issues.push({
+			rule: "comark/table/unknown-prop",
+			message: `${name}: \`${prop}\` isn't a prop of \`::table\`, so it's ignored. Use \`src\`, \`format\`, \`sort\`, or \`copy\`.`
+		});
+	}
+	const sort = on(attrs.sort);
+	const result = (table) => table ? [
+		TABLE_TAG,
+		{
+			sort,
+			copy: attrs.copy === void 0 || on(attrs.copy)
+		},
+		table
+	] : ["div", {}];
+	if (!src && isMarkdownTable(node)) {
+		const inner = [
+			"table",
+			{},
+			...childrenOf(node)
+		];
+		if (sort) sortable(inner);
+		return result(inner);
+	}
+	const content = childrenOf(node).filter(isContent);
+	if (src && content.length) run.issues.push({
+		rule: "comark/table/content-dropped",
+		message: `${name} drops what's inside it, since it reads \`src\`. Use one or the other.`
+	});
+	let source;
+	let format = text(attrs.format).toLowerCase();
+	if (src) {
+		const file = await fromFile(src, name, run);
+		if (!file) return result(void 0);
+		source = file.source;
+		format ||= file.format;
+	} else {
+		const [inner] = content;
+		const fence = content.length === 1 && isElement(inner) && inner[0] === "pre" ? inner : void 0;
+		if (!fence) {
+			run.issues.push({
+				rule: "comark/table/empty-block",
+				message: `${name} has nothing to show. Give it \`src="data.csv"\`, or put one Markdown table or one csv, tsv, or json fence inside it.`
+			});
+			return result(void 0);
+		}
+		source = textOf(fence);
+		format ||= text(fence[1].language).toLowerCase();
+	}
+	if (!FORMATS.has(format)) {
+		run.issues.push({
+			rule: "comark/table/unknown-format",
+			message: `${name}: can't read ${format ? `"${format}"` : "data without a format"}. Use a .csv, .tsv, or .json file or fence, or set \`format\`.`
+		});
+		return result(void 0);
+	}
+	const read = rowsOf(source, format);
+	if ("issue" in read) {
+		run.issues.push({
+			rule: read.issue.rule,
+			message: `${name}: ${read.issue.message}`
+		});
+		return result(void 0);
+	}
+	return result(build(read.rows, sort, name, run.issues));
+}
+/**
+* Turns `::table{src="bench.csv"}`, a `::table` around a csv, tsv, or json fence or a Markdown table, and every bare
+* ` ```csv ` or ` ```tsv ` fence into a table while parsing, with buttons that copy it as CSV or Markdown and, with
+* `sort`, headers that sort it. Problems are added to `meta.issues`.
+*/
+var src_default = defineComarkPlugin((options = {}) => ({
+	name: "comark-table",
+	async post(state) {
+		const { tree } = state;
+		const data = {
+			frontmatter: tree.frontmatter,
+			meta: tree.meta,
+			data: {},
+			props: {}
+		};
+		const base = resolvePath("", options.base ?? "");
+		const run = {
+			read: options.read ?? diskReader(options.root ?? "."),
+			base: base ?? "",
+			issues: []
+		};
+		if (base === void 0) run.issues.push({
+			rule: "comark/table/base-outside-root",
+			message: `table: \`base\` "${options.base ?? ""}" leaves the root. Set it to the document's folder under \`root\`.`
+		});
+		let tables = 0;
+		const tint = (nodes) => {
+			for (const node of nodes) {
+				if (!isElement(node) || node[0] === "pre" || node[0] === "code") continue;
+				if (isMarkdownTable(node)) color(node, `Markdown table ${++tables}`, run.issues);
+				else tint(childrenOf(node));
+			}
+		};
+		tint(tree.nodes);
+		const count = {
+			block: 0,
+			fence: 0
+		};
+		const walk = async (nodes, start) => {
+			for (let index = start; index < nodes.length; index++) {
+				const node = nodes[index];
+				if (!node || !isElement(node)) continue;
+				const [tag, attrs] = node;
+				const language = text(attrs.language).toLowerCase();
+				if (isBlock(node)) nodes[index] = await block(node, ++count.block, data, run);
+				else if (tag === "pre" && options.fences !== false && (language === "csv" || language === "tsv")) {
+					const name = `The \`\`\`${language} fence ${++count.fence}`;
+					const read = rowsOf(textOf(node), language);
+					if ("issue" in read) run.issues.push({
+						rule: read.issue.rule,
+						message: `${name}: ${read.issue.message}`
+					});
+					const table = "issue" in read ? void 0 : build(read.rows, false, name, run.issues);
+					if (table) nodes[index] = [
+						TABLE_TAG,
+						{
+							sort: false,
+							copy: true
+						},
+						table
+					];
+				} else if (tag !== "pre" && tag !== "code") await walk(node, 2);
+			}
+		};
+		await walk(tree.nodes, 0);
+		tree.meta.issues = [...tree.meta.issues ?? [], ...run.issues.map((issue) => issue.message)];
+		tree.meta.issueRules = {
+			...tree.meta.issueRules,
+			...Object.fromEntries(run.issues.map((issue) => [issue.message, issue.rule]))
+		};
+	}
+}));
+//#endregion
+export { src_default as n, TABLE_TAG as t };

package/dist/style.css

@@ -1 +1 @@
-@layer comark{:where(.ctb){--_comark-background:var(--comark-background,var(--ui-bg,var(--background,#fff)));--_comark-foreground:var(--comark-foreground,var(--ui-text-highlighted,var(--foreground,#0a0a0a)));--_comark-muted:var(--comark-muted,var(--ui-text-muted,var(--muted-foreground,#737373)));--_comark-border:var(--comark-border,var(--ui-border,var(--border,#e5e5e5)));--_comark-accent:var(--comark-accent,var(--ui-bg-elevated,var(--accent,#f5f5f5)));--_comark-ring:var(--comark-ring,var(--ui-primary,var(--ring,#a1a1a1)));--_comark-radius:var(--comark-radius,calc(var(--ui-radius,calc(var(--radius,.625rem)/2))*2));--_comark-font:var(--comark-font,var(--font-sans,ui-sans-serif,system-ui,sans-serif))}@media (prefers-color-scheme:dark){:where(.ctb){--_comark-background:var(--comark-background,var(--ui-bg,var(--background,#0a0a0a)));--_comark-foreground:var(--comark-foreground,var(--ui-text-highlighted,var(--foreground,#fafafa)));--_comark-muted:var(--comark-muted,var(--ui-text-muted,var(--muted-foreground,#a1a1a1)));--_comark-border:var(--comark-border,var(--ui-border,var(--border,rgb(255 255 255/.1))));--_comark-accent:var(--comark-accent,var(--ui-bg-elevated,var(--accent,#262626)));--_comark-ring:var(--comark-ring,var(--ui-primary,var(--ring,#737373)))}}.ctb{margin:1.5rem 0}.ctb-scroll{overflow-x:auto}.ctb-scroll>table{margin:0}.ctb-bar{display:flex;align-items:center;justify-content:flex-end;gap:.25rem;margin-bottom:.375rem;font:500 .75rem/1rem var(--_comark-font)}html:not([data-table-ready]) .ctb-bar{display:none}.ctb-copy{position:relative;display:inline-flex;border:1px solid var(--_comark-border);border-radius:calc(var(--_comark-radius) - 4px);background:var(--_comark-background)}.ctb-copy>button{display:inline-grid;place-items:center;height:1.625rem;padding:0;border:0;background:none;color:var(--_comark-muted);font:inherit;cursor:pointer;transition:background-color .15s,color .15s}.ctb-copy-main{width:1.75rem;border-radius:calc(var(--_comark-radius) - 5px) 0 0 calc(var(--_comark-radius) - 5px)}.ctb-copy>.ctb-copy-more{width:1.25rem;border-inline-start:1px solid var(--_comark-border);border-radius:0 calc(var(--_comark-radius) - 5px) calc(var(--_comark-radius) - 5px) 0}.ctb-copy-more svg{width:.75rem;height:.75rem}.ctb-copy-more[aria-expanded=true]{background:var(--_comark-accent);color:var(--_comark-foreground)}@media (hover:hover){.ctb-copy>button:hover,.ctb-menu button:hover{background:var(--_comark-accent);color:var(--_comark-foreground)}}.ctb-copy-main svg+svg,.ctb-copy-main[data-state=done] svg:first-child{display:none}.ctb-copy-main[data-state=done] svg+svg{display:block}.ctb-menu{position:absolute;top:calc(100% + .25rem);right:-1px;z-index:10;display:grid;min-width:15rem;padding:.25rem;border:1px solid var(--_comark-border);border-radius:var(--_comark-radius);background:var(--_comark-background);box-shadow:0 4px 16px rgb(0 0 0/.12),0 1px 3px rgb(0 0 0/.08)}.ctb-menu[hidden]{display:none}.ctb-menu button{display:grid;grid-template-columns:.875rem 1fr;gap:.5rem;align-items:start;padding:.375rem .5rem;border:0;border-radius:calc(var(--_comark-radius) - 4px);background:none;color:var(--_comark-foreground);font:inherit;text-align:start;cursor:pointer}.ctb-menu button:focus-visible{outline:none;background:var(--_comark-accent)}.ctb-menu svg{margin-top:.125rem}.ctb-menu b{display:block;font-weight:500}.ctb-menu small{display:block;color:var(--_comark-muted);font-size:.75rem;font-weight:400;line-height:1rem}.ctb-status{margin-inline-end:.25rem;color:var(--_comark-muted)}.ctb-sort{all:unset}.ctb-sort{margin:0!important;padding:0!important;border:0!important;background:none!important;box-shadow:none!important;font:inherit!important;color:inherit!important;text-align:inherit!important}html[data-table-ready] .ctb-sort{display:inline-flex;align-items:center;gap:.25rem;cursor:pointer}html[data-table-ready] .ctb-sort::after{content:'↕';color:var(--_comark-muted);font-weight:400}html[data-table-ready] [aria-sort='ascending']>.ctb-sort::after{content:'↑';color:inherit}html[data-table-ready] [aria-sort='descending']>.ctb-sort::after{content:'↓';color:inherit}.ctb-copy>button:focus-visible{outline:none;box-shadow:0 0 0 3px color-mix(in srgb,var(--_comark-ring) 50%,transparent)}.ctb-sort:focus-visible{outline:none;border-radius:calc(var(--_comark-radius) - 4px);box-shadow:0 0 0 3px color-mix(in srgb,var(--_comark-ring) 50%,transparent)!important}@media print{.ctb-bar{display:none}.ctb-sort::after{content:none!important}}}
+@layer comark{:where(.ctb){--_comark-background:var(--comark-background,var(--ui-bg,var(--background,#fff)));--_comark-foreground:var(--comark-foreground,var(--ui-text-highlighted,var(--foreground,#0a0a0a)));--_comark-muted:var(--comark-muted,var(--ui-text-muted,var(--muted-foreground,#737373)));--_comark-border:var(--comark-border,var(--ui-border,var(--border,#e5e5e5)));--_comark-accent:var(--comark-accent,var(--ui-bg-elevated,var(--accent,#f5f5f5)));--_comark-ring:var(--comark-ring,var(--ui-primary,var(--ring,#a1a1a1)));--_comark-shadow:var(--comark-shadow,0 4px 12px rgb(0 0 0/.12));--_comark-radius:var(--comark-radius,calc(var(--ui-radius,calc(var(--radius,.625rem)/2))*2));--_comark-font:var(--comark-font,var(--font-sans,ui-sans-serif,system-ui,sans-serif))}@media (prefers-color-scheme:dark){:where(.ctb){--_comark-background:var(--comark-background,var(--ui-bg,var(--background,#0a0a0a)));--_comark-foreground:var(--comark-foreground,var(--ui-text-highlighted,var(--foreground,#fafafa)));--_comark-muted:var(--comark-muted,var(--ui-text-muted,var(--muted-foreground,#a1a1a1)));--_comark-border:var(--comark-border,var(--ui-border,var(--border,rgb(255 255 255/.1))));--_comark-accent:var(--comark-accent,var(--ui-bg-elevated,var(--accent,#262626)));--_comark-ring:var(--comark-ring,var(--ui-primary,var(--ring,#737373)));--_comark-shadow:var(--comark-shadow,0 4px 12px rgb(0 0 0/.5))}}:where(.light,.light *):where(.ctb){--_comark-shadow:var(--comark-shadow,0 4px 12px rgb(0 0 0/.12))}:where(.dark,.dark *):where(.ctb){--_comark-shadow:var(--comark-shadow,0 4px 12px rgb(0 0 0/.5))}.ctb{margin:1.5rem 0}.ctb-scroll{overflow-x:auto}.ctb-scroll>table{margin:0}.ctb-bar{display:flex;align-items:center;justify-content:flex-end;gap:.25rem;margin-bottom:.375rem;font:500 .75rem/1rem var(--_comark-font)}html:not([data-table-ready]) .ctb-bar{display:none}.ctb-copy{position:relative;display:inline-flex;border:1px solid var(--_comark-border);border-radius:calc(var(--_comark-radius) - 4px);background:var(--_comark-background)}.ctb-copy>button{display:inline-grid;place-items:center;height:1.625rem;padding:0;border:0;background:none;color:var(--_comark-muted);font:inherit;cursor:pointer;transition:background-color .15s,color .15s}.ctb-copy-main{width:1.75rem;border-radius:calc(var(--_comark-radius) - 5px) 0 0 calc(var(--_comark-radius) - 5px)}.ctb-copy>.ctb-copy-more{width:1.25rem;border-inline-start:1px solid var(--_comark-border);border-radius:0 calc(var(--_comark-radius) - 5px) calc(var(--_comark-radius) - 5px) 0}.ctb-copy-more svg{width:.75rem;height:.75rem}.ctb-copy-more[aria-expanded=true]{background:var(--_comark-accent);color:var(--_comark-foreground)}@media (hover:hover){.ctb-copy>button:hover,.ctb-menu button:hover{background:var(--_comark-accent);color:var(--_comark-foreground)}}.ctb-copy-main svg+svg,.ctb-copy-main[data-state=done] svg:first-child{display:none}.ctb-copy-main[data-state=done] svg+svg{display:block}.ctb-menu{position:absolute;top:calc(100% + .25rem);right:-1px;z-index:10;display:grid;min-width:15rem;padding:.25rem;border:1px solid var(--_comark-border);border-radius:var(--_comark-radius);background:var(--_comark-background);box-shadow:var(--_comark-shadow)}.ctb-menu[hidden]{display:none}.ctb-menu button{display:grid;grid-template-columns:.875rem 1fr;gap:.5rem;align-items:start;padding:.375rem .5rem;border:0;border-radius:calc(var(--_comark-radius) - 4px);background:none;color:var(--_comark-foreground);font:inherit;text-align:start;cursor:pointer}.ctb-menu button:focus-visible{outline:none;background:var(--_comark-accent)}.ctb-menu svg{margin-top:.125rem}.ctb-menu b{display:block;font-weight:500}.ctb-menu small{display:block;color:var(--_comark-muted);font-size:.75rem;font-weight:400;line-height:1rem}.ctb-status{margin-inline-end:.25rem;color:var(--_comark-muted)}.ctb-sort{all:unset}.ctb-sort{margin:0!important;padding:0!important;border:0!important;background:none!important;box-shadow:none!important;font:inherit!important;color:inherit!important;text-align:inherit!important}html[data-table-ready] .ctb-sort{display:inline-flex;align-items:center;gap:.25rem;cursor:pointer}html[data-table-ready] .ctb-sort::after{content:'↕';color:var(--_comark-muted);font-weight:400}html[data-table-ready] [aria-sort='ascending']>.ctb-sort::after{content:'↑';color:inherit}html[data-table-ready] [aria-sort='descending']>.ctb-sort::after{content:'↓';color:inherit}.ctb-copy>button:focus-visible{outline:none;box-shadow:0 0 0 3px color-mix(in srgb,var(--_comark-ring) 50%,transparent)!important}.ctb-sort:focus-visible{outline:none;border-radius:calc(var(--_comark-radius) - 4px);box-shadow:0 0 0 3px color-mix(in srgb,var(--_comark-ring) 50%,transparent)!important}@media print{.ctb-bar{display:none}.ctb-sort::after{content:none!important}}}

package/dist/theme-WGjRIAmX.mjs

@@ -0,0 +1,141 @@
+//#region ../zoom/dist/theme.mjs
+const tokens = [
+	[
+		"background",
+		"ui-bg",
+		"background",
+		"#fff",
+		"#0a0a0a"
+	],
+	[
+		"foreground",
+		"ui-text-highlighted",
+		"foreground",
+		"#0a0a0a",
+		"#fafafa"
+	],
+	[
+		"muted",
+		"ui-text-muted",
+		"muted-foreground",
+		"#737373",
+		"#a1a1a1"
+	],
+	[
+		"border",
+		"ui-border",
+		"border",
+		"#e5e5e5",
+		"rgb(255 255 255/.1)"
+	],
+	[
+		"accent",
+		"ui-bg-elevated",
+		"accent",
+		"#f5f5f5",
+		"#262626"
+	],
+	[
+		"ring",
+		"ui-primary",
+		"ring",
+		"#a1a1a1",
+		"#737373"
+	]
+];
+const colors = {
+	success: [
+		"success",
+		"ui-success",
+		"success",
+		"#259f56",
+		"#59d38c"
+	],
+	danger: [
+		"danger",
+		"ui-error",
+		"destructive",
+		"#ee3533",
+		"#fd736d"
+	],
+	warning: [
+		"warning",
+		"ui-warning",
+		"",
+		"#d97706",
+		"#fbbf24"
+	],
+	info: [
+		"info",
+		"ui-info",
+		"",
+		"#2563eb",
+		"#60a5fa"
+	]
+};
+const groups = {
+	status: Object.values(colors),
+	primary: [
+		[
+			"primary",
+			"ui-primary",
+			"primary",
+			"var(--_comark-foreground)",
+			"var(--_comark-foreground)"
+		],
+		[
+			"primary-foreground",
+			"ui-text-inverted",
+			"primary-foreground",
+			"var(--_comark-background)",
+			"var(--_comark-background)"
+		],
+		[
+			"secondary",
+			"ui-secondary",
+			"",
+			"var(--_comark-muted)",
+			"var(--_comark-muted)"
+		]
+	],
+	shadow: [[
+		"shadow",
+		"",
+		"",
+		"0 4px 12px rgb(0 0 0/.12)",
+		"0 4px 12px rgb(0 0 0/.5)"
+	]]
+};
+const chain = (token, scheme) => {
+	const shadcn = token[2] ? `var(--${token[2]},${token[scheme]})` : token[scheme];
+	const nuxt = token[1] ? `var(--${token[1]},${shadcn})` : shadcn;
+	return `var(--comark-${token[0]},${nuxt})`;
+};
+const resolve = (list, scheme) => list.map((token) => `--_comark-${token[0]}:${chain(token, scheme)}`).join(";");
+/**
+* A status color for an element that no `theme()` rule reaches, such as a table cell with no wrapper: the same
+* fallbacks as `--_comark-<name>`, in the light shade.
+*/
+function statusColor(name) {
+	return chain(colors[name], 3);
+}
+/**
+* Resolves the `--comark-*` tokens on `selector`, falling back to Nuxt UI's variables, then shadcn/ui's, then shadcn's
+* neutral theme. Nuxt UI's corners are twice its `--ui-radius`, so the radius halves shadcn's to double it back.
+* They resolve on the component rather than `:root`, so a `.dark` class anywhere above it switches the theme, and a
+* `--comark-*` set on any ancestor still inherits down. `:where()` keeps them at zero specificity.
+*
+* Every block gets the core tokens. Name `"status"` for `--comark-success`, `-danger`, `-warning`, and `-info`,
+* `"primary"` for `--comark-primary`, `-primary-foreground`, and `-secondary`, and `"shadow"` for `--comark-shadow`, so
+* a block that never draws them doesn't carry them.
+*/
+function theme(selector, ...extras) {
+	const where = `:where(${selector})`;
+	const added = extras.flatMap((name) => groups[name]);
+	const list = [...tokens, ...added];
+	const schemed = added.filter((token) => token[3] !== token[4]);
+	const classes = schemed.length ? `:where(.light,.light *)${where}{${resolve(schemed, 3)}}:where(.dark,.dark *)${where}{${resolve(schemed, 4)}}` : "";
+	return `${where}{${resolve(list, 3)};--_comark-radius:var(--comark-radius,calc(var(--ui-radius,calc(var(--radius,.625rem)/2))*2));--_comark-font:var(--comark-font,var(--font-sans,ui-sans-serif,system-ui,sans-serif))}@media (prefers-color-scheme:dark){${where}{${resolve(list, 4)}}}` + classes;
+}
+//#endregion
+export { theme as n, statusColor as t };

package/dist/vue.mjs

@@ -1,5 +1,5 @@
-import src_default, { TABLE_TAG } from "./index.mjs";
-import { n as start, r as css, t as bar } from "./client-C5bRu9NG.mjs";
+import { n as src_default, t as TABLE_TAG } from "./src-BV7IF9ld.mjs";
+import { n as start, r as css, t as bar } from "./client-CDdgxJF0.mjs";
 import { defineComponent, h, onBeforeUnmount, onMounted } from "vue";
 //#region src/vue.ts
 /** Tables for `@comark/vue`. */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "comark-table",
-  "version": "0.7.6",
+  "version": "0.8.1",
   "description": "Tables from CSV, TSV, and JSON files or fences, read while parsing, with copy buttons and sortable headers. A Comark plugin.",
   "keywords": [
     "comark",
@@ -57,7 +57,7 @@
     "react-dom": "^19.3.1",
     "svelte": "^5.57.2",
     "vue": "^3.5.44",
-    "comark-zoom": "0.7.6"
+    "comark-zoom": "0.8.1"
   },
   "peerDependencies": {
     "@comark/html": "^0.8.0",