likec4 1.38.0 → 1.39.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (47) hide show
  1. package/__app__/src/main.js +478 -402
  2. package/__app__/src/style.css +1 -1
  3. package/dist/cli/index.mjs +639 -848
  4. package/dist/config/index.d.mts +52 -0
  5. package/dist/config/index.mjs +1 -0
  6. package/dist/index.d.mts +6 -3
  7. package/dist/index.mjs +2 -2
  8. package/dist/shared/likec4.C8DLF79h.d.mts +1660 -0
  9. package/dist/shared/likec4.C_KAHtJX.mjs +4164 -0
  10. package/dist/shared/likec4.D0i_9Zhl.mjs +257 -0
  11. package/dist/shared/likec4.DfOb2tZw.mjs +143 -0
  12. package/dist/shared/{likec4.CRYZWScz.d.mts → likec4.yf56CCfj.d.mts} +658 -2308
  13. package/dist/vite-plugin/index.d.mts +9 -2
  14. package/dist/vite-plugin/index.mjs +2 -2
  15. package/icons/all.d.ts +25 -0
  16. package/icons/all.js +50 -0
  17. package/icons/azure/ai-at-edge.js +1 -0
  18. package/icons/azure/azure-consumption-commitment.js +1 -0
  19. package/icons/azure/azure-managed-redis.js +1 -0
  20. package/icons/azure/breeze.js +1 -0
  21. package/icons/azure/data-virtualization.js +1 -0
  22. package/icons/azure/edge-actions.js +1 -0
  23. package/icons/azure/edge-storage-accelerator.js +1 -0
  24. package/icons/azure/engage-center-connect.js +1 -0
  25. package/icons/azure/external-id-modified.js +1 -0
  26. package/icons/azure/external-id.js +1 -0
  27. package/icons/azure/frd-qa.js +1 -0
  28. package/icons/azure/hybrid-connectivity-hub.js +1 -0
  29. package/icons/azure/landing-zone.js +1 -0
  30. package/icons/azure/load-balancer-hub.js +1 -1
  31. package/icons/azure/logic-apps-template.js +1 -0
  32. package/icons/azure/network-foundation-hub.js +1 -0
  33. package/icons/azure/network-security-hub.js +1 -0
  34. package/icons/azure/planetary-computer-pro.js +1 -0
  35. package/icons/azure/promethus.js +1 -0
  36. package/icons/azure/service-group-relationships.js +1 -0
  37. package/icons/azure/service-groups.js +1 -0
  38. package/icons/azure/sql-database-fleet-manager.js +1 -0
  39. package/icons/azure/storage-hubs.js +1 -0
  40. package/icons/azure/toolchain-orchestrator.js +1 -0
  41. package/icons/azure/vpnclient-windows.js +1 -0
  42. package/icons/azure/workload-orchestration.js +1 -0
  43. package/package.json +47 -28
  44. package/react/index.d.mts +237 -222
  45. package/react/index.mjs +35 -35
  46. package/dist/shared/likec4.D6zjV21i.mjs +0 -257
  47. package/dist/shared/likec4.enfOs0BB.mjs +0 -4204
package/__app__/src/main.js CHANGED
@@ -6,8 +6,9 @@ import { projects } from "likec4:projects";
6
6
  import * as ReactDOM from "react-dom";
7
7
  import ReactDOM__default, { flushSync, createPortal } from "react-dom";
8
8
  import { pageTitle, ComponentName, useHashHistory, withOverviewGraph, krokiPumlSvgUrl, isDevelopment, krokiD2SvgUrl, basepath } from "./const.js";
9
- import { isTagColorSpecified, invariant as invariant$2, hasAtLeast, nonexhaustive, isStepEdgeId, extractStep, nonNullable, defaultTheme, ElementShapes, toArray, ifirst, ifilter, compareNaturalHierarchically, compareNatural, RichText, ifind, DefaultMap, ancestorsFqn, nameFromFqn, isAncestor, sortParentsFirst, ThemeColors, Queue, whereOperatorAsPredicate, GroupElementKind, delay as delay$1, BBox, getParallelStepsPrefix, isDescendantOf } from "@likec4/core";
10
- import { DefaultShapeSize, DefaultTextSize, DefaultPaddingSize } from "@likec4/core/types";
9
+ import { isTagColorSpecified, nonexhaustive, invariant as invariant$3, isStepEdgeId, extractStep, nonNullable, defaultTheme, ElementShapes, RichText, ancestorsFqn, nameFromFqn, isAncestor as isAncestor$1, ThemeColors, Queue, whereOperatorAsPredicate, GroupElementKind, BBox, getParallelStepsPrefix } from "@likec4/core";
10
+ import { invariant as invariant$2, toArray, ifirst, ifilter, compareNaturalHierarchically, nonexhaustive as nonexhaustive$1, compareNatural, ifind, nonNullable as nonNullable$1, DefaultMap, isAncestor, sortParentsFirst, nameFromFqn as nameFromFqn$1, delay as delay$1, isDescendantOf } from "@likec4/core/utils";
11
+ import { DefaultShapeSize, DefaultTextSize, DefaultPaddingSize, RichText as RichText$1 } from "@likec4/core/types";
11
12
  import { computeRelationshipsView, treeFromElements as treeFromElements$1 } from "@likec4/core/compute-view/relationships";
12
13
  import { normalizeViewPath, VIEW_FOLDERS_SEPARATOR, modelConnection } from "@likec4/core/model";
13
14
  var __assign = function() {
@@ -1329,10 +1330,10 @@ function useHotkeys(hotkeys, tagsToIgnore = ["INPUT", "TEXTAREA", "SELECT"], tri
1329
1330
  }, [hotkeys]);
1330
1331
  }
