@uipath/apollo-react 4.32.1 → 4.33.0

package/dist/canvas/components/FloatingCanvasPanel/FloatingCanvasPanel.js

@@ -7,10 +7,12 @@ import { CanvasPortal } from "./CanvasPortal.js";
 import { PanelChrome } from "./PanelChrome.js";
 import { useFloatingPosition } from "./useFloatingPosition.js";
 const PANEL_BASE_CLASS = 'text-(--canvas-foreground) bg-(--canvas-background-raised) border border-(--canvas-border-de-emp) text-sm flex flex-col transition-opacity duration-200 ease-in-out';
+const PANEL_FLOATING_MAX_HEIGHT = 600;
+const PANEL_FLOATING_MIN_HEIGHT = 100;
 const PANEL_FLOATING_CLASS = 'rounded-lg shadow-[0_4px_16px_rgba(0,0,0,0.12)] w-auto min-w-[280px] max-w-none h-auto max-h-[600px]';
 const PANEL_PINNED_CLASS = 'rounded-none shadow-none w-[320px] min-w-[320px] max-w-[320px] h-screen max-h-screen';
-function FloatingCanvasPanel({ open = true, nodeId, anchorRect, placement = 'right-start', offset = 20, fallbackPlacement, isPinned = false, useFixedPosition = false, portalToBody = false, title, header, headerActions, children, onClose, scrollKey, onMouseEnter, onMouseLeave }) {
-    const { computedAnchor, floatingStyles, refs, mergedReferenceRef } = useFloatingPosition({
+function FloatingCanvasPanel({ open = true, nodeId, anchorRect, placement = 'right-start', offset = 20, fallbackPlacement, isPinned = false, useFixedPosition = false, portalToBody = false, title, header, headerActions, children, onClose, scrollKey, scrollableContent = true, onMouseEnter, onMouseLeave }) {
+    const { computedAnchor, floatingStyles, availableHeight, refs, mergedReferenceRef } = useFloatingPosition({
         open,
         nodeId,
         anchorRect,
@@ -21,6 +23,19 @@ function FloatingCanvasPanel({ open = true, nodeId, anchorRect, placement = 'rig
     const panelClassName = useMemo(()=>cn(PANEL_BASE_CLASS, isPinned ? PANEL_PINNED_CLASS : PANEL_FLOATING_CLASS), [
         isPinned
     ]);
+    const sizingStyle = useMemo(()=>{
+        if (isPinned || null == availableHeight) return {};
+        const maxHeight = Math.min(PANEL_FLOATING_MAX_HEIGHT, availableHeight);
+        const occupiedHeight = Math.max(PANEL_FLOATING_MIN_HEIGHT, maxHeight);
+        return {
+            maxHeight: `${maxHeight}px`,
+            minHeight: `${PANEL_FLOATING_MIN_HEIGHT}px`,
+            ['--floating-available-height']: `${occupiedHeight}px`
+        };
+    }, [
+        isPinned,
+        availableHeight
+    ]);
     if (!open || !computedAnchor) return null;
     if (useFixedPosition && anchorRect) {
         const getScreenSpacePosition = ()=>{
@@ -72,6 +87,7 @@ function FloatingCanvasPanel({ open = true, nodeId, anchorRect, placement = 'rig
             style: {
                 position: 'fixed',
                 ...screenPosition,
+                ...sizingStyle,
                 zIndex: 1100,
                 pointerEvents: 'auto'
             },
@@ -81,6 +97,7 @@ function FloatingCanvasPanel({ open = true, nodeId, anchorRect, placement = 'rig
                 headerActions: headerActions,
                 onClose: onClose,
                 scrollKey: scrollKey,
+                scrollableContent: scrollableContent,
                 children: children
             })
         });
@@ -95,6 +112,7 @@ function FloatingCanvasPanel({ open = true, nodeId, anchorRect, placement = 'rig
         onPointerLeave: onMouseLeave,
         style: {
             ...isPinned ? {} : floatingStyles,
+            ...sizingStyle,
             position: isPinned ? 'fixed' : 'absolute',
             right: isPinned ? 0 : void 0,
             top: isPinned ? 0 : void 0,
@@ -107,6 +125,7 @@ function FloatingCanvasPanel({ open = true, nodeId, anchorRect, placement = 'rig
             headerActions: headerActions,
             onClose: onClose,
             scrollKey: scrollKey,
+            scrollableContent: scrollableContent,
             children: children
         })
     });

package/dist/canvas/components/FloatingCanvasPanel/PanelChrome.cjs

@@ -51,7 +51,8 @@ const PanelHeader = styled_default().div`
 `;
 const PanelContent = styled_default().div`
   flex: 1;
-  overflow-y: auto;
+  min-height: 0;
+  overflow-y: ${(props)=>false === props.scrollable ? 'hidden' : 'auto'};
   overflow-x: hidden;
 
   &::-webkit-scrollbar {
@@ -72,7 +73,7 @@ const PanelContent = styled_default().div`
     }
   }
 `;
-function PanelChrome({ title, header, headerActions, children, onClose, scrollKey }) {
+function PanelChrome({ title, header, headerActions, children, onClose, scrollKey, scrollableContent = true }) {
     const contentRef = (0, external_react_namespaceObject.useRef)(null);
     (0, external_react_namespaceObject.useEffect)(()=>{
         if (contentRef.current && scrollKey) contentRef.current.scrollTop = 0;
@@ -114,6 +115,7 @@ function PanelChrome({ title, header, headerActions, children, onClose, scrollKe
             }),
             /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(PanelContent, {
                 ref: contentRef,
+                scrollable: scrollableContent,
                 children: children
             })
         ]

package/dist/canvas/components/FloatingCanvasPanel/PanelChrome.d.ts

@@ -6,6 +6,7 @@ export interface PanelChromeProps {
     children?: ReactNode;
     onClose?: () => void;
     scrollKey?: string;
+    scrollableContent?: boolean;
 }
-export declare function PanelChrome({ title, header, headerActions, children, onClose, scrollKey, }: PanelChromeProps): import("react/jsx-runtime").JSX.Element;
+export declare function PanelChrome({ title, header, headerActions, children, onClose, scrollKey, scrollableContent, }: PanelChromeProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=PanelChrome.d.ts.map

package/dist/canvas/components/FloatingCanvasPanel/PanelChrome.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PanelChrome.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/FloatingCanvasPanel/PanelChrome.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAqCvC,MAAM,WAAW,gBAAgB;IAC/B,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,MAAM,EACN,aAAa,EACb,QAAQ,EACR,OAAO,EACP,SAAS,GACV,EAAE,gBAAgB,2CAqClB"}
+{"version":3,"file":"PanelChrome.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/FloatingCanvasPanel/PanelChrome.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAsCvC,MAAM,WAAW,gBAAgB;IAC/B,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B;AAED,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,MAAM,EACN,aAAa,EACb,QAAQ,EACR,OAAO,EACP,SAAS,EACT,iBAAwB,GACzB,EAAE,gBAAgB,2CAuClB"}

package/dist/canvas/components/FloatingCanvasPanel/PanelChrome.js

@@ -13,7 +13,8 @@ const PanelHeader = styled.div`
 `;
 const PanelContent = styled.div`
   flex: 1;
-  overflow-y: auto;
+  min-height: 0;
+  overflow-y: ${(props)=>false === props.scrollable ? 'hidden' : 'auto'};
   overflow-x: hidden;
 
   &::-webkit-scrollbar {
@@ -34,7 +35,7 @@ const PanelContent = styled.div`
     }
   }
 `;
-function PanelChrome({ title, header, headerActions, children, onClose, scrollKey }) {
+function PanelChrome({ title, header, headerActions, children, onClose, scrollKey, scrollableContent = true }) {
     const contentRef = useRef(null);
     useEffect(()=>{
         if (contentRef.current && scrollKey) contentRef.current.scrollTop = 0;
@@ -76,6 +77,7 @@ function PanelChrome({ title, header, headerActions, children, onClose, scrollKe
             }),
             /*#__PURE__*/ jsx(PanelContent, {
                 ref: contentRef,
+                scrollable: scrollableContent,
                 children: children
             })
         ]

package/dist/canvas/components/FloatingCanvasPanel/useFloatingPosition.cjs

@@ -29,9 +29,11 @@ __webpack_require__.d(__webpack_exports__, {
 const react_namespaceObject = require("@floating-ui/react");
 const react_cjs_namespaceObject = require("../../xyflow/react.cjs");
 const external_react_namespaceObject = require("react");
+const VIEWPORT_PADDING = 8;
 function useFloatingPosition({ open = true, nodeId, anchorRect, placement = 'right-start', offset: offsetValue = 20, fallbackPlacement = 'none' }) {
     const referenceRef = (0, external_react_namespaceObject.useRef)(null);
     const internalNode = (0, react_cjs_namespaceObject.useInternalNode)(nodeId || '');
+    const [availableHeight, setAvailableHeight] = (0, external_react_namespaceObject.useState)(null);
     const computedAnchor = (0, external_react_namespaceObject.useMemo)(()=>{
         if (anchorRect) return anchorRect;
         if (!internalNode) return null;
@@ -58,6 +60,16 @@ function useFloatingPosition({ open = true, nodeId, anchorRect, placement = 'rig
             (0, react_namespaceObject.offset)(offsetValue),
             (0, react_namespaceObject.flip)({
                 fallbackAxisSideDirection: fallbackPlacement
+            }),
+            (0, react_namespaceObject.shift)({
+                padding: VIEWPORT_PADDING
+            }),
+            (0, react_namespaceObject.size)({
+                padding: VIEWPORT_PADDING,
+                apply ({ availableHeight: ah }) {
+                    const next = Math.max(0, Math.floor(ah));
+                    setAvailableHeight((prev)=>prev === next ? prev : next);
+                }
             })
         ],
         whileElementsMounted: react_namespaceObject.autoUpdate
@@ -66,6 +78,11 @@ function useFloatingPosition({ open = true, nodeId, anchorRect, placement = 'rig
         refs.setReference,
         referenceRef
     ]);
+    (0, external_react_namespaceObject.useEffect)(()=>{
+        if (!open) setAvailableHeight(null);
+    }, [
+        open
+    ]);
     (0, external_react_namespaceObject.useEffect)(()=>{
         if (open) update();
     }, [
@@ -79,6 +96,7 @@ function useFloatingPosition({ open = true, nodeId, anchorRect, placement = 'rig
     return {
         computedAnchor,
         floatingStyles,
+        availableHeight,
         refs,
         mergedReferenceRef
     };

package/dist/canvas/components/FloatingCanvasPanel/useFloatingPosition.d.ts

@@ -17,6 +17,7 @@ export interface UseFloatingPositionOptions {
 export interface UseFloatingPositionReturn {
     computedAnchor: AnchorRect | null;
     floatingStyles: CSSProperties;
+    availableHeight: number | null;
     refs: {
         setReference: RefCallback<Element>;
         setFloating: RefCallback<HTMLElement>;

package/dist/canvas/components/FloatingCanvasPanel/useFloatingPosition.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useFloatingPosition.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/FloatingCanvasPanel/useFloatingPosition.ts"],"names":[],"mappings":"AAAA,OAAO,EAIL,KAAK,SAAS,EAGf,MAAM,oBAAoB,CAAC;AAE5B,OAAO,EAAE,KAAK,aAAa,EAAE,KAAK,WAAW,EAA8B,MAAM,OAAO,CAAC;AAEzF,MAAM,MAAM,UAAU,GAAG;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,CAAC;AAEjF,MAAM,WAAW,0BAA0B;IACzC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,iBAAiB,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,KAAK,CAAC;CAC9C;AAED,MAAM,WAAW,yBAAyB;IACxC,cAAc,EAAE,UAAU,GAAG,IAAI,CAAC;IAClC,cAAc,EAAE,aAAa,CAAC;IAC9B,IAAI,EAAE;QACJ,YAAY,EAAE,WAAW,CAAC,OAAO,CAAC,CAAC;QACnC,WAAW,EAAE,WAAW,CAAC,WAAW,CAAC,CAAC;KACvC,CAAC;IACF,kBAAkB,EAAE,CAAC,CAAC,QAAQ,EAAE,OAAO,GAAG,IAAI,KAAK,IAAI,CAAC,GAAG,IAAI,CAAC;CACjE;AAED,wBAAgB,mBAAmB,CAAC,EAClC,IAAW,EACX,MAAM,EACN,UAAU,EACV,SAAyB,EACzB,MAAM,EAAE,WAAgB,EACxB,iBAA0B,GAC3B,EAAE,0BAA0B,GAAG,yBAAyB,CA8CxD"}
+{"version":3,"file":"useFloatingPosition.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/FloatingCanvasPanel/useFloatingPosition.ts"],"names":[],"mappings":"AAAA,OAAO,EAIL,KAAK,SAAS,EAKf,MAAM,oBAAoB,CAAC;AAE5B,OAAO,EAAE,KAAK,aAAa,EAAE,KAAK,WAAW,EAAwC,MAAM,OAAO,CAAC;AAEnG,MAAM,MAAM,UAAU,GAAG;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,CAAC;AASjF,MAAM,WAAW,0BAA0B;IACzC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,iBAAiB,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,KAAK,CAAC;CAC9C;AAED,MAAM,WAAW,yBAAyB;IACxC,cAAc,EAAE,UAAU,GAAG,IAAI,CAAC;IAClC,cAAc,EAAE,aAAa,CAAC;IAC9B,eAAe,EAAE,MAAM,GAAG,IAAI,CAAC;IAC/B,IAAI,EAAE;QACJ,YAAY,EAAE,WAAW,CAAC,OAAO,CAAC,CAAC;QACnC,WAAW,EAAE,WAAW,CAAC,WAAW,CAAC,CAAC;KACvC,CAAC;IACF,kBAAkB,EAAE,CAAC,CAAC,QAAQ,EAAE,OAAO,GAAG,IAAI,KAAK,IAAI,CAAC,GAAG,IAAI,CAAC;CACjE;AAED,wBAAgB,mBAAmB,CAAC,EAClC,IAAW,EACX,MAAM,EACN,UAAU,EACV,SAAyB,EACzB,MAAM,EAAE,WAAgB,EACxB,iBAA0B,GAC3B,EAAE,0BAA0B,GAAG,yBAAyB,CAmExD"}

package/dist/canvas/components/FloatingCanvasPanel/useFloatingPosition.js

@@ -1,9 +1,11 @@
-import { autoUpdate, flip, offset, useFloating, useMergeRefs } from "@floating-ui/react";
+import { autoUpdate, flip, offset, shift, size, useFloating, useMergeRefs } from "@floating-ui/react";
 import { useInternalNode } from "../../xyflow/react.js";
-import { useEffect, useMemo, useRef } from "react";
+import { useEffect, useMemo, useRef, useState } from "react";
+const VIEWPORT_PADDING = 8;
 function useFloatingPosition({ open = true, nodeId, anchorRect, placement = 'right-start', offset: offsetValue = 20, fallbackPlacement = 'none' }) {
     const referenceRef = useRef(null);
     const internalNode = useInternalNode(nodeId || '');
+    const [availableHeight, setAvailableHeight] = useState(null);
     const computedAnchor = useMemo(()=>{
         if (anchorRect) return anchorRect;
         if (!internalNode) return null;
@@ -30,6 +32,16 @@ function useFloatingPosition({ open = true, nodeId, anchorRect, placement = 'rig
             offset(offsetValue),
             flip({
                 fallbackAxisSideDirection: fallbackPlacement
+            }),
+            shift({
+                padding: VIEWPORT_PADDING
+            }),
+            size({
+                padding: VIEWPORT_PADDING,
+                apply ({ availableHeight: ah }) {
+                    const next = Math.max(0, Math.floor(ah));
+                    setAvailableHeight((prev)=>prev === next ? prev : next);
+                }
             })
         ],
         whileElementsMounted: autoUpdate
@@ -38,6 +50,11 @@ function useFloatingPosition({ open = true, nodeId, anchorRect, placement = 'rig
         refs.setReference,
         referenceRef
     ]);
+    useEffect(()=>{
+        if (!open) setAvailableHeight(null);
+    }, [
+        open
+    ]);
     useEffect(()=>{
         if (open) update();
     }, [
@@ -51,6 +68,7 @@ function useFloatingPosition({ open = true, nodeId, anchorRect, placement = 'rig
     return {
         computedAnchor,
         floatingStyles,
+        availableHeight,
         refs,
         mergedReferenceRef
     };

package/dist/canvas/components/ToolbarButton.cjs

@@ -0,0 +1,63 @@
+"use strict";
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.d = (exports1, definition)=>{
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    ToolbarButton: ()=>ToolbarButton_ToolbarButton
+});
+const jsx_runtime_namespaceObject = require("react/jsx-runtime");
+const external_react_namespaceObject = require("react");
+const apollo_wind_namespaceObject = require("@uipath/apollo-wind");
+const ToolbarButton_ToolbarButton = /*#__PURE__*/ (0, external_react_namespaceObject.forwardRef)(function({ label, tooltip, testId, onClick, disabled, className, tooltipSide, children }, ref) {
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(apollo_wind_namespaceObject.Tooltip, {
+        children: [
+            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(apollo_wind_namespaceObject.TooltipTrigger, {
+                asChild: true,
+                children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(apollo_wind_namespaceObject.Button, {
+                    ref: ref,
+                    "data-testid": testId,
+                    "aria-label": label,
+                    variant: "ghost",
+                    size: "xs",
+                    icon: true,
+                    className: className,
+                    onClick: onClick,
+                    disabled: disabled,
+                    children: children
+                })
+            }),
+            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(apollo_wind_namespaceObject.TooltipContent, {
+                side: tooltipSide,
+                children: tooltip ?? label
+            })
+        ]
+    });
+});
+exports.ToolbarButton = __webpack_exports__.ToolbarButton;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "ToolbarButton"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/canvas/components/ToolbarButton.d.ts

@@ -0,0 +1,14 @@
+import type { MouseEventHandler, ReactNode } from 'react';
+interface ToolbarButtonProps {
+    label: string;
+    tooltip?: ReactNode;
+    testId?: string;
+    onClick?: MouseEventHandler<HTMLButtonElement>;
+    disabled?: boolean;
+    className?: string;
+    tooltipSide?: 'top' | 'right' | 'bottom' | 'left';
+    children: ReactNode;
+}
+export declare const ToolbarButton: import("react").ForwardRefExoticComponent<ToolbarButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
+export {};
+//# sourceMappingURL=ToolbarButton.d.ts.map

package/dist/canvas/components/ToolbarButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToolbarButton.d.ts","sourceRoot":"","sources":["../../../src/canvas/components/ToolbarButton.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAG1D,UAAU,kBAAkB;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,OAAO,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IAC/C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;IAClD,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,eAAO,MAAM,aAAa,kHA0BzB,CAAC"}

package/dist/canvas/components/ToolbarButton.js

@@ -0,0 +1,29 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import { Button, Tooltip, TooltipContent, TooltipTrigger } from "@uipath/apollo-wind";
+const ToolbarButton_ToolbarButton = /*#__PURE__*/ forwardRef(function({ label, tooltip, testId, onClick, disabled, className, tooltipSide, children }, ref) {
+    return /*#__PURE__*/ jsxs(Tooltip, {
+        children: [
+            /*#__PURE__*/ jsx(TooltipTrigger, {
+                asChild: true,
+                children: /*#__PURE__*/ jsx(Button, {
+                    ref: ref,
+                    "data-testid": testId,
+                    "aria-label": label,
+                    variant: "ghost",
+                    size: "xs",
+                    icon: true,
+                    className: className,
+                    onClick: onClick,
+                    disabled: disabled,
+                    children: children
+                })
+            }),
+            /*#__PURE__*/ jsx(TooltipContent, {
+                side: tooltipSide,
+                children: tooltip ?? label
+            })
+        ]
+    });
+});
+export { ToolbarButton_ToolbarButton as ToolbarButton };

package/dist/canvas/components/Toolbox/Toolbox.cjs

@@ -428,15 +428,30 @@ function Toolbox({ onClose, onBack, onItemSelect, onSearch, onItemHover, title,
         startTransition,
         handleBackTransition
     ]);
+    const responsiveStyle = (0, external_react_namespaceObject.useMemo)(()=>fullHeight ? {
+            boxSizing: 'border-box',
+            overflow: 'hidden'
+        } : {
+            boxSizing: 'border-box',
+            overflow: 'hidden',
+            maxHeight: `min(${external_constants_cjs_namespaceObject.TOOLBOX_HEIGHT}px, var(--floating-available-height, ${external_constants_cjs_namespaceObject.TOOLBOX_HEIGHT}px))`
+        }, [
+        fullHeight
+    ]);
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
         ref: containerRef,
         "data-testid": "toolbox-container",
+        style: {
+            maxHeight: '100%',
+            overflow: 'hidden'
+        },
         children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(external_layouts_index_cjs_namespaceObject.Column, {
             px: external_constants_cjs_namespaceObject.TOOLBOX_PADDING_X,
             py: external_constants_cjs_namespaceObject.TOOLBOX_PADDING_Y,
             gap: external_constants_cjs_namespaceObject.TOOLBOX_GAP,
             w: fullWidth ? '100%' : external_constants_cjs_namespaceObject.TOOLBOX_WIDTH,
             h: fullHeight ? '100%' : external_constants_cjs_namespaceObject.TOOLBOX_HEIGHT,
+            style: responsiveStyle,
             children: [
                 quickActions && quickActions.length > 0 && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_QuickActionsRow_cjs_namespaceObject.QuickActionsRow, {
                     actions: quickActions

package/dist/canvas/components/Toolbox/Toolbox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Toolbox.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/Toolbox/Toolbox.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAE,KAAK,QAAQ,EAAkD,MAAM,YAAY,CAAC;AAC3F,OAAO,EAAmB,KAAK,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AA+C7E,MAAM,MAAM,yBAAyB,CAAC,CAAC,GAAG,GAAG,IAAI,CAAC,GAAG,EAAE;IACrD,eAAe,CAAC,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC;CAC/B,KAAK,KAAK,CAAC,YAAY,GAAG,IAAI,CAAC;AAEhC,MAAM,MAAM,oBAAoB,CAAC,CAAC,GAAG,GAAG,IAAI,CAC1C,KAAK,EAAE,MAAM,EACb,gBAAgB,EAAE,OAAO,EACzB,EAAE,YAAY,EAAE,QAAQ,EAAE,EAAE;IAAE,YAAY,CAAC,EAAE,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC;IAAC,QAAQ,CAAC,EAAE,MAAM,CAAA;CAAE,KAC5E,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC;AAE5B,MAAM,WAAW,YAAY,CAAC,CAAC;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,YAAY,EAAE,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC;IAC5B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,YAAY,EAAE,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC,CAAC,KAAK,OAAO,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC;IAC1D,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;IAC1C,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,CAAC,EAAE,oBAAoB,CAAC,CAAC,CAAC,CAAC;IAOnC,YAAY,CAAC,EAAE,kBAAkB,EAAE,CAAC;IAOpC,gBAAgB,CAAC,EAAE,yBAAyB,CAAC,CAAC,CAAC,CAAC;CACjD;AAgDD,wBAAgB,OAAO,CAAC,CAAC,EAAE,EACzB,OAAO,EACP,MAAM,EACN,YAAY,EACZ,QAAQ,EACR,WAAW,EACX,KAAK,EACL,YAAY,EACZ,OAAO,EACP,SAAiB,EACjB,UAAkB,EAClB,YAAY,EACZ,gBAAgB,GACjB,EAAE,YAAY,CAAC,CAAC,CAAC,2CA8gBjB"}
+{"version":3,"file":"Toolbox.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/Toolbox/Toolbox.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAE,KAAK,QAAQ,EAAkD,MAAM,YAAY,CAAC;AAC3F,OAAO,EAAmB,KAAK,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AA+C7E,MAAM,MAAM,yBAAyB,CAAC,CAAC,GAAG,GAAG,IAAI,CAAC,GAAG,EAAE;IACrD,eAAe,CAAC,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC;CAC/B,KAAK,KAAK,CAAC,YAAY,GAAG,IAAI,CAAC;AAEhC,MAAM,MAAM,oBAAoB,CAAC,CAAC,GAAG,GAAG,IAAI,CAC1C,KAAK,EAAE,MAAM,EACb,gBAAgB,EAAE,OAAO,EACzB,EAAE,YAAY,EAAE,QAAQ,EAAE,EAAE;IAAE,YAAY,CAAC,EAAE,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC;IAAC,QAAQ,CAAC,EAAE,MAAM,CAAA;CAAE,KAC5E,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC;AAE5B,MAAM,WAAW,YAAY,CAAC,CAAC;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,YAAY,EAAE,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC;IAC5B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,YAAY,EAAE,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC,CAAC,KAAK,OAAO,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC;IAC1D,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;IAC1C,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,CAAC,EAAE,oBAAoB,CAAC,CAAC,CAAC,CAAC;IAOnC,YAAY,CAAC,EAAE,kBAAkB,EAAE,CAAC;IAOpC,gBAAgB,CAAC,EAAE,yBAAyB,CAAC,CAAC,CAAC,CAAC;CACjD;AAgDD,wBAAgB,OAAO,CAAC,CAAC,EAAE,EACzB,OAAO,EACP,MAAM,EACN,YAAY,EACZ,QAAQ,EACR,WAAW,EACX,KAAK,EACL,YAAY,EACZ,OAAO,EACP,SAAiB,EACjB,UAAkB,EAClB,YAAY,EACZ,gBAAgB,GACjB,EAAE,YAAY,CAAC,CAAC,CAAC,2CAkiBjB"}

package/dist/canvas/components/Toolbox/Toolbox.js

@@ -400,15 +400,30 @@ function Toolbox({ onClose, onBack, onItemSelect, onSearch, onItemHover, title,
         startTransition,
         handleBackTransition
     ]);
+    const responsiveStyle = useMemo(()=>fullHeight ? {
+            boxSizing: 'border-box',
+            overflow: 'hidden'
+        } : {
+            boxSizing: 'border-box',
+            overflow: 'hidden',
+            maxHeight: `min(${TOOLBOX_HEIGHT}px, var(--floating-available-height, ${TOOLBOX_HEIGHT}px))`
+        }, [
+        fullHeight
+    ]);
     return /*#__PURE__*/ jsx("div", {
         ref: containerRef,
         "data-testid": "toolbox-container",
+        style: {
+            maxHeight: '100%',
+            overflow: 'hidden'
+        },
         children: /*#__PURE__*/ jsxs(Column, {
             px: TOOLBOX_PADDING_X,
             py: TOOLBOX_PADDING_Y,
             gap: TOOLBOX_GAP,
             w: fullWidth ? '100%' : TOOLBOX_WIDTH,
             h: fullHeight ? '100%' : TOOLBOX_HEIGHT,
+            style: responsiveStyle,
             children: [
                 quickActions && quickActions.length > 0 && /*#__PURE__*/ jsx(QuickActionsRow, {
                     actions: quickActions

package/dist/canvas/components/Toolbox/Toolbox.styles.cjs

@@ -71,14 +71,14 @@ const AnimatedContainer = styled_default().div`
   display: flex;
   flex-direction: column;
   overflow: hidden;
-  min-height: 200px;
+  min-height: 50px;
 `;
 const AnimatedContent = styled_default().div`
   flex: 1;
   display: flex;
   flex-direction: column;
   animation: ${(props)=>props.entering ? `slideIn-${props.direction}` : 'none'} 0.15s ease-out;
-  min-height: 200px;
+  min-height: 50px;
 
   @keyframes slideIn-forward {
     from {

package/dist/canvas/components/Toolbox/Toolbox.styles.js

@@ -31,14 +31,14 @@ const AnimatedContainer = styled.div`
   display: flex;
   flex-direction: column;
   overflow: hidden;
-  min-height: 200px;
+  min-height: 50px;
 `;
 const AnimatedContent = styled.div`
   flex: 1;
   display: flex;
   flex-direction: column;
   animation: ${(props)=>props.entering ? `slideIn-${props.direction}` : 'none'} 0.15s ease-out;
-  min-height: 200px;
+  min-height: 50px;
 
   @keyframes slideIn-forward {
     from {

package/dist/canvas/components/index.cjs

@@ -15,9 +15,15 @@ var __webpack_modules__ = {
     "./ButtonHandle?f877" (module) {
         module.exports = require("./ButtonHandle/index.cjs");
     },
+    "./CanvasModeToolbar" (module) {
+        module.exports = require("./CanvasModeToolbar/index.cjs");
+    },
     "./CanvasPositionControls" (module) {
         module.exports = require("./CanvasPositionControls.cjs");
     },
+    "./CanvasZoomControls" (module) {
+        module.exports = require("./CanvasZoomControls/index.cjs");
+    },
     "./CodedAgent" (module) {
         module.exports = require("./CodedAgent/index.cjs");
     },
@@ -136,81 +142,89 @@ var __webpack_exports__ = {};
     var __rspack_reexport = {};
     for(const __rspack_import_key in _ButtonHandle__rspack_import_4)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_ButtonHandle__rspack_import_4[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _CanvasPositionControls__rspack_import_5 = __webpack_require__("./CanvasPositionControls");
+    var _CanvasModeToolbar__rspack_import_5 = __webpack_require__("./CanvasModeToolbar");
+    var __rspack_reexport = {};
+    for(const __rspack_import_key in _CanvasModeToolbar__rspack_import_5)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_CanvasModeToolbar__rspack_import_5[__rspack_import_key];
+    __webpack_require__.d(__webpack_exports__, __rspack_reexport);
+    var _CanvasPositionControls__rspack_import_6 = __webpack_require__("./CanvasPositionControls");
+    var __rspack_reexport = {};
+    for(const __rspack_import_key in _CanvasPositionControls__rspack_import_6)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_CanvasPositionControls__rspack_import_6[__rspack_import_key];
+    __webpack_require__.d(__webpack_exports__, __rspack_reexport);
+    var _CanvasZoomControls__rspack_import_7 = __webpack_require__("./CanvasZoomControls");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _CanvasPositionControls__rspack_import_5)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_CanvasPositionControls__rspack_import_5[__rspack_import_key];
+    for(const __rspack_import_key in _CanvasZoomControls__rspack_import_7)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_CanvasZoomControls__rspack_import_7[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _CodedAgent__rspack_import_6 = __webpack_require__("./CodedAgent");
+    var _CodedAgent__rspack_import_8 = __webpack_require__("./CodedAgent");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _CodedAgent__rspack_import_6)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_CodedAgent__rspack_import_6[__rspack_import_key];
+    for(const __rspack_import_key in _CodedAgent__rspack_import_8)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_CodedAgent__rspack_import_8[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _Edges__rspack_import_7 = __webpack_require__("./Edges");
+    var _Edges__rspack_import_9 = __webpack_require__("./Edges");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _Edges__rspack_import_7)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_Edges__rspack_import_7[__rspack_import_key];
+    for(const __rspack_import_key in _Edges__rspack_import_9)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_Edges__rspack_import_9[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _ExecutionStatusIcon__rspack_import_8 = __webpack_require__("./ExecutionStatusIcon");
+    var _ExecutionStatusIcon__rspack_import_10 = __webpack_require__("./ExecutionStatusIcon");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _ExecutionStatusIcon__rspack_import_8)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_ExecutionStatusIcon__rspack_import_8[__rspack_import_key];
+    for(const __rspack_import_key in _ExecutionStatusIcon__rspack_import_10)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_ExecutionStatusIcon__rspack_import_10[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _FloatingCanvasPanel__rspack_import_9 = __webpack_require__("./FloatingCanvasPanel");
+    var _FloatingCanvasPanel__rspack_import_11 = __webpack_require__("./FloatingCanvasPanel");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _FloatingCanvasPanel__rspack_import_9)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_FloatingCanvasPanel__rspack_import_9[__rspack_import_key];
+    for(const __rspack_import_key in _FloatingCanvasPanel__rspack_import_11)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_FloatingCanvasPanel__rspack_import_11[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _GroupNode__rspack_import_10 = __webpack_require__("./GroupNode");
+    var _GroupNode__rspack_import_12 = __webpack_require__("./GroupNode");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _GroupNode__rspack_import_10)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_GroupNode__rspack_import_10[__rspack_import_key];
+    for(const __rspack_import_key in _GroupNode__rspack_import_12)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_GroupNode__rspack_import_12[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _HierarchicalCanvas__rspack_import_11 = __webpack_require__("./HierarchicalCanvas");
+    var _HierarchicalCanvas__rspack_import_13 = __webpack_require__("./HierarchicalCanvas");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _HierarchicalCanvas__rspack_import_11)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_HierarchicalCanvas__rspack_import_11[__rspack_import_key];
+    for(const __rspack_import_key in _HierarchicalCanvas__rspack_import_13)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_HierarchicalCanvas__rspack_import_13[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _LoopNode__rspack_import_12 = __webpack_require__("./LoopNode?4ffc");
+    var _LoopNode__rspack_import_14 = __webpack_require__("./LoopNode?4ffc");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _LoopNode__rspack_import_12)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_LoopNode__rspack_import_12[__rspack_import_key];
+    for(const __rspack_import_key in _LoopNode__rspack_import_14)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_LoopNode__rspack_import_14[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _MiniCanvasNavigator__rspack_import_13 = __webpack_require__("./MiniCanvasNavigator?564d");
+    var _MiniCanvasNavigator__rspack_import_15 = __webpack_require__("./MiniCanvasNavigator?564d");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _MiniCanvasNavigator__rspack_import_13)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_MiniCanvasNavigator__rspack_import_13[__rspack_import_key];
+    for(const __rspack_import_key in _MiniCanvasNavigator__rspack_import_15)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_MiniCanvasNavigator__rspack_import_15[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _NodeContextMenu__rspack_import_14 = __webpack_require__("./NodeContextMenu");
+    var _NodeContextMenu__rspack_import_16 = __webpack_require__("./NodeContextMenu");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _NodeContextMenu__rspack_import_14)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_NodeContextMenu__rspack_import_14[__rspack_import_key];
+    for(const __rspack_import_key in _NodeContextMenu__rspack_import_16)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_NodeContextMenu__rspack_import_16[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _NodeInspector__rspack_import_15 = __webpack_require__("./NodeInspector");
+    var _NodeInspector__rspack_import_17 = __webpack_require__("./NodeInspector");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _NodeInspector__rspack_import_15)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_NodeInspector__rspack_import_15[__rspack_import_key];
+    for(const __rspack_import_key in _NodeInspector__rspack_import_17)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_NodeInspector__rspack_import_17[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _NodePropertiesPanel__rspack_import_16 = __webpack_require__("./NodePropertiesPanel?a3e8");
+    var _NodePropertiesPanel__rspack_import_18 = __webpack_require__("./NodePropertiesPanel?a3e8");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _NodePropertiesPanel__rspack_import_16)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_NodePropertiesPanel__rspack_import_16[__rspack_import_key];
+    for(const __rspack_import_key in _NodePropertiesPanel__rspack_import_18)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_NodePropertiesPanel__rspack_import_18[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _shared__rspack_import_17 = __webpack_require__("./shared");
+    var _shared__rspack_import_19 = __webpack_require__("./shared");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _shared__rspack_import_17)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_shared__rspack_import_17[__rspack_import_key];
+    for(const __rspack_import_key in _shared__rspack_import_19)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_shared__rspack_import_19[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _StageNode__rspack_import_18 = __webpack_require__("./StageNode");
+    var _StageNode__rspack_import_20 = __webpack_require__("./StageNode");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _StageNode__rspack_import_18)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_StageNode__rspack_import_18[__rspack_import_key];
+    for(const __rspack_import_key in _StageNode__rspack_import_20)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_StageNode__rspack_import_20[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _StickyNoteNode__rspack_import_19 = __webpack_require__("./StickyNoteNode?d2a3");
+    var _StickyNoteNode__rspack_import_21 = __webpack_require__("./StickyNoteNode?d2a3");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _StickyNoteNode__rspack_import_19)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_StickyNoteNode__rspack_import_19[__rspack_import_key];
+    for(const __rspack_import_key in _StickyNoteNode__rspack_import_21)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_StickyNoteNode__rspack_import_21[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _TaskIcon__rspack_import_20 = __webpack_require__("./TaskIcon");
+    var _TaskIcon__rspack_import_22 = __webpack_require__("./TaskIcon");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _TaskIcon__rspack_import_20)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_TaskIcon__rspack_import_20[__rspack_import_key];
+    for(const __rspack_import_key in _TaskIcon__rspack_import_22)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_TaskIcon__rspack_import_22[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _Toolbar__rspack_import_21 = __webpack_require__("./Toolbar");
+    var _Toolbar__rspack_import_23 = __webpack_require__("./Toolbar");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _Toolbar__rspack_import_21)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_Toolbar__rspack_import_21[__rspack_import_key];
+    for(const __rspack_import_key in _Toolbar__rspack_import_23)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_Toolbar__rspack_import_23[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _Toolbox__rspack_import_22 = __webpack_require__("./Toolbox?2740");
+    var _Toolbox__rspack_import_24 = __webpack_require__("./Toolbox?2740");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _Toolbox__rspack_import_22)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_Toolbox__rspack_import_22[__rspack_import_key];
+    for(const __rspack_import_key in _Toolbox__rspack_import_24)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_Toolbox__rspack_import_24[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _TriggerNode__rspack_import_23 = __webpack_require__("./TriggerNode");
+    var _TriggerNode__rspack_import_25 = __webpack_require__("./TriggerNode");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _TriggerNode__rspack_import_23)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_TriggerNode__rspack_import_23[__rspack_import_key];
+    for(const __rspack_import_key in _TriggerNode__rspack_import_25)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_TriggerNode__rspack_import_25[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
 })();
 for(var __rspack_i in __webpack_exports__)exports[__rspack_i] = __webpack_exports__[__rspack_i];