@uipath/apollo-react 4.5.4 → 4.6.0

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

@@ -60,13 +60,14 @@ const PanelContainer = styled_default().div`
   transition: opacity 0.2s ease-in-out;
   border-left: ${(props)=>props.isPinned ? '1px solid var(--canvas-border-de-emp)' : 'none'};
 `;
-function FloatingCanvasPanel({ open = true, nodeId, anchorRect, placement = 'right-start', offset = 20, isPinned = false, useFixedPosition = false, portalToBody = false, title, header, headerActions, children, onClose, scrollKey, onMouseEnter, onMouseLeave }) {
+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 } = (0, external_useFloatingPosition_cjs_namespaceObject.useFloatingPosition)({
         open,
         nodeId,
         anchorRect,
         placement,
-        offset
+        offset,
+        fallbackPlacement
     });
     if (!open || !computedAnchor) return null;
     if (useFixedPosition && anchorRect) {

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

@@ -7,6 +7,7 @@ export type FloatingCanvasPanelProps = {
     anchorRect?: AnchorRect;
     placement?: Placement;
     offset?: number;
+    fallbackPlacement?: 'none' | 'start' | 'end';
     isPinned?: boolean;
     useFixedPosition?: boolean;
     portalToBody?: boolean;
@@ -19,5 +20,5 @@ export type FloatingCanvasPanelProps = {
     onMouseEnter?: () => void;
     onMouseLeave?: () => void;
 };
-export declare function FloatingCanvasPanel({ open, nodeId, anchorRect, placement, offset, isPinned, useFixedPosition, portalToBody, title, header, headerActions, children, onClose, scrollKey, onMouseEnter, onMouseLeave, }: FloatingCanvasPanelProps): import("react/jsx-runtime").JSX.Element | null;
+export declare function FloatingCanvasPanel({ open, nodeId, anchorRect, placement, offset, fallbackPlacement, isPinned, useFixedPosition, portalToBody, title, header, headerActions, children, onClose, scrollKey, onMouseEnter, onMouseLeave, }: FloatingCanvasPanelProps): import("react/jsx-runtime").JSX.Element | null;
 //# sourceMappingURL=FloatingCanvasPanel.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"FloatingCanvasPanel.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/FloatingCanvasPanel/FloatingCanvasPanel.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAEpD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvC,OAAO,EAAE,KAAK,UAAU,EAAuB,MAAM,uBAAuB,CAAC;AAoB7E,MAAM,MAAM,wBAAwB,GAAG;IAErC,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,QAAQ,CAAC,EAAE,OAAO,CAAC;IAOnB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAM3B,YAAY,CAAC,EAAE,OAAO,CAAC;IAGvB,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;IAGnB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;CAC3B,CAAC;AAEF,wBAAgB,mBAAmB,CAAC,EAClC,IAAW,EACX,MAAM,EACN,UAAU,EACV,SAAyB,EACzB,MAAW,EACX,QAAgB,EAChB,gBAAwB,EACxB,YAAoB,EACpB,KAAK,EACL,MAAM,EACN,aAAa,EACb,QAAQ,EACR,OAAO,EACP,SAAS,EACT,YAAY,EACZ,YAAY,GACb,EAAE,wBAAwB,kDA4I1B"}
+{"version":3,"file":"FloatingCanvasPanel.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/FloatingCanvasPanel/FloatingCanvasPanel.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAEpD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvC,OAAO,EAAE,KAAK,UAAU,EAAuB,MAAM,uBAAuB,CAAC;AAoB7E,MAAM,MAAM,wBAAwB,GAAG;IAErC,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;IAShB,iBAAiB,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,KAAK,CAAC;IAC7C,QAAQ,CAAC,EAAE,OAAO,CAAC;IAOnB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAM3B,YAAY,CAAC,EAAE,OAAO,CAAC;IAGvB,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;IAGnB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;CAC3B,CAAC;AAEF,wBAAgB,mBAAmB,CAAC,EAClC,IAAW,EACX,MAAM,EACN,UAAU,EACV,SAAyB,EACzB,MAAW,EACX,iBAAiB,EACjB,QAAgB,EAChB,gBAAwB,EACxB,YAAoB,EACpB,KAAK,EACL,MAAM,EACN,aAAa,EACb,QAAQ,EACR,OAAO,EACP,SAAS,EACT,YAAY,EACZ,YAAY,GACb,EAAE,wBAAwB,kDA6I1B"}

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

@@ -22,13 +22,14 @@ const PanelContainer = styled.div`
   transition: opacity 0.2s ease-in-out;
   border-left: ${(props)=>props.isPinned ? '1px solid var(--canvas-border-de-emp)' : 'none'};
 `;
-function FloatingCanvasPanel({ open = true, nodeId, anchorRect, placement = 'right-start', offset = 20, isPinned = false, useFixedPosition = false, portalToBody = false, title, header, headerActions, children, onClose, scrollKey, onMouseEnter, onMouseLeave }) {
+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({
         open,
         nodeId,
         anchorRect,
         placement,
-        offset
+        offset,
+        fallbackPlacement
     });
     if (!open || !computedAnchor) return null;
     if (useFixedPosition && anchorRect) {

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

@@ -29,7 +29,7 @@ __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");
-function useFloatingPosition({ open = true, nodeId, anchorRect, placement = 'right-start', offset: offsetValue = 20 }) {
+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 computedAnchor = (0, external_react_namespaceObject.useMemo)(()=>{
@@ -56,7 +56,9 @@ function useFloatingPosition({ open = true, nodeId, anchorRect, placement = 'rig
         open: !!open && !!computedAnchor,
         middleware: [
             (0, react_namespaceObject.offset)(offsetValue),
-            (0, react_namespaceObject.flip)()
+            (0, react_namespaceObject.flip)({
+                fallbackAxisSideDirection: fallbackPlacement
+            })
         ],
         whileElementsMounted: react_namespaceObject.autoUpdate
     });

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

@@ -12,6 +12,7 @@ export interface UseFloatingPositionOptions {
     anchorRect?: AnchorRect;
     placement?: Placement;
     offset?: number;
+    fallbackPlacement?: 'none' | 'start' | 'end';
 }
 export interface UseFloatingPositionReturn {
     computedAnchor: AnchorRect | null;
@@ -22,5 +23,5 @@ export interface UseFloatingPositionReturn {
     };
     mergedReferenceRef: ((instance: Element | null) => void) | null;
 }
-export declare function useFloatingPosition({ open, nodeId, anchorRect, placement, offset: offsetValue, }: UseFloatingPositionOptions): UseFloatingPositionReturn;
+export declare function useFloatingPosition({ open, nodeId, anchorRect, placement, offset: offsetValue, fallbackPlacement, }: UseFloatingPositionOptions): UseFloatingPositionReturn;
 //# sourceMappingURL=useFloatingPosition.d.ts.map

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;CACjB;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,GACzB,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,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"}

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

@@ -1,7 +1,7 @@
 import { autoUpdate, flip, offset, useFloating, useMergeRefs } from "@floating-ui/react";
 import { useInternalNode } from "../../xyflow/react.js";
 import { useEffect, useMemo, useRef } from "react";
-function useFloatingPosition({ open = true, nodeId, anchorRect, placement = 'right-start', offset: offsetValue = 20 }) {
+function useFloatingPosition({ open = true, nodeId, anchorRect, placement = 'right-start', offset: offsetValue = 20, fallbackPlacement = 'none' }) {
     const referenceRef = useRef(null);
     const internalNode = useInternalNode(nodeId || '');
     const computedAnchor = useMemo(()=>{
@@ -28,7 +28,9 @@ function useFloatingPosition({ open = true, nodeId, anchorRect, placement = 'rig
         open: !!open && !!computedAnchor,
         middleware: [
             offset(offsetValue),
-            flip()
+            flip({
+                fallbackAxisSideDirection: fallbackPlacement
+            })
         ],
         whileElementsMounted: autoUpdate
     });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uipath/apollo-react",
-  "version": "4.5.4",
+  "version": "4.6.0",
   "description": "Apollo Design System - React component library with Material UI theming",
   "repository": {
     "type": "git",