@ecomiq/storefront 2.1.4 → 3.0.0

package/dist/vite-sections-DTBr0-Kg.js

@@ -0,0 +1,464 @@
+import { SOURCE, SOURCES_PROP } from "./source-marker-DhqSkW7n.js";
+import { existsSync, readFileSync, statSync } from "node:fs";
+import { dirname, relative, resolve, sep } from "node:path";
+import { parse } from "@babel/parser";
+import { VISITOR_KEYS, traverseFast } from "@babel/types";
+// src/vite-sections.ts
+var SectionPropsError = class extends Error {};
+function parseModule(code) {
+	return parse(code, {
+		sourceType: "module",
+		plugins: ["typescript", "jsx"]
+	});
+}
+function exportedLoad(program) {
+	return program.some((node) => {
+		if (node.type !== "ExportNamedDeclaration" || !node.declaration) return false;
+		const declaration = node.declaration;
+		if (declaration.type === "FunctionDeclaration") return declaration.id?.name === "load";
+		if (declaration.type === "VariableDeclaration") return declaration.declarations.some((item) => item.id.type === "Identifier" && item.id.name === "load");
+		return false;
+	});
+}
+function callsUseSection(body) {
+	let found = false;
+	traverseFast(body, (node) => {
+		if (node.type !== "CallExpression" || node.callee.type !== "Identifier" || node.callee.name !== "useSection") return;
+		const first = node.arguments[0];
+		if (first?.type === "Identifier" && first.name === "load") found = true;
+	});
+	return found;
+}
+function sectionsOf(code) {
+	const program = parseModule(code).program.body;
+	const sections = /* @__PURE__ */ new Set();
+	for (const node of program) {
+		if (node.type !== "ExportNamedDeclaration" || !node.declaration) continue;
+		const declaration = node.declaration;
+		if (declaration.type === "FunctionDeclaration" && declaration.id && callsUseSection(declaration.body)) sections.add(declaration.id.name);
+		if (declaration.type !== "VariableDeclaration") continue;
+		for (const item of declaration.declarations) if (item.id.type === "Identifier" && item.init && callsUseSection(item.init)) sections.add(item.id.name);
+	}
+	return {
+		load: exportedLoad(program),
+		sections
+	};
+}
+function unwrap(node) {
+	if (node.type === "TSAsExpression" || node.type === "TSSatisfiesExpression" || node.type === "ParenthesizedExpression") return unwrap(node.expression);
+	return node;
+}
+function literal(input) {
+	const node = unwrap(input);
+	if (node.type === "StringLiteral" || node.type === "NumericLiteral" || node.type === "BooleanLiteral") return {
+		ok: true,
+		value: node.value
+	};
+	if (node.type === "NullLiteral") return {
+		ok: true,
+		value: null
+	};
+	if (node.type === "TemplateLiteral" && node.expressions.length === 0) return {
+		ok: true,
+		value: node.quasis[0]?.value.cooked ?? ""
+	};
+	if (node.type === "UnaryExpression" && node.operator === "-" && node.argument.type === "NumericLiteral") return {
+		ok: true,
+		value: -node.argument.value
+	};
+	if (node.type === "ArrayExpression") {
+		const values = [];
+		for (const element of node.elements) {
+			if (!element || element.type === "SpreadElement") return { ok: false };
+			const item = literal(element);
+			if (!item.ok) return item;
+			values.push(item.value);
+		}
+		return {
+			ok: true,
+			value: values
+		};
+	}
+	if (node.type === "ObjectExpression") {
+		const values = {};
+		for (const property of node.properties) {
+			if (property.type !== "ObjectProperty" || property.computed) return { ok: false };
+			let key;
+			if (property.key.type === "Identifier") key = property.key.name;
+			if (property.key.type === "StringLiteral") key = property.key.value;
+			if (key === void 0) return { ok: false };
+			const item = literal(property.value);
+			if (!item.ok) return item;
+			values[key] = item.value;
+		}
+		return {
+			ok: true,
+			value: values
+		};
+	}
+	return { ok: false };
+}
+function jsxProps(node, where, name) {
+	const props = {};
+	for (const attribute of node.attributes) {
+		if (attribute.type === "JSXSpreadAttribute") throw new SectionPropsError(`${where}: <${name}> carga sus datos y no acepta {...props}.`);
+		const key = attribute.name.type === "JSXIdentifier" ? attribute.name.name : `${attribute.name.namespace.name}:${attribute.name.name.name}`;
+		if (key === "key" || key.startsWith("data-")) continue;
+		const value = attribute.value;
+		if (value === null || value === void 0) {
+			props[key] = true;
+			continue;
+		}
+		if (value.type === "StringLiteral") {
+			if (!SOURCE.test(value.value)) props[key] = value.value;
+			continue;
+		}
+		const parsed = value.type === "JSXExpressionContainer" && value.expression.type !== "JSXEmptyExpression" ? literal(value.expression) : { ok: false };
+		if (!parsed.ok) throw new SectionPropsError(`${where}: <${name}> carga sus datos y solo acepta valores fijos; ${key} no lo es.`);
+		props[key] = parsed.value;
+	}
+	return props;
+}
+function resolveModule(source, importer, app) {
+	let base;
+	if (source.startsWith("~/")) base = resolve(app, source.slice(2));
+	if (source.startsWith("./") || source.startsWith("../")) base = resolve(dirname(importer), source);
+	if (base === void 0) return void 0;
+	for (const candidate of [
+		base,
+		`${base}.tsx`,
+		`${base}.ts`,
+		resolve(base, "index.tsx"),
+		resolve(base, "index.ts")
+	]) if (existsSync(candidate) && statSync(candidate).isFile()) return candidate;
+}
+function blank(text) {
+	return "\n".repeat(text.split("\n").length - 1);
+}
+function applyEdits(code, edits) {
+	let next = code;
+	for (const edit of [...edits].sort((a, b) => b.start - a.start)) next = `${next.slice(0, edit.start)}${edit.text}${next.slice(edit.end)}`;
+	return next;
+}
+const NOT_REFERENCES = {
+	MemberExpression: ["property"],
+	OptionalMemberExpression: ["property"],
+	ObjectProperty: ["key"],
+	ObjectMethod: ["key"],
+	ClassProperty: ["key"],
+	ClassMethod: ["key"],
+	TSPropertySignature: ["key"],
+	TSMethodSignature: ["key"],
+	TSQualifiedName: ["right"],
+	JSXAttribute: ["name"],
+	JSXMemberExpression: ["property"],
+	LabeledStatement: ["label"],
+	BreakStatement: ["label"],
+	ContinueStatement: ["label"]
+};
+function usedNames(program) {
+	const names = /* @__PURE__ */ new Set();
+	const visit = (node) => {
+		if (node.type === "Identifier" || node.type === "JSXIdentifier") names.add(node.name);
+		const skipped = node.computed ? [] : NOT_REFERENCES[node.type] ?? [];
+		for (const key of VISITOR_KEYS[node.type] ?? []) {
+			if (skipped.includes(key)) continue;
+			const child = node[key];
+			if (Array.isArray(child)) child.forEach((item) => item && visit(item));
+			else if (child) visit(child);
+		}
+	};
+	for (const node of program) if (node.type !== "ImportDeclaration") visit(node);
+	return names;
+}
+function clientSection(code) {
+	const edits = [];
+	for (const node of parseModule(code).program.body) {
+		if (node.type !== "ExportNamedDeclaration" || !node.declaration) continue;
+		const declaration = node.declaration;
+		if (declaration.type === "FunctionDeclaration" && declaration.id?.name === "load") {
+			const body = declaration.body;
+			edits.push({
+				start: body.start,
+				end: body.end,
+				text: `{ return undefined; }${blank(code.slice(body.start, body.end))}`
+			});
+		}
+		if (declaration.type !== "VariableDeclaration") continue;
+		for (const item of declaration.declarations) {
+			if (item.id.type !== "Identifier" || item.id.name !== "load" || !item.init) continue;
+			edits.push({
+				start: item.init.start,
+				end: item.init.end,
+				text: `async () => undefined${blank(code.slice(item.init.start, item.init.end))}`
+			});
+		}
+	}
+	if (edits.length === 0) return code;
+	const stripped = applyEdits(code, edits);
+	const program = parseModule(stripped).program.body;
+	const used = usedNames(program);
+	const imports = [];
+	for (const node of program) {
+		if (node.type !== "ImportDeclaration" || node.importKind === "type" || node.specifiers.length === 0) continue;
+		const keep = node.specifiers.filter((specifier) => specifier.type === "ImportSpecifier" && specifier.importKind === "type" || used.has(specifier.local.name));
+		if (keep.length === node.specifiers.length) continue;
+		const original = stripped.slice(node.start, node.end);
+		if (keep.length === 0) {
+			imports.push({
+				start: node.start,
+				end: node.end,
+				text: blank(original)
+			});
+			continue;
+		}
+		const named = keep.filter((specifier) => specifier.type === "ImportSpecifier").map((specifier) => stripped.slice(specifier.start, specifier.end));
+		const parts = [
+			...keep.filter((specifier) => specifier.type === "ImportDefaultSpecifier").map((specifier) => specifier.local.name),
+			...keep.filter((specifier) => specifier.type === "ImportNamespaceSpecifier").map((specifier) => `* as ${specifier.local.name}`),
+			...named.length > 0 ? [`{ ${named.join(", ")} }`] : []
+		];
+		imports.push({
+			start: node.start,
+			end: node.end,
+			text: `import ${parts.join(", ")} from ${stripped.slice(node.source.start, node.source.end)};${blank(original)}`
+		});
+	}
+	return applyEdits(stripped, imports);
+}
+function progressiveSections(code) {
+	const { sections } = sectionsOf(code);
+	const edits = [];
+	const exports = [];
+	for (const node of parseModule(code).program.body) {
+		if (node.type !== "ExportNamedDeclaration" || !node.declaration) continue;
+		const declaration = node.declaration;
+		if (declaration.type === "FunctionDeclaration" && declaration.id && sections.has(declaration.id.name)) {
+			const name = declaration.id.name;
+			const internal = `__ecomiqSection${name}`;
+			edits.push({
+				start: node.start,
+				end: declaration.start,
+				text: ""
+			});
+			edits.push({
+				start: declaration.id.start,
+				end: declaration.id.end,
+				text: internal
+			});
+			exports.push(`export const ${name} = __ecomiqWithSectionBoundary(${internal});`);
+		}
+		if (declaration.type !== "VariableDeclaration") continue;
+		for (const item of declaration.declarations) {
+			if (item.id.type !== "Identifier" || !sections.has(item.id.name) || !item.init) continue;
+			edits.push({
+				start: item.init.start,
+				end: item.init.end,
+				text: `__ecomiqWithSectionBoundary(${code.slice(item.init.start, item.init.end)})`
+			});
+		}
+	}
+	if (edits.length === 0) return code;
+	return `${applyEdits(code, edits)}\nimport { withSectionBoundary as __ecomiqWithSectionBoundary } from "@ecomiq/storefront";\n${exports.join("\n")}\n`;
+}
+function renameLoader(code, program) {
+	for (const node of program) {
+		if (node.type !== "ExportNamedDeclaration") continue;
+		if (node.specifiers.some((specifier) => specifier.exported.type === "Identifier" && specifier.exported.name === "loader")) throw new SectionPropsError("Declara el loader como export async function loader para que las secciones carguen sus datos.");
+		const declaration = node.declaration;
+		if (declaration?.type === "FunctionDeclaration" && declaration.id?.name === "loader") {
+			const head = `${declaration.async ? "async " : ""}function __ecomiqPageLoader`;
+			return {
+				code: `${code.slice(0, node.start)}${head}${code.slice(declaration.id.end)}`,
+				found: true
+			};
+		}
+		if (declaration?.type === "VariableDeclaration") {
+			const item = declaration.declarations.find((entry) => entry.id.type === "Identifier" && entry.id.name === "loader");
+			if (!item) continue;
+			const start = item.id.start;
+			const renamed = `${code.slice(0, start)}__ecomiqPageLoader${code.slice(start + 6)}`;
+			return {
+				code: `${renamed.slice(0, node.start)}${renamed.slice(declaration.start)}`,
+				found: true
+			};
+		}
+	}
+	return {
+		code,
+		found: false
+	};
+}
+const TEMPLATED = {
+	"app/routes/product.tsx": "product",
+	"app/routes/collection.tsx": "collection",
+	"app/routes/page.tsx": "page"
+};
+const DEFAULT_COMPONENT = "__ecomiqDefault";
+function wrapper(kind, head) {
+	const page = `__ecomiqCreateElement(__ecomiqTemplateComponent(__ecomiqTemplates, ${JSON.stringify(kind)}, props.loaderData) ?? ${DEFAULT_COMPONENT}, props)`;
+	return [
+		`import { createElement as __ecomiqCreateElement } from "react";`,
+		`import { SourceProvider as __ecomiqSourceProvider, templateComponent as __ecomiqTemplateComponent } from "@ecomiq/storefront";`,
+		`const __ecomiqTemplates = import.meta.glob("/app/templates/${kind}.*.tsx", { eager: true });`,
+		`${head}(props) { return __ecomiqCreateElement(__ecomiqSourceProvider, { value: props.loaderData }, ${page}); }`
+	].join("\n");
+}
+function sourcedProps(code) {
+	const edits = [];
+	traverseFast(parseModule(code), (node) => {
+		if (node.type !== "JSXOpeningElement") return;
+		const sourced = [];
+		for (const attribute of node.attributes) {
+			if (attribute.type !== "JSXAttribute" || attribute.name.type !== "JSXIdentifier" || attribute.value?.type !== "StringLiteral") continue;
+			const match = SOURCE.exec(attribute.value.value);
+			if (match === null) continue;
+			sourced.push(attribute.name.name);
+			edits.push({
+				start: attribute.value.start,
+				end: attribute.value.end,
+				text: `{__ecomiqSource(${JSON.stringify(match[1])})}`
+			});
+		}
+		if (sourced.length > 0) edits.push({
+			start: node.name.end,
+			end: node.name.end,
+			text: ` ${SOURCES_PROP}=${JSON.stringify(sourced.join(" "))}`
+		});
+	});
+	if (edits.length === 0) return void 0;
+	return `${applyEdits(code, edits)}\nimport { source as __ecomiqSource } from "@ecomiq/storefront";\n`;
+}
+function templatedComponent(code, kind) {
+	const program = parseModule(code).program.body;
+	const exported = program.find((node) => node.type === "ExportDefaultDeclaration");
+	if (exported?.type !== "ExportDefaultDeclaration") return void 0;
+	const declaration = exported.declaration;
+	if (declaration.type === "FunctionDeclaration") {
+		const name = declaration.id?.name ?? "__EcomiqTemplated";
+		const end = declaration.id?.end ?? declaration.start + 8;
+		return `${`${code.slice(0, exported.start)}function ${DEFAULT_COMPONENT}${code.slice(end)}`}\n${wrapper(kind, `export default function ${name}`)}\n`;
+	}
+	if (declaration.type !== "Identifier") return void 0;
+	const name = declaration.name;
+	for (const node of program) {
+		const own = node.type === "ExportNamedDeclaration" ? node.declaration : node;
+		if (own?.type !== "FunctionDeclaration" || own.id?.name !== name) continue;
+		return `${`${code.slice(0, own.id.start)}${DEFAULT_COMPONENT}${code.slice(own.id.end)}`}\n${wrapper(kind, node.type === "ExportNamedDeclaration" ? `export function ${name}` : `function ${name}`)}\n`;
+	}
+}
+function sectionLoaders() {
+	let root = "";
+	let app = "";
+	const modules = /* @__PURE__ */ new Map();
+	const moduleAt = (path) => {
+		const mtime = statSync(path).mtimeMs;
+		const cached = modules.get(path);
+		if (cached?.mtime === mtime) return cached;
+		try {
+			const read = sectionsOf(readFileSync(path, "utf8"));
+			const next = {
+				mtime,
+				load: read.load,
+				sections: read.sections
+			};
+			modules.set(path, next);
+			return next;
+		} catch {
+			return;
+		}
+	};
+	const fileOf = (path) => relative(root, path).split(sep).join("/");
+	function usagesOf(code, path, watch) {
+		const ast = parseModule(code);
+		const program = ast.program.body;
+		const imports = /* @__PURE__ */ new Map();
+		for (const node of program) {
+			if (node.type !== "ImportDeclaration" || node.importKind === "type") continue;
+			for (const specifier of node.specifiers) {
+				if (specifier.type === "ImportSpecifier" && specifier.importKind !== "type") imports.set(specifier.local.name, {
+					source: node.source.value,
+					imported: specifier.imported.type === "Identifier" ? specifier.imported.name : specifier.imported.value
+				});
+				if (specifier.type === "ImportDefaultSpecifier") imports.set(specifier.local.name, {
+					source: node.source.value,
+					imported: "default"
+				});
+			}
+		}
+		const usages = [];
+		const file = fileOf(path);
+		traverseFast(ast, (node) => {
+			if (node.type !== "JSXOpeningElement" || node.name.type !== "JSXIdentifier") return;
+			const target = imports.get(node.name.name);
+			if (!target) return;
+			const resolved = resolveModule(target.source, path, app);
+			if (!resolved) return;
+			watch(resolved);
+			const module = moduleAt(resolved);
+			if (!module?.load || !module.sections.has(target.imported)) return;
+			usages.push({
+				source: target.source,
+				file: fileOf(resolved),
+				props: jsxProps(node, `${file}:${node.loc?.start.line ?? 0}`, node.name.name)
+			});
+		});
+		return {
+			usages,
+			program
+		};
+	}
+	function sectionsCode(usages, exported) {
+		const sources = [...new Set(usages.map((usage) => usage.source))];
+		return [...sources.map((source, index) => `import { load as __ecomiqLoad${index} } from ${JSON.stringify(source)};`), `${exported ? "export " : ""}const __ecomiqSections = [${usages.map((usage) => `{ section: ${JSON.stringify(usage.file)}, load: __ecomiqLoad${sources.indexOf(usage.source)}, props: ${JSON.stringify(usage.props)} }`).join(", ")}];`];
+	}
+	function transformRoute(code, path, watch, kind) {
+		const { usages, program } = usagesOf(code, path, watch);
+		if (usages.length === 0 && kind === void 0) return void 0;
+		const renamed = renameLoader(code, program);
+		const page = renamed.found ? "__ecomiqPageLoader(args)" : "undefined";
+		let finish = "return __ecomiqWithSections(page, sections);";
+		if (kind !== void 0) finish = `return __ecomiqTemplated(args, page, sections, __ecomiqTemplates, ${JSON.stringify(kind)});`;
+		const lines = [
+			`import { loadSections as __ecomiqLoadSections, templated as __ecomiqTemplated, withSections as __ecomiqWithSections } from "@ecomiq/storefront";`,
+			...sectionsCode(usages, false),
+			`export async function loader(args) { const sections = __ecomiqLoadSections(args, __ecomiqSections); const page = await ${page}; ${finish} }`
+		];
+		return `${renamed.code}\n${lines.join("\n")}\n`;
+	}
+	function transformTemplate(code, path, watch) {
+		const { usages } = usagesOf(code, path, watch);
+		return `${code}\n${sectionsCode(usages, true).join("\n")}\n`;
+	}
+	return {
+		name: "ecomiq:section-loaders",
+		enforce: "pre",
+		configResolved(config) {
+			root = config.root;
+			app = resolve(config.root, "app");
+		},
+		transform(code, id, options) {
+			const path = id.split("?")[0] ?? id;
+			if (!path.startsWith(`${app}${sep}`) || !path.endsWith(".tsx")) return void 0;
+			const file = fileOf(path);
+			const server = options?.ssr === true || this.environment?.config?.consumer === "server";
+			let next = code;
+			const watch = (watched) => this.addWatchFile(watched);
+			const kind = TEMPLATED[file];
+			if (server && (file === "app/root.tsx" || file.startsWith("app/routes/"))) next = transformRoute(code, path, watch, kind) ?? code;
+			if (server && file.startsWith("app/templates/")) next = transformTemplate(code, path, watch);
+			if (kind !== void 0) next = templatedComponent(next, kind) ?? next;
+			if (kind !== void 0 || file.startsWith("app/templates/")) next = sourcedProps(next) ?? next;
+			if (/export\s+(?:async\s+function\s+load\b|function\s+load\b|const\s+load\b)/.test(code) && sectionsOf(code).load) {
+				if (!server) next = clientSection(next);
+				next = progressiveSections(next);
+				next = `${next}\nload.section = ${JSON.stringify(file)};\n`;
+			}
+			return next === code ? void 0 : {
+				code: next,
+				map: null
+			};
+		}
+	};
+}
+export { SectionPropsError, clientSection, sectionLoaders, sectionsOf, sourcedProps, templatedComponent };

