@likec4/diagram 1.60.0 → 1.61.0

package/dist/search/components/ElementsColumn.mjs

@@ -1,10 +1,12 @@
 import { __name } from "../../_virtual/_rolldown/runtime.mjs";
-import IconChevronRight from "../../node_modules/.pnpm/@tabler_icons-react@3.49.0_react@19.3.0/node_modules/@tabler/icons-react/dist/esm/icons/IconChevronRight.mjs";
+import IconChevronRight from "../../node_modules/.pnpm/@tabler_icons-react@3.49.0_react@19.3.1/node_modules/@tabler/icons-react/dist/esm/icons/IconChevronRight.mjs";
 import { IconOrShapeRenderer } from "../../context/IconRenderer.mjs";
 import { useCallbackRef } from "../../hooks/useCallbackRef.mjs";
 import { useLikeC4Model } from "../../hooks/useLikeC4Model.mjs";
-import { useSearchContext } from "../SearchContext.mjs";
+import { createFuzzySearch } from "../fuzzy.mjs";
 import { useNormalizedSearch } from "../hooks.mjs";
+import { METADATA_SEARCH_PREFIX, matchesMetadataSearch } from "../metadata-search.mjs";
+import { useSearchContext } from "../SearchContext.mjs";
 import { buttonsva, focusable } from "./_shared.css.mjs";
 import { elementExpandIcon, elementIcon, elementId, elementTitleAndId, elementViewsCount, treeLabel, treeNode, treeRoot, treeSubtree } from "./ElementsColumn.css.mjs";
 import { centerY, moveFocusToSearchInput, queryAllFocusable, stopAndPrevent } from "./utils.mjs";
@@ -18,7 +20,7 @@ import { ifilter, imap, isAncestor, nameFromFqn, stringHash, toArray } from "@li
 import { Txt } from "@likec4/styles/jsx";
 import * as m from "motion/react-m";
 
