likec4 1.60.0 → 1.61.0

package/README.md

@@ -94,6 +94,8 @@ likec4 build -o ./dist
 
 Demo - [https://template.likec4.dev](https://template.likec4.dev/view/boutique/)
 
+The options of `start`, `build` and other commands can be kept in a `likec4.app.config.ts` file instead of flags (experimental), see [App config](https://likec4.dev/tooling/app-config/).
+
 > **Tip:**\
 > [likec4/template](https://github.com/likec4/template) repository demonstrates how to deploy to github pages.
 

package/__app__/codegen/react.mjs

@@ -1,10 +1,4 @@
-import "../src/chunks/rolldown-runtime.mjs";
-import { $likec4model, IconRenderer as RenderIcon } from "likec4:single-project";
-import { LikeC4ModelProvider, LikeC4View, ReactLikeC4, useLikeC4Model, useLikeC4View } from "likec4:react";
-//#region codegen/react.tsx
-var likec4model = $likec4model.get();
-function isLikeC4ViewId(value) {
-	return value != null && typeof value === "string" && !!likec4model.findView(value);
-}
-//#endregion
-export { LikeC4ModelProvider, LikeC4View, ReactLikeC4, RenderIcon, isLikeC4ViewId, likec4model, useLikeC4Model, useLikeC4View };
+import { $likec4data, $likec4model, $likec4model as $likec4model$1, IconRenderer as RenderIcon, LikeC4ModelProvider, LikeC4View, ReactLikeC4, isLikeC4ViewId, useLikeC4Model, useLikeC4View } from "likec4:react";
+// codegen/react.tsx
+var likec4model = $likec4model$1.get();
+export { $likec4data, $likec4model, LikeC4ModelProvider, LikeC4View, ReactLikeC4, RenderIcon, isLikeC4ViewId, likec4model, useLikeC4Model, useLikeC4View };

package/__app__/codegen/webcomponent.mjs

@@ -1,209 +1,6 @@
-import "../src/chunks/rolldown-runtime.mjs";
-import { C as safeParseAsync, D as normalizeParams, E as installLazyProp, O as own, S as safeParse, T as clone, _ as $ZodPipe, b as parse, d as $ZodBoolean, f as $ZodCodec, g as $ZodOptional, h as $ZodObject, k as shallowClone, l as _string, m as $ZodLiteral, p as $ZodDefault, u as _stringbool, v as $ZodString, w as $constructor, x as parseAsync, y as $ZodType } from "../src/chunks/libs/zod.mjs";
-import { createRoot } from "react-dom/client";
-import { jsx } from "react/jsx-runtime";
 import { ComponentName } from "likec4:app-config";
-import { LikeC4View as LikeC4View$1 } from "likec4:react";
-//#region ../../node_modules/.pnpm/zod@4.6.5/node_modules/zod/v4/mini/schemas.js
-var ZodMiniType = /*@__PURE__*/ $constructor("ZodMiniType", (inst, def) => {
-	if (!inst._zod) throw new Error("Uninitialized schema in ZodMiniType.");
-	$ZodType.init(inst, def);
-	inst.def = def;
-	inst.type = def.type;
-}, {
-	get with() {
-		return this.check;
-	},
-	set with(value) {
-		own(this, "with", value);
-	},
-	parse(data, params) {
-		return parse(this, data, params, { callee: this.parse });
-	},
-	parseAsync(data, params) {
-		return parseAsync(this, data, params, { callee: this.parseAsync });
-	},
-	safeParse(data, params) {
-		return safeParse(this, data, params);
-	},
-	safeParseAsync(data, params) {
-		return safeParseAsync(this, data, params);
-	},
-	check(...checks) {
-		const def = this.def;
-		return this.clone({
-			...def,
-			checks: [...def.checks ?? [], ...checks.map((ch) => typeof ch === "function" ? { _zod: {
-				check: ch,
-				def: { check: "custom" },
-				onattach: []
-			} } : ch)]
-		}, { parent: true });
-	},
-	clone(_def, params) {
-		return clone(this, _def, params);
-	},
-	brand() {
-		return this;
-	},
-	register(reg, meta) {
-		reg.add(this, meta);
-		return this;
-	},
-	apply(fn, ...args) {
-		return args.length === 0 ? fn(this) : fn(this, ...args);
-	}
-});
-var ZodMiniString = /*@__PURE__*/ $constructor("ZodMiniString", (inst, def) => {
-	$ZodString.init(inst, def);
-	ZodMiniType.init(inst, def);
-});
-// @__NO_SIDE_EFFECTS__
-function string(params) {
-	return _string(ZodMiniString, params);
-}
-var ZodMiniBoolean = /*@__PURE__*/ $constructor("ZodMiniBoolean", (inst, def) => {
-	$ZodBoolean.init(inst, def);
-	ZodMiniType.init(inst, def);
-});
-var ZodMiniObject = /*@__PURE__*/ $constructor("ZodMiniObject", (inst, def) => {
-	$ZodObject.init(inst, def);
-	ZodMiniType.init(inst, def);
-	installLazyProp(inst, "shape", (self) => self._zod.def.shape, false);
-});
-// @__NO_SIDE_EFFECTS__
-function object(shape, params) {
-	return new ZodMiniObject({
-		type: "object",
-		shape: shape ?? {},
-		...normalizeParams(params)
-	});
-}
-var ZodMiniLiteral = /*@__PURE__*/ $constructor("ZodMiniLiteral", (inst, def) => {
-	$ZodLiteral.init(inst, def);
-	ZodMiniType.init(inst, def);
-});
-// @__NO_SIDE_EFFECTS__
-function literal(value, params) {
-	return new ZodMiniLiteral({
-		type: "literal",
-		values: Array.isArray(value) ? value : [value],
-		...normalizeParams(params)
-	});
-}
-var ZodMiniOptional = /*@__PURE__*/ $constructor("ZodMiniOptional", (inst, def) => {
-	$ZodOptional.init(inst, def);
-	ZodMiniType.init(inst, def);
-});
-// @__NO_SIDE_EFFECTS__
-function optional(innerType) {
-	return new ZodMiniOptional({
-		type: "optional",
-		innerType
-	});
-}
-var ZodMiniDefault = /*@__PURE__*/ $constructor("ZodMiniDefault", (inst, def) => {
-	$ZodDefault.init(inst, def);
-	ZodMiniType.init(inst, def);
-});
-// @__NO_SIDE_EFFECTS__
-function _default(innerType, defaultValue) {
-	return new ZodMiniDefault({
-		type: "default",
-		innerType,
-		get defaultValue() {
-			return typeof defaultValue === "function" ? defaultValue() : shallowClone(defaultValue);
-		}
-	});
-}
-var ZodMiniPipe = /*@__PURE__*/ $constructor("ZodMiniPipe", (inst, def) => {
-	$ZodPipe.init(inst, def);
-	ZodMiniType.init(inst, def);
-});
-var ZodMiniCodec = /*@__PURE__*/ $constructor("ZodMiniCodec", (inst, def) => {
-	ZodMiniPipe.init(inst, def);
-	$ZodCodec.init(inst, def);
-});
-var stringbool = (...args) => _stringbool({
-	Codec: ZodMiniCodec,
-	Boolean: ZodMiniBoolean,
-	String: ZodMiniString
-}, ...args);
-//#endregion
-//#region codegen/webcomponent.tsx
-var propsSchema = /* @__PURE__ */ object({
-	viewId: /* @__PURE__ */ _default(/* @__PURE__ */ string(), "index"),
-	browser: /* @__PURE__ */ _default(stringbool(), true),
-	dynamicViewVariant: /* @__PURE__ */ optional(/* @__PURE__ */ literal(["diagram", "sequence"])),
-	colorScheme: /* @__PURE__ */ optional(/* @__PURE__ */ literal(["light", "dark"]))
-});
-var LikeC4View = class extends HTMLElement {
-	shadow;
-	root;
-	hostCss;
-	lastHostCss = "";
-	constructor() {
-		super();
-		this.shadow = this.attachShadow({
-			mode: "open",
-			delegatesFocus: true
-		});
-	}
-	updateHostCss() {
-		const hostCss = `
-    :host {
-      display: contents;
-      background-color: transparent;
-      margin: 0;
-      padding: 0;
-    }`;
-		if (hostCss !== this.lastHostCss) {
-			this.hostCss?.replaceSync(hostCss);
-			this.lastHostCss = hostCss;
-		}
-	}
-	connectedCallback() {
-		this.lastHostCss = "";
-		this.hostCss = new CSSStyleSheet();
-		this.updateHostCss();
-		this.shadow.adoptedStyleSheets = [this.hostCss];
-		this.render();
-	}
-	disconnectedCallback() {
-		this.root?.unmount();
-		this.root = void 0;
-		this.shadow.adoptedStyleSheets.length = 0;
-		this.hostCss = void 0;
-	}
-	static observedAttributes = [
-		"view-id",
-		"browser",
-		"dynamic-variant",
-		"color-scheme"
-	];
-	getProps() {
-		const props = propsSchema.safeParse({
-			viewId: this.getAttribute("view-id"),
-			browser: this.getAttribute("browser") ?? void 0,
-			dynamicViewVariant: this.getAttribute("dynamic-variant") ?? void 0,
-			colorScheme: this.getAttribute("color-scheme") ?? void 0
-		});
-		if (!props.success) {
-			console.error("Invalid props", props.error);
-			return { viewId: "index" };
-		}
-		return props.data;
-	}
-	render() {
-		const props = this.getProps();
-		this.updateHostCss();
-		this.root ??= createRoot(this.shadow);
-		this.root.render(/* @__PURE__ */ jsx(LikeC4View$1, { ...props }));
-	}
-	attributeChangedCallback(_name) {
-		if (this.root) this.render();
-	}
-};
-customElements.define(ComponentName.View, LikeC4View);
-//#endregion
-export { LikeC4View };
+import { defineLikeC4Webcomponent } from "likec4/react";
+import { LikeC4View } from "likec4:react";
+import { projectId } from "likec4:single-project";
+// codegen/webcomponent.tsx
+defineLikeC4Webcomponent(ComponentName.View, LikeC4View, projectId);

package/__app__/index.html

@@ -1,19 +1,19 @@
 <!DOCTYPE html>
 <html lang="en-US">
+  <head>
+    <meta charset="utf-8" />
+    <meta
+      name="viewport"
+      content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, shrink-to-fit=no"
+    />
+    <link rel="icon" type="image/svg+xml" href="/favicon.svg">
+    <link rel="stylesheet" href="/src/fonts.css">
+    <link rel="stylesheet" href="/src/style.css">
+    <title>LikeC4</title>
+  </head>
 
-<head>
-  <meta charset="utf-8" />
-  <meta name="viewport"
-    content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, shrink-to-fit=no" />
-  <link rel="icon" type="image/svg+xml" href="/favicon.svg">
-  <link rel="stylesheet" href="/src/fonts.css">
-  <link rel="stylesheet" href="/src/style.css">
-  <title>LikeC4</title>
-</head>
-
-<body>
-  <div id="likec4-root"></div>
-  <script type="module" src="/src/main"></script>
-</body>
-
+  <body>
+    <div id="likec4-root"></div>
+    <script type="module" src="/src/main"></script>
+  </body>
 </html>

package/__app__/src/aichat/index.mjs

@@ -2,12 +2,11 @@ import "../chunks/rolldown-runtime.mjs";
 import { Suspense, lazy } from "react";
 import { jsx } from "react/jsx-runtime";
 import { isAIAvailable } from "likec4:rpc";
-//#region src/aichat/index.tsx
+// src/aichat/index.tsx
 var AIChat = /* @__PURE__ */ lazy(() => import("../chunks/AIChat.mjs"));
 /**
 * AI Chat component that is conditionally rendered based on AI availability
 * Uses lazy loading to avoid importing AI components in environments where AI is not available
 */
 var LazyAIChat = isAIAvailable ? () => /* @__PURE__ */ jsx(Suspense, { children: /* @__PURE__ */ jsx(AIChat, {}) }) : () => null;
-//#endregion
 export { LazyAIChat };