/*! ratio-ui · design system for knowledge sharing · https://github.com/losol/ratio-ui · (c) 2026 Losol AS · MPL-2.0 */
"use client";
import { cn } from "../../utils/cn.js";
import { Check, ChevronDown, Copy, Download, WrapText } from "../../icons/index.js";
import { useCopyToClipboard } from "../../hooks/useCopyToClipboard.js";
import { ActionButton } from "../ActionButton/ActionButton.js";
import "../ActionButton/index.js";
/* empty css          */
import { useCallback, useMemo, useState } from "react";
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
//#region src/core/CodeBlock/CodeBlock.tsx
var MIME_BY_LANGUAGE = {
	json: "application/json",
	xml: "application/xml"
};
/**
* Download file extension per language label (lower-cased). Falls back to the
* label itself when unmapped, so `language="TypeScript"` downloads as `.ts`,
* not `.typescript`.
*/
var EXTENSION_BY_LANGUAGE = {
	typescript: "ts",
	javascript: "js",
	json: "json",
	xml: "xml",
	python: "py",
	csharp: "cs",
	"c#": "cs",
	html: "html",
	css: "css",
	markdown: "md",
	yaml: "yml",
	bash: "sh",
	shell: "sh",
	sql: "sql",
	java: "java",
	go: "go",
	rust: "rs"
};
var ICON = {
	size: 15,
	strokeWidth: 2
};
/**
* Frames code / JSON / XML with a language badge, optional filename, and a
* toolbar (copy, word-wrap toggle, download), plus collapse and "show more".
* It does **not** highlight or format — pass raw `code` (formatting happens
* upstream) and, optionally, per-line `highlightedLines` from any highlighter
* (Shiki/Prism/hljs). Surface uses the `--code-*` tokens and follows the theme.
*
* @beta This component is experimental — prop shape may change before release.
*/
function CodeBlock({ code, language = "TypeScript", filename, languageSelector, highlightedLines, showHeader = true, showLineNumbers = true, showCopy = true, showWrap = true, showCollapse = true, showDownload = true, showMore = false, maxLines = 8, wrap = false, startCollapsed = false, className }) {
	const [collapsed, setCollapsed] = useState(startCollapsed);
	const [wrapped, setWrapped] = useState(wrap);
	const [expanded, setExpanded] = useState(false);
	const { copied, copy } = useCopyToClipboard();
	const lines = useMemo(() => code.split(/\r\n|\r|\n/), [code]);
	const lineCount = lines.length;
	const clipped = showMore && !expanded && lineCount > maxLines;
	const visibleCount = clipped ? maxLines : lineCount;
	const download = useCallback(() => {
		const key = language.toLowerCase();
		const mime = MIME_BY_LANGUAGE[key] ?? "text/plain";
		const ext = EXTENSION_BY_LANGUAGE[key] ?? key;
		const blob = new Blob([code], { type: mime });
		const url = URL.createObjectURL(blob);
		const a = document.createElement("a");
		a.href = url;
		a.download = filename ?? `code.${ext}`;
		document.body.appendChild(a);
		a.click();
		a.remove();
		setTimeout(() => URL.revokeObjectURL(url), 0);
	}, [
		code,
		filename,
		language
	]);
	const actions = showHeader && /* @__PURE__ */ jsxs("div", {
		className: "codeblock__actions",
		onClick: (e) => e.stopPropagation(),
		role: "presentation",
		children: [
			showWrap && /* @__PURE__ */ jsx(ActionButton, {
				ariaLabel: "Toggle word wrap",
				"aria-pressed": wrapped,
				className: "enabled:active:scale-100",
				onClick: () => setWrapped((w) => !w),
				children: /* @__PURE__ */ jsx(WrapText, { ...ICON })
			}),
			showDownload && /* @__PURE__ */ jsx(ActionButton, {
				ariaLabel: "Download",
				className: "enabled:active:scale-100",
				onClick: download,
				children: /* @__PURE__ */ jsx(Download, { ...ICON })
			}),
			showCopy && /* @__PURE__ */ jsxs(ActionButton, {
				ariaLabel: "Copy code",
				"data-copied": copied || void 0,
				className: "codeblock__copy enabled:active:scale-100",
				onClick: () => copy(code),
				children: [copied ? /* @__PURE__ */ jsx(Check, { ...ICON }) : /* @__PURE__ */ jsx(Copy, { ...ICON }), /* @__PURE__ */ jsx("span", { children: copied ? "Copied" : "Copy" })]
			})
		]
	});
	const leading = /* @__PURE__ */ jsxs(Fragment, { children: [
		showCollapse && /* @__PURE__ */ jsx(ChevronDown, {
			...ICON,
			className: "codeblock__chevron",
			"aria-hidden": true
		}),
		!languageSelector && /* @__PURE__ */ jsx("span", {
			className: "codeblock__badge",
			children: language
		}),
		filename && /* @__PURE__ */ jsx("span", {
			className: "codeblock__filename",
			children: filename
		}),
		collapsed && /* @__PURE__ */ jsxs("span", {
			className: "codeblock__count",
			children: [
				"· ",
				lineCount,
				" lines"
			]
		})
	] });
	return /* @__PURE__ */ jsxs("div", {
		className: cn("codeblock", wrapped && "codeblock--wrap", collapsed && "codeblock--collapsed", !showLineNumbers && "codeblock--no-ln", className),
		children: [
			showHeader && /* @__PURE__ */ jsxs("div", {
				className: "codeblock__header",
				children: [
					showCollapse ? /* @__PURE__ */ jsx("button", {
						type: "button",
						className: "codeblock__toggle",
						"aria-expanded": !collapsed,
						onClick: () => setCollapsed((c) => !c),
						children: leading
					}) : /* @__PURE__ */ jsx("div", {
						className: "codeblock__toggle codeblock__toggle--static",
						children: leading
					}),
					languageSelector && /* @__PURE__ */ jsx("div", {
						className: "codeblock__language",
						onClick: (e) => e.stopPropagation(),
						role: "presentation",
						children: languageSelector
					}),
					actions
				]
			}),
			!collapsed && /* @__PURE__ */ jsxs("div", {
				className: "codeblock__body",
				children: [/* @__PURE__ */ jsx("pre", {
					className: "codeblock__pre",
					children: lines.slice(0, visibleCount).map((line, i) => /* @__PURE__ */ jsxs("div", {
						className: "codeblock__line",
						children: [showLineNumbers && /* @__PURE__ */ jsx("span", {
							className: "codeblock__ln",
							"aria-hidden": "true",
							children: i + 1
						}), /* @__PURE__ */ jsx("span", {
							className: "codeblock__cell",
							children: highlightedLines?.[i] ?? line
						})]
					}, i))
				}), clipped && /* @__PURE__ */ jsx("div", {
					className: "codeblock__fade",
					"aria-hidden": "true"
				})]
			}),
			!collapsed && clipped && /* @__PURE__ */ jsxs("button", {
				type: "button",
				className: "codeblock__more",
				onClick: () => setExpanded(true),
				children: [
					"Show ",
					lineCount - maxLines,
					" more lines"
				]
			})
		]
	});
}
CodeBlock.displayName = "CodeBlock";
//#endregion
export { CodeBlock };

//# sourceMappingURL=CodeBlock2.js.map