-//#region src/search/components/ElementsColumn.tsx
+// src/search/components/ElementsColumn.tsx
 function useElementsColumnData() {
 	const model = useLikeC4Model();
 	const allElements = useMemo(() => pipe(model.elements(), ifilter((i) => !i.imported), imap((element) => ({
@@ -29,6 +31,24 @@ function useElementsColumnData() {
 		children: [],
 		hasChildren: false
 	})), toArray()), [model]);
+	const fuzzy = useMemo(() => createFuzzySearch(allElements, [
+		{
+			name: "name",
+			getFn: ({ element }) => element.name
+		},
+		{
+			name: "title",
+			getFn: ({ element }) => element.title
+		},
+		{
+			name: "id",
+			getFn: ({ element }) => element.id
+		},
+		{
+			name: "summary",
+			getFn: ({ element }) => element.summary.text ?? ""
+		}
+	]), [allElements]);
 	const search = useNormalizedSearch();
 	return useMemo(() => {
 		const searchTerms = search.split(".");
@@ -44,7 +64,8 @@ function useElementsColumnData() {
 			elements = filter(allElements, ({ element }) => {
 				return element.tags.some((tag) => tag.toLocaleLowerCase().includes(searchTag));
 			});
-		} else if (hasAtLeast(searchTerms, 2)) {
+		} else if (search.startsWith("meta:")) elements = filter(allElements, ({ element }) => matchesMetadataSearch(element.metadata, search));
+		else if (hasAtLeast(searchTerms, 2)) {
 			const satisfies = (element) => {
 				const fqnParts = element.id.toLocaleLowerCase().split(".");
 				if (fqnParts.length < searchTerms.length) return false;
@@ -57,9 +78,7 @@ function useElementsColumnData() {
 				return false;
 			};
 			elements = filter(allElements, ({ element }) => satisfies(element));
-		} else elements = filter(allElements, ({ element }) => {
-			return (element.title + " " + element.name + " " + (element.summary.md || "")).toLocaleLowerCase().includes(search);
-		});
+		} else elements = fuzzy(search);
 		const byid = {};
 		const { hash, all, roots } = pipe(elements, reduce((acc, treeItem) => {
 			treeItem.children = [];
@@ -85,7 +104,11 @@ function useElementsColumnData() {
 			roots,
 			searchTerms: hasAtLeast(searchTerms, 1) ? searchTerms : [search]
 		};
-	}, [allElements, search]);
+	}, [
+		allElements,
+		fuzzy,
+		search
+	]);
 }
 const btn = buttonsva();
 const ElementsColumn = memo(() => {
@@ -260,5 +283,4 @@ function useHandleElementSelection() {
 	});
 }
 
-//#endregion
 export { ElementsColumn };

package/dist/search/components/PickView.mjs

@@ -1,15 +1,15 @@
 import { __name } from "../../_virtual/_rolldown/runtime.mjs";
-import IconX from "../../node_modules/.pnpm/@tabler_icons-react@3.49.0_react@19.3.0/node_modules/@tabler/icons-react/dist/esm/icons/IconX.mjs";
+import IconX from "../../node_modules/.pnpm/@tabler_icons-react@3.49.0_react@19.3.1/node_modules/@tabler/icons-react/dist/esm/icons/IconX.mjs";
 import { useLikeC4Model } from "../../hooks/useLikeC4Model.mjs";
 import { useSearchContext } from "../SearchContext.mjs";
-import { ViewButton } from "./ViewsColum.mjs";
 import { pickview, pickviewBackdrop, pickviewGroup } from "./styles.css.mjs";
+import { ViewButton } from "./ViewsColum.mjs";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { ActionIcon, FocusTrap, Group, ScrollAreaAutosize, Stack, Title } from "@mantine/core";
 import { useCallbackRef, useWindowEvent } from "@mantine/hooks";
 import * as m from "motion/react-m";
 
-//#region src/search/components/PickView.tsx
+// src/search/components/PickView.tsx
 function PickView({ elementFqn }) {
 	const ctx = useSearchContext();
 	const currentViewId = ctx.currentViewId ?? "";
@@ -116,5 +116,4 @@ function PickView({ elementFqn }) {
 	}, "pickview") })] });
 }
 
-//#endregion
 export { PickView };

package/dist/search/components/SearchByTags.mjs

@@ -1,7 +1,7 @@
 import { __name } from "../../_virtual/_rolldown/runtime.mjs";
-import IconX from "../../node_modules/.pnpm/@tabler_icons-react@3.49.0_react@19.3.0/node_modules/@tabler/icons-react/dist/esm/icons/IconX.mjs";
-import { useLikeC4Model } from "../../hooks/useLikeC4Model.mjs";
+import IconX from "../../node_modules/.pnpm/@tabler_icons-react@3.49.0_react@19.3.1/node_modules/@tabler/icons-react/dist/esm/icons/IconX.mjs";
 import { ElementTag } from "../../base-primitives/element/ElementTags.mjs";
+import { useLikeC4Model } from "../../hooks/useLikeC4Model.mjs";
 import { useNormalizedSearch, useUpdateSearch } from "../hooks.mjs";
 import { focusToFirstFoundElement, moveFocusToSearchInput } from "./utils.mjs";
 import { css } from "@likec4/styles/css";
@@ -10,7 +10,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { Button } from "@mantine/core";
 import { HStack } from "@likec4/styles/jsx";
 
-//#region src/search/components/SearchByTags.tsx
+// src/search/components/SearchByTags.tsx
 function SearchByTags() {
 	const ref = useRef(null);
 	let tags = useLikeC4Model().tagsSortedByUsage;
@@ -77,5 +77,4 @@ function SearchByTags() {
 	});
 }
 
-//#endregion
 export { SearchByTags };

package/dist/search/components/SearchInput.mjs

@@ -1,16 +1,16 @@
 import { __name } from "../../_virtual/_rolldown/runtime.mjs";