package/dist/vite-sections.d.ts

@@ -0,0 +1,21 @@
+export declare class SectionPropsError extends Error {}
+export declare function sectionLoaders(): {
+  name: string;
+  enforce: "pre";
+  configResolved(config: {
+    root: string;
+  }): void;
+  transform(this: {
+    addWatchFile(path: string): void;
+    environment?: {
+      config?: {
+        consumer?: string;
+      };
+    };
+  }, code: string, id: string, options?: {
+    ssr?: boolean;
+  }): {
+    code: string;
+    map: null;
+  } | undefined;
+};

package/dist/vite-theme-ui-BMO-CDi3.js

@@ -0,0 +1,41 @@
+import { existsSync } from "node:fs";
+import { basename, join } from "node:path";
+// src/vite-theme-ui.ts
+const PREFIX = "@theme/ui/";
+const NAME = /^[a-z0-9-]+$/;
+const EXTENSIONS = [
+	".tsx",
+	".ts",
+	".jsx",
+	".js"
+];
+var ThemeUiError = class extends Error {};
+function themeUiFile(root, source, importer) {
+	if (!source.startsWith(PREFIX)) return null;
+	const name = source.slice(10);
+	const user = importer === void 0 ? "Una sección de @ecomiq/storefront" : `${basename(importer.split("?")[0] ?? importer)} de @ecomiq/storefront`;
+	if (!NAME.test(name)) throw new ThemeUiError(`${user} importa ${source}, que no es un componente de app/components/ui.`);
+	const base = join(root, "app/components/ui", name);
+	const file = EXTENSIONS.map((extension) => `${base}${extension}`).find((candidate) => existsSync(candidate));
+	if (file === void 0) throw new ThemeUiError(`${user} usa ${source}, pero el tema no tiene app/components/ui/${name}.tsx. Agrega ese componente al tema o personaliza la sección.`);
+	return file;
+}
+function themeUi() {
+	let root = process.cwd();
+	return {
+		name: "ecomiq:theme-ui",
+		enforce: "pre",
+		configResolved(config) {
+			root = config.root;
+		},
+		resolveId(source, importer) {
+			try {
+				return themeUiFile(root, source, importer);
+			} catch (error) {
+				if (error instanceof ThemeUiError) this.error(error.message);
+				throw error;
+			}
+		}
+	};
+}
+export { ThemeUiError, themeUi, themeUiFile };

