@likec4/diagram 1.59.3 → 1.60.0

package/dist/navigationpanel/comparepanel/DriftsSummary.js

@@ -1,218 +0,0 @@
-import "../../_virtual/_rolldown/runtime.js";
-import { useCallbackRef as useCallbackRef$1 } from "../../hooks/useCallbackRef.js";
-import { selectDiagramContext, useDiagram, useDiagramSelector } from "../../hooks/safeContext.js";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { deepEqual } from "fast-equals";
-import { filter, hasAtLeast, map, pipe } from "remeda";
-import { AnimatePresence, m, stagger } from "motion/react";
-import { useDebouncedCallback } from "@mantine/hooks";
-import { Txt, styled } from "@likec4/styles/jsx";
-import { vstack } from "@likec4/styles/patterns";
-//#region src/navigationpanel/comparepanel/DriftsSummary.tsx
-var hasDrifts = (item) => {
-	return !!item.drifts && hasAtLeast(item.drifts, 1);
-};
-var selectDrifts = selectDiagramContext((ctx) => ({
-	view: ctx.view.drifts ?? [],
-	nodes: pipe(ctx.view.nodes, map((node) => ({
-		id: node.id,
-		name: node.title,
-		drifts: node.drifts
-	})), filter(hasDrifts)),
-	edges: pipe(ctx.view.edges, map((edge) => ({
-		edgeId: edge.id,
-		drifts: edge.drifts
-	})), filter(hasDrifts))
-}), deepEqual);
-var variants = {
-	initial: {
-		opacity: 0,
-		translateY: -8
-	},
-	animate: {
-		opacity: 1,
-		translateY: 0,
-		transition: { delayChildren: stagger(.1) }
-	},
-	exit: {
-		opacity: 0,
-		translateY: -8,
-		transition: { delayChildren: stagger(.2, {
-			startDelay: .5,
-			from: "last"
-		}) }
-	}
-};
-function DriftsSummary() {
-	const selected = useDiagramSelector(selectDrifts);
-	const diagram = useDiagram();
-	const onMouseLeaveDebounced = useDebouncedCallback((e) => {
-		e.stopPropagation();
-		diagram.unhighlightAll();
-	}, 150);
-	const handlers = {
-		onMouseEnter: useCallbackRef$1((e) => {
-			const target = e.currentTarget.getAttribute("data-drift-type");
-			const id = e.currentTarget.getAttribute("data-drift-id");
-			if (target === "node" && id) {
-				e.stopPropagation();
-				onMouseLeaveDebounced.cancel();
-				diagram.highlightNode(id);
-				return;
-			}
-			if (target === "edge" && id) {
-				e.stopPropagation();
-				onMouseLeaveDebounced.cancel();
-				diagram.highlightEdge(id);
-				return;
-			}
-		}),
-		onMouseLeave: onMouseLeaveDebounced,
-		onClick: useCallbackRef$1((e) => {
-			const target = e.currentTarget.getAttribute("data-drift-type");
-			const id = e.currentTarget.getAttribute("data-drift-id");
-			if (target === "node" && id) {
-				e.stopPropagation();
-				diagram.centerViewportOnNode(id);
-				return;
-			}
-			if (target === "edge" && id) {
-				e.stopPropagation();
-				diagram.centerViewportOnEdge(id);
-				return;
-			}
-		})
-	};
-	const { view, nodes, edges } = selected;
-	if (view.length === 0 && nodes.length === 0 && edges.length === 0) return null;
-	return /* @__PURE__ */ jsx(AnimatePresence, { children: /* @__PURE__ */ jsxs(m.div, {
-		layout: "size",
-		variants,
-		initial: "initial",
-		animate: "animate",
-		exit: "exit",
-		layoutDependency: selected,
-		className: vstack({
-			mx: "[calc({spacing.2} * -1)]",
-			px: "2",
-			flex: "1",
-			height: "100%",
-			overflow: "scroll",
-			gap: "4"
-		}),
-		children: [
-			hasAtLeast(view, 1) && /* @__PURE__ */ jsx(ViewDrifts, { drifts: view }),
-			nodes.length > 0 && /* @__PURE__ */ jsxs(m.div, {
-				layout: true,
-				children: [/* @__PURE__ */ jsx(SectionHeader, { children: "Elements:" }), /* @__PURE__ */ jsx("div", {
-					className: vstack({
-						mt: "2",
-						gap: "2"
-					}),
-					children: map(nodes, (node) => /* @__PURE__ */ jsx(NodeDrifts, {
-						...node,
-						...handlers
-					}, node.id))
-				})]
-			}, `nodes-drifts`),
-			edges.length > 0 && /* @__PURE__ */ jsxs(m.div, {
-				layout: true,
-				children: [/* @__PURE__ */ jsx(SectionHeader, { children: "Relationships:" }), /* @__PURE__ */ jsx("div", {
-					className: vstack({
-						mt: "2",
-						gap: "2"
-					}),
-					children: map(edges, (edge) => /* @__PURE__ */ jsx(EdgeDrifts, {
-						...edge,
-						...handlers
-					}, edge.edgeId))
-				})]
-			}, `edges-drifts`)
-		]
-	}, `drifts-summary`) });
-}
-function ViewDrifts({ drifts }) {
-	return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs(m.div, {
-		layout: "position",
-		className: vstack({ gap: "2" }),
-		children: [/* @__PURE__ */ jsx(SectionHeader, { children: "View drifts (summary):" }), /* @__PURE__ */ jsx(DriftsGroup, { children: map(drifts, (drift) => /* @__PURE__ */ jsx(DriftLabel, { children: drift }, drift)) }, `view-drifts`)]
-	}, `view-drifts-header`) });
-}
-function NodeDrifts({ id, name, drifts, ...handlers }) {
-	const key = `node-drifts-${id}`;
-	return /* @__PURE__ */ jsxs(DriftsGroup, {
-		"data-drift-type": "node",
-		"data-drift-id": id,
-		...handlers,
-		children: [/* @__PURE__ */ jsx(Txt, {
-			truncate: true,
-			css: { maxWidth: {
-				base: 160,
-				"@/sm": 180,
-				"@/md": 250
-			} },
-			color: "likec4.compare.manual.outline",
-			fontSize: "xs",
-			lineHeight: "sm",
-			fontWeight: "medium",
-			children: name
-		}), map(drifts, (drift, i) => /* @__PURE__ */ jsx(DriftLabel, { children: drift }, key + drift + i))]
-	}, key);
-}
-function EdgeDrifts({ edgeId, drifts, ...handlers }) {
-	const key = `edge-drifts-${edgeId}`;
-	return /* @__PURE__ */ jsx(DriftsGroup, {
-		"data-drift-type": "edge",
-		"data-drift-id": edgeId,
-		...handlers,
-		children: map(drifts, (drift, i) => /* @__PURE__ */ jsx(DriftLabel, { children: drift }, key + drift + i))
-	}, key);
-}
-var DriftsGroup = styled(m.div, { base: vstack.raw({
-	gap: "1",
-	px: "3",
-	py: "2",
-	cursor: "default",
-	rounded: "sm",
-	backgroundColor: "likec4.compare.manual/10",
-	border: "1px solid {colors.likec4.compare.manual.outline/20}",
-	_hover: {
-		backgroundColor: "likec4.compare.manual/20",
-		borderColor: "likec4.compare.manual.outline/25"
-	}
-}) }, { defaultProps: {
-	className: "group",
-	variants,
-	layout: true,
-	initial: "initial",
-	animate: "animate",
-	exit: "exit"
-} });
-var SectionHeader = styled(m.div, { base: {
-	userSelect: "none",
-	fontWeight: "medium",
-	textStyle: "dimmed.xs",
-	pl: "2"
-} }, { defaultProps: {
-	variants,
-	layout: "position",
-	initial: "initial",
-	animate: "animate",
-	exit: "exit"
-} });
-var DriftLabel = styled(m.div, { base: {
-	userSelect: "none",
-	textStyle: "xs",
-	color: {
-		base: "text",
-		_groupHover: "text.bright"
-	}
-} }, { defaultProps: {
-	variants,
-	layout: "position",
-	initial: "initial",
-	animate: "animate",
-	exit: "exit"
-} });
-//#endregion
-export { DriftsSummary };