-import IconSearch from "../../node_modules/.pnpm/@tabler_icons-react@3.49.0_react@19.3.0/node_modules/@tabler/icons-react/dist/esm/icons/IconSearch.mjs";
+import IconSearch from "../../node_modules/.pnpm/@tabler_icons-react@3.49.0_react@19.3.1/node_modules/@tabler/icons-react/dist/esm/icons/IconSearch.mjs";
 import { useLikeC4Model } from "../../hooks/useLikeC4Model.mjs";
 import { useSearchContext } from "../SearchContext.mjs";
-import { focusToFirstFoundElement, moveFocusToSearchInput, stopAndPrevent } from "./utils.mjs";
 import { input } from "./styles.css.mjs";
+import { focusToFirstFoundElement, moveFocusToSearchInput, stopAndPrevent } from "./utils.mjs";
 import { memo, useRef } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { keys } from "remeda";
 import { Combobox, ComboboxDropdown, ComboboxEmpty, ComboboxOption, ComboboxOptions, ComboboxTarget, Input, ScrollAreaAutosize, Text, rem, useCombobox } from "@mantine/core";
 import { useFocusWithin, useMergedRef, useWindowEvent } from "@mantine/hooks";
 
-//#region src/search/components/SearchInput.tsx
+// src/search/components/SearchInput.tsx
 function startingWithKind(search) {
 	return search.match(/^(k|ki|kin|kind|kind:)$/) != null;
 }
@@ -189,5 +189,4 @@ const LikeC4SearchInput = memo(() => {
 	});
 });
 
-//#endregion
 export { LikeC4SearchInput };

package/dist/search/components/ViewsColum.mjs

@@ -1,23 +1,23 @@
 import { __name } from "../../_virtual/_rolldown/runtime.mjs";
-import { useLikeC4Model } from "../../hooks/useLikeC4Model.mjs";
 import { EmptyBox } from "../../components/EmptyBox.mjs";
 import { ViewIcon } from "../../components/ViewIcon.mjs";
-import { useSearchContext } from "../SearchContext.mjs";
+import { useLikeC4Model } from "../../hooks/useLikeC4Model.mjs";
 import { useNormalizedSearch } from "../hooks.mjs";
+import { METADATA_SEARCH_PREFIX } from "../metadata-search.mjs";
+import { useSearchContext } from "../SearchContext.mjs";
 import { buttonsva, focusable } from "./_shared.css.mjs";
-import { centerY, moveFocusToSearchInput, queryAllFocusable } from "./utils.mjs";
+import { centerY, createViewSearch, moveFocusToSearchInput, queryAllFocusable, viewTitleWithFolder } from "./utils.mjs";
 import { viewButton } from "./ViewsColumn.css.mjs";
 import { cx } from "@likec4/styles/css";
 import { memo, useMemo, useRef } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { first } from "remeda";
-import { Badge, Group, Highlight, Stack, ThemeIcon, UnstyledButton, VisuallyHidden, createScopedKeydownHandler } from "@mantine/core";
+import { Badge, Group, Highlight, ThemeIcon, UnstyledButton, VisuallyHidden, createScopedKeydownHandler } from "@mantine/core";
 import { m } from "motion/react";
-import { preferSummary } from "@likec4/core/types";
 import { Box as Box$1 } from "@likec4/styles/jsx";
 import { vstack } from "@likec4/styles/patterns";
 
