@likec4/diagram 1.59.3 → 1.59.4

package/dist/context/DefaultMantineProvider.d.ts

@@ -1,2 +0,0 @@
-import { MantineProviderProps } from '@mantine/core';
-export declare function DefaultMantineProvider({ children, theme, ...props }: MantineProviderProps): import("react").JSX.Element;

package/dist/context/DefaultMantineProvider.js

@@ -1,48 +0,0 @@
-import "../_virtual/_rolldown/runtime.js";
-import { jsx } from "react/jsx-runtime";
-import { MantineProvider, Portal, SegmentedControl, Tooltip, createTheme } from "@mantine/core";
-//#region src/context/DefaultMantineProvider.tsx
-var DefaultTheme = createTheme({
-	autoContrast: true,
-	primaryColor: "indigo",
-	cursorType: "pointer",
-	defaultRadius: "sm",
-	fontFamily: "var(--likec4-app-font, var(--likec4-app-font-default))",
-	headings: {
-		fontWeight: "medium",
-		sizes: {
-			h1: { fontWeight: "bold" },
-			h2: { fontWeight: "medium" }
-		}
-	},
-	fontSizes: {
-		xxs: "var(--font-sizes-xxs)",
-		xs: "var(--font-sizes-xs)",
-		sm: "var(--font-sizes-sm)",
-		md: "var(--font-sizes-md)",
-		lg: "var(--font-sizes-lg)",
-		xl: "var(--font-sizes-xl)"
-	},
-	spacing: {
-		xs: "var(--spacing-xs)",
-		sm: "var(--spacing-sm)",
-		md: "var(--spacing-md)",
-		lg: "var(--spacing-lg)",
-		xl: "var(--spacing-xl)"
-	},
-	components: {
-		SegmentedControl: SegmentedControl.extend({ vars: (theme, props) => ({ root: { "--sc-font-size": theme.fontSizes[props.fz ?? props.size] } }) }),
-		Portal: Portal.extend({ defaultProps: { reuseTargetNode: true } }),
-		Tooltip: Tooltip.extend({ defaultProps: { color: "dark" } })
-	}
-});
-function DefaultMantineProvider({ children, theme, ...props }) {
-	return /* @__PURE__ */ jsx(MantineProvider, {
-		defaultColorScheme: "auto",
-		theme: theme ?? DefaultTheme,
-		...props,
-		children
-	});
-}
-//#endregion
-export { DefaultMantineProvider };

package/dist/likec4diagram/ui/sequence-outline/state.js

@@ -1,55 +0,0 @@
-import "../../../_virtual/_rolldown/runtime.js";
-import { useMemo } from "react";
-import "@likec4/core";
-//#region src/likec4diagram/ui/sequence-outline/state.ts
-function buildTree(flow, collapsedFlows) {
-	const tree = [];
-	let currentFlow = tree;
-	let isCollapsed = false;
-	flow.walk({
-		step: ({ step, stepnum, source, target, edge }) => {
-			if (isCollapsed) return;
-			currentFlow.push({
-				label: edge.label ?? `${source.title} → ${target.title}`,
-				value: step,
-				nodeProps: {
-					type: "step",
-					stepnum: stepnum.global,
-					source: source.title,
-					target: target.title,
-					label: edge.label,
-					notes: edge.notes ?? null
-				}
-			});
-		},
-		subflow: ({ subflow }) => {
-			if (collapsedFlows[subflow.id]) {
-				isCollapsed = true;
-				return () => {
-					isCollapsed = false;
-				};
-			}
-			const node = {
-				label: subflow.title ?? subflow._type,
-				value: subflow.id,
-				nodeProps: {
-					type: subflow._type,
-					title: subflow.title
-				},
-				children: []
-			};
-			const parent = currentFlow;
-			parent.push(node);
-			currentFlow = node.children;
-			return () => {
-				currentFlow = parent;
-			};
-		}
-	});
-	return tree;
-}
-function useTreeData(flow, collapsed) {
-	return useMemo(() => buildTree(flow, collapsed), [flow, collapsed]);
-}
-//#endregion
-export { useTreeData };

package/dist/navigationpanel/controls/DetailsControls.d.ts