package/dist/navigationpanel/comparepanel/LayoutTypeSwitcher.d.ts

@@ -1,5 +0,0 @@
-import { LayoutType } from '@likec4/core';
-export declare function LayoutTypeSwitcher({ value, onChange, }: {
-    value: LayoutType;
-    onChange: (layout: LayoutType) => void;
-}): import("react").JSX.Element;

package/dist/navigationpanel/comparepanel/LayoutTypeSwitcher.js

@@ -1,35 +0,0 @@
-import "../../_virtual/_rolldown/runtime.js";
-import { css } from "@likec4/styles/css";
-import { jsx } from "react/jsx-runtime";
-import { invariant } from "@likec4/core";
-import { SegmentedControl } from "@mantine/core";
-import * as m from "motion/react-m";
-//#region src/navigationpanel/comparepanel/LayoutTypeSwitcher.tsx
-var data = [{
-	value: "manual",
-	label: "Saved manual"
-}, {
-	value: "auto",
-	label: "Latest auto"
-}];
-function LayoutTypeSwitcher({ value, onChange }) {
-	return /* @__PURE__ */ jsx(m.div, {
-		layout: "position",
-		children: /* @__PURE__ */ jsx(SegmentedControl, {
-			size: "xs",
-			color: value === "manual" ? "orange" : "green",
-			value,
-			onChange: (layout) => {
-				invariant(layout === "manual" || layout === "auto", "Invalid layout type");
-				onChange(layout);
-			},
-			classNames: { label: css({
-				fontSize: "xxs",
-				fontWeight: "medium"
-			}) },
-			data
-		})
-	});
-}
-//#endregion
-export { LayoutTypeSwitcher };

