sommark 3.3.4 → 4.0.0

package/mappers/languages/html.js

@@ -1,92 +1,126 @@
 import Mapper from "../mapper.js";
-import { HTML_TAGS } from "../../constants/html_tags.js";
-import { HTML_PROPS } from "../../constants/html_props.js";
 import { VOID_ELEMENTS } from "../../constants/void_elements.js";
-import kebabize from "../../helpers/kebabize.js";
-import { todo, list, htmlTable } from "../../helpers/utils.js";
+import { registerSharedOutputs } from "../shared/index.js";
+
+/**
+ * Helper to format an HTML tag with attributes and content.
+ * 
+ * @param {string} id - The name of the HTML tag.
+ * @param {Object} args - The attributes for the tag.
+ * @param {string} content - The text or tags inside this tag.
+ * @returns {string} - The finished HTML string.
+ */
+const renderHtmlTag = function (id, args, content) {
+	const element = this.tag(id);
+
+	element.smartAttributes(args, this.customProps);
+
+	let finalContent = content;
+	if (id.toLowerCase() === "script" && args.scoped === true) {
+		finalContent = `(function(){\n${content}\n})();`;
+	}
 
-class HtmlMapper extends Mapper {
-	constructor() {
-		super();
+	if (VOID_ELEMENTS.has(id.toLowerCase())) {
+		return element.selfClose();
 	}
+
+	return element.body(finalContent);
+};
+
+/**
+ * The HTML Mapper used for generating web pages.
+ */
+const HTML = Mapper.define({
+	/**
+	 * Formats an HTML comment.
+	 * @param {string} text - The text inside the comment.
+	 * @returns {string} - The finished comment.
+	 */
 	comment(text) {
-		return `<!-- ${text.replace(/^#/, "").trim()} -->`;
-	}
+		return `<!-- ${text} -->`;
+	},
 
-	formatOutput(output, includeDocument) {
-		const todoRegex = /@@TODO_BLOCK:([\s\S]*?):([\s\S]*?)@@/g;
-		const statusMarkers = ["done", "x", "X", "-", ""];
-		output = output.replace(todoRegex, (match, body, arg0) => {
-			const bodyTrimmed = body.trim().toLowerCase();
-			const arg0Trimmed = arg0.trim().toLowerCase();
+	/**
+	 * Formats plain text and makes sure it's safe for HTML if needed.
+	 */
+	text(text, options) {
+		if (options?.escape === false) return text;
+		return this.escapeHTML(text);
+	},
 
-			const bodyIsStatus = statusMarkers.includes(bodyTrimmed);
-			const arg0IsStatus = statusMarkers.includes(arg0Trimmed);
+	/**
+	 * Formats text inside inline tags (like bold or links).
+	 */
+	inlineText(text, options) {
+		if (options?.escape !== false) {
+			return this.escapeHTML(text);
+		}
+		return text;
+	},
 
-			let finalStatus = arg0; // Default: arg is status
-			let finalTask = body;   // Default: body is task
+	/**
+	 * Formats the content inside AtBlocks.
+	 */
+	atBlockBody(text, options) {
+		let out = String(text);
+		if (options?.escape !== false) {
+			out = this.escapeHTML(out);
+		}
+		if (out.includes('\n')) {
+			out = '\n' + out + '\n';
+		}
+		return out;
+	},
 
-			if (bodyIsStatus && !arg0IsStatus) {
-				finalStatus = body;
-				finalTask = arg0;
+	/**
+	 * Provides high-fidelity fallback for unknown ids by rendering them as HTML elements.
+	 * @param {Object} node - The unknown AST node.
+	 * @returns {Object} - A virtual id registration for fallback rendering.
+	 */
+	getUnknownTag(node) {
+		const id = node.id.toLowerCase();
+		const isVoid = VOID_ELEMENTS.has(id);
+		const isCodeStyleOrScript = ["code", "style", "script"].includes(id);
+
+		return {
+			render: function ({ args, content }) { return renderHtmlTag.call(this, id, args, content); },
+			options: {
+				type: isCodeStyleOrScript ? ["Block", "AtBlock"] : ["Block", "Inline"],
+				escape: !isCodeStyleOrScript,
+				rules: { is_self_closing: isVoid }
 			}
-
-			const checked = todo(finalStatus);
-			return this.tag("div").body(this.tag("input").attributes({ type: "checkbox", disabled: true, checked }).selfClose() + " " + (finalTask || ""));
-		});
-		if (includeDocument) {
-			let finalHeader = this.header;
-			let styleContent = "";
-			const updateStyleTag = style => {
-				if (style) {
-					const styleTag = `<style>\n${style}\n</style>`;
-					if (!finalHeader.includes(styleTag)) {
-						finalHeader += styleTag + "\n";
-					}
-				}
-			};
-
-
-			styleContent = this.styles.join("\n");
-			updateStyleTag(styleContent);
-
-			return `<!DOCTYPE html>\n<html>\n${finalHeader}\n<body>\n${output}\n</body>\n</html>\n`;
-		}
-		return output;
+		};
+	},
+	
+	options: {
+		// trimAndWrapBlocks: false // Default to false for high-fidelity
 	}
-}
+});
+
+// DOCTYPE tag
+HTML.register(["DOCTYPE", "doctype"], () => {
+	return "<!DOCTYPE html>";
+}, { type: "Block", rules: { is_self_closing: true } });
 
-const HTML = new HtmlMapper();
+// head tag
+HTML.register("head", function ({ content }) {
+	let varsStyle = "";
+	if (this.cssVariables) {
+		varsStyle = `<style>:root { ${this.cssVariables} }</style>\n`;
+	}
+	return this.tag("head").body(`${varsStyle}${content}`);
+}, { type: "Block", escape: false });
 
+// Root tag for Metadata and CSS Variables (Collector)
 HTML.register(
-	"Html",
+	["Root", "root"],
 	function ({ args }) {
-		this.pageProps.pageTitle = this.safeArg(args, undefined, "title", null, null, this.pageProps.pageTitle);
-		this.pageProps.charset = this.safeArg(args, undefined, "charset", null, null, this.pageProps.charset);
-		this.pageProps.tabIcon.src = this.safeArg(args, undefined, "iconSrc", null, null, this.pageProps.tabIcon.src);
-		this.pageProps.tabIcon.type = this.safeArg(args, undefined, "iconType", null, null, this.pageProps.tabIcon.type);
-		this.pageProps.httpEquiv["X-UA-Compatible"] = this.safeArg(
-			args,
-			undefined,
-			"httpEquiv",
-			null,
-			null,
-			this.pageProps.httpEquiv["X-UA-Compatible"]
-		);
-		this.pageProps.viewport = this.safeArg(args, undefined, "viewport", null, null, this.pageProps.viewport);
-
-		// Global CSS Variables
-		let cssVars = "";
+		this.cssVariables = this.cssVariables || "";
 		Object.keys(args).forEach(key => {
 			if (key.startsWith("--")) {
-				cssVars += `${key}:${args[key]};`;
+				this.cssVariables += `${key}:${args[key]};`;
 			}
 		});
-
-		if (cssVars) {
-			this.addStyle(`:root { ${cssVars} }`);
-		}
-
 		return "";
 	},
 	{
@@ -94,148 +128,6 @@ HTML.register(
 	}
 );
 
-// Block
-HTML.register(
-	"Block",
-	function ({ content }) {
-		return content;
-	},
-	{
-		type: "Block"
-	}
-);
-// Quote
-HTML.register(["quote", "blockquote"], function ({ content }) {
-	return this.tag("blockquote").body(content);
-}, { type: "Block" });
-// Raw Content Blocks
-HTML.register(["raw", "mdx"], function ({ content }) {
-	return content;
-}, { type: "Block" });
-// Bold
-HTML.register("bold", function ({ content }) {
-	return this.tag("strong").body(content);
-}, { type: "any" });
-// Strike
-HTML.register("strike", function ({ content }) {
-	return this.tag("s").body(content);
-}, { type: "any" });
-// Italic
-HTML.register("italic", function ({ content }) {
-	return this.tag("i").body(content);
-}, { type: "any" });
-// Emphasis
-HTML.register("emphasis", function ({ content }) {
-	return this.tag("span").attributes({ style: "font-weight:bold; font-style: italic;" }).body(content);
-}, { type: "any" });
-// Colored Text
-HTML.register("color", function ({ args, content }) {
-	const color = this.safeArg(args, 0, undefined, null, null, "none");
-	return this.tag("span")
-		.attributes({ style: `color:${color}` })
-		.body(content);
-}, { type: "any" });
-// Code
-HTML.register(
-	"Code",
-	function ({ args, content }) {
-		const lang = this.safeArg(args, 0, "lang", null, null, "text");
-		const code = content || "";
-		const code_element = this.tag("code");
-
-		code_element.attributes({ class: `language-${lang}` });
-
-		return this.tag("pre").body(code_element.body(code));
-	},
-	{ escape: false, type: ["AtBlock", "Block"] }
-);
-// List
-HTML.register(
-	"list",
-	function ({ content }) {
-		return list(content, "ul", this.escapeHTML);
-	},
-	{ escape: false, type: "any" }
-);
-HTML.register(
-	"Table",
-	function ({ content, args }) {
-		return htmlTable(content.split(/\n/), args, this.escapeHTML);
-	},
-	{
-		escape: false,
-		type: "AtBlock"
-	}
-);
-
-// Todo
-HTML.register("todo", function ({ args, content }) {
-	const isPlaceholder = content.includes("__SOMMARK_BODY_PLACEHOLDER_");
-	if (isPlaceholder) {
-		return `@@TODO_BLOCK:${content}:${args[0] || ""}@@`;
-	}
-	const statusMarkers = ["done", "x", "X", "-", ""];
-	const isInline = !isPlaceholder && statusMarkers.includes(content.trim().toLowerCase()) && args.length > 0;
-	const status = isInline ? content : (args[0] || "");
-	const label = isInline ? (args[0] || "") : content;
-	const checked = todo(status);
-	return this.tag("div").body(this.tag("input").attributes({ type: "checkbox", disabled: true, checked }).selfClose() + " " + (label || ""));
-}, { type: "any" });
-
-HTML_TAGS.forEach(tagName => {
-	const idsToRegister = [tagName].filter(id => {
-		const existing = HTML.get(id);
-		if (!existing || !existing.id) return true;
-		return Array.isArray(existing.id) ? !existing.id.includes(id) : existing.id !== id;
-	});
-
-	idsToRegister.forEach(id => {
-		const isAtBlock = ["style", "script"].includes(id.toLowerCase());
-
-		HTML.register(
-			id,
-			function ({ args, content, textContent }) {
-				const element = this.tag(id);
-				let inline_style = args.style ? (args.style.endsWith(";") ? args.style : args.style + ";") : "";
-
-
-				const keys = Object.keys(args).filter(arg => isNaN(arg));
-				keys.forEach(key => {
-					if (key === "style") return; // Already handled
-
-					const isDimensionAttributeSupported = ["img", "video", "svg", "canvas", "iframe", "object", "embed"].includes(id.toLowerCase());
-					const isWidthOrHeight = key === "width" || key === "height";
-					const isEvent = key.toLowerCase().startsWith("on");
-
-					const k = isEvent ? key.toLowerCase() : (HTML_PROPS.has(key) || this.extraProps.has(key)) ? key : kebabize(key);
-
-					if (isEvent || ((HTML_PROPS.has(key) || this.extraProps.has(key)) && (!isWidthOrHeight || isDimensionAttributeSupported)) || k.startsWith("data-") || k.startsWith("aria-")) {
-						element.attributes({ [k]: args[key] });
-					} else {
-						inline_style += `${k}:${args[key]};`;
-					}
-				});
-
-				if (inline_style) {
-					element.attributes({ style: inline_style });
-				}
-				// Self-Closing Element
-				if (VOID_ELEMENTS.has(id.toLowerCase())) {
-					return element.selfClose();
-				}
-
-				return element.body(content);
-			},
-			{
-				type: isAtBlock ? "AtBlock" : "Block",
-				escape: !isAtBlock,
-				rules: {
-					is_self_closing: VOID_ELEMENTS.has(id.toLowerCase())
-				}
-			}
-		);
-	});
-});
-
+registerSharedOutputs(HTML);
 
 export default HTML;

package/mappers/languages/json.js

@@ -1,191 +1,142 @@
 import Mapper from "../mapper.js";
-import { TEXT } from "../../core/labels.js";
-import { transpilerError } from "../../core/errors.js";
-
-
-// ========================================================================== //
-//  Helpers                                                                   //
-// ========================================================================== //
-
-function escapeString(str) {
-	return JSON.stringify(str);
+import { getPositionalArgs, matchedValue, safeArg } from "../../helpers/utils.js";
+
+/**
+ * JSON Mapper - Creates JSON output.
+ * It manages the structure manually using 'handleAst: true'.
+ */
+
+/**
+ * Returns a string representing the specified indentation level.
+ */
+function getIndent(depth) {
+	return "  ".repeat(depth);
 }
 
-function processNode(node, parentType = null) {
-	if (!node) return "";
-
-	if (node.id === "Object" || node.id === "Array" || node.id === "Json") {
-		return renderBlock(node, parentType);
-	} else if (["string", "number", "bool", "null", "array", "none"].includes(node.id)) {
-		return renderInline(node, parentType);
-	} else if (node.type === TEXT) {
-		return "";
-	}
-	return "";
+/**
+ * Escapes a string for use in a JSON property or value.
+ * @param {string} str - The string to escape.
+ * @param {boolean} [trim=false] - Whether to trim the string.
+ */
+function escapeString(str, trim = false) {
+	let out = String(str);
+	if (trim) out = out.trim();
+	return JSON.stringify(out);
 }
 
-function renderBlock(node, parentType) {
-	let output = "";
-	let key = "";
-	let isRoot = node.id === "Json";
-	let type = node.id === "Array" || (isRoot && node.args.includes("array")) ? "array" : "object";
-
-	// ========================================================================== //
-	//  Key                                                                       //
-	// ========================================================================== //
-	if (!isRoot) {
-		if (parentType === "object") {
-			key = node.args && node.args[0] ? escapeString(node.args[0]) : null;
-			if (!key) {
-				key = '"unknown_key"';
-			}
-		}
-	}
-
-	// ========================================================================== //
-	//  Children                                                                  //
-	// ========================================================================== //
-	let children = [];
-	if (node.body && node.body.length > 0) {
-		for (const child of node.body) {
-			const childOutput = processNode(child, type);
-			if (childOutput) {
-				children.push(childOutput);
-			}
-		}
+/**
+ * Recursively extracts text content from a node, ignoring structural metadata.
+ */
+function getNodeText(node) {
+	if (!node.body) return "";
+	let text = "";
+	for (const child of node.body) {
+		if (child.type === "Text") text += child.text;
+		else if (child.type === "Block") text += getNodeText(child);
 	}
+	return text;
+}
 
-	let content = children.join(",");
-	let wrapper = type === "array" ? `[${content}]` : `{${content}}`;
+/**
+ * Resolves the key-value pairing for a JSON member.
+ */
+function renderMember(args, value) {
+	const posArgs = getPositionalArgs(args);
+	const key = args.key || posArgs[0]; // The 'key' rule determines the member name
 
 	if (key) {
-		return `${key}:${wrapper}`;
-	} else {
-		if (parentType === "object") {
-			if (!node.args || !node.args[0]) {
-				transpilerError([`{line}<$red:JSON Error:$> <$yellow:Blocks inside an Object must have a key argument.$>{line}`]);
-			}
-		}
-		return wrapper;
+		return `${escapeString(key)}: ${value}`;
 	}
+	return value;
 }
 
-function renderInline(node, parentType) {
-	let key = null;
-	let value = "";
-
-	// ========================================================================== //
-	//  Value                                                                     //
-	// ========================================================================== //
-	if (node.id === "string") {
-		if (!node.args || node.args.length === 0) {
-			transpilerError([`{line}<$red:JSON Error:$> <$yellow:String inline must have a value.$>{line}`]);
-		}
-		value = escapeString(node.args[0] || "");
-	} else if (node.id === "number") {
-		if (!node.args || node.args.length === 0 || isNaN(Number(node.args[0]))) {
-			transpilerError([`{line}<$red:JSON Error:$> <$yellow:Invalid or missing number value for inline.$>{line}`]);
-		}
-		value = node.args[0];
-	} else if (node.id === "bool") {
-		if (!node.args || (node.args[0] !== "true" && node.args[0] !== "false")) {
-			transpilerError([`{line}<$red:JSON Error:$> <$yellow:Bool inline must be 'true' or 'false'.$>{line}`]);
-		}
-		value = node.args[0] === "true" ? "true" : "false";
-	} else if (node.id === "null") {
-		value = "null";
-	} else if (node.id === "array") {
-		// ========================================================================== //
-		//  Inline array                                                              //
-		// ========================================================================== //
-		// (data)->(array: 1, 2, 3)
-		// args = ["1", " 2", " 3"]
-		const items = node.args.map(arg => {
-			const trimmed = arg.trim();
-			if (trimmed === "null") return "null";
-			if (trimmed === "true" || trimmed === "false") return trimmed;
-			if (!isNaN(parseFloat(trimmed)) && isFinite(trimmed)) return trimmed;
-			return escapeString(trimmed);
-		});
-		value = `[${items.join(",")}]`;
-	} else if (node.id === "none") {
-		// Special case: (-)->(none: val)
-		if (parentType === "object") {
-			transpilerError([
-				`{line}<$red:JSON Error:$> <$yellow:'none' inline is not allowed directly inside an Object. It must be inside an Array.$>{line}`
-			]);
-			return "";
-		}
-
-		// (-)->(none: 1, 2, null) -> [1, 2, null] -> args.length > 1
-		// (-)->(none: true) -> true -> args.length == 1
-
-		if (node.args.length > 1) {
-			const items = node.args.map(arg => {
-				const trimmed = arg.trim();
-				if (trimmed === "null") return "null";
-				if (trimmed === "true" || trimmed === "false") return trimmed;
-				if (!isNaN(parseFloat(trimmed)) && isFinite(trimmed)) return trimmed;
-				return escapeString(trimmed);
-			});
-			value = `[${items.join(",")}]`;
-		} else {
-			const arg = node.args[0] || "";
-			const trimmed = arg.trim();
-			if (trimmed === "null") value = "null";
-			else if (trimmed === "true" || trimmed === "false") value = trimmed;
-			else if (!isNaN(parseFloat(trimmed)) && isFinite(trimmed)) value = trimmed;
-			else value = escapeString(trimmed);
-		}
-	}
-
-	if (parentType === "object") {
-		if (node.id === "none") return "";
-
-		if (!node.value) {
-			transpilerError([
-				`{line}<$red:JSON Error:$> <$yellow:Inline elements inside an Object must have an identifier (key).$>{line}`
-			]);
-		}
-
-		key = escapeString(node.value);
-		return `${key}:${value}`;
-	} else {
-		return value;
-	}
+/**
+ * Formats a given node and tracks its indentation.
+ */
+async function renderNode(node, mapper, depth = 0) {
+	const target = matchedValue(mapper.outputs, node.id) || mapper.getUnknownTag(node);
+	if (!target) return "";
+
+	const textContent = getNodeText(node);
+	return await target.render.call(mapper, {
+		nodeType: node.type,
+		args: node.args,
+		content: "",
+		textContent,
+		ast: node,
+		depth
+	});
 }
 
-class JsonMapper extends Mapper {
-	constructor() {
-		super();
-	}
-
-	formatOutput(output) {
-		try {
-			return JSON.parse(JSON.stringify(output));
-		} catch (e) {
-			transpilerError([
-				"{line}<$red:JSON Format Error:$> ",
-				`<$yellow:Failed to parse generated JSON output.$>{N}<$cyan:Reason: $> <$magenta:'${e.message}'$>{line}`
-			]);
-			return output;
+/**
+ * Formats the children of a node into a neat list.
+ */
+async function renderChildren(node, mapper, depth = 0) {
+	let results = [];
+	const childIndent = getIndent(depth + 1);
+
+	for (const child of node.body) {
+		if (child.type === "Block") {
+			const output = await renderNode(child, mapper, depth + 1);
+			if (output) {
+				results.push(childIndent + output);
+			}
 		}
 	}
+	return results.join(",\n");
 }
 
-const Json = new JsonMapper();
-
-// ========================================================================== //
-//  Main Registration                                                         //
-// ========================================================================== //
-
-const noop = () => "";
-Json.register(["Object", "Array"], noop, { type: "Block" });
-Json.register(["string", "number", "bool", "null", "array", "none"], noop, { type: "Inline" });
-
-Json.register("Json", ({ args, content, ast }) => {
-	if (!ast) return "";
-	return processNode(ast, null);
-}, { type: "Block" });
+const Json = Mapper.define({});
+
+/**
+ * The JSON object node rule.
+ */
+Json.register(["Object", "object"], async ({ args, ast, depth = 0 }) => {
+	if (ast.body.length === 0) return renderMember(args, "{}");
+	const content = await renderChildren(ast, Json, depth);
+	const val = `{\n${content}\n${getIndent(depth)}}`;
+	return renderMember(args, val);
+}, { type: "Block", handleAst: true });
+
+/**
+ * The JSON array node rule.
+ */
+Json.register(["Array", "array"], async ({ args, ast, depth = 0 }) => {
+	if (ast.body.length === 0) return renderMember(args, "[]");
+	const content = await renderChildren(ast, Json, depth);
+	const val = `[\n${content}\n${getIndent(depth)}]`;
+	return renderMember(args, val);
+}, { type: "Block", handleAst: true });
+
+/**
+ * JSON Primitives
+ */
+Json.register("string", ({ args, textContent }) => {
+	const trim = safeArg({ 
+		args, 
+		key: "trim", 
+		type: "boolean", 
+		setType: v => v === "true" || v === true,
+		fallBack: false 
+	});
+	const val = escapeString(textContent, trim);
+	return renderMember(args, val);
+}, { type: "Block", handleAst: true });
+
+Json.register("number", ({ args, textContent }) => {
+	const raw = textContent.trim();
+	const val = (isNaN(Number(raw)) || raw === "") ? "0" : raw;
+	return renderMember(args, val);
+}, { type: "Block", handleAst: true });
+
+Json.register("bool", ({ args, textContent }) => {
+	const raw = textContent.trim().toLowerCase();
+	const val = (raw === "true" || raw === "1") ? "true" : "false";
+	return renderMember(args, val);
+}, { type: "Block", handleAst: true });
+
+Json.register("null", ({ args }) => {
+	return renderMember(args, "null");
+}, { type: "Block", handleAst: true });
 
 export default Json;