@likec4/diagram 1.45.0 → 1.46.2

package/dist/navigationpanel/NavigationPanel.js

@@ -2,12 +2,11 @@ import { jsx, jsxs } from 'react/jsx-runtime';
 import { VStack } from '@likec4/styles/jsx';
 import { hstack } from '@likec4/styles/patterns';
 import { Popover, PopoverTarget } from '@mantine/core';
-import { useUpdateEffect } from '@react-hookz/web';
 import { useActorRef, useSelector } from '@xstate/react';
 import { LayoutGroup, AnimatePresence } from 'motion/react';
 import * as m from 'motion/react-m';
 import { memo, useEffect } from 'react';
-import { useDiagramActorRef } from '../hooks/safeContext.js';
+import { useDiagram } from '../hooks/safeContext.js';
 import { useCurrentView } from '../hooks/useCurrentView.js';
 import { useOptionalCurrentViewModel } from '../hooks/useCurrentViewModel.js';
 import { useDiagramContext } from '../hooks/useDiagram.js';
@@ -22,7 +21,7 @@ import { EditorPanel } from './editorpanel/EditorPanel.js';
 import { ActiveWalkthroughControls } from './walkthrough/ActiveWalkthroughControls.js';
 
 const NavigationPanel = memo(() => {
-  const diagramActor = useDiagramActorRef();
+  const diagram = useDiagram();
   const view = useCurrentView();
   const viewModel = useOptionalCurrentViewModel();
   const actorRef = useActorRef(
@@ -36,13 +35,11 @@ const NavigationPanel = memo(() => {
   );
   useEffect(() => {
     const subscription = actorRef.on("navigateTo", (event) => {
-      if (diagramActor.getSnapshot().context.view.id !== event.viewId) {
-        diagramActor.send({ type: "navigate.to", viewId: event.viewId });
-      }
+      diagram.navigateTo(event.viewId);
     });
     return () => subscription.unsubscribe();
-  }, [actorRef, diagramActor]);
-  useUpdateEffect(() => {
+  }, [actorRef, diagram]);
+  useEffect(() => {
     actorRef.send({ type: "update.inputs", inputs: { viewModel, view } });
   }, [viewModel, view]);
   return /* @__PURE__ */ jsx(
@@ -95,7 +92,7 @@ const NavigationPanelImpl = ({ actor }) => {
       },
       opened,
       position: "bottom-start",
-      trapFocus: true,
+      trapFocus: opened,
       ...portalProps,
       clickOutsideEvents: ["pointerdown", "mousedown", "click"],
       onDismiss: () => actor.send({ type: "dropdown.dismiss" }),

package/dist/navigationpanel/NavigationPanelDropdown.js

@@ -17,13 +17,13 @@ import { ProjectsMenu } from './dropdown/ProjectsMenu.js';
 import { useNavigationActor, useNavigationActorSnapshot, useNavigationActorContext, useNavigationActorRef } from './hooks.js';
 import { breadcrumbTitle } from './styles.css.js';
 import { useOnDiagramEvent } from '../hooks/useDiagram.js';
-import IconSearch from '../node_modules/.pnpm/@tabler_icons-react@3.35.0_react@19.2.0/node_modules/@tabler/icons-react/dist/esm/icons/IconSearch.js';
-import IconChevronRight from '../node_modules/.pnpm/@tabler_icons-react@3.35.0_react@19.2.0/node_modules/@tabler/icons-react/dist/esm/icons/IconChevronRight.js';
-import IconDirectionSignFilled from '../node_modules/.pnpm/@tabler_icons-react@3.35.0_react@19.2.0/node_modules/@tabler/icons-react/dist/esm/icons/IconDirectionSignFilled.js';
-import IconStack2 from '../node_modules/.pnpm/@tabler_icons-react@3.35.0_react@19.2.0/node_modules/@tabler/icons-react/dist/esm/icons/IconStack2.js';
-import IconZoomScan from '../node_modules/.pnpm/@tabler_icons-react@3.35.0_react@19.2.0/node_modules/@tabler/icons-react/dist/esm/icons/IconZoomScan.js';
-import IconStarFilled from '../node_modules/.pnpm/@tabler_icons-react@3.35.0_react@19.2.0/node_modules/@tabler/icons-react/dist/esm/icons/IconStarFilled.js';
-import IconFolderFilled from '../node_modules/.pnpm/@tabler_icons-react@3.35.0_react@19.2.0/node_modules/@tabler/icons-react/dist/esm/icons/IconFolderFilled.js';
+import IconSearch from '../node_modules/.pnpm/@tabler_icons-react@3.36.0_react@19.2.3/node_modules/@tabler/icons-react/dist/esm/icons/IconSearch.js';
+import IconChevronRight from '../node_modules/.pnpm/@tabler_icons-react@3.36.0_react@19.2.3/node_modules/@tabler/icons-react/dist/esm/icons/IconChevronRight.js';
+import IconDirectionSignFilled from '../node_modules/.pnpm/@tabler_icons-react@3.36.0_react@19.2.3/node_modules/@tabler/icons-react/dist/esm/icons/IconDirectionSignFilled.js';
+import IconStack2 from '../node_modules/.pnpm/@tabler_icons-react@3.36.0_react@19.2.3/node_modules/@tabler/icons-react/dist/esm/icons/IconStack2.js';
+import IconZoomScan from '../node_modules/.pnpm/@tabler_icons-react@3.36.0_react@19.2.3/node_modules/@tabler/icons-react/dist/esm/icons/IconZoomScan.js';
+import IconStarFilled from '../node_modules/.pnpm/@tabler_icons-react@3.36.0_react@19.2.3/node_modules/@tabler/icons-react/dist/esm/icons/IconStarFilled.js';
+import IconFolderFilled from '../node_modules/.pnpm/@tabler_icons-react@3.36.0_react@19.2.3/node_modules/@tabler/icons-react/dist/esm/icons/IconFolderFilled.js';
 
 const scopedKeydownHandler = createScopedKeydownHandler({
   siblingSelector: "[data-likec4-focusable]",

package/dist/navigationpanel/_common.js

@@ -4,7 +4,7 @@ import { navigationPanelActionIcon } from '@likec4/styles/recipes';
 import { ActionIcon, ThemeIcon, Tooltip as Tooltip$1, Breadcrumbs } from '@mantine/core';
 import * as m from 'motion/react-m';
 import { forwardRef } from 'react';
-import IconChevronRight from '../node_modules/.pnpm/@tabler_icons-react@3.35.0_react@19.2.0/node_modules/@tabler/icons-react/dist/esm/icons/IconChevronRight.js';
+import IconChevronRight from '../node_modules/.pnpm/@tabler_icons-react@3.36.0_react@19.2.3/node_modules/@tabler/icons-react/dist/esm/icons/IconChevronRight.js';
 
 const Tooltip = Tooltip$1.withProps({
   color: "dark",

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

@@ -1,3 +1,5 @@
-export declare function CompareActionsMenu({ onResetManualLayout, }: {
+export declare function CompareActionsMenu({ disabled, onApplyLatestToManual, onResetManualLayout, }: {
+    disabled?: boolean;
+    onApplyLatestToManual?: undefined | (() => void);
     onResetManualLayout: () => void;
 }): import("react/jsx-runtime").JSX.Element;

package/dist/navigationpanel/comparepanel/CompareActionsMenu.js

@@ -1,12 +1,15 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import { cx } from '@likec4/styles/css';
 import { Box } from '@likec4/styles/jsx';
 import { hstack } from '@likec4/styles/patterns';
-import { navigationPanelActionIcon } from '@likec4/styles/recipes';
-import { Menu, UnstyledButton, Badge } from '@mantine/core';
-import IconChevronDown from '../../node_modules/.pnpm/@tabler_icons-react@3.35.0_react@19.2.0/node_modules/@tabler/icons-react/dist/esm/icons/IconChevronDown.js';
+import { Menu, UnstyledButton, Tooltip } from '@mantine/core';
+import IconChevronDown from '../../node_modules/.pnpm/@tabler_icons-react@3.36.0_react@19.2.3/node_modules/@tabler/icons-react/dist/esm/icons/IconChevronDown.js';
+import { stopPropagation } from '../../utils/xyflow.js';
+import IconInfoCircle from '../../node_modules/.pnpm/@tabler_icons-react@3.36.0_react@19.2.3/node_modules/@tabler/icons-react/dist/esm/icons/IconInfoCircle.js';
 
 function CompareActionsMenu({
+  disabled = false,
+  onApplyLatestToManual,
   onResetManualLayout
 }) {
   return /* @__PURE__ */ jsxs(
@@ -17,27 +20,22 @@ function CompareActionsMenu({
       shadow: "lg",
       position: "bottom-start",
       offset: { mainAxis: 4 },
+      disabled,
       children: [
         /* @__PURE__ */ jsx(Menu.Target, { children: /* @__PURE__ */ jsxs(
           UnstyledButton,
           {
+            disabled,
             className: cx(
               "mantine-active",
-              navigationPanelActionIcon({
-                variant: "default"
-              }),
               hstack({
                 gap: "2",
                 py: "1.5",
                 px: "2",
                 lineHeight: "1",
-                rounded: "sm",
                 textStyle: "xs",
                 fontWeight: "medium",
-                color: {
-                  base: "likec4.panel.action",
-                  _hover: "likec4.panel.action.hover"
-                },
+                layerStyle: "likec4.panel.action",
                 userSelect: "none"
               })
             ),
@@ -48,8 +46,36 @@ function CompareActionsMenu({
           }
         ) }),
         /* @__PURE__ */ jsxs(Menu.Dropdown, { children: [
-          /* @__PURE__ */ jsx(Menu.Item, { disabled: true, rightSection: /* @__PURE__ */ jsx(Badge, { size: "xs", radius: "sm", children: "Soon" }), children: "Apply changes" }),
-          /* @__PURE__ */ jsx(Menu.Item, { fz: "sm", onClick: onResetManualLayout, children: "Reset manual layout" })
+          /* @__PURE__ */ jsxs(
+            Menu.Item,
+            {
+              disabled: !onApplyLatestToManual,
+              onClick: onApplyLatestToManual,
+              rightSection: onApplyLatestToManual && /* @__PURE__ */ jsx(
+                Tooltip,
+                {
+                  onClick: stopPropagation,
+                  position: "right-start",
+                  label: /* @__PURE__ */ jsxs(Fragment, { children: [
+                    "Applies changes from the latest auto-layouted",
+                    /* @__PURE__ */ jsx("br", {}),
+                    "to saved snapshot, preserving (as possible)",
+                    /* @__PURE__ */ jsx("br", {}),
+                    "manual adjustments.",
+                    /* @__PURE__ */ jsx("br", {}),
+                    /* @__PURE__ */ jsx("br", {}),
+                    "You can undo this action."
+                  ] }),
+                  children: /* @__PURE__ */ jsx(IconInfoCircle, { size: 14, stroke: 1.7, opacity: 0.5 })
+                }
+              ),
+              children: [
+                "Sync with latest",
+                !onApplyLatestToManual && /* @__PURE__ */ jsx(Box, { textStyle: "xs", children: "view type is changed" })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx(Menu.Item, { onClick: onResetManualLayout, children: "Remove manual layout" })
         ] })
       ]
     }

package/dist/navigationpanel/comparepanel/ComparePanelControls.js

@@ -5,7 +5,7 @@ import { useDiagramCompareLayout } from '../../hooks/useDiagramCompareLayout.js'
 import { PanelActionIcon } from '../_common.js';
 import { CompareActionsMenu } from './CompareActionsMenu.js';
 import { LayoutTypeSwitcher } from './LayoutTypeSwitcher.js';
-import IconX from '../../node_modules/.pnpm/@tabler_icons-react@3.35.0_react@19.2.0/node_modules/@tabler/icons-react/dist/esm/icons/IconX.js';
+import IconX from '../../node_modules/.pnpm/@tabler_icons-react@3.36.0_react@19.2.3/node_modules/@tabler/icons-react/dist/esm/icons/IconX.js';
 
 const Divider = Divider$1.withProps({
   mx: 2,
@@ -13,7 +13,7 @@ const Divider = Divider$1.withProps({
   orientation: "vertical"
 });
 function ComparePanelControls() {
-  const [ctx, { toggleCompare, switchLayout, resetManualLayout }] = useDiagramCompareLayout();
+  const [ctx, { toggleCompare, switchLayout, resetManualLayout, applyLatestToManual }] = useDiagramCompareLayout();
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsx(
       Box,
@@ -33,12 +33,14 @@ function ComparePanelControls() {
         onChange: switchLayout
       }
     ),
-    ctx.isEditable && /* @__PURE__ */ jsxs(HStack, { gap: "1", children: [
+    ctx.hasEditor && /* @__PURE__ */ jsxs(HStack, { gap: "1", children: [
       /* @__PURE__ */ jsx(Divider, {}),
       /* @__PURE__ */ jsx(
         CompareActionsMenu,
         {
-          onResetManualLayout: resetManualLayout
+          disabled: ctx.layout === "auto",
+          onResetManualLayout: resetManualLayout,
+          onApplyLatestToManual: ctx.canApplyLatest ? applyLatestToManual : void 0
         }
       ),
       /* @__PURE__ */ jsx(Divider, {})

package/dist/navigationpanel/comparepanel/LayoutTypeSwitcher.js

@@ -10,8 +10,8 @@ function LayoutTypeSwitcher({
   onChange
 }) {
   const data = useMemo(() => [
-    { value: "manual", label: "Saved" },
-    { value: "auto", label: "Latest" }
+    { value: "manual", label: "Saved manual" },
+    { value: "auto", label: "Latest auto" }
   ], []);
   return /* @__PURE__ */ jsx(m.div, { layout: "position", children: /* @__PURE__ */ jsx(
     SegmentedControl,

package/dist/navigationpanel/controls/DetailsControls.js

@@ -12,8 +12,8 @@ import { Link } from '../../components/Link.js';
 import { useOnDiagramEvent } from '../../hooks/useDiagram.js';
 import { useMantinePortalProps } from '../../hooks/useMantinePortalProps.js';
 import { useNavigationActorSnapshot } from '../hooks.js';
-import IconId from '../../node_modules/.pnpm/@tabler_icons-react@3.35.0_react@19.2.0/node_modules/@tabler/icons-react/dist/esm/icons/IconId.js';
-import IconLink from '../../node_modules/.pnpm/@tabler_icons-react@3.35.0_react@19.2.0/node_modules/@tabler/icons-react/dist/esm/icons/IconLink.js';
+import IconId from '../../node_modules/.pnpm/@tabler_icons-react@3.36.0_react@19.2.3/node_modules/@tabler/icons-react/dist/esm/icons/IconId.js';
+import IconLink from '../../node_modules/.pnpm/@tabler_icons-react@3.36.0_react@19.2.3/node_modules/@tabler/icons-react/dist/esm/icons/IconLink.js';
 import { useDiagram } from '../../hooks/safeContext.js';
 import { ElementTag } from '../../base-primitives/element/ElementTags.js';
 import { Markdown } from '../../base-primitives/Markdown.js';

package/dist/navigationpanel/controls/LayoutWarning.js

@@ -8,7 +8,7 @@ import * as m from 'motion/react-m';
 import { memo, Fragment as Fragment$1 } from 'react';
 import { useDiagramCompareLayout } from '../../hooks/useDiagramCompareLayout.js';
 import { useMantinePortalProps } from '../../hooks/useMantinePortalProps.js';
-import IconAlertTriangle from '../../node_modules/.pnpm/@tabler_icons-react@3.35.0_react@19.2.0/node_modules/@tabler/icons-react/dist/esm/icons/IconAlertTriangle.js';
+import IconAlertTriangle from '../../node_modules/.pnpm/@tabler_icons-react@3.36.0_react@19.2.3/node_modules/@tabler/icons-react/dist/esm/icons/IconAlertTriangle.js';
 
 const LayoutWarning = memo(() => {
   const [ctx, { toggleCompare }] = useDiagramCompareLayout();
@@ -33,6 +33,7 @@ const LayoutWarning = memo(() => {
             component: m.button,
             layout: "position",
             onClick: (e) => {
+              e.stopPropagation();
               toggleCompare();
             },
             whileTap: {

package/dist/navigationpanel/controls/NavigationButtons.js

@@ -4,8 +4,8 @@ import * as m from 'motion/react-m';
 import { useDiagramContext } from '../../hooks/useDiagram.js';
 import { PanelActionIcon } from '../_common.js';
 import { useDiagram } from '../../hooks/safeContext.js';
-import IconArrowLeft from '../../node_modules/.pnpm/@tabler_icons-react@3.35.0_react@19.2.0/node_modules/@tabler/icons-react/dist/esm/icons/IconArrowLeft.js';
-import IconArrowRight from '../../node_modules/.pnpm/@tabler_icons-react@3.35.0_react@19.2.0/node_modules/@tabler/icons-react/dist/esm/icons/IconArrowRight.js';
+import IconArrowLeft from '../../node_modules/.pnpm/@tabler_icons-react@3.36.0_react@19.2.3/node_modules/@tabler/icons-react/dist/esm/icons/IconArrowLeft.js';
+import IconArrowRight from '../../node_modules/.pnpm/@tabler_icons-react@3.36.0_react@19.2.3/node_modules/@tabler/icons-react/dist/esm/icons/IconArrowRight.js';
 
 const NavigationButtons = () => {
   const diagram = useDiagram();

package/dist/navigationpanel/controls/OpenSource.js

@@ -3,7 +3,7 @@ import { useDiagramEventHandlers } from '../../context/DiagramEventHandlers.js';
 import { useEnabledFeatures } from '../../context/DiagramFeatures.js';
 import { useCurrentViewId } from '../../hooks/useCurrentView.js';
 import { Tooltip, PanelActionIcon } from '../_common.js';
-import IconFileSymlink from '../../node_modules/.pnpm/@tabler_icons-react@3.35.0_react@19.2.0/node_modules/@tabler/icons-react/dist/esm/icons/IconFileSymlink.js';
+import IconFileSymlink from '../../node_modules/.pnpm/@tabler_icons-react@3.36.0_react@19.2.3/node_modules/@tabler/icons-react/dist/esm/icons/IconFileSymlink.js';
 
 const OpenSource = () => {
   const viewId = useCurrentViewId();

package/dist/navigationpanel/controls/SearchControl.js

@@ -11,7 +11,7 @@ import '@xstate/react';
 import 'fast-equals';
 import { useDiagram } from '../../hooks/safeContext.js';
 import { useEnabledFeatures } from '../../context/DiagramFeatures.js';
-import IconSearch from '../../node_modules/.pnpm/@tabler_icons-react@3.35.0_react@19.2.0/node_modules/@tabler/icons-react/dist/esm/icons/IconSearch.js';
+import IconSearch from '../../node_modules/.pnpm/@tabler_icons-react@3.36.0_react@19.2.3/node_modules/@tabler/icons-react/dist/esm/icons/IconSearch.js';
 
 const SearchControl = memo(() => {
   const { enableSearch, enableCompareWithLatest } = useEnabledFeatures();
@@ -37,7 +37,7 @@ const SearchControl = memo(() => {
           paddingInline: "sm",
           paddingBlock: "xxs",
           userSelect: "none",
-          layerStyle: "likec4.panel.action",
+          layerStyle: "likec4.panel.action.filled",
           display: {
             base: "none",
             "@/md": "flex"

package/dist/navigationpanel/controls/ToggleReadonly.js

@@ -4,18 +4,27 @@ import { hstack } from '@likec4/styles/patterns';
 import { UnstyledButton } from '@mantine/core';
 import { AnimatePresence } from 'motion/react';
 import * as m from 'motion/react-m';
+import { isTruthy } from 'remeda';
 import { useDiagramContext } from '../../hooks/useDiagram.js';
+import { deriveToggledFeatures } from '../../likec4diagram/state/machine.setup.js';
 import { useDiagram } from '../../hooks/safeContext.js';
-import IconLockOpen2 from '../../node_modules/.pnpm/@tabler_icons-react@3.35.0_react@19.2.0/node_modules/@tabler/icons-react/dist/esm/icons/IconLockOpen2.js';
-import IconLock from '../../node_modules/.pnpm/@tabler_icons-react@3.35.0_react@19.2.0/node_modules/@tabler/icons-react/dist/esm/icons/IconLock.js';
+import IconLockOpen2 from '../../node_modules/.pnpm/@tabler_icons-react@3.36.0_react@19.2.3/node_modules/@tabler/icons-react/dist/esm/icons/IconLockOpen2.js';
+import IconLock from '../../node_modules/.pnpm/@tabler_icons-react@3.36.0_react@19.2.3/node_modules/@tabler/icons-react/dist/esm/icons/IconLock.js';
 
-const selector = (ctx) => ({
-  visible: ctx.features.enableReadOnly !== true && // Disable toggle in sequence mode
-  (ctx.view._type !== "dynamic" || ctx.dynamicViewVariant !== "sequence"),
-  isReadOnly: ctx.toggledFeatures.enableReadOnly ?? ctx.features.enableReadOnly
-});
+const selector = (ctx) => {
+  const toggledFeatures = deriveToggledFeatures(ctx);
+  const comparingLatest = toggledFeatures.enableCompareWithLatest && !!ctx.view.drifts && ctx.view._layout === "auto";
+  const sequenceLayoutActive = ctx.view._type === "dynamic" && ctx.dynamicViewVariant === "sequence";
+  const noActiveWalkthrough = !isTruthy(ctx.activeWalkthrough);
+  const hasEditor = ctx.features.enableEditor;
+  return {
+    visible: hasEditor && noActiveWalkthrough,
+    disabled: comparingLatest || sequenceLayoutActive,
+    isReadOnly: ctx.toggledFeatures.enableReadOnly ?? false
+  };
+};
 const ToggleReadonly = () => {
-  const { visible, isReadOnly } = useDiagramContext(selector);
+  const { visible, disabled, isReadOnly } = useDiagramContext(selector);
   const diagram = useDiagram();
   return /* @__PURE__ */ jsx(AnimatePresence, { mode: "popLayout", children: visible && /* @__PURE__ */ jsxs(
     UnstyledButton,
@@ -23,12 +32,13 @@ const ToggleReadonly = () => {
       component: m.button,
       layout: "position",
       layoutDependency: isReadOnly,
+      disabled,
       onClick: (e) => {
         e.stopPropagation();
-        diagram.toggleFeature("ReadOnly");
+        !disabled && diagram.toggleFeature("ReadOnly");
       },
       initial: { opacity: 0, scale: 0.6 },
-      animate: { opacity: 1, scale: 1 },
+      animate: { opacity: 1, scale: disabled ? 0.95 : 1 },
       exit: { opacity: 0, scale: 0.6 },
       whileTap: {
         translateY: 1
@@ -39,15 +49,13 @@ const ToggleReadonly = () => {
           gap: "0.5",
           paddingInline: "xxs",
           paddingBlock: "xxs",
-          rounded: "sm",
           userSelect: "none",
-          cursor: "pointer",
-          color: {
-            base: "likec4.panel.action",
-            _hover: "likec4.panel.action.hover"
-          },
+          layerStyle: "likec4.panel.action",
           backgroundColor: {
-            _hover: "likec4.panel.action.bg.hover"
+            base: "none",
+            _notDisabled: {
+              _hover: "likec4.panel.action.bg.hover"
+            }
           }
         })
       ),

package/dist/navigationpanel/dropdown/ProjectsMenu.js

@@ -4,7 +4,7 @@ import { HStack, Box } from '@likec4/styles/jsx';
 import { Menu, MenuTarget, Button, MenuDropdown, MenuItem } from '@mantine/core';
 import { memo } from 'react';
 import { useLikeC4ProjectsContext, useLikeC4ProjectId } from '../../hooks/useLikeC4Project.js';
-import IconChevronDown from '../../node_modules/.pnpm/@tabler_icons-react@3.35.0_react@19.2.0/node_modules/@tabler/icons-react/dist/esm/icons/IconChevronDown.js';
+import IconChevronDown from '../../node_modules/.pnpm/@tabler_icons-react@3.36.0_react@19.2.3/node_modules/@tabler/icons-react/dist/esm/icons/IconChevronDown.js';
 
 const ProjectsMenu = memo((_) => {
   const { projects, onProjectChange } = useLikeC4ProjectsContext();

package/dist/navigationpanel/editorpanel/CenterCamera.js

@@ -5,7 +5,7 @@ import 'react';
 import { useDiagram } from '../../hooks/safeContext.js';
 import { PanelActionIcon } from '../_common.js';
 import { Tooltip } from './_common.js';
-import IconFocusCentered from '../../node_modules/.pnpm/@tabler_icons-react@3.35.0_react@19.2.0/node_modules/@tabler/icons-react/dist/esm/icons/IconFocusCentered.js';
+import IconFocusCentered from '../../node_modules/.pnpm/@tabler_icons-react@3.36.0_react@19.2.3/node_modules/@tabler/icons-react/dist/esm/icons/IconFocusCentered.js';
 
 const CenterCamera = () => {
   const diagram = useDiagram();

package/dist/navigationpanel/editorpanel/ChangeAutoLayoutButton.js

@@ -8,7 +8,7 @@ import { PanelActionIcon } from '../_common.js';
 import { Tooltip } from './_common.js';
 import { autolayoutIndicator, autolayoutButton, spacingSliderBody, spacingSliderThumb } from './styles.js';
 import { useDiagram } from '../../hooks/safeContext.js';
-import IconLayoutDashboard from '../../node_modules/.pnpm/@tabler_icons-react@3.35.0_react@19.2.0/node_modules/@tabler/icons-react/dist/esm/icons/IconLayoutDashboard.js';
+import IconLayoutDashboard from '../../node_modules/.pnpm/@tabler_icons-react@3.36.0_react@19.2.3/node_modules/@tabler/icons-react/dist/esm/icons/IconLayoutDashboard.js';
 
 const selector = (state) => ({
   viewId: state.view.id,

package/dist/navigationpanel/editorpanel/ManualLayoutToolsButton.js

@@ -9,15 +9,15 @@ import { useDiagram } from '../../hooks/safeContext.js';
 import { useMantinePortalProps } from '../../hooks/useMantinePortalProps.js';
 import { PanelActionIcon } from '../_common.js';
 import { Tooltip } from './_common.js';
-import IconLayoutCollage from '../../node_modules/.pnpm/@tabler_icons-react@3.35.0_react@19.2.0/node_modules/@tabler/icons-react/dist/esm/icons/IconLayoutCollage.js';
-import IconLayoutBoardSplit from '../../node_modules/.pnpm/@tabler_icons-react@3.35.0_react@19.2.0/node_modules/@tabler/icons-react/dist/esm/icons/IconLayoutBoardSplit.js';
-import IconLayoutAlignLeft from '../../node_modules/.pnpm/@tabler_icons-react@3.35.0_react@19.2.0/node_modules/@tabler/icons-react/dist/esm/icons/IconLayoutAlignLeft.js';
-import IconLayoutAlignCenter from '../../node_modules/.pnpm/@tabler_icons-react@3.35.0_react@19.2.0/node_modules/@tabler/icons-react/dist/esm/icons/IconLayoutAlignCenter.js';
-import IconLayoutAlignRight from '../../node_modules/.pnpm/@tabler_icons-react@3.35.0_react@19.2.0/node_modules/@tabler/icons-react/dist/esm/icons/IconLayoutAlignRight.js';
-import IconLayoutAlignTop from '../../node_modules/.pnpm/@tabler_icons-react@3.35.0_react@19.2.0/node_modules/@tabler/icons-react/dist/esm/icons/IconLayoutAlignTop.js';
-import IconLayoutAlignMiddle from '../../node_modules/.pnpm/@tabler_icons-react@3.35.0_react@19.2.0/node_modules/@tabler/icons-react/dist/esm/icons/IconLayoutAlignMiddle.js';
-import IconLayoutAlignBottom from '../../node_modules/.pnpm/@tabler_icons-react@3.35.0_react@19.2.0/node_modules/@tabler/icons-react/dist/esm/icons/IconLayoutAlignBottom.js';
-import IconRouteOff from '../../node_modules/.pnpm/@tabler_icons-react@3.35.0_react@19.2.0/node_modules/@tabler/icons-react/dist/esm/icons/IconRouteOff.js';
+import IconLayoutCollage from '../../node_modules/.pnpm/@tabler_icons-react@3.36.0_react@19.2.3/node_modules/@tabler/icons-react/dist/esm/icons/IconLayoutCollage.js';
+import IconLayoutBoardSplit from '../../node_modules/.pnpm/@tabler_icons-react@3.36.0_react@19.2.3/node_modules/@tabler/icons-react/dist/esm/icons/IconLayoutBoardSplit.js';
+import IconLayoutAlignLeft from '../../node_modules/.pnpm/@tabler_icons-react@3.36.0_react@19.2.3/node_modules/@tabler/icons-react/dist/esm/icons/IconLayoutAlignLeft.js';
+import IconLayoutAlignCenter from '../../node_modules/.pnpm/@tabler_icons-react@3.36.0_react@19.2.3/node_modules/@tabler/icons-react/dist/esm/icons/IconLayoutAlignCenter.js';
+import IconLayoutAlignRight from '../../node_modules/.pnpm/@tabler_icons-react@3.36.0_react@19.2.3/node_modules/@tabler/icons-react/dist/esm/icons/IconLayoutAlignRight.js';
+import IconLayoutAlignTop from '../../node_modules/.pnpm/@tabler_icons-react@3.36.0_react@19.2.3/node_modules/@tabler/icons-react/dist/esm/icons/IconLayoutAlignTop.js';
+import IconLayoutAlignMiddle from '../../node_modules/.pnpm/@tabler_icons-react@3.36.0_react@19.2.3/node_modules/@tabler/icons-react/dist/esm/icons/IconLayoutAlignMiddle.js';
+import IconLayoutAlignBottom from '../../node_modules/.pnpm/@tabler_icons-react@3.36.0_react@19.2.3/node_modules/@tabler/icons-react/dist/esm/icons/IconLayoutAlignBottom.js';
+import IconRouteOff from '../../node_modules/.pnpm/@tabler_icons-react@3.36.0_react@19.2.3/node_modules/@tabler/icons-react/dist/esm/icons/IconRouteOff.js';
 
 const Action = ({
   label,

package/dist/navigationpanel/editorpanel/ToggleReadonly.js

@@ -5,7 +5,7 @@ import 'react';
 import { useDiagram } from '../../hooks/safeContext.js';
 import { PanelActionIcon } from '../_common.js';
 import { Tooltip } from './_common.js';
-import IconLockOpen2 from '../../node_modules/.pnpm/@tabler_icons-react@3.35.0_react@19.2.0/node_modules/@tabler/icons-react/dist/esm/icons/IconLockOpen2.js';
+import IconLockOpen2 from '../../node_modules/.pnpm/@tabler_icons-react@3.36.0_react@19.2.3/node_modules/@tabler/icons-react/dist/esm/icons/IconLockOpen2.js';
 
 const ToggleReadonly = () => {
   const diagram = useDiagram();

package/dist/navigationpanel/walkthrough/ActiveWalkthroughControls.js

@@ -8,9 +8,9 @@ import { isTruthy } from 'remeda';
 import { useDiagramContext } from '../../hooks/useDiagram.js';
 import { TriggerWalkthroughButton } from './DynamicViewControls.js';
 import { useDiagram } from '../../hooks/safeContext.js';
-import IconPlayerStopFilled from '../../node_modules/.pnpm/@tabler_icons-react@3.35.0_react@19.2.0/node_modules/@tabler/icons-react/dist/esm/icons/IconPlayerStopFilled.js';
-import IconPlayerSkipBackFilled from '../../node_modules/.pnpm/@tabler_icons-react@3.35.0_react@19.2.0/node_modules/@tabler/icons-react/dist/esm/icons/IconPlayerSkipBackFilled.js';
-import IconPlayerSkipForwardFilled from '../../node_modules/.pnpm/@tabler_icons-react@3.35.0_react@19.2.0/node_modules/@tabler/icons-react/dist/esm/icons/IconPlayerSkipForwardFilled.js';
+import IconPlayerStopFilled from '../../node_modules/.pnpm/@tabler_icons-react@3.36.0_react@19.2.3/node_modules/@tabler/icons-react/dist/esm/icons/IconPlayerStopFilled.js';
+import IconPlayerSkipBackFilled from '../../node_modules/.pnpm/@tabler_icons-react@3.36.0_react@19.2.3/node_modules/@tabler/icons-react/dist/esm/icons/IconPlayerSkipBackFilled.js';
+import IconPlayerSkipForwardFilled from '../../node_modules/.pnpm/@tabler_icons-react@3.36.0_react@19.2.3/node_modules/@tabler/icons-react/dist/esm/icons/IconPlayerSkipForwardFilled.js';
 import { useMantinePortalProps } from '../../hooks/useMantinePortalProps.js';
 
 const PrevNextButton = Button.withProps({