package/dist/navigationpanel/comparepanel/index.d.ts

@@ -1 +0,0 @@
-export { ComparePanel } from './ComparePanel';

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 };

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

@@ -1,2 +0,0 @@
-import { MemoExoticComponent } from 'react';
-export declare const LayoutWarning: MemoExoticComponent<() => import("react").JSX.Element>;

package/dist/navigationpanel/controls/LayoutWarning.js

@@ -1,92 +0,0 @@
-import "../../_virtual/_rolldown/runtime.js";
-import { useMantinePortalProps } from "../../hooks/useMantinePortalProps.js";
-import { useDiagramCompareLayout } from "../../hooks/useDiagramCompareLayout.js";
-import { cx } from "@likec4/styles/css";
-import { IconAlertTriangle } from "@tabler/icons-react";
-import { Fragment, memo } from "react";
-import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
-import { Button, HoverCard, HoverCardDropdown, HoverCardTarget, Notification, Text, UnstyledButton } from "@mantine/core";
-import { AnimatePresence } from "motion/react";
-import { hstack } from "@likec4/styles/patterns";
-import * as m$1 from "motion/react-m";
-import { navigationPanelActionIcon } from "@likec4/styles/recipes";
-//#region src/navigationpanel/controls/LayoutWarning.tsx
-var LayoutWarning = memo(() => {
-	const [ctx, { toggleCompare }] = useDiagramCompareLayout();
-	const portalProps = useMantinePortalProps();
-	const { drifts, isActive, isEnabled } = ctx;
-	return /* @__PURE__ */ jsx(AnimatePresence, {
-		propagate: true,
-		children: isEnabled && !isActive && /* @__PURE__ */ jsxs(HoverCard, {
-			position: "bottom-start",
-			openDelay: 600,
-			closeDelay: 200,
-			floatingStrategy: "absolute",
-			offset: {
-				mainAxis: 4,
-				crossAxis: -22
-			},
-			...portalProps,
-			children: [/* @__PURE__ */ jsx(HoverCardTarget, { children: /* @__PURE__ */ jsx(UnstyledButton, {
-				component: m$1.button,
-				layout: "position",
-				onClick: (e) => {
-					e.stopPropagation();
-					toggleCompare();
-				},
-				whileTap: {
-					scale: .95,
-					translateY: 1
-				},
-				className: cx("group", navigationPanelActionIcon({
-					variant: "filled",
-					type: "warning"
-				}), hstack({
-					gap: "xxs",
-					padding: "1.5",
-					rounded: "sm",
-					userSelect: "none",
-					cursor: "pointer",
-					fontSize: "xs",
-					fontWeight: "bold"
-				})),
-				children: isActive ? /* @__PURE__ */ jsx(Fragment$1, { children: "Stop Compare" }) : /* @__PURE__ */ jsx(IconAlertTriangle, { size: 18 })
-			}) }), /* @__PURE__ */ jsx(HoverCardDropdown, {
-				p: "0",
-				children: /* @__PURE__ */ jsxs(Notification, {
-					color: "orange",
-					withBorder: false,
-					withCloseButton: false,
-					title: "View is out of sync",
-					children: [
-						/* @__PURE__ */ jsx(Text, {
-							mt: 2,
-							size: "sm",
-							lh: "xs",
-							children: "Model has changed since this view was last updated."
-						}),
-						/* @__PURE__ */ jsxs(Text, {
-							mt: 4,
-							size: "sm",
-							lh: "xs",
-							children: ["Detected changes:", drifts.map((drift) => /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("br", {}), /* @__PURE__ */ jsxs("span", { children: ["- ", drift] })] }, drift))]
-						}),
-						/* @__PURE__ */ jsx(Button, {
-							mt: "xs",
-							size: "compact-sm",
-							variant: "default",
-							onClick: (e) => {
-								e.stopPropagation();
-								toggleCompare();
-							},
-							children: "Compare with current state"
-						})
-					]
-				})
-			})]
-		})
-	});
-});
-LayoutWarning.displayName = "ManualLayoutWarning";
-//#endregion
-export { LayoutWarning };

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