1331
1332
  function useHover$1() {
1332
- const [hovered, setHovered2] = useState(!1), previousNode = useRef(null), handleMouseEnter = useCallback(() => {
1333
- setHovered2(!0);
1333
+ const [hovered, setHovered] = useState(!1), previousNode = useRef(null), handleMouseEnter = useCallback(() => {
1334
+ setHovered(!0);
1334
1335
  }, []), handleMouseLeave = useCallback(() => {
1335
- setHovered2(!1);
1336
+ setHovered(!1);
1336
1337
  }, []);
1337
1338
  return { ref: useCallback(
1338
1339
  (node2) => {
@@ -4473,12 +4474,8 @@ function getWindowScrollBarX(element, rect) {
4473
4474
  const leftScroll = getNodeScroll(element).scrollLeft;
4474
4475
  return rect ? rect.left + leftScroll : getBoundingClientRect(getDocumentElement(element)).left + leftScroll;
4475
4476
  }
4476
- function getHTMLOffset(documentElement, scroll, ignoreScrollbarX) {
4477
- ignoreScrollbarX === void 0 && (ignoreScrollbarX = !1);
4478
- const htmlRect = documentElement.getBoundingClientRect(), x2 = htmlRect.left + scroll.scrollLeft - (ignoreScrollbarX ? 0 : (
4479
- // RTL <body> scrollbar.
4480
- getWindowScrollBarX(documentElement, htmlRect)
4481
- )), y2 = htmlRect.top + scroll.scrollTop;
4477
+ function getHTMLOffset(documentElement, scroll) {
4478
+ const htmlRect = documentElement.getBoundingClientRect(), x2 = htmlRect.left + scroll.scrollLeft - getWindowScrollBarX(documentElement, htmlRect), y2 = htmlRect.top + scroll.scrollTop;
4482
4479
  return {
4483
4480
  x: x2,
4484
4481
  y: y2
@@ -4503,7 +4500,7 @@ function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
4503
4500
  const offsetRect = getBoundingClientRect(offsetParent);
4504
4501
  scale2 = getScale(offsetParent), offsets.x = offsetRect.x + offsetParent.clientLeft, offsets.y = offsetRect.y + offsetParent.clientTop;
4505
4502
  }
4506
- const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll, !0) : createCoords(0);
4503
+ const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll) : createCoords(0);
4507
4504
  return {
4508
4505
  width: rect.width * scale2.x,
4509
4506
  height: rect.height * scale2.y,
@@ -4525,6 +4522,7 @@ function getDocumentRect(element) {
4525
4522
  y: y2
4526
4523
  };
4527
4524
  }
4525
+ const SCROLLBAR_MAX = 25;
4528
4526
  function getViewportRect(element, strategy) {
4529
4527
  const win2 = getWindow(element), html = getDocumentElement(element), visualViewport = win2.visualViewport;
4530
4528
  let width = html.clientWidth, height = html.clientHeight, x2 = 0, y2 = 0;
@@ -4533,6 +4531,11 @@ function getViewportRect(element, strategy) {
4533
4531
  const visualViewportBased = isWebKit();
4534
4532
  (!visualViewportBased || visualViewportBased && strategy === "fixed") && (x2 = visualViewport.offsetLeft, y2 = visualViewport.offsetTop);
4535
4533
  }
4534
+ const windowScrollbarX = getWindowScrollBarX(html);
4535
+ if (windowScrollbarX <= 0) {
4536
+ const doc = html.ownerDocument, body2 = doc.body, bodyStyles = getComputedStyle(body2), bodyMarginInline = doc.compatMode === "CSS1Compat" && parseFloat(bodyStyles.marginLeft) + parseFloat(bodyStyles.marginRight) || 0, clippingStableScrollbarWidth = Math.abs(html.clientWidth - body2.clientWidth - bodyMarginInline);
4537
+ clippingStableScrollbarWidth <= SCROLLBAR_MAX && (width -= clippingStableScrollbarWidth);
4538
+ } else windowScrollbarX <= SCROLLBAR_MAX && (width += windowScrollbarX);
4536
4539
  return {
4537
4540
  width,
4538
4541
  height,
@@ -4850,7 +4853,7 @@ function useFloating$1(options) {
4850
4853
  transform: transform2 = !0,
4851
4854
  whileElementsMounted,
4852
4855
  open
4853
- } = options, [data, setData2] = React.useState({
4856
+ } = options, [data, setData] = React.useState({
4854
4857
  x: 0,
4855
4858
  y: 0,
4856
4859
  strategy,
@@ -4881,12 +4884,12 @@ function useFloating$1(options) {
4881
4884
  isPositioned: openRef.current !== !1
4882
4885
  };
4883
4886
  isMountedRef.current && !deepEqual$2(dataRef.current, fullData) && (dataRef.current = fullData, ReactDOM.flushSync(() => {
4884
- setData2(fullData);
4887
+ setData(fullData);
4885
4888
  }));
4886
4889
  });
4887
4890
  }, [latestMiddleware, placement, strategy, platformRef, openRef]);
4888
4891
  index$2(() => {
4889
- open === !1 && dataRef.current.isPositioned && (dataRef.current.isPositioned = !1, setData2((data2) => ({
4892
+ open === !1 && dataRef.current.isPositioned && (dataRef.current.isPositioned = !1, setData((data2) => ({
4890
4893
  ...data2,
4891
4894
  isPositioned: !1
4892
4895
  })));
@@ -6184,10 +6187,10 @@ ScrollAreaScrollbar.displayName = "@mantine/core/ScrollAreaScrollbar";
6184
6187
  function addUnlinkedScrollListener(node2, handler = () => {
6185
6188
  }) {
6186
6189
  let prevPosition = { left: node2.scrollLeft, top: node2.scrollTop }, rAF = 0;
6187
- return function loop() {
6190
+ return (function loop() {
6188
6191
  const position = { left: node2.scrollLeft, top: node2.scrollTop }, isHorizontalScroll = prevPosition.left !== position.left, isVerticalScroll = prevPosition.top !== position.top;
6189
6192
  (isHorizontalScroll || isVerticalScroll) && handler(), prevPosition = position, rAF = window.requestAnimationFrame(loop);
6190
- }(), () => window.cancelAnimationFrame(rAF);
6193
+ })(), () => window.cancelAnimationFrame(rAF);
6191
6194
  }
6192
6195
  const Thumb$1 = forwardRef((props2, forwardedRef) => {
6193
6196
  const { style: style2, ...others } = props2, scrollAreaContext = useScrollAreaContext(), scrollbarContext = useScrollbarContext(), { onThumbPositionChange } = scrollbarContext, composedRef = useMergedRef(forwardedRef, (node2) => scrollbarContext.onThumbChange(node2)), removeUnlinkedScrollListenerRef = useRef(void 0), debounceScrollEnd = useDebouncedCallback$1(() => {
@@ -11120,12 +11123,12 @@ function getDefaultExportFromCjs(x2) {
11120
11123
  }
11121
11124
  var useIsomorphicLayoutEffect_cjs = {}, hasRequiredUseIsomorphicLayoutEffect_cjs;
11122
11125
  function requireUseIsomorphicLayoutEffect_cjs() {
11123
- return hasRequiredUseIsomorphicLayoutEffect_cjs || (hasRequiredUseIsomorphicLayoutEffect_cjs = 1, function(exports) {
11126
+ return hasRequiredUseIsomorphicLayoutEffect_cjs || (hasRequiredUseIsomorphicLayoutEffect_cjs = 1, (function(exports) {
11124
11127
  Object.defineProperty(exports, "__esModule", { value: !0 });
11125
11128
  var react = React__default, isClient = typeof document < "u", noop2 = function() {
11126
11129
  }, index2 = isClient ? react.useLayoutEffect : noop2;
11127
11130
  exports.default = index2;
11128
- }(useIsomorphicLayoutEffect_cjs)), useIsomorphicLayoutEffect_cjs;
11131
+ })(useIsomorphicLayoutEffect_cjs)), useIsomorphicLayoutEffect_cjs;
11129
11132
  }
11130
11133
  var classes$g = { root: "m_6e45937b", loader: "m_e8eb006c", overlay: "m_df587f17" };
11131
11134
  const defaultProps$i = {
@@ -13184,7 +13187,7 @@ const defaultProps$5 = {
13184
13187
  vars,
13185
13188
  varsResolver: varsResolver$6,
13186
13189
  unstyled
13187
- }), { dir } = useDirection(), [hovered, setHovered2] = useState(!1), [_value, setValue] = useUncontrolled({
13190
+ }), { dir } = useDirection(), [hovered, setHovered] = useState(!1), [_value, setValue] = useUncontrolled({
13188
13191
  value: typeof value == "number" ? clamp$4(value, min2, max2) : value,
13189
13192
  defaultValue: typeof defaultValue == "number" ? clamp$4(defaultValue, min2, max2) : defaultValue,
13190
13193
  finalValue: clamp$4(0, min2, max2),
@@ -13321,8 +13324,8 @@ const defaultProps$5 = {
13321
13324
  disabled,
13322
13325
  containerProps: {
13323
13326
  ref: container2,
13324
- onMouseEnter: showLabelOnHover ? () => setHovered2(!0) : void 0,
13325
- onMouseLeave: showLabelOnHover ? () => setHovered2(!1) : void 0
13327
+ onMouseEnter: showLabelOnHover ? () => setHovered(!0) : void 0,
13328
+ onMouseLeave: showLabelOnHover ? () => setHovered(!1) : void 0
13326
13329
  },
13327
13330
  children: /* @__PURE__ */ jsx(
13328
13331
  Thumb,
@@ -14019,9 +14022,9 @@ function useTree({
14019
14022
  onNodeCollapse,
14020
14023
  onNodeExpand
14021
14024
  } = {}) {
14022
- const [data, setData2] = useState([]), [expandedState, setExpandedState] = useState(initialExpandedState), [selectedState, setSelectedState] = useState(initialSelectedState), [checkedState, setCheckedState] = useState(initialCheckedState), [anchorNode, setAnchorNode] = useState(null), [hoveredNode, setHoveredNode2] = useState(null), initialize = useCallback(
14025
+ const [data, setData] = useState([]), [expandedState, setExpandedState] = useState(initialExpandedState), [selectedState, setSelectedState] = useState(initialSelectedState), [checkedState, setCheckedState] = useState(initialCheckedState), [anchorNode, setAnchorNode] = useState(null), [hoveredNode, setHoveredNode2] = useState(null), initialize = useCallback(
14023
14026
  (_data) => {
14024
- setExpandedState((current) => getInitialTreeExpandedState(current, _data, selectedState)), setCheckedState((current) => getInitialCheckedState(current, _data)), setData2(_data);
14027
+ setExpandedState((current) => getInitialTreeExpandedState(current, _data, selectedState)), setCheckedState((current) => getInitialCheckedState(current, _data)), setData(_data);
14025
14028
  },
14026
14029
  [selectedState, checkedState]
14027
14030
  ), toggleExpanded = useCallback(
@@ -16015,7 +16018,7 @@ class RouterCore {
16015
16018
  const route = this.looseRoutesById[d2.routeId];
16016
16019
  if (!route.options.loader)
16017
16020
  return !0;
16018
- const gcTime = (d2.preload ? route.options.preloadGcTime ?? this.options.defaultPreloadGcTime : route.options.gcTime ?? this.options.defaultGcTime) ?? 5 * 60 * 1e3;
16021
+ const gcTime = (d2.preload ? route.options.preloadGcTime ?? this.options.defaultPreloadGcTime : route.options.gcTime ?? this.options.defaultGcTime) ?? 300 * 1e3;
16019
16022
  return !(d2.status !== "error" && Date.now() - d2.updatedAt < gcTime);
16020
16023
  };
16021
16024
  this.clearCache({ filter: filter2 });
@@ -21703,12 +21706,12 @@ class VisualElementDragControls {
21703
21706
  isRefObject(dragConstraints) && dragConstraints.current && (this.constraints = this.resolveRefConstraints());
21704
21707
  }, { projection } = this.visualElement, stopMeasureLayoutListener = projection.addEventListener("measure", measureDragConstraints);
21705
21708
  projection && !projection.layout && (projection.root && projection.root.updateScroll(), projection.updateLayout()), frame$1.read(measureDragConstraints);
21706
- const stopResizeListener = addDomEvent(window, "resize", () => this.scalePositionWithinConstraints()), stopLayoutUpdateListener = projection.addEventListener("didUpdate", ({ delta, hasLayoutChanged }) => {
21709
+ const stopResizeListener = addDomEvent(window, "resize", () => this.scalePositionWithinConstraints()), stopLayoutUpdateListener = projection.addEventListener("didUpdate", (({ delta, hasLayoutChanged }) => {
21707
21710
  this.isDragging && hasLayoutChanged && (eachAxis((axis) => {
21708
21711
  const motionValue2 = this.getAxisMotionValue(axis);
21709
21712
  motionValue2 && (this.originPoint[axis] += delta[axis].translate, motionValue2.set(motionValue2.get() + delta[axis].translate));
21710
21713
  }), this.visualElement.render());
21711
- });
21714
+ }));
21712
21715
  return () => {
21713
21716
  stopResizeListener(), stopPointerListener(), stopMeasureLayoutListener(), stopLayoutUpdateListener && stopLayoutUpdateListener();
21714
21717
  };
@@ -24742,7 +24745,7 @@ function nogamma(a2, b2) {
24742
24745
  var d2 = b2 - a2;
24743
24746
  return d2 ? linear(a2, d2) : constant$2(isNaN(a2) ? b2 : a2);
24744
24747
  }
24745
- const interpolateRgb = function rgbGamma(y2) {
24748
+ const interpolateRgb = (function rgbGamma(y2) {
24746
24749
  var color2 = gamma(y2);
24747
24750
  function rgb$1(start2, end) {
24748
24751
  var r2 = color2((start2 = rgb(start2)).r, (end = rgb(end)).r), g = color2(start2.g, end.g), b2 = color2(start2.b, end.b), opacity = nogamma(start2.opacity, end.opacity);
@@ -24751,7 +24754,7 @@ const interpolateRgb = function rgbGamma(y2) {
24751
24754
  };
24752
24755
  }
24753
24756
  return rgb$1.gamma = rgbGamma, rgb$1;
24754
- }(1);
24757
+ })(1);
24755
24758
  function numberArray(a2, b2) {
24756
24759
  b2 || (b2 = []);
24757
24760
  var n2 = a2 ? Math.min(b2.length, a2.length) : 0, c2 = b2.slice(), i2;
@@ -24884,7 +24887,7 @@ function sinh(x2) {
24884
24887
  function tanh(x2) {
24885
24888
  return ((x2 = Math.exp(2 * x2)) - 1) / (x2 + 1);
24886
24889
  }
24887
- const interpolateZoom = function zoomRho(rho, rho2, rho4) {
24890
+ const interpolateZoom = (function zoomRho(rho, rho2, rho4) {
24888
24891
  function zoom2(p0, p1) {
24889
24892
  var ux0 = p0[0], uy0 = p0[1], w0 = p0[2], ux1 = p1[0], uy1 = p1[1], w1 = p1[2], dx = ux1 - ux0, dy = uy1 - uy0, d2 = dx * dx + dy * dy, i2, S;
24890
24893
  if (d2 < epsilon2)
@@ -24912,7 +24915,7 @@ const interpolateZoom = function zoomRho(rho, rho2, rho4) {
24912
24915
  var _1 = Math.max(1e-3, +_), _2 = _1 * _1, _4 = _2 * _2;
24913
24916
  return zoomRho(_1, _2, _4);
24914
24917
  }, zoom2;
24915
- }(Math.SQRT2, 2, 4);
24918
+ })(Math.SQRT2, 2, 4);
24916
24919
  var frame = 0, timeout$1 = 0, interval = 0, pokeDelay = 1e3, taskHead, taskTail, clockLast = 0, clockNow = 0, clockSkew = 0, clock = typeof performance == "object" && performance.now ? performance : Date, setFrame = typeof window == "object" && window.requestAnimationFrame ? window.requestAnimationFrame.bind(window) : function(f2) {
24917
24920
  setTimeout(f2, 17);
24918
24921
  };
@@ -26087,7 +26090,7 @@ const getViewportForBounds = (bounds, width, height, minZoom, maxZoom, padding)
26087
26090
  };
26088
26091
  }, isMacOs = () => typeof navigator < "u" && navigator?.userAgent?.indexOf("Mac") >= 0;
26089
26092
  function isCoordinateExtent(extent) {
26090
- return extent !== void 0 && extent !== "parent";
26093
+ return extent != null && extent !== "parent";
26091
26094
  }
26092
26095
  function getNodeDimensions(node2) {
26093
26096
  return {
@@ -26739,8 +26742,8 @@ function XYDrag({ onNodeMouseDown, getStoreItems, onDragStart, onDrag, onDragSto
26739
26742
  continue;
26740
26743
  let nextPosition = { x: x2 - dragItem.distance.x, y: y2 - dragItem.distance.y };
26741
26744
  snapToGrid && (nextPosition = multiDragSnapOffset ? {
26742
- x: nextPosition.x + multiDragSnapOffset.x,
26743
- y: nextPosition.y + multiDragSnapOffset.y
26745
+ x: Math.round(nextPosition.x + multiDragSnapOffset.x),
26746
+ y: Math.round(nextPosition.y + multiDragSnapOffset.y)
26744
26747
  } : snapPosition(nextPosition, snapGrid));
26745
26748
  let adjustedNodeExtent = null;
26746
26749
  if (isMultiDrag && nodeExtent && !dragItem.extent && nodesBox) {
@@ -28727,13 +28730,13 @@ const ArrowSymbol = ({ color: color2 = "none", strokeWidth = 1 }) => {
28727
28730
  strokeWidth,
28728
28731
  ...color2 && { stroke: color2 }
28729
28732
  };
28730
- return jsx("polyline", { style: style2, strokeLinecap: "round", strokeLinejoin: "round", fill: "none", points: "-5,-4 0,0 -5,4" });
28733
+ return jsx("polyline", { className: "arrow", style: style2, strokeLinecap: "round", fill: "none", strokeLinejoin: "round", points: "-5,-4 0,0 -5,4" });
28731
28734
  }, ArrowClosedSymbol = ({ color: color2 = "none", strokeWidth = 1 }) => {
28732
28735
  const style2 = {
28733
28736
  strokeWidth,
28734
28737
  ...color2 && { stroke: color2, fill: color2 }
28735
28738
  };
28736
- return jsx("polyline", { style: style2, strokeLinecap: "round", strokeLinejoin: "round", points: "-5,-4 0,0 -5,4 -5,-4" });
28739
+ return jsx("polyline", { className: "arrowclosed", style: style2, strokeLinecap: "round", strokeLinejoin: "round", points: "-5,-4 0,0 -5,4 -5,-4" });
28737
28740
  }, MarkerSymbols = {
28738
28741
  [MarkerType.Arrow]: ArrowSymbol,
28739
28742
  [MarkerType.ArrowClosed]: ArrowClosedSymbol
@@ -30397,9 +30400,9 @@ function createIsCircular(areItemsEqual) {
30397
30400
  function getStrictProperties(object2) {
30398
30401
  return getOwnPropertyNames(object2).concat(getOwnPropertySymbols(object2));
30399
30402
  }
30400
- var hasOwn = Object.hasOwn || function(object2, property) {
30403
+ var hasOwn = Object.hasOwn || (function(object2, property) {
30401
30404
  return hasOwnProperty.call(object2, property);
30402
- };
30405
+ });
30403
30406
  function sameValueZeroEqual(a2, b2) {
30404
30407
  return a2 === b2 || !a2 && !b2 && a2 !== a2 && b2 !== b2;
30405
30408
  }
@@ -32042,7 +32045,7 @@ function bezierControlPoints(diagramEdge) {
32042
32045
  const handles = [
32043
32046
  // start
32044
32047
  ];
32045
- for (; hasAtLeast(bezierPoints, 3); ) {
32048
+ for (; i$8(bezierPoints, 3); ) {
32046
32049
  const [cp1, cp2, end, ...rest] = bezierPoints, bezier = new Bezier(start2[0], start2[1], cp1[0], cp1[1], cp2[0], cp2[1], end[0], end[1]), inflections = bezier.inflections();
32047
32050
  inflections.length === 0 && inflections.push(0.5), inflections.forEach((t2) => {
32048
32051
  const { x: x2, y: y2 } = bezier.get(t2);
@@ -32073,7 +32076,7 @@ function bezierPath(bezierSpline) {
32073
32076
  let [start2, ...points] = bezierSpline;
32074
32077
  invariant$2(start2, "start should be defined");
32075
32078
  let path = `M ${start2[0]},${start2[1]}`;
32076
- for (; hasAtLeast(points, 3); ) {
32079
+ for (; i$8(points, 3); ) {
32077
32080
  const [cp1, cp2, end, ...rest] = points;
32078
32081
  path = path + ` C ${cp1[0]},${cp1[1]} ${cp2[0]},${cp2[1]} ${end[0]},${end[1]}`, points = rest;
32079
32082
  }
@@ -32100,38 +32103,45 @@ const ZIndexes = {
32100
32103
  Edge: 20,
32101
32104
  Element: 20,
32102
32105
  Max: 30
32103
- }, MinZoom = 0.05, MaxZoom = 3, _setDimmed = (v, dimmed) => (v.data.dimmed ?? !1) === dimmed ? v : {
32104
- ...v,
32105
- data: {
32106
- ...v.data,
32107
- dimmed
32108
- }
32109
- };
32110
- function setDimmed(arg1, arg2) {
32111
- return arg2 !== void 0 ? _setDimmed(arg1, arg2) : (v) => _setDimmed(v, arg1);
32112
- }
32113
- const _setHovered = (v, hovered) => (v.data.hovered ?? !1) === hovered ? v : {
32114
- ...v,
32115
- data: {
32116
- ...v.data,
32117
- hovered
32106
+ }, MinZoom = 0.05, MaxZoom = 3;
32107
+ var Base;
32108
+ ((Base2) => {
32109
+ const _setDimmed = (v, dimmed) => (v.data.dimmed ?? !1) === dimmed ? v : {
32110
+ ...v,
32111
+ data: {
32112
+ ...v.data,
32113
+ dimmed
32114
+ }
32115
+ };
32116
+ function setDimmed(arg1, arg2) {
32117
+ return arg2 !== void 0 ? _setDimmed(arg1, arg2) : (v) => _setDimmed(v, arg1);
32118
32118
  }
32119
- };
32120
- function setHovered(arg1, arg2) {
32121
- return arg2 !== void 0 ? _setHovered(arg1, arg2) : (v) => _setHovered(v, arg1);
32122
- }
32123
- function _setData(value, state) {
32124
- return j(value.data, state) ? value : {
32125
- ...value,
32119
+ Base2.setDimmed = setDimmed;
32120
+ const _setHovered = (v, hovered) => (v.data.hovered ?? !1) === hovered ? v : {
32121
+ ...v,
32126
32122
  data: {
32127
- ...value.data,
32128
- ...state
32123
+ ...v.data,
32124
+ hovered
32129
32125
  }
32130
32126
  };
32131
- }
32132
- function setData(arg1, arg2) {
32133
- return arg2 !== void 0 ? _setData(arg1, arg2) : (edge) => _setData(edge, arg1);
32134
- }
32127
+ function setHovered(arg1, arg2) {
32128
+ return arg2 !== void 0 ? _setHovered(arg1, arg2) : (v) => _setHovered(v, arg1);
32129
+ }
32130
+ Base2.setHovered = setHovered;
32131
+ function _setData(value, state) {
32132
+ return j(value.data, state) ? value : {
32133
+ ...value,
32134
+ data: {
32135
+ ...value.data,
32136
+ ...state
32137
+ }
32138
+ };
32139
+ }
32140
+ function setData(arg1, arg2) {
32141
+ return arg2 !== void 0 ? _setData(arg1, arg2) : (edge) => _setData(edge, arg1);
32142
+ }
32143
+ Base2.setData = setData;
32144
+ })(Base || (Base = {}));
32135
32145
  const BaseXYFlow = ({
32136
32146
  nodes,
32137
32147
  edges,
@@ -32219,7 +32229,7 @@ const BaseXYFlow = ({
32219
32229
  node2.data.hovered || onNodesChange([{
32220
32230
  id: node2.id,
32221
32231
  type: "replace",
32222
- item: setHovered(node2, !0)
32232
+ item: Base.setHovered(node2, !0)
32223
32233
  }]);
32224
32234
  }),
32225
32235
  onNodeMouseLeave: useCallbackRef((_event, node2) => {
@@ -32230,7 +32240,7 @@ const BaseXYFlow = ({
32230
32240
  node2.data.hovered && onNodesChange([{
32231
32241
  id: node2.id,
32232
32242
  type: "replace",
32233
- item: setHovered(node2, !1)
32243
+ item: Base.setHovered(node2, !1)
32234
32244
  }]);
32235
32245
  }),
32236
32246
  onEdgeMouseEnter: useCallbackRef((_event, edge) => {
@@ -32241,7 +32251,7 @@ const BaseXYFlow = ({
32241
32251
  edge.data.hovered || onEdgesChange([{
32242
32252
  id: edge.id,
32243
32253
  type: "replace",
32244
- item: setHovered(edge, !0)
32254
+ item: Base.setHovered(edge, !0)
32245
32255
  }]);
32246
32256
  }),
32247
32257
  onEdgeMouseLeave: useCallbackRef((_event, edge) => {
@@ -32252,7 +32262,7 @@ const BaseXYFlow = ({
32252
32262
  edge.data.hovered && onEdgesChange([{
32253
32263
  id: edge.id,
32254
32264
  type: "replace",
32255
- item: setHovered(edge, !1)
32265
+ item: Base.setHovered(edge, !1)
32256
32266
  }]);
32257
32267
  }),
32258
32268
  onNodeDoubleClick: stopPropagation,
@@ -32589,9 +32599,9 @@ function requireRaiseB4a670a0_cjs() {
32589
32599
  }
32590
32600
  let executingCustomAction = !1;
32591
32601
  const $$ACTOR_TYPE = 1;
32592
- let ProcessingStatus = /* @__PURE__ */ function(ProcessingStatus2) {
32602
+ let ProcessingStatus = /* @__PURE__ */ (function(ProcessingStatus2) {
32593
32603
  return ProcessingStatus2[ProcessingStatus2.NotStarted = 0] = "NotStarted", ProcessingStatus2[ProcessingStatus2.Running = 1] = "Running", ProcessingStatus2[ProcessingStatus2.Stopped = 2] = "Stopped", ProcessingStatus2;
32594
- }({});
32604
+ })({});
32595
32605
  const defaultOptions2 = {
32596
32606
  clock: {
32597
32607
  setTimeout: (fn, ms) => setTimeout(fn, ms),
@@ -34779,9 +34789,9 @@ function requireLog63c8f21f_cjs() {
34779
34789
  }
34780
34790
  return emit3.type = "xstate.emit", emit3.event = eventOrExpr, emit3.resolve = resolveEmit, emit3.execute = executeEmit, emit3;
34781
34791
  }
34782
- let SpecialTargets = /* @__PURE__ */ function(SpecialTargets2) {
34792
+ let SpecialTargets = /* @__PURE__ */ (function(SpecialTargets2) {
34783
34793
  return SpecialTargets2.Parent = "#_parent", SpecialTargets2.Internal = "#_internal", SpecialTargets2;
34784
- }({});
34794
+ })({});
34785
34795
  function resolveSendTo(actorScope, snapshot, args, actionParams, {
34786
34796
  to,
34787
34797
  event: eventOrExpr,
@@ -35792,14 +35802,14 @@ CatmullRomOpen.prototype = {
35792
35802
  this._l01_a = this._l12_a, this._l12_a = this._l23_a, this._l01_2a = this._l12_2a, this._l12_2a = this._l23_2a, this._x0 = this._x1, this._x1 = this._x2, this._x2 = x2, this._y0 = this._y1, this._y1 = this._y2, this._y2 = y2;
35793
35803
  }
35794
35804
  };
35795
- const curveCatmullRomOpen = function custom4(alpha2) {
35805
+ const curveCatmullRomOpen = (function custom4(alpha2) {
35796
35806
  function catmullRom(context2) {
35797
35807
  return alpha2 ? new CatmullRomOpen(context2, alpha2) : new CardinalOpen(context2, 0);
35798
35808
  }
35799
35809
  return catmullRom.alpha = function(alpha3) {
35800
35810
  return custom4(+alpha3);
35801
35811
  }, catmullRom;
35802
- }(0.5), createRecipe = (name, defaultVariants, compoundVariants) => {
35812
+ })(0.5), createRecipe = (name, defaultVariants, compoundVariants) => {
35803
35813
  const getVariantProps2 = (variants) => ({
35804
35814
  [name]: "__ignore__",
35805
35815
  ...defaultVariants,
@@ -35970,11 +35980,16 @@ const curveCatmullRomOpen = function custom4(alpha2) {
35970
35980
  },
35971
35981
  getVariantProps: likec4tagFn.getVariantProps
35972
35982
  }), markdownBlockFn = /* @__PURE__ */ createRecipe("likec4-markdown-block", {
35973
- uselikec4palette: !1
35983
+ uselikec4palette: !1,
35984
+ value: "markdown"
35974
35985
  }, []), markdownBlockVariantMap = {
35975
35986
  uselikec4palette: [
35976
35987
  "true",
35977
35988
  "false"
35989
+ ],
35990
+ value: [
35991
+ "markdown",
35992
+ "plaintext"
35978
35993
  ]
35979
35994
  }, markdownBlockVariantKeys = Object.keys(markdownBlockVariantMap), markdownBlock = /* @__PURE__ */ Object.assign(memo$1(markdownBlockFn.recipeFn), {
35980
35995
  __recipe__: !0,
@@ -36458,7 +36473,7 @@ function EdgeContainer({
36458
36473
  "data-likec4-dimmed": isDimmed
36459
36474
  }
36460
36475
  };
36461
- return component === "svg" ? /* @__PURE__ */ jsx("svg", { style: style2, ...props2, children: children2 }) : (invariant$2(component === "g", 'EdgeContainer: component must be "g" or "svg"'), /* @__PURE__ */ jsx("g", { style: style2, ...props2, children: children2 }));
36476
+ return component === "svg" ? /* @__PURE__ */ jsx("svg", { style: style2, ...props2, children: children2 }) : (invariant$3(component === "g", 'EdgeContainer: component must be "g" or "svg"'), /* @__PURE__ */ jsx("g", { style: style2, ...props2, children: children2 }));
36462
36477
  }
36463
36478
  const EdgeLabel = forwardRef(({
36464
36479
  edgeProps: {
@@ -37491,7 +37506,8 @@ const MarkdownBlock = forwardRef(({
37491
37506
  ...props2,
37492
37507
  className: cx(
37493
37508
  markdownBlock({
37494
- uselikec4palette
37509
+ uselikec4palette,
37510
+ value: value.isMarkdown ? "markdown" : "plaintext"
37495
37511
  }),
37496
37512
  className
37497
37513
  ),
@@ -37551,7 +37567,7 @@ function ElementTitle({ id: id2, data, iconSize: iconSize2 }) {
37551
37567
  children: data.technology
37552
37568
  }
37553
37569
  ),
37554
- data.description?.nonEmpty && (data.description.isMarkdown ? /* @__PURE__ */ jsx(
37570
+ data.description?.nonEmpty && /* @__PURE__ */ jsx(
37555
37571
  MarkdownBlock,
37556
37572
  {
37557
37573
  className: cx(classes2.description, "likec4-element-description"),
@@ -37561,15 +37577,7 @@ function ElementTitle({ id: id2, data, iconSize: iconSize2 }) {
37561
37577
  maxHeight: data.description.isMarkdown ? "8rem" : void 0,
37562
37578
  lineClamp: isSmOrXs ? 3 : 5
37563
37579
  }
37564
- ) : /* @__PURE__ */ jsx(
37565
- Text,
37566
- {
37567
- component: "div",
37568
- className: cx(classes2.description, "likec4-element-description"),
37569
- lineClamp: isSmOrXs ? 3 : 5,
37570
- children: data.description.text
37571
- }
37572
- ))
37580
+ )
37573
37581
  ] })
37574
37582
  ]
37575
37583
  }
@@ -37882,7 +37890,7 @@ const curve = d3line().curve(curveCatmullRomOpen).x((d2) => d2.x).y((d2) => d2.y
37882
37890
  }
37883
37891
  }), buttons22;
37884
37892
  }, [enableNavigateTo, enableRelationshipBrowser, diagram, modelFqn, navigateTo, props2.id]);
37885
- return extraButtons && hasAtLeast(extraButtons, 1) && (buttons2 = [...buttons2, ...extraButtons]), /* @__PURE__ */ jsx(ElementActionButtons, { ...props2, buttons: buttons2 });
37893
+ return extraButtons && i$8(extraButtons, 1) && (buttons2 = [...buttons2, ...extraButtons]), /* @__PURE__ */ jsx(ElementActionButtons, { ...props2, buttons: buttons2 });
37886
37894
  }, DeploymentElementActions = ({
37887
37895
  extraButtons,
37888
37896
  ...props2
@@ -37904,7 +37912,7 @@ const curve = d3line().curve(curveCatmullRomOpen).x((d2) => d2.x).y((d2) => d2.y
37904
37912
  }
37905
37913
  }), buttons22;
37906
37914
  }, [enableNavigateTo, enableRelationshipBrowser, diagram, modelFqn, navigateTo, props2.id]);
37907
- return extraButtons && hasAtLeast(extraButtons, 1) && (buttons2 = [...buttons2, ...extraButtons]), /* @__PURE__ */ jsx(ElementActionButtons, { ...props2, buttons: buttons2 });
37915
+ return extraButtons && i$8(extraButtons, 1) && (buttons2 = [...buttons2, ...extraButtons]), /* @__PURE__ */ jsx(ElementActionButtons, { ...props2, buttons: buttons2 });
37908
37916
  }, {
37909
37917
  primary,
37910
37918
  secondary,
@@ -37930,7 +37938,7 @@ const curve = d3line().curve(curveCatmullRomOpen).x((d2) => d2.x).y((d2) => d2.y
37930
37938
  function useHandlers(target, props2) {
37931
37939
  const { onChange: triggerOnChange } = useDiagramEventHandlers(), diagram = useDiagram(), [originalColor, setOriginalColor] = useState(null), onColorPreview = useCallbackRef((color2) => {
37932
37940
  if (color2 === null) {
37933
- invariant$2(originalColor, "originalColor is null"), setOriginalColor(null), diagram.updateNodeData(props2.id, {
37941
+ invariant$3(originalColor, "originalColor is null"), setOriginalColor(null), diagram.updateNodeData(props2.id, {
37934
37942
  color: originalColor
37935
37943
  });
37936
37944
  return;
@@ -39628,7 +39636,7 @@ const selector$7 = (state) => ({
39628
39636
  ] })
39629
39637
  ]
39630
39638
  }
39631
- ) }), SectionHeader = styled("div", {
39639
+ ) }), SectionHeader$1 = styled("div", {
39632
39640
  base: {
39633
39641
  fontSize: "xs",
39634
39642
  color: "mantine.colors.dimmed",
@@ -39693,12 +39701,12 @@ const selector$7 = (state) => ({
39693
39701
  ] })
39694
39702
  ] }),
39695
39703
  links.length > 0 && /* @__PURE__ */ jsxs("section", { className: hstack({ alignItems: "baseline" }), children: [
39696
- /* @__PURE__ */ jsx(SectionHeader, { children: "Links" }),
39704
+ /* @__PURE__ */ jsx(SectionHeader$1, { children: "Links" }),
39697
39705
  /* @__PURE__ */ jsx(HStack, { gap: "xs", flexWrap: "wrap", children: links.map((link, i2) => /* @__PURE__ */ jsx(Link, { value: link }, `${i2}-${link.url}`)) })
39698
39706
  ] }),
39699
39707
  description2.isEmpty && /* @__PURE__ */ jsx(Text, { component: "div", fw: 500, size: "xs", c: "dimmed", my: "md", style: { userSelect: "none" }, children: "No description" }),
39700
39708
  description2.nonEmpty && /* @__PURE__ */ jsxs("section", { children: [
39701
- /* @__PURE__ */ jsx(SectionHeader, { children: "Description" }),
39709
+ /* @__PURE__ */ jsx(SectionHeader$1, { children: "Description" }),
39702
39710
  /* @__PURE__ */ jsx(
39703
39711
  MarkdownBlock,
39704
39712
  {
@@ -39838,7 +39846,8 @@ const selector$7 = (state) => ({
39838
39846
  hasNext,
39839
39847
  hasPrevious,
39840
39848
  currentStep,
39841
- totalSteps
39849
+ totalSteps,
39850
+ notes
39842
39851
  } = useDiagramContext((s2) => {
39843
39852
  const currentStepIndex = s2.xyedges.findIndex((e2) => e2.id === s2.activeWalkthrough?.stepId);
39844
39853
  return {
@@ -39846,7 +39855,8 @@ const selector$7 = (state) => ({
39846
39855
  hasNext: currentStepIndex < s2.xyedges.length - 1,
39847
39856
  hasPrevious: currentStepIndex > 0,
39848
39857
  currentStep: currentStepIndex + 1,
39849
- totalSteps: s2.xyedges.length
39858
+ totalSteps: s2.xyedges.length,
39859
+ notes: s2.xyedges[currentStepIndex]?.data?.notes ?? RichText.EMPTY
39850
39860
  };
39851
39861
  });
39852
39862
  return /* @__PURE__ */ jsxs(AnimatePresence, { propagate: !0, children: [
@@ -39861,8 +39871,7 @@ const selector$7 = (state) => ({
39861
39871
  },
39862
39872
  rightSection: /* @__PURE__ */ jsx(IconPlayerStopFilled, { size: 10 }),
39863
39873
  children: "Stop"
39864
- },
39865
- "trigger-dynamic-walkthrough"
39874
+ }
39866
39875
  ),
39867
39876
  /* @__PURE__ */ jsx(
39868
39877
  PrevNextButton,
@@ -40456,7 +40465,7 @@ function FolderColumnItem({ columnItem, ...props2 }) {
40456
40465
  columnItem.viewId
40457
40466
  );
40458
40467
  default:
40459
- nonexhaustive(columnItem);
40468
+ nonexhaustive$1(columnItem);
40460
40469
  }
40461
40470
  }
40462
40471
  function SearchInput({ onKeyDown, ...props2 }) {
@@ -40522,7 +40531,297 @@ function SearchInput({ onKeyDown, ...props2 }) {
40522
40531
  }
40523
40532
  );
40524
40533
  }
40525
- const NavigationPanel = memo$2(() => {
40534
+ const backdropBlur$1 = "--_blur", backdropOpacity$1 = "--_opacity", level = "--_level", offset = "--_offset", inset = "--_inset", borderRadius = "--_border-radius", dialog$2 = css.raw({
40535
+ boxSizing: "border-box",
40536
+ margin: "0",
40537
+ position: "fixed",
40538
+ width: "100vw",
40539
+ height: "100vh",
40540
+ maxWidth: "100vw",
40541
+ maxHeight: "100vh",
40542
+ background: "mantine.colors.defaultBorder/50",
40543
+ shadow: "xl",
40544
+ border: "transparent",
40545
+ outline: "none",
40546
+ borderRadius: `var(${borderRadius})`,
40547
+ [backdropBlur$1]: "0px",
40548
+ [level]: "0",
40549
+ [offset]: "0px",
40550
+ [inset]: "calc((1 + var(--_level) * 0.75) * var(--_offset))",
40551
+ [backdropOpacity$1]: "0%",
40552
+ [borderRadius]: "0px",
40553
+ _backdrop: {
40554
+ cursor: "zoom-out"
40555
+ },
40556
+ inset: "0",
40557
+ padding: "0"
40558
+ }), body$1 = css.raw({
40559
+ position: "relative",
40560
+ containerName: "likec4-dialog",
40561
+ containerType: "size",
40562
+ border: "0 solid transparent",
40563
+ overflow: "hidden",
40564
+ width: "100%",
40565
+ height: "100%",
40566
+ background: "mantine.colors.body"
40567
+ }), overlay = sva({
40568
+ slots: ["dialog", "body"],
40569
+ base: {
40570
+ dialog: dialog$2,
40571
+ body: body$1
40572
+ },
40573
+ variants: {
40574
+ fullscreen: {
40575
+ false: {
40576
+ dialog: {
40577
+ sm: {
40578
+ inset: "[var(--_inset) var(--_inset) var(--_offset) var(--_inset)]",
40579
+ width: "calc(100vw - 2 * var(--_inset))",
40580
+ height: "calc(100vh - var(--_offset) - var(--_inset))",
40581
+ [borderRadius]: "6px",
40582
+ padding: "1.5",
40583
+ // 6px
40584
+ [offset]: "1rem"
40585
+ },
40586
+ md: {
40587
+ [offset]: "1rem"
40588
+ },
40589
+ lg: {
40590
+ [offset]: "2rem"
40591
+ },
40592
+ xl: {
40593
+ [offset]: "4rem"
40594
+ }
40595
+ },
40596
+ body: {
40597
+ sm: {
40598
+ borderRadius: `calc(var(${borderRadius}) - 2px)`
40599
+ }
40600
+ }
40601
+ },
40602
+ true: {
40603
+ dialog: {
40604
+ inset: "0",
40605
+ padding: "0"
40606
+ }
40607
+ }
40608
+ },
40609
+ // transparent: {
40610
+ // false: {
40611
+ // },
40612
+ // true: {
40613
+ // dialog: {
40614
+ // background: 'transparent',
40615
+ // },
40616
+ // },
40617
+ // },
40618
+ withBackdrop: {
40619
+ false: {
40620
+ dialog: {
40621
+ _backdrop: {
40622
+ display: "none"
40623
+ }
40624
+ }
40625
+ },
40626
+ true: {
40627
+ dialog: {
40628
+ _backdrop: {
40629
+ backdropFilter: `blur(var(${backdropBlur$1}))`,
40630
+ backgroundColor: {
40631
+ _dark: `[rgb(34 34 34 / var(${backdropOpacity$1}))]`,
40632
+ _light: `[rgb(15 15 15/ var(${backdropOpacity$1}))]`
40633
+ }
40634
+ }
40635
+ }
40636
+ }
40637
+ }
40638
+ },
40639
+ defaultVariants: {
40640
+ fullscreen: !1,
40641
+ withBackdrop: !0
40642
+ }
40643
+ }), Overlay = forwardRef(({
40644
+ onClose,
40645
+ className,
40646
+ classes: classes2,
40647
+ overlayLevel = 0,
40648
+ children: children2,
40649
+ fullscreen = !1,
40650
+ withBackdrop = !0,
40651
+ backdrop,
40652
+ openDelay = 130,
40653
+ ...rest
40654
+ }, ref) => {
40655
+ const [opened, setOpened] = useState(openDelay === 0), focusTrapRef = useFocusTrap(opened), dialogRef = useRef(null), isClosingRef = useRef(!1), motionNotReduced = useReducedMotionConfig() !== !0, onCloseRef = useRef(onClose);
40656
+ onCloseRef.current = onClose;
40657
+ const close = useDebouncedCallback(
40658
+ () => {
40659
+ isClosingRef.current || (isClosingRef.current = !0, onCloseRef.current());
40660
+ },
40661
+ [],
40662
+ 50
40663
+ );
40664
+ useLayoutEffect$1(() => {
40665
+ dialogRef.current?.open || dialogRef.current?.showModal();
40666
+ }, []), useTimeoutEffect(() => {
40667
+ setOpened(!0);
40668
+ }, openDelay > 0 ? openDelay : void 0);
40669
+ const styles = overlay({
40670
+ fullscreen,
40671
+ withBackdrop
40672
+ });
40673
+ let targetBackdropOpacity = overlayLevel > 0 ? "50%" : "60%";
40674
+ return backdrop?.opacity !== void 0 && (targetBackdropOpacity = `${backdrop.opacity * 100}%`), /* @__PURE__ */ jsx(
40675
+ m$4.dialog,
40676
+ {
40677
+ ref: useMergedRef(
40678
+ dialogRef,
40679
+ focusTrapRef,
40680
+ ref
40681
+ ),
40682
+ className: cx(
40683
+ classes2?.dialog,
40684
+ className,
40685
+ styles.dialog,
40686
+ fullscreen && RemoveScroll.classNames.fullWidth
40687
+ ),
40688
+ layout: !0,
40689
+ style: {
40690
+ // @ts-ignore
40691
+ [level]: overlayLevel
40692
+ },
40693
+ ...motionNotReduced ? {
40694
+ initial: {
40695
+ [backdropBlur$1]: "0px",
40696
+ [backdropOpacity$1]: "0%",
40697
+ scale: 0.95,
40698
+ originY: 0,
40699
+ translateY: -20,
40700
+ opacity: 0
40701
+ },
40702
+ animate: {
40703
+ [backdropBlur$1]: overlayLevel > 0 ? "4px" : "8px",
40704
+ [backdropOpacity$1]: targetBackdropOpacity,
40705
+ scale: 1,
40706
+ opacity: 1,
40707
+ translateY: 0,
40708
+ transition: {
40709
+ delay: 0.075
40710
+ }
40711
+ },
40712
+ exit: {
40713
+ opacity: 0,
40714
+ scale: 0.98,
40715
+ translateY: -20,
40716
+ transition: {
40717
+ duration: 0.1
40718
+ },
40719
+ [backdropBlur$1]: "0px",
40720
+ [backdropOpacity$1]: "0%"
40721
+ }
40722
+ } : {
40723
+ initial: {
40724
+ [backdropBlur$1]: "8px",
40725
+ [backdropOpacity$1]: targetBackdropOpacity
40726
+ }
40727
+ },
40728
+ onClick: (e2) => {
40729
+ if (e2.stopPropagation(), e2.target?.nodeName?.toUpperCase() === "DIALOG") {
40730
+ dialogRef.current?.close();
40731
+ return;
40732
+ }
40733
+ },
40734
+ onCancel: (e2) => {
40735
+ e2.preventDefault(), e2.stopPropagation(), close();
40736
+ },
40737
+ onDoubleClick: stopPropagation,
40738
+ onPointerDown: stopPropagation,
40739
+ onClose: (e2) => {
40740
+ e2.stopPropagation(), close();
40741
+ },
40742
+ ...rest,
40743
+ children: /* @__PURE__ */ jsx(RemoveScroll, { forwardProps: !0, children: /* @__PURE__ */ jsx(
40744
+ "div",
40745
+ {
40746
+ className: cx(
40747
+ classes2?.body,
40748
+ styles.body,
40749
+ "overlay-body"
40750
+ ),
40751
+ children: opened && /* @__PURE__ */ jsx(Fragment$1, { children: children2 })
40752
+ }
40753
+ ) })
40754
+ }
40755
+ );
40756
+ });
40757
+ Overlay.displayName = "Overlay";
40758
+ const SectionHeader = styled("div", {
40759
+ base: {
40760
+ fontSize: "xs",
40761
+ color: "mantine.colors.dimmed",
40762
+ fontWeight: 500,
40763
+ userSelect: "none",
40764
+ mb: "xxs"
40765
+ }
40766
+ });
40767
+ function selectWalkthroughNotes(s2) {
40768
+ const isActive = n(s2.activeWalkthrough), activeStepIndex = isActive ? s2.xyedges.findIndex((e2) => e2.id === s2.activeWalkthrough?.stepId) : -1;
40769
+ return {
40770
+ isActive,
40771
+ isParallel: isActive && n$5(s2.activeWalkthrough?.parallelPrefix),
40772
+ hasNext: isActive && activeStepIndex < s2.xyedges.length - 1,
40773
+ hasPrevious: isActive && activeStepIndex > 0,
40774
+ notes: isActive ? s2.xyedges[activeStepIndex]?.data?.notes ?? RichText.EMPTY : null
40775
+ };
40776
+ }
40777
+ const WalkthroughPanel = () => {
40778
+ const { notes } = useDiagramContext(selectWalkthroughNotes);
40779
+ return !notes || notes.isEmpty ? null : /* @__PURE__ */ jsx(styled.div, { position: "relative", children: /* @__PURE__ */ jsxs(
40780
+ ScrollAreaAutosize,
40781
+ {
40782
+ className: cx(
40783
+ "nowheel nopan nodrag",
40784
+ vstack({
40785
+ position: "absolute",
40786
+ layerStyle: "likec4.dropdown",
40787
+ gap: "sm",
40788
+ padding: "md",
40789
+ paddingTop: "xxs",
40790
+ pointerEvents: "all",
40791
+ maxWidth: "calc(100cqw - 32px)",
40792
+ minWidth: "calc(100cqw - 50px)",
40793
+ maxHeight: "calc(100cqh - 100px)",
40794
+ width: "max-content",
40795
+ cursor: "default",
40796
+ overflow: "auto",
40797
+ overscrollBehavior: "contain",
40798
+ "@/sm": {
40799
+ minWidth: 400,
40800
+ maxWidth: 550
40801
+ },
40802
+ "@/lg": {
40803
+ maxWidth: 700
40804
+ }
40805
+ })
40806
+ ),
40807
+ type: "scroll",
40808
+ children: [
40809
+ /* @__PURE__ */ jsx(SectionHeader, { children: "Notes" }),
40810
+ /* @__PURE__ */ jsx(
40811
+ MarkdownBlock,
40812
+ {
40813
+ value: notes,
40814
+ fontSize: "sm",
40815
+ emptyText: "No description",
40816
+ className: css({
40817
+ userSelect: "all"
40818
+ })
40819
+ }
40820
+ )
40821
+ ]
40822
+ }
40823
+ ) });
40824
+ }, NavigationPanel = memo$2(() => {
40526
40825
  const diagramActor = useDiagramActorRef(), viewModel = useCurrentViewModel(), { portalProps } = useMantinePortalProps(), actorRef = xstateReact_cjsExports.useActorRef(
40527
40826
  navigationPanelActorLogic,
40528
40827
  {
@@ -40566,7 +40865,8 @@ const NavigationPanel = memo$2(() => {
40566
40865
  },
40567
40866
  children: /* @__PURE__ */ jsxs(NavigationPanelActorContextProvider, { value: actorRef, children: [
40568
40867
  /* @__PURE__ */ jsx(NavigationPanelImpl, { actor: actorRef }),
40569
- /* @__PURE__ */ jsx(EditorPanel, {})
40868
+ /* @__PURE__ */ jsx(EditorPanel, {}),
40869
+ /* @__PURE__ */ jsx(WalkthroughPanel, {})
40570
40870
  ] })
40571
40871
  }
40572
40872
  ) });
@@ -40749,7 +41049,7 @@ function useLikeC4ElementsTree(viewId) {
40749
41049
  const model = useLikeC4Model$1();
40750
41050
  return useMemo(() => viewId ? [...model.view(viewId).roots()].map(buildNode).sort(sortByLabel) : [...model.roots()].map(buildNode).sort(sortByLabel), [model, viewId ?? null]);
40751
41051
  }
40752
- const backdropBlur$1 = "--_blur", backdropOpacity$1 = "--_opacity", dialog$2 = css({
41052
+ const backdropBlur = "--_blur", backdropOpacity = "--_opacity", dialog$1 = css({
40753
41053
  boxSizing: "border-box",
40754
41054
  margin: "0",
40755
41055
  padding: "0",
@@ -40764,8 +41064,8 @@ const backdropBlur$1 = "--_blur", backdropOpacity$1 = "--_opacity", dialog$2 = c
40764
41064
  _backdrop: {
40765
41065
  // WebkitBackdropFilter: `blur(${backdropBlur})`,
40766
41066
  backdropFilter: "auto",
40767
- backdropBlur: `var(${backdropBlur$1})`,
40768
- backgroundColor: `[rgb(36 36 36 / var(${backdropOpacity$1}, 5%))]`
41067
+ backdropBlur: `var(${backdropBlur})`,
41068
+ backgroundColor: `[rgb(36 36 36 / var(${backdropOpacity}, 5%))]`
40769
41069
  }
40770
41070
  }), card$2 = css({
40771
41071
  position: "absolute",
@@ -43977,7 +44277,7 @@ function layoutRelationshipsView$1(data, scope) {
43977
44277
  y: position.y,
43978
44278
  position: [position.x, position.y],
43979
44279
  title: "empty node",
43980
- description: RichText.EMPTY,
44280
+ description: RichText$1.EMPTY,
43981
44281
  technology: null,
43982
44282
  tags: [],
43983
44283
  links: [],
@@ -44016,7 +44316,7 @@ function layoutRelationshipsView$1(data, scope) {
44016
44316
  y: position.y,
44017
44317
  position: [position.x, position.y],
44018
44318
  title: element.title,
44019
- description: RichText.from(element.description),
44319
+ description: RichText$1.from(element.description),
44020
44320
  technology: element.technology,
44021
44321
  tags: [...element.tags],
44022
44322
  links: null,
@@ -44071,7 +44371,7 @@ function layoutRelationshipsView$1(data, scope) {
44071
44371
  relations,
44072
44372
  sourceHandle,
44073
44373
  targetHandle
44074
- } = nonNullable(f(edges, (e22) => e22.name === ename)), onlyRelation = t$6(relations), label2 = onlyRelation?.title ?? "untitled", isMultiple = relations.length > 1, navigateTo = t$6(i$9(relations.flatMap((r2) => r2.navigateTo?.id ? r2.navigateTo.id : [])));
44374
+ } = nonNullable$1(f(edges, (e22) => e22.name === ename)), onlyRelation = t$6(relations), label2 = onlyRelation?.title ?? "untitled", isMultiple = relations.length > 1, navigateTo = t$6(i$9(relations.flatMap((r2) => r2.navigateTo?.id ? r2.navigateTo.id : [])));
44075
44375
  return acc.push({
44076
44376
  id: name,
44077
44377
  sourceFqn,
@@ -44899,19 +45199,19 @@ function ElementDetailsCard({
44899
45199
  m$4.dialog,
44900
45200
  {
44901
45201
  ref,
44902
- className: cx(dialog$2, RemoveScroll.classNames.fullWidth),
45202
+ className: cx(dialog$1, RemoveScroll.classNames.fullWidth),
44903
45203
  layout: !0,
44904
45204
  initial: {
44905
- [backdropBlur$1]: "0px",
44906
- [backdropOpacity$1]: "5%"
45205
+ [backdropBlur]: "0px",
45206
+ [backdropOpacity]: "5%"
44907
45207
  },
44908
45208
  animate: {
44909
- [backdropBlur$1]: "3px",
44910
- [backdropOpacity$1]: "60%"
45209
+ [backdropBlur]: "3px",
45210
+ [backdropOpacity]: "60%"
44911
45211
  },
44912
45212
  exit: {
44913
- [backdropBlur$1]: "0px",
44914
- [backdropOpacity$1]: "0%",
45213
+ [backdropBlur]: "0px",
45214
+ [backdropOpacity]: "0%",
44915
45215
  transition: {
44916
45216
  duration: 0.1
44917
45217
  }
@@ -45321,230 +45621,6 @@ function ElementDetails({
45321
45621
  }
45322
45622
  ) });
45323
45623
  }
45324
- const backdropBlur = "--_blur", backdropOpacity = "--_opacity", level = "--_level", offset = "--_offset", inset = "--_inset", borderRadius = "--_border-radius", dialog$1 = css.raw({
45325
- boxSizing: "border-box",
45326
- margin: "0",
45327
- position: "fixed",
45328
- width: "100vw",
45329
- height: "100vh",
45330
- maxWidth: "100vw",
45331
- maxHeight: "100vh",
45332
- background: "mantine.colors.defaultBorder/50",
45333
- shadow: "xl",
45334
- border: "transparent",
45335
- outline: "none",
45336
- borderRadius: `var(${borderRadius})`,
45337
- [backdropBlur]: "0px",
45338
- [level]: "0",
45339
- [offset]: "0px",
45340
- [inset]: "calc((1 + var(--_level) * 0.75) * var(--_offset))",
45341
- [backdropOpacity]: "0%",
45342
- [borderRadius]: "0px",
45343
- _backdrop: {
45344
- cursor: "zoom-out"
45345
- },
45346
- inset: "0",
45347
- padding: "0"
45348
- }), body$1 = css.raw({
45349
- position: "relative",
45350
- containerName: "likec4-dialog",
45351
- containerType: "size",
45352
- border: "0 solid transparent",
45353
- overflow: "hidden",
45354
- width: "100%",
45355
- height: "100%",
45356
- background: "mantine.colors.body"
45357
- }), overlay = sva({
45358
- slots: ["dialog", "body"],
45359
- base: {
45360
- dialog: dialog$1,
45361
- body: body$1
45362
- },
45363
- variants: {
45364
- fullscreen: {
45365
- false: {
45366
- dialog: {
45367
- sm: {
45368
- inset: "[var(--_inset) var(--_inset) var(--_offset) var(--_inset)]",
45369
- width: "calc(100vw - 2 * var(--_inset))",
45370
- height: "calc(100vh - var(--_offset) - var(--_inset))",
45371
- [borderRadius]: "6px",
45372
- padding: "1.5",
45373
- // 6px
45374
- [offset]: "1rem"
45375
- },
45376
- md: {
45377
- [offset]: "1rem"
45378
- },
45379
- lg: {
45380
- [offset]: "2rem"
45381
- },
45382
- xl: {
45383
- [offset]: "4rem"
45384
- }
45385
- },
45386
- body: {
45387
- sm: {
45388
- borderRadius: `calc(var(${borderRadius}) - 2px)`
45389
- }
45390
- }
45391
- },
45392
- true: {
45393
- dialog: {
45394
- inset: "0",
45395
- padding: "0"
45396
- }
45397
- }
45398
- },
45399
- // transparent: {
45400
- // false: {
45401
- // },
45402
- // true: {
45403
- // dialog: {
45404
- // background: 'transparent',
45405
- // },
45406
- // },
45407
- // },
45408
- withBackdrop: {
45409
- false: {
45410
- dialog: {
45411
- _backdrop: {
45412
- display: "none"
45413
- }
45414
- }
45415
- },
45416
- true: {
45417
- dialog: {
45418
- _backdrop: {
45419
- backdropFilter: `blur(var(${backdropBlur}))`,
45420
- backgroundColor: {
45421
- _dark: `[rgb(34 34 34 / var(${backdropOpacity}))]`,
45422
- _light: `[rgb(15 15 15/ var(${backdropOpacity}))]`
45423
- }
45424
- }
45425
- }
45426
- }
45427
- }
45428
- },
45429
- defaultVariants: {
45430
- fullscreen: !1,
45431
- withBackdrop: !0
45432
- }
45433
- }), Overlay = forwardRef(({
45434
- onClose,
45435
- className,
45436
- classes: classes2,
45437
- overlayLevel = 0,
45438
- children: children2,
45439
- fullscreen = !1,
45440
- withBackdrop = !0,
45441
- backdrop,
45442
- openDelay = 130,
45443
- ...rest
45444
- }, ref) => {
45445
- const [opened, setOpened] = useState(openDelay === 0), focusTrapRef = useFocusTrap(opened), dialogRef = useRef(null), isClosingRef = useRef(!1), motionNotReduced = useReducedMotionConfig() !== !0, onCloseRef = useRef(onClose);
45446
- onCloseRef.current = onClose;
45447
- const close = useDebouncedCallback(
45448
- () => {
45449
- isClosingRef.current || (isClosingRef.current = !0, onCloseRef.current());
45450
- },
45451
- [],
45452
- 50
45453
- );
45454
- useLayoutEffect$1(() => {
45455
- dialogRef.current?.open || dialogRef.current?.showModal();
45456
- }, []), useTimeoutEffect(() => {
45457
- setOpened(!0);
45458
- }, openDelay > 0 ? openDelay : void 0);
45459
- const styles = overlay({
45460
- fullscreen,
45461
- withBackdrop
45462
- });
45463
- let targetBackdropOpacity = overlayLevel > 0 ? "50%" : "60%";
45464
- return backdrop?.opacity !== void 0 && (targetBackdropOpacity = `${backdrop.opacity * 100}%`), /* @__PURE__ */ jsx(
45465
- m$4.dialog,
45466
- {
45467
- ref: useMergedRef(
45468
- dialogRef,
45469
- focusTrapRef,
45470
- ref
45471
- ),
45472
- className: cx(
45473
- classes2?.dialog,
45474
- className,
45475
- styles.dialog,
45476
- fullscreen && RemoveScroll.classNames.fullWidth
45477
- ),
45478
- layout: !0,
45479
- style: {
45480
- // @ts-ignore
45481
- [level]: overlayLevel
45482
- },
45483
- ...motionNotReduced ? {
45484
- initial: {
45485
- [backdropBlur]: "0px",
45486
- [backdropOpacity]: "0%",
45487
- scale: 0.95,
45488
- originY: 0,
45489
- translateY: -20,
45490
- opacity: 0
45491
- },
45492
- animate: {
45493
- [backdropBlur]: overlayLevel > 0 ? "4px" : "8px",
45494
- [backdropOpacity]: targetBackdropOpacity,
45495
- scale: 1,
45496
- opacity: 1,
45497
- translateY: 0,
45498
- transition: {
45499
- delay: 0.075
45500
- }
45501
- },
45502
- exit: {
45503
- opacity: 0,
45504
- scale: 0.98,
45505
- translateY: -20,
45506
- transition: {
45507
- duration: 0.1
45508
- },
45509
- [backdropBlur]: "0px",
45510
- [backdropOpacity]: "0%"
45511
- }
45512
- } : {
45513
- initial: {
45514
- [backdropBlur]: "8px",
45515
- [backdropOpacity]: targetBackdropOpacity
45516
- }
45517
- },
45518
- onClick: (e2) => {
45519
- if (e2.stopPropagation(), e2.target?.nodeName?.toUpperCase() === "DIALOG") {
45520
- dialogRef.current?.close();
45521
- return;
45522
- }
45523
- },
45524
- onCancel: (e2) => {
45525
- e2.preventDefault(), e2.stopPropagation(), close();
45526
- },
45527
- onDoubleClick: stopPropagation,
45528
- onPointerDown: stopPropagation,
45529
- onClose: (e2) => {
45530
- e2.stopPropagation(), close();
45531
- },
45532
- ...rest,
45533
- children: /* @__PURE__ */ jsx(RemoveScroll, { forwardProps: !0, children: /* @__PURE__ */ jsx(
45534
- "div",
45535
- {
45536
- className: cx(
45537
- classes2?.body,
45538
- styles.body,
45539
- "overlay-body"
45540
- ),
45541
- children: opened && /* @__PURE__ */ jsx(Fragment$1, { children: children2 })
45542
- }
45543
- ) })
45544
- }
45545
- );
45546
- });
45547
- Overlay.displayName = "Overlay";
45548
45624
  const finalize = (elements, explicits) => elements.size > 2 && explicits.size !== elements.size ? new Set(sortParentsFirst([
45549
45625
  ...treeFromElements$1(elements).flatten(),
45550
45626
  ...explicits
@@ -45558,7 +45634,7 @@ function computeEdgeDetailsViewData(edges, view) {
45558
45634
  };
45559
45635
  for (const edgeId of edges) {
45560
45636
  const edge = view.findEdge(edgeId), _relationships = edge ? [...edge.relationships("model")] : [];
45561
- if (!edge || !hasAtLeast(_relationships, 1) || !edge.source.hasElement() || !edge.target.hasElement())
45637
+ if (!edge || !i$8(_relationships, 1) || !edge.source.hasElement() || !edge.target.hasElement())
45562
45638
  continue;
45563
45639
  const source = edge.source.element, target = edge.target.element;
45564
45640
  addExplicit(source, "source"), addExplicit(target, "target");
@@ -46243,7 +46319,7 @@ const selectSubject = (state) => ({
46243
46319
  const actor = useRelationshipDetailsActor(), subject = xstateReact_cjsExports.useSelector(actor, selectSubject, deepEqual), likec4model = useLikeC4Model$1(), view = likec4model.findView(subject.viewId) ?? null, data = useMemo(() => {
46244
46320
  let data2;
46245
46321
  if ("edgeId" in subject && n$5(subject.edgeId)) {
46246
- invariant$2(view, `view ${subject.viewId} not found`);
46322
+ invariant$3(view, `view ${subject.viewId} not found`);
46247
46323
  const edge = nonNullable(view.findEdge(subject.edgeId), `edge ${subject.edgeId} not found in ${subject.viewId}`);
46248
46324
  data2 = computeEdgeDetailsViewData([edge.id], view);
46249
46325
  } else if (subject.source && subject.target)
@@ -46344,7 +46420,7 @@ const selectSubject = (state) => ({
46344
46420
  if (!view || !view.isDiagram())
46345
46421
  return null;
46346
46422
  const edges = [...view.edges()];
46347
- let edge = "edgeId" in subject && n$5(subject.edgeId) ? edges.find((e2) => e2.id === subject.edgeId) : f(edges, (e2) => e2.source.element?.id === subject.source && e2.target.element?.id === subject.target) || f(edges, (e2) => (e2.source.element?.id === subject.source || isAncestor(e2.source.element?.id ?? "__", subject.source ?? "__")) && (e2.target.element?.id === subject.target || isAncestor(e2.target.element?.id ?? "__", subject.target ?? "__")));
46423
+ let edge = "edgeId" in subject && n$5(subject.edgeId) ? edges.find((e2) => e2.id === subject.edgeId) : f(edges, (e2) => e2.source.element?.id === subject.source && e2.target.element?.id === subject.target) || f(edges, (e2) => (e2.source.element?.id === subject.source || isAncestor$1(e2.source.element?.id ?? "__", subject.source ?? "__")) && (e2.target.element?.id === subject.target || isAncestor$1(e2.target.element?.id ?? "__", subject.target ?? "__")));
46348
46424
  return edge ? /* @__PURE__ */ jsx(TopLeftPanelInner, { edge: edge.$edge, view: view.$view }) : null;
46349
46425
  }), TopLeftPanelInner = ({ edge, view }) => {
46350
46426
  const browser = useRelationshipDetails(), edgeId = edge.id, [historyEdgeId, historyOps, { history, current }] = useStateHistory(edge.id);
@@ -47010,7 +47086,7 @@ function ElementTreeNode({ node: node2, elementProps, hasChildren, expanded }) {
47010
47086
  component: "div",
47011
47087
  highlight: searchTerms,
47012
47088
  className: cx(elementId, btn$1.descriptionColor),
47013
- children: nameFromFqn(element.id)
47089
+ children: nameFromFqn$1(element.id)
47014
47090
  }
47015
47091
  ) })
47016
47092
  ] }),
@@ -50353,7 +50429,7 @@ function viewToNodesEdge$1(opts) {
50353
50429
  break;
50354
50430
  }
50355
50431
  case isCompound: {
50356
- invariant$2(!!modelFqn, "ModelRef expected"), xynodes.push(
50432
+ invariant$3(!!modelFqn, "ModelRef expected"), xynodes.push(
50357
50433
  {
50358
50434
  ...base,
50359
50435
  type: "compound-element",
@@ -50383,7 +50459,7 @@ function viewToNodesEdge$1(opts) {
50383
50459
  break;
50384
50460
  }
50385
50461
  default:
50386
- invariant$2(!!modelFqn, "ModelRef expected"), xynodes.push(
50462
+ invariant$3(!!modelFqn, "ModelRef expected"), xynodes.push(
50387
50463
  {
50388
50464
  ...base,
50389
50465
  type: "element",
@@ -50415,7 +50491,7 @@ function viewToNodesEdge$1(opts) {
50415
50491
  id: edge.id,
50416
50492
  label: edge.label,
50417
50493
  technology: edge.technology,
50418
- notes: edge.notes,
50494
+ notes: RichText.from(edge.notes),
50419
50495
  navigateTo: edge.navigateTo,
50420
50496
  controlPoints: edge.controlPoints ?? null,
50421
50497
  labelBBox: edge.labelBBox ?? null,
@@ -50551,7 +50627,7 @@ function viewToNodesEdge(view) {
50551
50627
  break;
50552
50628
  }
50553
50629
  default:
50554
- invariant$2(fqn2, "Element should have either modelRef or deploymentRef"), xynodes.push(
50630
+ invariant$3(fqn2, "Element should have either modelRef or deploymentRef"), xynodes.push(
50555
50631
  {
50556
50632
  ...base,
50557
50633
  type: "element",
@@ -50635,7 +50711,7 @@ const findRootSubject = (nodes) => nodes.find(
50635
50711
  xynodes: updateNodes(nodes, next.xynodes),
50636
50712
  xyedges: updateEdges(edges, next.xyedges)
50637
50713
  };
50638
- }, parent = nonNullable(self2._parent);
50714
+ }, parent = nonNullable$1(self2._parent);
50639
50715
  let zoom2 = xyflow2.getZoom();
50640
50716
  const maxZoom = Math.max(zoom2, 1), nextviewport = getViewportForBounds(update.bounds, width, height, MinZoom, maxZoom, ViewPadding), nextSubjectNode = next.xynodes.find(
50641
50717
  (n2) => n2.type !== "empty" && n2.data.column === "subjects" && n2.data.fqn === subjectId
@@ -50679,7 +50755,7 @@ const findRootSubject = (nodes) => nodes.find(
50679
50755
  type: "update.xydata",
50680
50756
  xynodes: currentNodes,
50681
50757
  xyedges: []
50682
- }), await delay$1(120), next.xynodes = next.xynodes.map(setDimmed(!1)), signal.aborted || (await xyflow2.setCenter(currentSubjectCenter.x, currentSubjectCenter.y, { zoom: zoom2, duration: 300 }), await xyflow2.setCenter(nextSubjectCenter.x, nextSubjectCenter.y, { zoom: zoom2 })), updateXYData();
50758
+ }), await delay$1(120), next.xynodes = next.xynodes.map(Base.setDimmed(!1)), signal.aborted || (await xyflow2.setCenter(currentSubjectCenter.x, currentSubjectCenter.y, { zoom: zoom2, duration: 300 }), await xyflow2.setCenter(nextSubjectCenter.x, nextSubjectCenter.y, { zoom: zoom2 })), updateXYData();
50683
50759
  }), relationshipsBrowserLogic = xstate_cjsExports.setup({
50684
50760
  types: {
50685
50761
  context: {},
@@ -50872,10 +50948,10 @@ const findRootSubject = (nodes) => nodes.find(
50872
50948
  xstate_cjsExports.assign({
50873
50949
  xyedges: ({ context: context2, event }) => {
50874
50950
  const hasDimmed = context2.xyedges.some((edge) => edge.data.dimmed !== !1 || edge.selected);
50875
- return context2.xyedges.map((edge) => edge.id === event.edge.id ? setData(edge, {
50951
+ return context2.xyedges.map((edge) => edge.id === event.edge.id ? Base.setData(edge, {
50876
50952
  hovered: !0,
50877
50953
  dimmed: !1
50878
- }) : hasDimmed && !edge.selected ? setDimmed(edge, "immediate") : edge);
50954
+ }) : hasDimmed && !edge.selected ? Base.setDimmed(edge, "immediate") : edge);
50879
50955
  }
50880
50956
  }),
50881
50957
  xstate_cjsExports.cancel("undim.edges"),
@@ -50886,7 +50962,7 @@ const findRootSubject = (nodes) => nodes.find(
50886
50962
  "xyflow.edgeMouseLeave": {
50887
50963
  actions: [
50888
50964
  xstate_cjsExports.assign({
50889
- xyedges: ({ context: context2, event }) => context2.xyedges.map((edge) => edge.id === event.edge.id ? setHovered(edge, !1) : edge)
50965
+ xyedges: ({ context: context2, event }) => context2.xyedges.map((edge) => edge.id === event.edge.id ? Base.setHovered(edge, !1) : edge)
50890
50966
  }),
50891
50967
  xstate_cjsExports.cancel("dim.nonhovered.edges"),
50892
50968
  xstate_cjsExports.raise({ type: "undim.edges" }, { id: "undim.edges", delay: 400 })
@@ -50895,13 +50971,13 @@ const findRootSubject = (nodes) => nodes.find(
50895
50971
  "dim.nonhovered.edges": {
50896
50972
  actions: xstate_cjsExports.assign({
50897
50973
  xyedges: ({ context: context2 }) => context2.xyedges.map(
50898
- (edge) => edge.data.hovered ? edge : setDimmed(edge, edge.data.dimmed === "immediate" ? "immediate" : !0)
50974
+ (edge) => edge.data.hovered ? edge : Base.setDimmed(edge, edge.data.dimmed === "immediate" ? "immediate" : !0)
50899
50975
  )
50900
50976
  })
50901
50977
  },
50902
50978
  "undim.edges": {
50903
50979
  actions: xstate_cjsExports.assign({
50904
- xyedges: ({ context: context2 }) => context2.xyedges.map(setDimmed(!1))
50980
+ xyedges: ({ context: context2 }) => context2.xyedges.map(Base.setDimmed(!1))
50905
50981
  })
50906
50982
  },
50907
50983
  "xyflow.selectionChange": {
@@ -50918,9 +50994,9 @@ const findRootSubject = (nodes) => nodes.find(
50918
50994
  input: ({ context: context2 }) => ({
50919
50995
  subjectId: context2.subject,
50920
50996
  navigateFromNode: context2.navigateFromNode,
50921
- xyflow: nonNullable(context2.xyflow),
50922
- xystore: nonNullable(context2.xystore),
50923
- update: nonNullable(context2.layouted)
50997
+ xyflow: nonNullable$1(context2.xyflow),
50998
+ xystore: nonNullable$1(context2.xystore),
50999
+ update: nonNullable$1(context2.layouted)
50924
51000
  }),
50925
51001
  onDone: {
50926
51002
  target: "idle",
@@ -51145,7 +51221,7 @@ function layoutResultToXYFlow(layout2) {
51145
51221
  };
51146
51222
  }
51147
51223
  function inputToSubject(input2) {
51148
- return "edgeId" in input2 ? (invariant$2(t$3(input2.edgeId), "edgeId is required"), {
51224
+ return "edgeId" in input2 ? (invariant$3(t$3(input2.edgeId), "edgeId is required"), {
51149
51225
  edgeId: input2.edgeId
51150
51226
  }) : {
51151
51227
  source: input2.source,
@@ -51163,7 +51239,7 @@ const relationshipDetailsLogic = xstate_cjsExports.setup({
51163
51239
  let { duration, bounds } = params ?? {};
51164
51240
  duration ??= 450;
51165
51241
  const { xyflow: xyflow2, xystore } = context2;
51166
- invariant$2(xyflow2, "xyflow is not initialized"), invariant$2(xystore, "xystore is not initialized"), bounds ??= context2.bounds;
51242
+ invariant$3(xyflow2, "xyflow is not initialized"), invariant$3(xystore, "xystore is not initialized"), bounds ??= context2.bounds;
51167
51243
  const maxZoom = Math.max(xyflow2.getZoom(), 1);
51168
51244
  if (bounds) {
51169
51245
  const { width, height } = xystore.getState(), viewport = getViewportForBounds(bounds, width, height, MinZoom, maxZoom, 0.1);
@@ -51177,7 +51253,7 @@ const relationshipDetailsLogic = xstate_cjsExports.setup({
51177
51253
  });
51178
51254
  },
51179
51255
  "xyflow:updateNodeInternals": ({ context: context2 }) => {
51180
- invariant$2(context2.xystore, "xystore is not initialized");
51256
+ invariant$3(context2.xystore, "xystore is not initialized");
51181
51257
  const { domNode, updateNodeInternals: updateNodeInternals2 } = context2.xystore.getState(), nodeIds = new Set(context2.xyedges.flatMap((e2) => [e2.source, e2.target]));
51182
51258
  if (nodeIds.size === 0 || !domNode)
51183
51259
  return;
@@ -51276,10 +51352,10 @@ const relationshipDetailsLogic = xstate_cjsExports.setup({
51276
51352
  const hasDimmed = context2.xyedges.some(
51277
51353
  (edge) => edge.data.dimmed === !0 || edge.data.dimmed === "immediate"
51278
51354
  );
51279
- return context2.xyedges.map((edge) => edge.id === event.edge.id ? setData(edge, {
51355
+ return context2.xyedges.map((edge) => edge.id === event.edge.id ? Base.setData(edge, {
51280
51356
  hovered: !0,
51281
51357
  dimmed: !1
51282
- }) : hasDimmed && !edge.selected ? setDimmed(edge, "immediate") : edge);
51358
+ }) : hasDimmed && !edge.selected ? Base.setDimmed(edge, "immediate") : edge);
51283
51359
  }
51284
51360
  }),
51285
51361
  xstate_cjsExports.cancel("undim.edges"),
@@ -51290,7 +51366,7 @@ const relationshipDetailsLogic = xstate_cjsExports.setup({
51290
51366
  "xyflow.edgeMouseLeave": {
51291
51367
  actions: [
51292
51368
  xstate_cjsExports.assign({
51293
- xyedges: ({ context: context2, event }) => context2.xyedges.map((edge) => edge.id === event.edge.id ? setHovered(edge, !1) : edge)
51369
+ xyedges: ({ context: context2, event }) => context2.xyedges.map((edge) => edge.id === event.edge.id ? Base.setHovered(edge, !1) : edge)
51294
51370
  }),
51295
51371
  xstate_cjsExports.cancel("dim.nonhovered.edges"),
51296
51372
  xstate_cjsExports.raise({ type: "undim.edges" }, { id: "undim.edges", delay: 400 })
@@ -51298,14 +51374,14 @@ const relationshipDetailsLogic = xstate_cjsExports.setup({
51298
51374
  },
51299
51375
  "dim.nonhovered.edges": {
51300
51376
  actions: xstate_cjsExports.assign({
51301
- xyedges: ({ context: context2 }) => context2.xyedges.map((edge) => setDimmed(edge, edge.data.hovered !== !0))
51377
+ xyedges: ({ context: context2 }) => context2.xyedges.map((edge) => Base.setDimmed(edge, edge.data.hovered !== !0))
51302
51378
  })
51303
51379
  },
51304
51380
  "undim.edges": {
51305
51381
  actions: xstate_cjsExports.assign({
51306
51382
  xyedges: ({ context: context2 }) => context2.xyedges.some((edge) => edge.selected === !0) ? context2.xyedges.map(
51307
- (edge) => setDimmed(edge, edge.selected !== !0 ? edge.data.dimmed || "immediate" : !1)
51308
- ) : context2.xyedges.map(setDimmed(!1))
51383
+ (edge) => Base.setDimmed(edge, edge.selected !== !0 ? edge.data.dimmed || "immediate" : !1)
51384
+ ) : context2.xyedges.map(Base.setDimmed(!1))
51309
51385
  })
51310
51386
  },
51311
51387
  "xyflow.selectionChange": {
@@ -51848,7 +51924,7 @@ class GridAligner extends Aligner {
51848
51924
  Array.from(layout2.nodePositions),
51849
51925
  m$1(([id2, position]) => {
51850
51926
  const originalRect = originalRects.get(id2);
51851
- return invariant$2(originalRect, `Could not find original rect for node ${id2}`), [i$6(originalRect, ["x", "y"]), position];
51927
+ return invariant$3(originalRect, `Could not find original rect for node ${id2}`), [i$6(originalRect, ["x", "y"]), position];
51852
51928
  }),
51853
51929
  m$1(
51854
51930
  ([original, suggested]) => Math.abs(original[this.secondaryAxisCoord] - suggested[this.secondaryAxisCoord])
@@ -51860,7 +51936,7 @@ class GridAligner extends Aligner {
51860
51936
  }
51861
51937
  getGapsPositions(layer) {
51862
51938
  const result = [], { layout: layout2, nodes } = layer;
51863
- invariant$2(layout2, "Layout of the layer must be computed before calling getGapsPositions");
51939
+ invariant$3(layout2, "Layout of the layer must be computed before calling getGapsPositions");
51864
51940
  for (let i2 = 1; i2 < nodes.length; i2++) {
51865
51941
  const previousNode = nodes[i2 - 1], currentNode = nodes[i2], previousNodePosition = layout2.nodePositions.get(previousNode.id), currentNodePosition = layout2.nodePositions.get(currentNode.id);
51866
51942
  result.push(
@@ -51871,7 +51947,7 @@ class GridAligner extends Aligner {
51871
51947
  }
51872
51948
  getNodePositions(layer) {
51873
51949
  const result = [], { layout: layout2, nodes } = layer;
51874
- invariant$2(layout2, "Layout of the layer must be computed before calling getGapsPositions");
51950
+ invariant$3(layout2, "Layout of the layer must be computed before calling getGapsPositions");
51875
51951
  for (let i2 = 0; i2 < nodes.length; i2++) {
51876
51952
  const node2 = nodes[i2], nodePosition = layout2.nodePositions.get(node2.id);
51877
51953
  result.push(
@@ -52018,15 +52094,15 @@ function focusNodesEdges(params) {
52018
52094
  const { xynodes: _xynodes, xyedges: _xyedges, focusedNode } = params.context;
52019
52095
  if (!focusedNode)
52020
52096
  return {};
52021
- const focused = /* @__PURE__ */ new Set([focusedNode]), xyedges = _xyedges.map((edge) => edge.source === focusedNode || edge.target === focusedNode ? (focused.add(edge.source), focused.add(edge.target), setData(edge, {
52097
+ const focused = /* @__PURE__ */ new Set([focusedNode]), xyedges = _xyedges.map((edge) => edge.source === focusedNode || edge.target === focusedNode ? (focused.add(edge.source), focused.add(edge.target), Base.setData(edge, {
52022
52098
  dimmed: !1,
52023
52099
  active: !0
52024
- })) : setData(edge, {
52100
+ })) : Base.setData(edge, {
52025
52101
  dimmed: !0,
52026
52102
  active: !1
52027
52103
  }));
52028
52104
  return {
52029
- xynodes: _xynodes.map((n2) => setDimmed(n2, !focused.has(n2.id))),
52105
+ xynodes: _xynodes.map((n2) => Base.setDimmed(n2, !focused.has(n2.id))),
52030
52106
  xyedges
52031
52107
  };
52032
52108
  }
@@ -52107,7 +52183,7 @@ function navigateBack({ context: context2 }) {
52107
52183
  history
52108
52184
  }
52109
52185
  } = context2;
52110
- invariant$2(currentIndex > 0, "Cannot navigate back");
52186
+ invariant$3(currentIndex > 0, "Cannot navigate back");
52111
52187
  const stepCurrent = history[currentIndex], stepBack = history[currentIndex - 1];
52112
52188
  return {
52113
52189
  navigationHistory: {
@@ -52128,7 +52204,7 @@ function navigateForward({ context: context2 }) {
52128
52204
  history
52129
52205
  }
52130
52206
  } = context2;
52131
- invariant$2(currentIndex < history.length - 1, "Cannot navigate forward");
52207
+ invariant$3(currentIndex < history.length - 1, "Cannot navigate forward");
52132
52208
  const stepCurrent = history[currentIndex], stepForward = history[currentIndex + 1];
52133
52209
  return {
52134
52210
  navigationHistory: {
@@ -52213,14 +52289,14 @@ function updateActiveWalkthrough({ context: context2 }) {
52213
52289
  return {
52214
52290
  xyedges: context2.xyedges.map((edge) => {
52215
52291
  const active = stepId === edge.id || !!parallelPrefix && edge.id.startsWith(parallelPrefix);
52216
- return setData(edge, {
52292
+ return Base.setData(edge, {
52217
52293
  active,
52218
52294
  dimmed: !active
52219
52295
  });
52220
52296
  }),
52221
52297
  xynodes: context2.xynodes.map((node2) => {
52222
52298
  const dimmed = step.source !== node2.id && step.target !== node2.id;
52223
- return setDimmed(node2, dimmed);
52299
+ return Base.setDimmed(node2, dimmed);
52224
52300
  })
52225
52301
  };
52226
52302
  }
@@ -52483,7 +52559,7 @@ const _diagramMachine = xstate_cjsExports.setup({
52483
52559
  },
52484
52560
  "xyflow:setViewportCenter": ({ context: context2 }, params) => {
52485
52561
  const { x: x2, y: y2 } = params;
52486
- invariant$2(context2.xyflow, "xyflow is not initialized");
52562
+ invariant$3(context2.xyflow, "xyflow is not initialized");
52487
52563
  const zoom2 = context2.xyflow.getZoom();
52488
52564
  context2.xyflow.setCenter(Math.round(x2), Math.round(y2), { zoom: zoom2 });
52489
52565
  },
@@ -52574,16 +52650,16 @@ const _diagramMachine = xstate_cjsExports.setup({
52574
52650
  });
52575
52651
  }),
52576
52652
  onNodeMouseEnter: xstate_cjsExports.assign(({ context: context2 }, params) => ({
52577
- xynodes: context2.xynodes.map((n2) => n2.id === params.node.id ? setHovered(n2, !0) : n2)
52653
+ xynodes: context2.xynodes.map((n2) => n2.id === params.node.id ? Base.setHovered(n2, !0) : n2)
52578
52654
  })),
52579
52655
  onNodeMouseLeave: xstate_cjsExports.assign(({ context: context2 }, params) => ({
52580
- xynodes: context2.xynodes.map((n2) => n2.id === params.node.id ? setHovered(n2, !1) : n2)
52656
+ xynodes: context2.xynodes.map((n2) => n2.id === params.node.id ? Base.setHovered(n2, !1) : n2)
52581
52657
  })),
52582
52658
  onEdgeMouseEnter: xstate_cjsExports.enqueueActions(({ enqueue, context: context2, event }) => {
52583
52659
  xstate_cjsExports.assertEvent(event, "xyflow.edgeMouseEnter");
52584
52660
  let edge = event.edge;
52585
52661
  enqueue.assign({
52586
- xyedges: context2.xyedges.map((e2) => e2.id === event.edge.id ? (edge = setHovered(e2, !0), edge) : e2)
52662
+ xyedges: context2.xyedges.map((e2) => e2.id === event.edge.id ? (edge = Base.setHovered(e2, !0), edge) : e2)
52587
52663
  }), enqueue.emit({
52588
52664
  type: "edgeMouseEnter",
52589
52665
  edge,
@@ -52594,7 +52670,7 @@ const _diagramMachine = xstate_cjsExports.setup({
52594
52670
  xstate_cjsExports.assertEvent(event, "xyflow.edgeMouseLeave");
52595
52671
  let edge = event.edge;
52596
52672
  enqueue.assign({
52597
- xyedges: context2.xyedges.map((e2) => e2.id === event.edge.id ? (edge = setHovered(e2, !1), edge) : e2)
52673
+ xyedges: context2.xyedges.map((e2) => e2.id === event.edge.id ? (edge = Base.setHovered(e2, !1), edge) : e2)
52598
52674
  }), enqueue.emit({
52599
52675
  type: "edgeMouseLeave",
52600
52676
  edge,
@@ -52607,17 +52683,17 @@ const _diagramMachine = xstate_cjsExports.setup({
52607
52683
  return {
52608
52684
  xynodes: context2.xynodes.map((n2) => {
52609
52685
  const node2 = findDiagramNode(context2, n2.id);
52610
- return node2 && node2.notation === params.notation.title && node2.shape === params.notation.shape && node2.color === params.notation.color && kinds.includes(node2.kind) ? setDimmed(n2, !1) : setDimmed(n2, "immediate");
52686
+ return node2 && node2.notation === params.notation.title && node2.shape === params.notation.shape && node2.color === params.notation.color && kinds.includes(node2.kind) ? Base.setDimmed(n2, !1) : Base.setDimmed(n2, "immediate");
52611
52687
  }),
52612
- xyedges: context2.xyedges.map(setDimmed("immediate"))
52688
+ xyedges: context2.xyedges.map(Base.setDimmed("immediate"))
52613
52689
  };
52614
52690
  }),
52615
52691
  "tag.highlight": xstate_cjsExports.assign(({ context: context2, event }) => (xstate_cjsExports.assertEvent(event, "tag.highlight"), {
52616
- xynodes: context2.xynodes.map((n2) => n2.data.tags?.includes(event.tag) ? setDimmed(n2, !1) : setDimmed(n2, !0))
52692
+ xynodes: context2.xynodes.map((n2) => n2.data.tags?.includes(event.tag) ? Base.setDimmed(n2, !1) : Base.setDimmed(n2, !0))
52617
52693
  })),
52618
52694
  "undim everything": xstate_cjsExports.assign(({ context: context2 }) => ({
52619
- xynodes: context2.xynodes.map(setDimmed(!1)),
52620
- xyedges: context2.xyedges.map(setData({
52695
+ xynodes: context2.xynodes.map(Base.setDimmed(!1)),
52696
+ xyedges: context2.xyedges.map(Base.setData({
52621
52697
  dimmed: !1,
52622
52698
  active: !1
52623
52699
  }))
@@ -52625,14 +52701,14 @@ const _diagramMachine = xstate_cjsExports.setup({
52625
52701
  "update active walkthrough": xstate_cjsExports.assign(updateActiveWalkthrough),
52626
52702
  "emit: walkthroughStarted": xstate_cjsExports.emit(({ context: context2 }) => {
52627
52703
  const edge = context2.xyedges.find((x2) => x2.id === context2.activeWalkthrough?.stepId);
52628
- return invariant$2(edge, "Invalid walkthrough state"), {
52704
+ return invariant$3(edge, "Invalid walkthrough state"), {
52629
52705
  type: "walkthroughStarted",
52630
52706
  edge
52631
52707
  };
52632
52708
  }),
52633
52709
  "emit: walkthroughStep": xstate_cjsExports.emit(({ context: context2 }) => {
52634
52710
  const edge = context2.xyedges.find((x2) => x2.id === context2.activeWalkthrough?.stepId);
52635
- return invariant$2(edge, "Invalid walkthrough state"), {
52711
+ return invariant$3(edge, "Invalid walkthrough state"), {
52636
52712
  type: "walkthroughStep",
52637
52713
  edge
52638
52714
  };
@@ -53150,8 +53226,8 @@ const _diagramMachine = xstate_cjsExports.setup({
53150
53226
  },
53151
53227
  "xyflow.viewportMoved": {
53152
53228
  actions: xstate_cjsExports.assign({
53153
- viewportChangedManually: ({ event }) => event.manually,
53154
- viewport: ({ event }) => event.viewport
53229
+ viewportChangedManually: (({ event }) => event.manually),
53230
+ viewport: (({ event }) => event.viewport)
53155
53231
  })
53156
53232
  },
53157
53233
  "xyflow.edgeEditingStarted": {
@@ -53256,9 +53332,9 @@ function DiagramActorProvider({
53256
53332
  actors: {
53257
53333
  syncManualLayoutActorLogic: syncManualLayoutActorLogic.provide({
53258
53334
  actions: {
53259
- "trigger:OnChange": (_, params) => {
53335
+ "trigger:OnChange": ((_, params) => {
53260
53336
  handlersRef.current.onChange?.(params);
53261
- }
53337
+ })
53262
53338
  }
53263
53339
  })
53264
53340
  }
@@ -53974,7 +54050,7 @@ function buildDiagramTreeData(views, groupBy) {
53974
54050
  relativePath = "";
53975
54051
  break;
53976
54052
  default:
53977
- nonexhaustive(groupBy);
54053
+ nonexhaustive$1(groupBy);
53978
54054
  }
53979
54055
  const parent = findParent(relativePath);
53980
54056
  parent.children.push({
@@ -54653,7 +54729,7 @@ function treeFromElements(elements) {
54653
54729
  ), acc), new DefaultMap(() => []));
54654
54730
  return {
54655
54731
  sorted,
54656
- byId: (id2) => nonNullable(map2.get(id2), `Element not found by id: ${id2}`),
54732
+ byId: (id2) => nonNullable$1(map2.get(id2), `Element not found by id: ${id2}`),
54657
54733
  root: root2,
54658
54734
  parent: (el) => parents.get(el),
54659
54735
  children: (el) => children2.get(el)
@@ -55307,9 +55383,9 @@ const Panel = forwardRef((props2, ref) => createElement(PanelWithForwardedRef, {
55307
55383
  PanelWithForwardedRef.displayName = "Panel";
55308
55384
  Panel.displayName = "forwardRef(Panel)";
55309
55385
  let currentCursorStyle = null, prevRuleIndex = -1, styleElement = null;
55310
- function getCursorStyle(state, constraintFlags) {
55386
+ function getCursorStyle(state, constraintFlags, isPointerDown2) {
55387
+ const horizontalMin = (constraintFlags & EXCEEDED_HORIZONTAL_MIN) !== 0, horizontalMax = (constraintFlags & EXCEEDED_HORIZONTAL_MAX) !== 0, verticalMin = (constraintFlags & EXCEEDED_VERTICAL_MIN) !== 0, verticalMax = (constraintFlags & EXCEEDED_VERTICAL_MAX) !== 0;
55311
55388
  if (constraintFlags) {
55312
- const horizontalMin = (constraintFlags & EXCEEDED_HORIZONTAL_MIN) !== 0, horizontalMax = (constraintFlags & EXCEEDED_HORIZONTAL_MAX) !== 0, verticalMin = (constraintFlags & EXCEEDED_VERTICAL_MIN) !== 0, verticalMax = (constraintFlags & EXCEEDED_VERTICAL_MAX) !== 0;
55313
55389
  if (horizontalMin)
55314
55390
  return verticalMin ? "se-resize" : verticalMax ? "ne-resize" : "e-resize";
55315
55391
  if (horizontalMax)
@@ -55331,7 +55407,7 @@ function getCursorStyle(state, constraintFlags) {
55331
55407
  function resetGlobalCursorStyle() {
55332
55408
  styleElement !== null && (document.head.removeChild(styleElement), currentCursorStyle = null, styleElement = null, prevRuleIndex = -1);
55333
55409
  }
55334
- function setGlobalCursorStyle(state, constraintFlags) {
55410
+ function setGlobalCursorStyle(state, constraintFlags, isPointerDown2) {
55335
55411
  var _styleElement$sheet$i, _styleElement$sheet2;
55336
55412
  const style2 = getCursorStyle(state, constraintFlags);
55337
55413
  if (currentCursorStyle !== style2) {
@@ -55470,7 +55546,7 @@ function handlePointerDown(event) {
55470
55546
  target,
55471
55547
  x: x2,
55472
55548
  y: y2
55473
- }), updateListeners(), intersectingHandles.length > 0 && (updateResizeHandlerStates("down", event), event.preventDefault(), isWithinResizeHandle(target) || event.stopImmediatePropagation());
55549
+ }), updateListeners(), intersectingHandles.length > 0 && (updateResizeHandlerStates("down", event), updateCursor(), event.preventDefault(), isWithinResizeHandle(target) || event.stopImmediatePropagation());
55474
55550
  }
55475
55551
  function handlePointerMove(event) {
55476
55552
  const {
@@ -55719,7 +55795,7 @@ function adjustLayoutByDelta({
55719
55795
  panelIndex: index2,
55720
55796
  size: unsafeSize
55721
55797
  });
55722
- if (!fuzzyNumbersEqual(prevSize, safeSize) && (deltaApplied += prevSize - safeSize, nextLayout[index2] = safeSize, deltaApplied.toPrecision(3).localeCompare(Math.abs(delta).toPrecision(3), void 0, {
55798
+ if (!fuzzyNumbersEqual(prevSize, safeSize) && (deltaApplied += prevSize - safeSize, nextLayout[index2] = safeSize, deltaApplied.toFixed(3).localeCompare(Math.abs(delta).toFixed(3), void 0, {
55723
55799
  numeric: !0
55724
55800
  }) >= 0))
55725
55801
  break;
@@ -56024,7 +56100,7 @@ function computePanelFlexBoxStyle({
56024
56100
  }) {
56025
56101
  const size2 = layout2[panelIndex];
56026
56102
  let flexGrow;
56027
- return size2 == null ? flexGrow = defaultSize2 != null ? defaultSize2.toPrecision(precision) : "1" : panelData.length === 1 ? flexGrow = "1" : flexGrow = size2.toPrecision(precision), {
56103
+ return size2 == null ? flexGrow = defaultSize2 != null ? defaultSize2.toFixed(precision) : "1" : panelData.length === 1 ? flexGrow = "1" : flexGrow = size2.toFixed(precision), {
56028
56104
  flexBasis: 0,
56029
56105
  flexGrow,
56030
56106
  flexShrink: 1,