package/dist/vite-theme-ui.d.ts

@@ -0,0 +1,10 @@
+export declare function themeUi(): {
+  name: string;
+  enforce: "pre";
+  configResolved(config: {
+    root: string;
+  }): void;
+  resolveId(this: {
+    error(message: string): never;
+  }, source: string, importer: string | undefined): string | null;
+};

package/dist/vite.d.ts

@@ -0,0 +1,36 @@
+import { SectionPropsError, sectionLoaders } from "./vite-sections.js";
+import { paymentLogos } from "./vite-payment-logos.js";
+import { themeUi } from "./vite-theme-ui.js";
+import { publicAssets } from "./vite-public-assets.js";
+import { CatalogLink } from "@ecomiq/core";
+export declare function catalogLinksFromSource(source: string): CatalogLink[];
+type HotModule = {
+  id: string | null;
+};
+type HotContext = {
+  file: string;
+  server: {
+    moduleGraph: {
+      getModuleById(id: string): HotModule | undefined;
+      invalidateModule(module: HotModule): void;
+    };
+    ws: {
+      send(message: {
+        type: "full-reload";
+      }): void;
+    };
+  };
+};
+export type CatalogLinksPlugin = {
+  name: string;
+  configResolved(config: {
+    root: string;
+  }): void;
+  resolveId(id: string): string | undefined;
+  load(this: {
+    addWatchFile(path: string): void;
+  }, id: string): string | undefined;
+  handleHotUpdate(context: HotContext): void;
+};
+export declare function catalogLinks(): CatalogLinksPlugin;
+export { SectionPropsError, paymentLogos, publicAssets, sectionLoaders, themeUi };