@@ -1 +0,0 @@
-export declare const LogoButton: () => import("react").JSX.Element;

package/dist/navigationpanel/controls/LogoButton.js

@@ -1,48 +0,0 @@
-import "../../_virtual/_rolldown/runtime.js";
-import { useDiagramEventHandlers } from "../../context/DiagramEventHandlers.js";
-import { useNavigationActor } from "../hooks.js";
-import { Logo, LogoIcon } from "../../components/Logo.js";
-import { css, cx } from "@likec4/styles/css";
-import { jsx, jsxs } from "react/jsx-runtime";
-import { UnstyledButton } from "@mantine/core";
-import { hstack } from "@likec4/styles/patterns";
-import * as m from "motion/react-m";
-//#region src/navigationpanel/controls/LogoButton.tsx
-var LogoButton = () => {
-	const actor = useNavigationActor();
-	const { onLogoClick } = useDiagramEventHandlers();
-	return /* @__PURE__ */ jsx(m.div, {
-		layout: "position",
-		children: /* @__PURE__ */ jsxs(UnstyledButton, {
-			onMouseEnter: () => {
-				actor.send({ type: "breadcrumbs.mouseEnter.root" });
-			},
-			onMouseLeave: () => {
-				actor.send({ type: "breadcrumbs.mouseLeave.root" });
-			},
-			onClick: (e) => {
-				e.stopPropagation();
-				if (onLogoClick && actor.isOpened()) setTimeout(() => {
-					onLogoClick();
-				}, 100);
-				actor.send({ type: "breadcrumbs.click.root" });
-			},
-			className: cx("mantine-active", hstack({
-				padding: "0.5",
-				width: {
-					base: "[20px]",
-					"@/md": "[64px]"
-				}
-			})),
-			children: [/* @__PURE__ */ jsx(Logo, { className: css({ display: {
-				base: "none",
-				"@/md": "block"
-			} }) }), /* @__PURE__ */ jsx(LogoIcon, { className: css({ display: {
-				base: "block",
-				"@/md": "none"
-			} }) })]
-		})
-	});
-};
-//#endregion
-export { LogoButton };

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

@@ -1 +0,0 @@
-export declare const NavigationButtons: () => import("react").JSX.Element;

package/dist/navigationpanel/controls/NavigationButtons.js

@@ -1,37 +0,0 @@
-import "../../_virtual/_rolldown/runtime.js";
-import { useDiagram } from "../../hooks/safeContext.js";
-import { useDiagramContext } from "../../hooks/useDiagram.js";
-import { PanelActionIcon } from "../_common.js";
-import { IconArrowLeft, IconArrowRight } from "@tabler/icons-react";
-import { jsx, jsxs } from "react/jsx-runtime";
-import { hstack } from "@likec4/styles/patterns";
-import * as m from "motion/react-m";
-//#region src/navigationpanel/controls/NavigationButtons.tsx
-var NavigationButtons = () => {
-	const diagram = useDiagram();
-	const { hasStepBack, hasStepForward } = useDiagramContext((s) => ({
-		hasStepBack: s.navigationHistory.currentIndex > 0,
-		hasStepForward: s.navigationHistory.currentIndex < s.navigationHistory.history.length - 1
-	}));
-	return /* @__PURE__ */ jsxs(m.div, {
-		layout: "position",
-		className: hstack({ gap: "0.5" }),
-		children: [/* @__PURE__ */ jsx(PanelActionIcon, {
-			disabled: !hasStepBack,
-			onClick: (e) => {
-				e.stopPropagation();
-				diagram.navigate("back");
-			},
-			children: /* @__PURE__ */ jsx(IconArrowLeft, { size: 14 })
-		}), /* @__PURE__ */ jsx(PanelActionIcon, {
-			disabled: !hasStepForward,
-			onClick: (e) => {
-				e.stopPropagation();
-				diagram.navigate("forward");
-			},
-			children: /* @__PURE__ */ jsx(IconArrowRight, { size: 14 })
-		})]
-	});
-};
-//#endregion
-export { NavigationButtons };

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

@@ -1 +0,0 @@
-export declare const OpenSource: () => import("react").JSX.Element | null;