@@ -1,2 +0,0 @@
-import { PopoverProps } from '@mantine/core';
-export declare const DetailsControls: (props: PopoverProps) => import("react").JSX.Element;

package/dist/navigationpanel/controls/DetailsControls.js

@@ -1,224 +0,0 @@
-import "../../_virtual/_rolldown/runtime.js";
-import { useDiagram } from "../../hooks/safeContext.js";
-import { useOnDiagramEvent } from "../../hooks/useDiagram.js";
-import { useMantinePortalProps } from "../../hooks/useMantinePortalProps.js";
-import { selectNavigationContext, useNavigationActorSelector } from "../hooks.js";
-import { Markdown } from "../../base-primitives/Markdown.js";
-import { ElementTag } from "../../base-primitives/element/ElementTags.js";
-import { Link } from "../../components/Link.js";
-import { css, cx } from "@likec4/styles/css";
-import { IconId, IconLink } from "@tabler/icons-react";
-import { useState } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-import { Badge, Popover, Text, UnstyledButton } from "@mantine/core";
-import { Box as Box$1, HStack, styled } from "@likec4/styles/jsx";
-import { RichText } from "@likec4/core/types";
-import { hstack, vstack } from "@likec4/styles/patterns";
-import * as m from "motion/react-m";
-import { extractViewTitleFromPath } from "@likec4/core/model";
-//#region src/navigationpanel/controls/DetailsControls.tsx
-var selector = selectNavigationContext((context) => {
-	const view = context.view;
-	return {
-		id: view.id,
-		title: context.viewModel?.title ?? (view.title && extractViewTitleFromPath(view.title)) ?? "Untitled View",
-		description: context.viewModel?.description ?? RichText.from(view.description),
-		tags: view.tags ?? [],
-		links: view.links ?? []
-	};
-});
-var DetailsControls = (props) => {
-	const [opened, setOpened] = useState(false);
-	const data = useNavigationActorSelector(selector);
-	const portalProps = useMantinePortalProps();
-	return /* @__PURE__ */ jsxs(Popover, {
-		position: "bottom-end",
-		shadow: "xl",
-		clickOutsideEvents: [
-			"pointerdown",
-			"mousedown",
-			"click"
-		],
-		offset: { mainAxis: 4 },
-		opened,
-		onChange: setOpened,
-		...portalProps,
-		...props,
-		children: [/* @__PURE__ */ jsx(ViewDetailsCardTrigger, {
-			linksCount: data.links.length,
-			onOpen: () => setOpened(true)
-		}), opened && /* @__PURE__ */ jsx(ViewDetailsCardDropdown, {
-			data,
-			onClose: () => setOpened(false)
-		})]
-	});
-};
-var ViewDetailsCardTrigger = ({ linksCount, onOpen }) => /* @__PURE__ */ jsx(Popover.Target, { children: /* @__PURE__ */ jsxs(UnstyledButton, {
-	component: m.button,
-	layout: "position",
-	whileTap: {
-		scale: .95,
-		translateY: 1
-	},
-	onClick: (e) => {
-		e.stopPropagation();
-		onOpen();
-	},
-	className: cx("group", hstack({
-		gap: "2",
-		paddingInline: "2",
-		paddingBlock: "1",
-		rounded: "sm",
-		userSelect: "none",
-		cursor: "pointer",
-		color: {
-			base: "likec4.panel.action",
-			_hover: "likec4.panel.action.hover"
-		},
-		backgroundColor: { _hover: "likec4.panel.action.bg.hover" },
-		display: {
-			base: "none",
-			"@/xs": "flex"
-		}
-	}), ``),
-	children: [/* @__PURE__ */ jsx(IconId, {
-		size: 16,
-		stroke: 1.8
-	}), linksCount > 0 && /* @__PURE__ */ jsxs(HStack, {
-		gap: "[1px]",
-		children: [/* @__PURE__ */ jsx(IconLink, {
-			size: 14,
-			stroke: 2
-		}), /* @__PURE__ */ jsx(Box$1, {
-			css: {
-				fontSize: "11px",
-				fontWeight: "bold",
-				lineHeight: 1,
-				opacity: .8
-			},
-			children: linksCount
-		})]
-	})]
-}) });
-var SectionHeader = styled("div", { base: {
-	fontSize: "xs",
-	color: "text.dimmed",
-	fontWeight: "medium",
-	userSelect: "none",
-	mb: "xxs"
-} });
-var ViewDetailsCardDropdown = ({ data: { id, title, description, tags, links }, onClose }) => {
-	const diagram = useDiagram();
-	useOnDiagramEvent("paneClick", onClose);
-	useOnDiagramEvent("nodeClick", onClose);
-	return /* @__PURE__ */ jsxs(Popover.Dropdown, {
-		className: cx("nowheel nopan nodrag", vstack({
-			margin: "xs",
-			layerStyle: "likec4.dropdown",
-			gap: "md",
-			padding: "md",
-			paddingBottom: "lg",
-			pointerEvents: "all",
-			maxWidth: "calc(100cqw - 52px)",
-			minWidth: "200px",
-			maxHeight: "calc(100cqh - 100px)",
-			width: "max-content",
-			cursor: "default",
-			overflow: "auto",
-			overscrollBehavior: "contain",
-			"@/sm": {
-				minWidth: 400,
-				maxWidth: 550
-			},
-			"@/lg": { maxWidth: 700 }
-		})),
-		children: [
-			/* @__PURE__ */ jsxs("section", { children: [/* @__PURE__ */ jsx(Text, {
-				component: "div",
-				fw: 500,
-				size: "xl",
-				lh: "sm",
-				children: title
-			}), /* @__PURE__ */ jsxs(HStack, {
-				alignItems: "flex-start",
-				mt: "1",
-				children: [/* @__PURE__ */ jsx(ViewBadge, {
-					label: "id",
-					value: id
-				}), /* @__PURE__ */ jsx(HStack, {
-					gap: "xs",
-					flexWrap: "wrap",
-					children: tags.map((tag) => /* @__PURE__ */ jsx(ElementTag, {
-						tag,
-						cursor: "pointer",
-						onClick: (e) => {
-							e.stopPropagation();
-							diagram.openSearch(`#${tag}`);
-						}
-					}, tag))
-				})]
-			})] }),
-			links.length > 0 && /* @__PURE__ */ jsxs("section", {
-				className: hstack({ alignItems: "baseline" }),
-				children: [/* @__PURE__ */ jsx(SectionHeader, { children: "Links" }), /* @__PURE__ */ jsx(HStack, {
-					gap: "xs",
-					flexWrap: "wrap",
-					children: links.map((link, i) => /* @__PURE__ */ jsx(Link, { value: link }, `${i}-${link.url}`))
-				})]
-			}),
-			description.isEmpty && /* @__PURE__ */ jsx(Text, {
-				component: "div",
-				fw: 500,
-				size: "xs",
-				c: "dimmed",
-				style: { userSelect: "none" },
-				children: "No description"
-			}),
-			description.nonEmpty && /* @__PURE__ */ jsxs("section", { children: [/* @__PURE__ */ jsx(SectionHeader, { children: "Description" }), /* @__PURE__ */ jsx(Markdown, {
-				value: description,
-				fontSize: "sm",
-				emptyText: "No description",
-				className: css({ userSelect: "all" })
-			})] })
-		]
-	});
-};
-var ViewBadge = ({ label, value }) => {
-	return /* @__PURE__ */ jsxs(HStack, {
-		gap: "0.5",
-		children: [/* @__PURE__ */ jsx(ViewBadgeLabel, { children: label }), /* @__PURE__ */ jsx(Badge, {
-			size: "sm",
-			radius: "sm",
-			variant: "light",
-			color: "gray",
-			tt: "none",
-			fw: 500,
-			classNames: {
-				root: css({
-					width: "max-content",
-					overflow: "visible",
-					px: "1",
-					color: {
-						_dark: "mantine.gray[4]",
-						_light: "mantine.gray[8]"
-					}
-				}),
-				label: css({ overflow: "visible" }),
-				section: css({
-					opacity: .5,
-					userSelect: "none",
-					marginInlineEnd: "0.5"
-				})
-			},
-			children: value
-		})]
-	});
-};
-var ViewBadgeLabel = styled("div", { base: {
-	color: "text.dimmed",
-	fontWeight: "medium",
-	fontSize: "xxs",
-	userSelect: "none"
-} });
-//#endregion
-export { DetailsControls };