@qds.dev/tools 0.11.2 → 0.13.0

package/lib/rolldown/as-child.qwik.mjs

@@ -6,101 +6,62 @@ import { parseSync } from "oxc-parser";
 import { walk } from "oxc-walker";
 
 //#region rolldown/as-child.ts
-/**
-* Rolldown plugin that transforms JSX elements with asChild prop by moving child element props to the parent
-* @param options - Plugin configuration options
-* @returns Rolldown-compatible plugin object
-*/ const asChild = (options = {}) => {
-	const { debug: isDebugMode = false } = options;
-	/**
-	* Debug logging function that only outputs when debug mode is enabled
-	* @param message - Debug message to log
-	*/ const debug = (message) => {
-		if (!isDebugMode) return;
-		console.log(message);
-	};
-	return {
-		name: "vite-plugin-as-child",
-		enforce: "pre",
-		transform: {
-			filter: { id: createRegExp(exactly(".").and(anyOf("tsx", "jsx")).at.lineEnd()) },
-			handler(code, id) {
-				debug(`🔧 asChild plugin processing: ${id}`);
-				const parsed = parseSync(id, code);
-				if (parsed.errors.length > 0) return null;
-				const ast = parsed.program;
-				const s = new MagicString(code);
-				walk(ast, { enter(node) {
-					if (isJSXElement(node) && hasAsChild(node.openingElement)) processAsChild(node, s, code);
-				} });
-				if (s.hasChanged()) return {
-					code: s.toString(),
-					map: s.generateMap({ hires: true })
-				};
-				return null;
-			}
+function hasAsChild(opening, debug) {
+	const isAsChildProp = opening.attributes.some((attr) => attr.type === "JSXAttribute" && attr.name.type === "JSXIdentifier" && attr.name.name === "asChild");
+	if (isAsChildProp) debug("🔄 Found asChild element!");
+	return isAsChildProp;
+}
+function processAsChild(elem, s, source, debug) {
+	const children = elem.children.filter((child) => !isJSXText(child) || child.value.trim() !== "");
+	if (children.length === 0) return;
+	if (children.length > 1) throw new Error(`asChild elements must have exactly one child at ${elem.start}`);
+	const child = children[0];
+	let jsxType;
+	let movedProps;
+	if (isJSXElement(child)) {
+		const { type, props } = extractFromElement(child, source);
+		jsxType = type;
+		movedProps = props;
+		const attrs = child.openingElement.attributes;
+		if (attrs.length > 0) {
+			const nameEnd = child.openingElement.name.end;
+			const firstAttrStart = attrs[0].start;
+			const lastAttrEnd = attrs[attrs.length - 1].end;
+			const startPos = Math.max(nameEnd, firstAttrStart - 10);
+			const actualStart = source.slice(startPos, firstAttrStart).search(/\s/) + startPos;
+			s.remove(actualStart === startPos - 1 ? firstAttrStart : actualStart, lastAttrEnd);
 		}
-	};
-	/**
-	* Checks if a JSX opening element has an asChild attribute
-	* @param opening - JSX opening element to check
-	* @returns True if element has asChild attribute
-	*/ function hasAsChild(opening) {
-		const isAsChildProp = opening.attributes.some((attr) => attr.type === "JSXAttribute" && attr.name.type === "JSXIdentifier" && attr.name.name === "asChild");
-		if (isAsChildProp) debug("🔄 Found asChild element!");
-		return isAsChildProp;
-	}
-	/**
-	* Processes a JSX element with asChild prop, moving child props to parent
-	* @param elem - JSX element with asChild prop
-	* @param s - MagicString instance for code transformation
-	* @param source - Original source code
-	*/ function processAsChild(elem, s, source) {
-		const children = elem.children.filter((child) => !isJSXText(child) || child.value.trim() !== "");
-		if (children.length === 0) return;
-		if (children.length > 1) throw new Error(`asChild elements must have exactly one child at ${elem.start}`);
-		const child = children[0];
-		let jsxType;
-		let movedProps;
-		if (isJSXElement(child)) {
-			const { type, props } = extractFromElement(child, source);
-			jsxType = type;
-			movedProps = props;
-			const attrs = child.openingElement.attributes;
-			if (attrs.length > 0) {
-				const nameEnd = child.openingElement.name.end;
-				const firstAttrStart = attrs[0].start;
-				const lastAttrEnd = attrs[attrs.length - 1].end;
-				const startPos = Math.max(nameEnd, firstAttrStart - 10);
-				const actualStart = source.slice(startPos, firstAttrStart).search(/\s/) + startPos;
-				s.remove(actualStart === startPos - 1 ? firstAttrStart : actualStart, lastAttrEnd);
-			}
-			if (child.children.length > 0) {
-				const childrenCode = child.children.map((grandchild) => source.slice(grandchild.start, grandchild.end)).join("");
-				s.overwrite(child.start, child.end, childrenCode);
-			} else s.remove(child.start, child.end);
-		} else if (isJSXExpressionContainer(child)) {
-			const result = handleExpression(child.expression, source);
-			if (result) {
-				jsxType = result.type;
-				movedProps = result.props;
-				debug("⚠️ Expression asChild: props not removed from children");
-			} else {
-				debug(`⚠️ Skipping unsupported expression type: ${child.expression.type} at line ${getLineNumber(source, elem.start)}`);
-				return;
-			}
+		if (child.children.length > 0) {
+			const childrenCode = child.children.map((grandchild) => source.slice(grandchild.start, grandchild.end)).join("");
+			s.overwrite(child.start, child.end, childrenCode);
+		} else s.remove(child.start, child.end);
+	} else if (isJSXExpressionContainer(child)) {
+		const result = handleExpression(child.expression, source);
+		if (result) {
+			jsxType = result.type;
+			movedProps = result.props;
+			debug("⚠️ Expression asChild: props not removed from children");
 		} else {
-			debug(`⚠️ Skipping unsupported child type: ${child.type} at line ${getLineNumber(source, elem.start)}`);
+			debug(`⚠️ Skipping unsupported expression type: ${child.expression.type} at line ${getLineNumber(source, elem.start)}`);
 			return;
 		}
-		const opening = elem.openingElement;
-		const insertPos = opening.attributes.length > 0 ? opening.attributes[opening.attributes.length - 1].end : opening.name.end;
-		const typeAttr = jsxType.startsWith("\"") ? ` jsxType=${jsxType}` : ` jsxType={${jsxType}}`;
-		s.appendLeft(insertPos, typeAttr);
-		const propsAttr = ` movedProps={${movedProps}}`;
-		s.appendLeft(insertPos, propsAttr);
+	} else {
+		debug(`⚠️ Skipping unsupported child type: ${child.type} at line ${getLineNumber(source, elem.start)}`);
+		return;
 	}
-};
+	const opening = elem.openingElement;
+	const insertPos = opening.attributes.length > 0 ? opening.attributes[opening.attributes.length - 1].end : opening.name.end;
+	const typeAttr = jsxType.startsWith("\"") ? ` jsxType=${jsxType}` : ` jsxType={${jsxType}}`;
+	s.appendLeft(insertPos, typeAttr);
+	const propsAttr = ` movedProps={${movedProps}}`;
+	s.appendLeft(insertPos, propsAttr);
+}
+function asChildTransformCore(ast, s, code, debug) {
+	walk(ast, { enter(node) {
+		if (isJSXElement(node) && hasAsChild(node.openingElement, debug)) processAsChild(node, s, code, debug);
+	} });
+	return { changed: s.hasChanged() };
+}
 
 //#endregion
-export { asChild };
+export { asChildTransformCore };

package/lib/rolldown/index.d.ts

@@ -1,9 +1,10 @@
 export type { AsChildPluginOptions, AsChildTypes } from "./as-child";
-export { asChild } from "./as-child";
 export type { IconsPluginOptions, PacksMap } from "./icons";
-export { icons } from "./icons";
 export type { InlineAssetPluginOptions } from "./inline-asset";
 export { inlineAsset } from "./inline-asset";
 export { injectComponentTypes } from "./inject-component-types";
 export { inlineCssPlugin } from "./inline-css";
 export { qwikRolldown } from "./qwik-rolldown";
+export type { UiPluginOptions } from "./ui";
+export type { QdsOptions, QdsSubPlugin } from "./qds-types";
+export { qds } from "./qds";

package/lib/rolldown/index.qwik.mjs

@@ -1,8 +1,7 @@
-import { asChild } from "./as-child.qwik.mjs";
-import { icons } from "./icons.qwik.mjs";
 import { inlineAsset } from "./inline-asset.qwik.mjs";
 import { injectComponentTypes } from "./inject-component-types.qwik.mjs";
 import { inlineCssPlugin } from "./inline-css.qwik.mjs";
 import { qwikRolldown } from "./qwik-rolldown.qwik.mjs";
+import { qds } from "./qds.qwik.mjs";
 
-export { asChild, icons, injectComponentTypes, inlineAsset, inlineCssPlugin, qwikRolldown };
+export { injectComponentTypes, inlineAsset, inlineCssPlugin, qds, qwikRolldown };

package/lib/rolldown/inject-component-types.qwik.mjs

@@ -1,10 +1,10 @@
 import { getNodeText } from "../utils/ast/core.qwik.mjs";
 import { detectsRenderComponentUsage } from "../utils/ast/qwik.qwik.mjs";
+import { dirname, join, relative } from "node:path";
 import { anyOf, createRegExp } from "magic-regexp";
 import MagicString from "magic-string";
 import { parseSync } from "oxc-parser";
 import { walk } from "oxc-walker";
-import { dirname, join, relative } from "node:path";
 
 //#region rolldown/inject-component-types.ts
 const tsFilePattern = createRegExp(anyOf(".tsx", ".ts"));

package/lib/rolldown/inline-asset.qwik.mjs

@@ -1,8 +1,8 @@
-import { anyOf, char, createRegExp, exactly, maybe, oneOrMore } from "magic-regexp";
+import { createHash } from "node:crypto";
 import { existsSync, mkdirSync, readFileSync, writeFileSync } from "node:fs";
 import { createRequire } from "node:module";
 import { basename, dirname, join } from "node:path";
-import { createHash } from "node:crypto";
+import { anyOf, char, createRegExp, exactly, maybe, oneOrMore } from "magic-regexp";
 
 //#region rolldown/inline-asset.ts
 const nodeRequire = createRequire(import.meta.url);
@@ -42,7 +42,7 @@ const nodeRequire = createRequire(import.meta.url);
 		resolveId: {
 			order: "pre",
 			filter: { id: combinedQuery },
-			async handler(id, importer, options) {
+			async handler(id, importer, resolveOptions) {
 				const isInlineAsset = inlineAssetQuery.test(id);
 				const isNoTransform = noTransformQuery.test(id);
 				if (!isInlineAsset && !isNoTransform) return;
@@ -57,7 +57,7 @@ const nodeRequire = createRequire(import.meta.url);
 				let resolvedPath = null;
 				try {
 					const resolved = await this.resolve(basePath, importer, {
-						...options,
+						...resolveOptions,
 						skipSelf: true
 					});
 					if (resolved) resolvedPath = resolved.id.split("?")[0];
@@ -75,8 +75,8 @@ const nodeRequire = createRequire(import.meta.url);
 						}
 						const subpath = parts.slice(subpathStartIndex).join("/");
 						try {
-							const basePath = importer ? dirname(importer) : process.cwd();
-							resolvedPath = join(dirname(nodeRequire.resolve(`${packageName}/package.json`, { paths: [basePath] })), subpath);
+							const resolverBasePath = importer ? dirname(importer) : process.cwd();
+							resolvedPath = join(dirname(nodeRequire.resolve(`${packageName}/package.json`, { paths: [resolverBasePath] })), subpath);
 							debugInlineAsset("Manually resolved package import:", resolvedPath);
 						} catch (err) {
 							debugInlineAsset("Failed to manually resolve:", err);

package/lib/rolldown/inline-css.qwik.mjs

@@ -1,5 +1,5 @@
-import { anyOf, charNotIn, createRegExp, exactly, oneOrMore } from "magic-regexp";
 import { readFileSync } from "node:fs";
+import { anyOf, charNotIn, createRegExp, exactly, oneOrMore } from "magic-regexp";
 
 //#region rolldown/inline-css.ts
 function inlineCssPlugin() {

package/lib/rolldown/qds-types.d.ts

@@ -0,0 +1,41 @@
+import type { Program } from "@oxc-project/types";
+import type MagicString from "magic-string";
+export type QdsDebugFn = (message: string, ...data: unknown[]) => void;
+export type QdsSubPluginContext = {
+    code: string;
+    id: string;
+    ast: Program | null;
+    s: MagicString;
+    debug: QdsDebugFn;
+    warn?: (message: string) => void;
+};
+export type QdsSubPluginResult = {
+    changed: boolean;
+};
+export type QdsSubPlugin = {
+    name: string;
+    extensions: RegExp;
+    transform(ctx: QdsSubPluginContext): QdsSubPluginResult | null;
+    resolveId?(source: string): string | null;
+    load?(id: string): Promise<{
+        code: string;
+    } | null> | {
+        code: string;
+    } | null;
+};
+export type QdsUiOptions = {
+    importSources?: string[];
+};
+export type QdsIconsOptions = {
+    importSources?: string[];
+    packs?: Record<string, {
+        iconifyPrefix: string;
+        sanitizeIcon?: (pascal: string) => string;
+    }>;
+};
+export type QdsOptions = {
+    ui?: boolean | QdsUiOptions;
+    icons?: boolean | QdsIconsOptions;
+    asChild?: boolean;
+    debug?: boolean;
+};

package/lib/rolldown/qds.d.ts

@@ -0,0 +1,5 @@
+import type { Plugin } from "rolldown";
+import type { QdsOptions, QdsSubPlugin } from "./qds-types";
+export declare const qds: (options?: QdsOptions, _testSubPlugins?: QdsSubPlugin[]) => Plugin & {
+    enforce?: "pre" | "post";
+};

package/lib/rolldown/qds.qwik.mjs

@@ -0,0 +1,147 @@
+import { asChildTransformCore } from "./as-child.qwik.mjs";
+import { uiTransformCore } from "./ui.qwik.mjs";
+import { CollectionLoader } from "../utils/icons/collections/loader.qwik.mjs";
+import { resolveImportAliases } from "../utils/icons/import-resolver.qwik.mjs";
+import { transformTSXFileCore } from "../utils/icons/transform/tsx.qwik.mjs";
+import { transformMDXFileCore } from "../utils/icons/transform/mdx.qwik.mjs";
+import MagicString from "magic-string";
+import { parseSync } from "oxc-parser";
+
+//#region rolldown/qds.ts
+const createDebug = (pluginName, isDebugMode) => (message, ...data) => {
+	if (!isDebugMode) return;
+	console.log(`[qds:${pluginName}] ${message}`, ...data);
+};
+const buildCombinedFilter = (activePlugins) => {
+	if (activePlugins.length === 0) return /(?!)/;
+	return new RegExp(activePlugins.map((p) => p.extensions.source).join("|"));
+};
+const createUiSubPlugin = (opts, _debug) => {
+	const importSources = typeof opts === "object" && opts.importSources ? opts.importSources : ["@qds.dev/ui"];
+	return {
+		name: "ui",
+		extensions: /\.(tsx|jsx)$/,
+		transform: (ctx) => {
+			if (!ctx.ast) return { changed: false };
+			return uiTransformCore(ctx.code, ctx.id, ctx.ast, ctx.s, importSources, ctx.debug, ctx.warn);
+		}
+	};
+};
+const createIconsSubPlugin = (opts, debug) => {
+	const importSources = typeof opts === "object" && opts.importSources ? opts.importSources : ["@qds.dev/ui"];
+	const packs = typeof opts === "object" ? opts.packs : void 0;
+	const collectionNames = /* @__PURE__ */ new Map();
+	const collectionLoader = new CollectionLoader(debug);
+	return {
+		name: "icons",
+		extensions: /\.(tsx|jsx|mdx)$/,
+		transform: (ctx) => {
+			if (collectionLoader.getAvailableCollections().size === 0) collectionLoader.discoverCollections();
+			const availableCollections = collectionLoader.getAvailableCollections();
+			if (ctx.id.endsWith(".mdx")) return transformMDXFileCore(ctx.code, ctx.id, ctx.s, importSources, availableCollections, collectionNames, packs, ctx.debug);
+			if (!ctx.ast) return { changed: false };
+			const aliasToPack = resolveImportAliases(ctx.ast, importSources, availableCollections, collectionNames, packs, ctx.debug);
+			if (aliasToPack.size === 0) return { changed: false };
+			return transformTSXFileCore(ctx.code, ctx.id, ctx.ast, ctx.s, aliasToPack, collectionNames, availableCollections, packs, ctx.debug);
+		},
+		resolveId: (source) => {
+			if (source.startsWith("virtual:icons/")) return `\0${source}`;
+			return null;
+		},
+		load: async (id) => {
+			if (!id.startsWith("\0virtual:icons/")) return null;
+			const parts = id.slice(1).split("/");
+			const prefix = parts[1];
+			const name = parts[2];
+			if (!prefix || !name) return null;
+			try {
+				const iconData = name.includes("-") ? await collectionLoader.loadIconDataLazy(prefix, name) : await collectionLoader.loadIconDataByLowercase(prefix, name);
+				if (!iconData) return { code: `export default '<path d="M12 2L2 7l10 5 10-5z"/><path d="M2 17l10 5 10-5M2 12l10 5 10-5"/>';\n` };
+				return { code: `export default \`${iconData.body}\`;` };
+			} catch {
+				return { code: `export default '<circle cx="12" cy="12" r="10"/><path d="M12 6v6l4 2"/>';\n` };
+			}
+		}
+	};
+};
+const createAsChildSubPlugin = (_debug) => ({
+	name: "as-child",
+	extensions: /\.(tsx|jsx)$/,
+	transform: (ctx) => {
+		if (!ctx.ast) return { changed: false };
+		return asChildTransformCore(ctx.ast, ctx.s, ctx.code, ctx.debug);
+	}
+});
+const buildActivePlugins = (options, isDebugMode) => {
+	const plugins = [];
+	if (options.ui !== false) {
+		const uiOpts = typeof options.ui === "object" ? options.ui : true;
+		plugins.push(createUiSubPlugin(uiOpts, createDebug("ui", isDebugMode)));
+	}
+	if (options.icons) {
+		const iconsOpts = typeof options.icons === "object" ? options.icons : true;
+		plugins.push(createIconsSubPlugin(iconsOpts, createDebug("icons", isDebugMode)));
+	}
+	if (options.asChild) plugins.push(createAsChildSubPlugin(createDebug("as-child", isDebugMode)));
+	return plugins;
+};
+const qds = (options = {}, _testSubPlugins) => {
+	const isDebugMode = !!options.debug;
+	const activePlugins = _testSubPlugins ?? buildActivePlugins(options, isDebugMode);
+	const combinedFilter = buildCombinedFilter(activePlugins);
+	const hasResolveId = activePlugins.some((p) => "resolveId" in p);
+	const hasLoad = activePlugins.some((p) => "load" in p);
+	const plugin = {
+		name: "vite-plugin-qds",
+		enforce: "pre",
+		transform: {
+			filter: { id: combinedFilter },
+			handler(code, id) {
+				const isMDX = id.endsWith(".mdx");
+				let ast = null;
+				if (!isMDX) {
+					const parsed = parseSync(id, code);
+					if (parsed.errors.length > 0) return null;
+					ast = parsed.program;
+				}
+				const s = new MagicString(code);
+				let changed = false;
+				for (const subPlugin of activePlugins) {
+					if (!subPlugin.extensions.test(id)) continue;
+					if (subPlugin.transform({
+						code,
+						id,
+						ast,
+						s,
+						debug: createDebug(subPlugin.name, isDebugMode),
+						warn: this?.warn?.bind(this)
+					})?.changed) changed = true;
+				}
+				if (!changed) return null;
+				return {
+					code: s.toString(),
+					map: s.generateMap({ hires: true })
+				};
+			}
+		}
+	};
+	if (hasResolveId) plugin.resolveId = { handler(source) {
+		for (const subPlugin of activePlugins) {
+			if (!subPlugin.resolveId) continue;
+			const result = subPlugin.resolveId(source);
+			if (result !== null) return result;
+		}
+		return null;
+	} };
+	if (hasLoad) plugin.load = { async handler(id) {
+		for (const subPlugin of activePlugins) {
+			if (!subPlugin.load) continue;
+			return subPlugin.load(id);
+		}
+		return null;
+	} };
+	return plugin;
+};
+
+//#endregion
+export { qds };

package/lib/rolldown/qds.unit.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/rolldown/ui-types.d.ts

@@ -0,0 +1,42 @@
+import type { JSXExpressionContainer, StaticMemberExpression } from "@oxc-project/types";
+export type UIPluginOptions = {
+    debug?: boolean;
+    importSources?: string[];
+};
+export type BoundNamespace = {
+    localName: string;
+    importedName: string;
+};
+export type StateReference = {
+    node: StaticMemberExpression;
+    namespace: BoundNamespace;
+    getterName: string;
+    contextField: string;
+    start: number;
+    end: number;
+};
+export type AliasBinding = {
+    localName: string;
+    namespace: BoundNamespace;
+    getterName: string;
+    contextField: string;
+};
+export type TransformTarget = {
+    kind: "expression" | "element";
+    container?: JSXExpressionContainer;
+    stateRefs: StateReference[];
+    aliasRefs: AliasBinding[];
+    start: number;
+    end: number;
+};
+export type HookTarget = {
+    hookStart: number;
+    hookEnd: number;
+    stateRefs: StateReference[];
+    aliasRefs: AliasBinding[];
+    namespace: BoundNamespace;
+    contextField: string;
+    rootOpeningEnd: number;
+    aliasDeclaratorStart: number;
+    aliasDeclaratorEnd: number;
+};

package/lib/rolldown/ui.d.ts

@@ -0,0 +1,12 @@
+import type { Program } from "@oxc-project/types";
+import type { Plugin } from "rolldown";
+import MagicString from "magic-string";
+import type { UIPluginOptions } from "./ui-types";
+export type UiTransformCoreResult = {
+    changed: boolean;
+};
+export declare function uiTransformCore(code: string, id: string, ast: Program, s: MagicString, importSources: string[], debug: (message: string, ...data: unknown[]) => void, warn?: (message: string) => void): UiTransformCoreResult;
+export declare const ui: (options?: UIPluginOptions) => Plugin & {
+    enforce?: "pre" | "post";
+};
+export type { UIPluginOptions as UiPluginOptions } from "./ui-types";