-//#region src/search/components/ViewsColum.tsx
+// src/search/components/ViewsColum.tsx
 const NothingFound = () => /* @__PURE__ */ jsx(EmptyBox, {
 	fullsize: true,
 	as: m.div,
@@ -27,18 +27,16 @@ const useFoundViews = () => {
 	const { currentViewId } = useSearchContext();
 	const likec4model = useLikeC4Model();
 	const search = useNormalizedSearch();
+	const allViews = useMemo(() => [...likec4model.views()], [likec4model]);
+	const fuzzy = useMemo(() => createViewSearch(allViews), [allViews]);
 	return useMemo(() => {
-		let views = [...likec4model.views()];
+		let views = allViews;
 		if (search) {
-			if (search.startsWith("kind:")) views = [];
-			else {
-				const searchTag = search.startsWith("#") ? search.slice(1) : null;
-				views = views.filter((view) => {
-					if (searchTag) return view.tags.some((tag) => tag.toLocaleLowerCase().includes(searchTag));
-					const desc = preferSummary(view.$view)?.md || " ";
-					return `${view.id} ${view.title} ${desc}`.toLocaleLowerCase().includes(search);
-				});
-			}
+			if (search.startsWith("kind:") || search.startsWith("meta:")) views = [];
+			else if (search.startsWith("#")) {
+				const searchTag = search.slice(1);
+				views = views.filter((view) => view.tags.some((tag) => tag.toLocaleLowerCase().includes(searchTag)));
+			} else views = fuzzy(search);
 		}
 		return [
 			views,
@@ -46,7 +44,8 @@ const useFoundViews = () => {
 			currentViewId
 		];
 	}, [
-		likec4model,
+		allViews,
+		fuzzy,
 		search,
 		currentViewId
 	]);
@@ -96,6 +95,7 @@ function ViewButton({ className, view, loop = false, search, focusOnElement, cur
 	const ctx = useSearchContext();
 	const nextViewId = view.id;
 	const isCurrentView = nextViewId === currentViewId;
+	const label = viewTitleWithFolder(view);
 	const navigate = () => {
 		ctx.navigateTo(nextViewId, focusOnElement);
 	};
@@ -138,8 +138,9 @@ function ViewButton({ className, view, loop = false, search, focusOnElement, cur
 					component: "div",
 					highlight: search,
 					className: btn.title,
-					lineClamp: 1,
-					children: view.titleOrUntitled
+					lineClamp: 2,
+					title: label,
+					children: label
 				}), isCurrentView && /* @__PURE__ */ jsx(Badge, {
 					size: "xs",
 					fz: 9,
@@ -157,5 +158,4 @@ function ViewButton({ className, view, loop = false, search, focusOnElement, cur
 	});
 }
 
-//#endregion
 export { NothingFound, ViewButton, ViewsColumn };

package/dist/search/components/ViewsColumn.css.mjs

@@ -1,7 +1,7 @@
 import { focusable } from "./_shared.css.mjs";
 import { css, cx } from "@likec4/styles/css";
 
-//#region src/search/components/ViewsColumn.css.ts
+// src/search/components/ViewsColumn.css.ts
 const _viewBtn = "likec4-view-btn";
 const viewButton = cx(css({
 	flexWrap: "nowrap",
@@ -15,5 +15,4 @@ const viewButtonDescription = css({
 	[`:where(.likec4-view-btn[data-disabled]) &`]: { opacity: "0.85" }
 });
 
-//#endregion
 export { viewButton };

package/dist/search/components/_shared.css.mjs

@@ -1,7 +1,7 @@
 import { css, sva } from "@likec4/styles/css";
 import { emptyBox } from "@likec4/styles/recipes";
 
-//#region src/search/components/_shared.css.ts
+// src/search/components/_shared.css.ts
 const buttonFocused = css.raw({
 	outline: "none",
 	background: "likec4.accent.8",
@@ -119,5 +119,4 @@ const buttonsva = sva({
 	}
 });
 
-//#endregion
 export { buttonsva, focusable };

package/dist/search/components/styles.css.mjs

@@ -1,7 +1,7 @@
 import { focusable } from "./_shared.css.mjs";
 import { css } from "@likec4/styles/css";
 
-//#region src/search/components/styles.css.ts
+// src/search/components/styles.css.ts
 const input = css({
 	border: "transparent",
 	background: {
@@ -52,5 +52,4 @@ const scrollArea = css({
 	}
 });
 
-//#endregion
 export { input, pickview, pickviewBackdrop, pickviewGroup };

package/dist/search/components/utils.mjs

@@ -1,8 +1,10 @@
 import { __name } from "../../_virtual/_rolldown/runtime.mjs";
+import { createFuzzySearch } from "../fuzzy.mjs";
 import { focusable } from "./_shared.css.mjs";
 import { isFunction } from "remeda";
+import { preferSummary } from "@likec4/core/types";
 
-//#region src/search/components/utils.ts
+// src/search/components/utils.ts
 function stopAndPrevent(e) {
 	e.stopPropagation();
 	e.preventDefault();
@@ -52,6 +54,33 @@ function queryAllFocusable(from, where, selector = `.${focusable}`) {
 	}
 	return [...root.querySelectorAll(`[data-likec4-search-${where}] ${selector}`)];
 }
+/**
+* Title of the view prefixed with the folders it belongs to, e.g. `Folder 1 / Folder 2 / View`.
+* Views at the root are returned as is.
+*/
+function viewTitleWithFolder(view) {
+	if (view.folder.isRoot) return view.titleOrUntitled;
+	return [...view.folder.breadcrumbs.map((folder) => folder.title), view.titleOrUntitled].join(" / ");
+}
+/**
+* Fuzzy search over the views (see `createFuzzySearch`): matches the view id, its title with the folder path,
+* and its summary or description.
+*/
+function createViewSearch(views) {
+	return createFuzzySearch(views, [
+		{
+			name: "id",
+			getFn: (view) => view.id
+		},
+		{
+			name: "title",
+			getFn: (view) => viewTitleWithFolder(view)
+		},
+		{
+			name: "description",
+			getFn: (view) => preferSummary(view.$view)?.md ?? ""
+		}
+	]);
+}
 
-//#endregion
-export { centerY, focusToFirstFoundElement, moveFocusToSearchInput, queryAllFocusable, stopAndPrevent };
+export { centerY, createViewSearch, focusToFirstFoundElement, moveFocusToSearchInput, queryAllFocusable, stopAndPrevent, viewTitleWithFolder };

package/dist/search/fuzzy.mjs

@@ -0,0 +1,27 @@
+import { __name } from "../_virtual/_rolldown/runtime.mjs";
+import Fuse from "fuse.js";
+
+// src/search/fuzzy.ts
+/**
+* Fuzzy search over `items`, with the same settings as the `search-element` tool of the MCP server:
+* a word still matches with a typo ("chekout" finds "checkout") and it may match any of the `keys`.
+*
+* The index is built once. The returned function takes a search string and gives back the items that
+* match every word of it, in their original order (the callers build a tree from the result).
+*/
+function createFuzzySearch(items, keys) {
+	const fuse = new Fuse(items, {
+		useExtendedSearch: true,
+		ignoreLocation: true,
+		threshold: .2,
+		keys
+	});
+	return (search) => {
+		const words = search.match(/[\p{L}\p{M}\p{N}_]+/gu);
+		if (!words) return [];
+		const found = new Set(fuse.search({ $and: words.map((word) => ({ $or: keys.map((key) => ({ [key.name]: word })) })) }).map((result) => result.item));
+		return items.filter((item) => found.has(item));
+	};
+}
+
+export { createFuzzySearch };

package/dist/search/hooks.mjs

@@ -2,7 +2,7 @@ import { __name } from "../_virtual/_rolldown/runtime.mjs";
 import { useSearchContext } from "./SearchContext.mjs";
 import { useCallback, useDeferredValue } from "react";
 
-//#region src/search/hooks.ts
+// src/search/hooks.ts
 function useNormalizedSearch() {
 	const ctx = useSearchContext();
 	return useDeferredValue(ctx.normalizedSearch);
@@ -14,5 +14,4 @@ function useUpdateSearch() {
 	}, [setSearchValue]);
 }
 
-//#endregion
 export { useNormalizedSearch, useUpdateSearch };

package/dist/search/metadata-search.mjs

@@ -0,0 +1,32 @@
+import { __name } from "../_virtual/_rolldown/runtime.mjs";
+
+// src/search/metadata-search.ts
+const METADATA_SEARCH_PREFIX = "meta:";
+/**
+* Builds a search query that finds elements with the given metadata key,
+* and optionally the given value: `meta:key` or `meta:key=value`.
+*/
+function metadataSearchQuery(key, value) {
+	return value === void 0 ? `${METADATA_SEARCH_PREFIX}${key}` : `${METADATA_SEARCH_PREFIX}${key}=${value}`;
+}
+function metadataValues(value) {
+	if (Array.isArray(value)) return value.map(String);
+	if (typeof value === "string") return value.includes("\n") ? value.split("\n").map((s) => s.trim()).filter(Boolean) : [value];
+	return [];
+}
+/**
+* Checks if metadata matches a normalized (lowercased) `meta:` search.
+* - `meta:key` matches elements having a key that includes `key`
+* - `meta:key=value` matches elements having exactly `key`, with any value that includes `value`
+*/
+function matchesMetadataSearch(metadata, normalizedSearch) {
+	const query = normalizedSearch.slice(5);
+	if (query === "") return Object.keys(metadata).length > 0;
+	const eq = query.indexOf("=");
+	if (eq < 0) return Object.keys(metadata).some((key) => key.toLowerCase().includes(query));
+	const searchKey = query.slice(0, eq).trim();
+	const searchValue = query.slice(eq + 1).trim();
+	return Object.entries(metadata).some(([key, value]) => key.toLowerCase() === searchKey && (searchValue === "" || metadataValues(value).some((v) => v.toLowerCase().includes(searchValue))));
+}
+
+export { METADATA_SEARCH_PREFIX, matchesMetadataSearch, metadataSearchQuery };

package/dist/search/searchActor.d.mts

@@ -1,7 +1,6 @@
 import { __name } from "../_virtual/_rolldown/runtime.mjs";
 import { Fqn, ViewId } from "@likec4/core/types";
 import { ActorRef, SnapshotFrom, StateMachine } from "xstate";
-//#region src/search/searchActor.d.ts
 export type SearchActorEvent = {
   type: 'open';
   search?: string | undefined;
@@ -33,5 +32,4 @@ export interface SearchContext {
 }
 export interface SearchActorLogic extends StateMachine<SearchContext, SearchActorEvent, {}, any, any, any, any, 'inactive' | 'opened' | 'pickView' | 'waitAnimationEnd', never, never, any, any, any, any> {}
 export type SearchActorSnapshot = SnapshotFrom<SearchActorLogic>;
-export interface SearchActorRef extends ActorRef<SearchActorSnapshot, SearchActorEvent> {}
-//#endregion
+export interface SearchActorRef extends ActorRef<SearchActorSnapshot, SearchActorEvent> {}

package/dist/search/searchActor.mjs

@@ -2,7 +2,7 @@ import { __name } from "../_virtual/_rolldown/runtime.mjs";
 import { typedSystem } from "../likec4diagram/state/utils.mjs";
 import { assertEvent, assign, enqueueActions, setup } from "xstate";
 
-//#region src/search/searchActor.ts
+// src/search/searchActor.ts
 const _searchActorLogic = setup({
 	types: {
 		context: {},
@@ -100,5 +100,4 @@ const _searchActorLogic = setup({
 });
 const searchActorLogic = _searchActorLogic;
 
-//#endregion
 export { searchActorLogic };

package/dist/shadowroot/ShadowRoot.mjs

@@ -1,8 +1,8 @@
 import { __name } from "../_virtual/_rolldown/runtime.mjs";
+import { FramerMotionConfig } from "../context/FramerMotionConfig.mjs";
 import { useCallbackRef as useCallbackRef$1 } from "../hooks/useCallbackRef.mjs";
+import { useId as useId$2 } from "../hooks/useId.mjs";
 import { LikeC4MantineProvider } from "../LikeC4MantineProvider.mjs";
-import { FramerMotionConfig } from "../context/FramerMotionConfig.mjs";
-import { useId as useId$1 } from "../hooks/useId.mjs";
 import styles_font_default from "../styles-font2.mjs";
 import styles_default from "../styles2.mjs";
 import { memo, useEffectEvent, useInsertionEffect, useLayoutEffect, useRef, useState } from "react";
@@ -11,7 +11,7 @@ import { first, isDefined, isFunction, isString, once } from "remeda";
 import { useColorScheme, useMutationObserverTarget } from "@mantine/hooks";
 import { createPortal } from "react-dom";
 
-//#region src/shadowroot/ShadowRoot.tsx
+// src/shadowroot/ShadowRoot.tsx
 function useShadowRootStyle(instanceId, keepAspectRatio = false) {
 	if (keepAspectRatio === false) return `
 :where([data-likec4-instance="${instanceId}"]) {
@@ -66,7 +66,7 @@ function useInjectLikeC4Font(injectFontCss, styleNonce) {
 }
 function ShadowRoot({ children, theme, injectFontCss = true, styleNonce, colorScheme: explicitColorScheme, keepAspectRatio = false, ...props }) {
 	const colorScheme = useColorScheme$1(explicitColorScheme);
-	const id = useId$1();
+	const id = useId$2();
 	const cssstyle = useShadowRootStyle(id, keepAspectRatio);
 	const mantineRootRef = useRef(null);
 	useInjectLikeC4Font(injectFontCss, styleNonce);
@@ -168,8 +168,10 @@ function scopeStylesToShadowRoot(styles) {
 */
 const shadowScopedCSS = once(() => {
 	const scoped = scopeStylesToShadowRoot(styles_default);
-	console.log("Shadow root scoped CSS:");
-	console.log(scoped);
+	if (import.meta.env.DEV) {
+		console.log("Shadow root scoped CSS:");
+		console.log(scoped);
+	}
 	return scoped;
 });
 /**
@@ -201,5 +203,4 @@ function useColorScheme$1(explicit) {
 }
 __name(useColorScheme$1, "useColorScheme");
 
-//#endregion
 export { ShadowRoot };

package/dist/styles-font2.mjs

@@ -1,5 +1,4 @@
-//#region src/styles-font.css?inline
+// src/styles-font.css?inline
 var styles_font_default = "@font-face{font-family:IBM Plex Sans Variable;font-style:normal;font-display:swap;font-weight:100 700;src:url(https://cdn.jsdelivr.net/fontsource/fonts/ibm-plex-sans:vf@latest/latin-wght-normal.woff2)format(\"woff2-variations\");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:IBM Plex Sans Variable;font-style:normal;font-display:swap;font-weight:100 700;src:url(https://cdn.jsdelivr.net/fontsource/fonts/ibm-plex-sans:vf@latest/cyrillic-wght-normal.woff2)format(\"woff2-variations\");unicode-range:U+301,U+400-45F,U+490-491,U+4B0-4B1,U+2116}@font-face{font-family:IBM Plex Sans Variable;font-style:normal;font-display:swap;font-weight:100 700;src:url(https://cdn.jsdelivr.net/fontsource/fonts/ibm-plex-sans:vf@latest/cyrillic-ext-wght-normal.woff2)format(\"woff2-variations\");unicode-range:U+460-52F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:IBM Plex Sans Variable;font-style:normal;font-display:swap;font-weight:100 700;src:url(https://cdn.jsdelivr.net/fontsource/fonts/ibm-plex-sans:vf@latest/greek-wght-normal.woff2)format(\"woff2-variations\");unicode-range:U+370-377,U+37A-37F,U+384-38A,U+38C,U+38E-3A1,U+3A3-3FF}@font-face{font-family:IBM Plex Sans Variable;font-style:normal;font-display:swap;font-weight:100 700;src:url(https://cdn.jsdelivr.net/fontsource/fonts/ibm-plex-sans:vf@latest/latin-ext-wght-normal.woff2)format(\"woff2-variations\");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:IBM Plex Sans Variable;font-style:normal;font-display:swap;font-weight:100 700;src:url(https://cdn.jsdelivr.net/fontsource/fonts/ibm-plex-sans:vf@latest/vietnamese-wght-normal.woff2)format(\"woff2-variations\");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}\n";
 
-//#endregion
 export { styles_font_default as default };