@uipath/apollo-wind 2.66.1 → 2.67.0

package/dist/components/ui/message-scroller/primitive/use-message-scroller-controller.cjs

@@ -0,0 +1,474 @@
+"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__, {
+    useMessageScrollerController: ()=>useMessageScrollerController
+});
+const external_react_namespaceObject = require("react");
+const external_geometry_cjs_namespaceObject = require("./geometry.cjs");
+const external_types_cjs_namespaceObject = require("./types.cjs");
+const external_use_message_scroller_commands_cjs_namespaceObject = require("./use-message-scroller-commands.cjs");
+const external_use_message_scroller_refs_cjs_namespaceObject = require("./use-message-scroller-refs.cjs");
+function useElementRef(elementRef, onMount) {
+    return external_react_namespaceObject.useCallback((element)=>{
+        elementRef.current = element;
+        if (element) onMount();
+    }, [
+        elementRef,
+        onMount
+    ]);
+}
+function useMessageScrollerController({ autoScroll = false, defaultScrollPosition = 'end', scrollEdgeThreshold = external_types_cjs_namespaceObject.DEFAULT_SCROLL_EDGE_THRESHOLD, scrollPreviousItemPeek = external_types_cjs_namespaceObject.DEFAULT_SCROLL_PREVIOUS_ITEM_PEEK, scrollMargin = external_types_cjs_namespaceObject.DEFAULT_SCROLL_MARGIN }) {
+    const refs = (0, external_use_message_scroller_refs_cjs_namespaceObject.useMessageScrollerRefs)({
+        autoScroll,
+        defaultScrollPosition,
+        scrollEdgeThreshold,
+        scrollMargin,
+        scrollPreviousItemPeek
+    });
+    const { streamingTurnRef, autoScrollRef, autoscrollingRef, autoscrollingTimeoutRef, contentRef, defaultScrollPositionAppliedRef, firstItemRef, itemCountRef, lastScrollTopRef, messageElementsRef, modeRef, pendingScrollFrameRef, pendingScrollToMessageRef, prependRestoreRef, preserveScrollOnPrependRef, pendingDefaultScrollStore, rootRef, scrollEdgeThresholdRef, scrollMarginRef, scrollPreviousItemPeekRef, spacerGapRef, spacerHeightRef, spacerRef, stateFrameRef, stateStore, viewportRef, visibilityFrameRef, visibilityObserverRef, visibilityStore, visibleMessageIdsRef, handledScrollAnchorsRef } = refs;
+    const previousDefaultScrollPositionRef = external_react_namespaceObject.useRef(defaultScrollPosition);
+    if (previousDefaultScrollPositionRef.current !== defaultScrollPosition) {
+        previousDefaultScrollPositionRef.current = defaultScrollPosition;
+        defaultScrollPositionAppliedRef.current = false;
+    }
+    const writeStateAttributes = external_react_namespaceObject.useCallback((state)=>{
+        const root = rootRef.current;
+        const viewport = viewportRef.current;
+        const scrollable = [
+            state.start && 'start',
+            state.end && 'end'
+        ].filter(Boolean).join(' ');
+        const autoScrolling = autoscrollingRef.current;
+        for (const element of [
+            root,
+            viewport
+        ])if (element) {
+            if (scrollable) element.setAttribute('data-scrollable', scrollable);
+            else element.removeAttribute('data-scrollable');
+            element.toggleAttribute('data-autoscrolling', autoScrolling);
+        }
+    }, []);
+    const reconcileFollowMode = external_react_namespaceObject.useCallback((scrollable)=>{
+        const scrollTop = viewportRef.current?.scrollTop ?? 0;
+        const scrolledUp = scrollTop < lastScrollTopRef.current - external_types_cjs_namespaceObject.SCROLL_POSITION_EPSILON;
+        lastScrollTopRef.current = scrollTop;
+        if (autoScrollRef.current && !scrollable.end && 'settling-jump' !== modeRef.current && 'anchored-to-message' !== modeRef.current) modeRef.current = 'following-bottom';
+        else if ('following-bottom' === modeRef.current && scrollable.end && scrolledUp && !autoscrollingRef.current) modeRef.current = 'free-scrolling';
+    }, []);
+    const commitScrollState = external_react_namespaceObject.useCallback(()=>{
+        const nextState = (0, external_geometry_cjs_namespaceObject.getMessageScrollerScrollable)({
+            content: contentRef.current,
+            scrollEdgeThreshold: scrollEdgeThresholdRef.current,
+            spacer: spacerRef.current,
+            viewport: viewportRef.current
+        });
+        reconcileFollowMode(nextState);
+        const publishedState = 'following-bottom' === modeRef.current ? {
+            ...nextState,
+            end: false
+        } : nextState;
+        writeStateAttributes(publishedState);
+        stateStore.setSnapshot(publishedState);
+    }, [
+        reconcileFollowMode,
+        stateStore,
+        writeStateAttributes
+    ]);
+    const scheduleStateCommit = external_react_namespaceObject.useCallback(()=>{
+        if (null !== stateFrameRef.current) return;
+        stateFrameRef.current = window.requestAnimationFrame(()=>{
+            stateFrameRef.current = null;
+            commitScrollState();
+        });
+    }, [
+        commitScrollState
+    ]);
+    const scheduleVisibilitySync = external_react_namespaceObject.useCallback(()=>{
+        if (!visibilityStore.hasListeners()) return;
+        if (null !== visibilityFrameRef.current) return;
+        visibilityFrameRef.current = window.requestAnimationFrame(()=>{
+            visibilityFrameRef.current = null;
+            if (!visibilityStore.hasListeners()) return;
+            visibilityStore.setSnapshot((0, external_geometry_cjs_namespaceObject.getMessageScrollerVisibilityState)({
+                content: contentRef.current,
+                scrollMargin: scrollMarginRef.current,
+                scrollPreviousItemPeek: scrollPreviousItemPeekRef.current,
+                spacer: spacerRef.current,
+                viewport: viewportRef.current,
+                visibleMessageIds: visibleMessageIdsRef.current
+            }));
+        });
+    }, [
+        visibilityStore
+    ]);
+    const { flushPendingScrollToMessage, reanchorToAnchoredMessage, scrollToElement, scrollToEnd, scrollToMessage, scrollToStart } = (0, external_use_message_scroller_commands_cjs_namespaceObject.useMessageScrollerCommands)({
+        refs,
+        commitScrollState,
+        scheduleStateCommit,
+        scheduleVisibilitySync
+    });
+    const restorePrependedAnchor = external_react_namespaceObject.useCallback(()=>{
+        const anchor = prependRestoreRef.current;
+        const viewport = viewportRef.current;
+        if (!anchor || !viewport || !anchor.element.isConnected) return false;
+        const nextViewportTop = (0, external_geometry_cjs_namespaceObject.getElementViewportTop)(anchor.element, viewport);
+        const delta = nextViewportTop - anchor.viewportTop;
+        if (Math.abs(delta) <= external_types_cjs_namespaceObject.SCROLL_POSITION_EPSILON) return false;
+        viewport.scrollTop += delta;
+        anchor.viewportTop = (0, external_geometry_cjs_namespaceObject.getElementViewportTop)(anchor.element, viewport);
+        scheduleStateCommit();
+        scheduleVisibilitySync();
+        return true;
+    }, [
+        scheduleStateCommit,
+        scheduleVisibilitySync
+    ]);
+    const capturePrependAnchor = external_react_namespaceObject.useCallback(()=>{
+        const content = contentRef.current;
+        const viewport = viewportRef.current;
+        if (!content || !viewport) {
+            prependRestoreRef.current = null;
+            return;
+        }
+        const anchor = (0, external_geometry_cjs_namespaceObject.getFirstVisibleMessageItem)({
+            content,
+            spacer: spacerRef.current,
+            viewport
+        });
+        prependRestoreRef.current = anchor ? {
+            element: anchor,
+            viewportTop: (0, external_geometry_cjs_namespaceObject.getElementViewportTop)(anchor, viewport)
+        } : null;
+    }, []);
+    const schedulePendingScrollToMessageFlush = external_react_namespaceObject.useCallback(()=>{
+        if (null !== pendingScrollFrameRef.current) return;
+        pendingScrollFrameRef.current = window.requestAnimationFrame(()=>{
+            pendingScrollFrameRef.current = null;
+            if (flushPendingScrollToMessage()) capturePrependAnchor();
+        });
+    }, [
+        capturePrependAnchor,
+        flushPendingScrollToMessage
+    ]);
+    const applyDefaultScrollPosition = external_react_namespaceObject.useCallback(()=>{
+        if (!defaultScrollPosition || defaultScrollPositionAppliedRef.current || 0 === itemCountRef.current) return false;
+        let handled = false;
+        if ('last-anchor' === defaultScrollPosition) {
+            const content = contentRef.current;
+            const viewport = viewportRef.current;
+            const anchor = content && viewport ? (0, external_geometry_cjs_namespaceObject.getLastScrollAnchor)((0, external_geometry_cjs_namespaceObject.getMessageScrollerItems)(content, spacerRef.current)) : null;
+            if (content && viewport && anchor) {
+                const anchorTop = (0, external_geometry_cjs_namespaceObject.getElementTop)(anchor, viewport);
+                const contentBottom = (0, external_geometry_cjs_namespaceObject.getContentBottom)({
+                    content,
+                    spacer: spacerRef.current,
+                    viewport
+                });
+                const lastTurnFits = contentBottom - anchorTop <= viewport.clientHeight;
+                handled = lastTurnFits ? scrollToEnd({
+                    behavior: 'auto'
+                }) : scrollToElement(anchor, {
+                    align: 'start'
+                }, {
+                    keepPreviousPeek: true
+                });
+            } else handled = scrollToEnd({
+                behavior: 'auto'
+            });
+        } else handled = 'end' === defaultScrollPosition ? scrollToEnd({
+            behavior: 'auto'
+        }) : scrollToStart({
+            behavior: 'auto'
+        });
+        if (!handled) return false;
+        (0, external_use_message_scroller_refs_cjs_namespaceObject.markDefaultScrollPositionApplied)(refs);
+        return true;
+    }, [
+        defaultScrollPosition,
+        scrollToElement,
+        scrollToEnd,
+        scrollToStart
+    ]);
+    const handleContentChange = external_react_namespaceObject.useCallback(()=>{
+        const content = contentRef.current;
+        if (!content) return;
+        const items = (0, external_geometry_cjs_namespaceObject.getMessageScrollerItems)(content, spacerRef.current);
+        const previousItemCount = itemCountRef.current;
+        const previousFirstItem = firstItemRef.current;
+        itemCountRef.current = items.length;
+        firstItemRef.current = items[0] ?? null;
+        const reconcileScrollPosition = ()=>{
+            if (flushPendingScrollToMessage()) return;
+            if (0 === previousItemCount) {
+                if (applyDefaultScrollPosition()) return;
+                if (items.length > 0 && autoScrollRef.current && scrollToEnd({
+                    behavior: 'auto'
+                })) return;
+                commitScrollState();
+                scheduleVisibilitySync();
+                return;
+            }
+            const previousFirstItemIndex = previousFirstItem ? items.indexOf(previousFirstItem) : -1;
+            const didPrepend = preserveScrollOnPrependRef.current && previousFirstItemIndex > 0;
+            if (didPrepend) return void restorePrependedAnchor();
+            if (items.length > previousItemCount) {
+                const anchor = (0, external_geometry_cjs_namespaceObject.getNewScrollAnchor)(items, previousItemCount);
+                if (anchor) {
+                    if (autoScrollRef.current && 'following-bottom' === modeRef.current && (0, external_geometry_cjs_namespaceObject.hasMultipleNewScrollAnchors)(items, previousItemCount)) return void scrollToEnd({
+                        behavior: 'auto'
+                    });
+                    scrollToElement(anchor, {
+                        align: 'start'
+                    }, {
+                        keepPreviousPeek: true
+                    });
+                    handledScrollAnchorsRef.current.add(anchor);
+                    return;
+                }
+            }
+            if (items.length === previousItemCount) {
+                const anchor = (0, external_geometry_cjs_namespaceObject.getUnanchoredScrollAnchor)(items, handledScrollAnchorsRef.current);
+                if (anchor) {
+                    scrollToElement(anchor, {
+                        align: 'start'
+                    }, {
+                        keepPreviousPeek: true
+                    });
+                    handledScrollAnchorsRef.current.add(anchor);
+                    return;
+                }
+            }
+            if ('following-bottom' === modeRef.current && autoScrollRef.current) scrollToEnd({
+                behavior: 'auto'
+            });
+            else {
+                commitScrollState();
+                scheduleVisibilitySync();
+            }
+        };
+        reconcileScrollPosition();
+        capturePrependAnchor();
+    }, [
+        applyDefaultScrollPosition,
+        capturePrependAnchor,
+        commitScrollState,
+        flushPendingScrollToMessage,
+        restorePrependedAnchor,
+        scheduleVisibilitySync,
+        scrollToElement,
+        scrollToEnd
+    ]);
+    const handleResize = external_react_namespaceObject.useCallback(()=>{
+        if ('following-bottom' === modeRef.current && autoScrollRef.current) return void scrollToEnd({
+            behavior: 'auto'
+        });
+        const previousSpacerHeight = spacerHeightRef.current;
+        if (reanchorToAnchoredMessage()) {
+            if (autoScrollRef.current && previousSpacerHeight > 0 && 0 === spacerHeightRef.current) scrollToEnd({
+                behavior: 'auto'
+            });
+            return;
+        }
+        scheduleStateCommit();
+        scheduleVisibilitySync();
+    }, [
+        reanchorToAnchoredMessage,
+        scheduleStateCommit,
+        scheduleVisibilitySync,
+        scrollToEnd
+    ]);
+    const observeVisibility = external_react_namespaceObject.useCallback(()=>{
+        const viewport = viewportRef.current;
+        if (!viewport || !visibilityStore.hasListeners()) return;
+        if ("u" < typeof IntersectionObserver) return void scheduleVisibilitySync();
+        if (!visibilityObserverRef.current) visibilityObserverRef.current = new IntersectionObserver((entries)=>{
+            for (const entry of entries){
+                const messageId = entry.target.dataset.messageId;
+                if (messageId) if (entry.isIntersecting) visibleMessageIdsRef.current.add(messageId);
+                else visibleMessageIdsRef.current.delete(messageId);
+            }
+            scheduleVisibilitySync();
+        }, {
+            root: viewport,
+            rootMargin: `${-(scrollMarginRef.current + scrollPreviousItemPeekRef.current)}px 0px 0px 0px`,
+            threshold: [
+                0,
+                0.01,
+                0.5,
+                1
+            ]
+        });
+        messageElementsRef.current.forEach((element)=>{
+            visibilityObserverRef.current?.observe(element);
+        });
+        scheduleVisibilitySync();
+    }, [
+        scheduleVisibilitySync,
+        visibilityStore
+    ]);
+    const unobserveVisibility = external_react_namespaceObject.useCallback(()=>{
+        if (null !== visibilityFrameRef.current) {
+            window.cancelAnimationFrame(visibilityFrameRef.current);
+            visibilityFrameRef.current = null;
+        }
+        visibilityObserverRef.current?.disconnect();
+        visibilityObserverRef.current = null;
+        visibleMessageIdsRef.current.clear();
+        visibilityStore.setSnapshot(external_types_cjs_namespaceObject.EMPTY_MESSAGE_SCROLLER_VISIBILITY_STATE);
+    }, [
+        visibilityStore
+    ]);
+    const registerMessage = external_react_namespaceObject.useCallback((messageId, element, removedElement)=>{
+        if (element) {
+            messageElementsRef.current.set(messageId, element);
+            visibilityObserverRef.current?.observe(element);
+            scheduleVisibilitySync();
+            if (pendingScrollToMessageRef.current?.messageId === messageId) schedulePendingScrollToMessageFlush();
+            return;
+        }
+        if (removedElement && messageElementsRef.current.get(messageId) === removedElement) {
+            messageElementsRef.current.delete(messageId);
+            visibleMessageIdsRef.current.delete(messageId);
+            visibilityObserverRef.current?.unobserve(removedElement);
+            scheduleVisibilitySync();
+        }
+    }, [
+        schedulePendingScrollToMessageFlush,
+        scheduleVisibilitySync
+    ]);
+    const userScrollIntent = external_react_namespaceObject.useCallback(()=>{
+        if ('following-bottom' === modeRef.current || 'anchored-to-message' === modeRef.current || 'settling-jump' === modeRef.current) {
+            streamingTurnRef.current = null;
+            modeRef.current = 'free-scrolling';
+        }
+    }, []);
+    const mirrorStateAttributes = external_react_namespaceObject.useCallback(()=>writeStateAttributes(stateStore.getSnapshot()), [
+        stateStore,
+        writeStateAttributes
+    ]);
+    const setRootElement = useElementRef(rootRef, mirrorStateAttributes);
+    const setViewportElement = useElementRef(viewportRef, mirrorStateAttributes);
+    const setContentElement = external_react_namespaceObject.useCallback((element)=>{
+        contentRef.current = element;
+    }, []);
+    const setSpacerElement = external_react_namespaceObject.useCallback((element)=>{
+        spacerRef.current = element;
+        spacerGapRef.current = (0, external_geometry_cjs_namespaceObject.getFlexGap)(element?.parentElement ?? null);
+    }, []);
+    const syncAfterScroll = external_react_namespaceObject.useCallback(()=>{
+        commitScrollState();
+        scheduleVisibilitySync();
+        capturePrependAnchor();
+    }, [
+        capturePrependAnchor,
+        commitScrollState,
+        scheduleVisibilitySync
+    ]);
+    const context = external_react_namespaceObject.useMemo(()=>({
+            handleContentChange,
+            handleResize,
+            observeVisibility,
+            pendingDefaultScrollStore,
+            preserveScrollOnPrependRef,
+            scrollToEnd,
+            scrollToMessage,
+            scrollToStart,
+            setContentElement,
+            setRootElement,
+            setSpacerElement,
+            setViewportElement,
+            stateStore,
+            syncAfterScroll,
+            unobserveVisibility,
+            userScrollIntent,
+            viewportRef,
+            visibilityStore
+        }), [
+        handleContentChange,
+        handleResize,
+        observeVisibility,
+        pendingDefaultScrollStore,
+        scrollToEnd,
+        scrollToMessage,
+        scrollToStart,
+        setContentElement,
+        setRootElement,
+        setSpacerElement,
+        setViewportElement,
+        stateStore,
+        syncAfterScroll,
+        unobserveVisibility,
+        userScrollIntent,
+        visibilityStore
+    ]);
+    external_react_namespaceObject.useLayoutEffect(()=>{
+        if (applyDefaultScrollPosition()) return;
+        if (0 === itemCountRef.current) (0, external_use_message_scroller_refs_cjs_namespaceObject.clearPendingDefaultScroll)(refs);
+    }, [
+        applyDefaultScrollPosition
+    ]);
+    external_react_namespaceObject.useEffect(()=>()=>{
+            if (null !== stateFrameRef.current) {
+                window.cancelAnimationFrame(stateFrameRef.current);
+                stateFrameRef.current = null;
+            }
+            if (null !== visibilityFrameRef.current) {
+                window.cancelAnimationFrame(visibilityFrameRef.current);
+                visibilityFrameRef.current = null;
+            }
+            if (null !== autoscrollingTimeoutRef.current) {
+                window.clearTimeout(autoscrollingTimeoutRef.current);
+                autoscrollingTimeoutRef.current = null;
+            }
+            if (null !== pendingScrollFrameRef.current) {
+                window.cancelAnimationFrame(pendingScrollFrameRef.current);
+                pendingScrollFrameRef.current = null;
+            }
+            visibilityObserverRef.current?.disconnect();
+            visibilityObserverRef.current = null;
+        }, []);
+    external_react_namespaceObject.useLayoutEffect(()=>{
+        if (autoScroll && 'following-bottom' === modeRef.current && itemCountRef.current > 0) return void scrollToEnd({
+            behavior: 'auto'
+        });
+        commitScrollState();
+    }, [
+        autoScroll,
+        commitScrollState,
+        scrollToEnd
+    ]);
+    return {
+        context,
+        registerMessage
+    };
+}
+exports.useMessageScrollerController = __webpack_exports__.useMessageScrollerController;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "useMessageScrollerController"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/components/ui/message-scroller/primitive/use-message-scroller-controller.d.ts

@@ -0,0 +1,6 @@
+import type { MessageScrollerContextValue, MessageScrollerProviderProps, MessageScrollerRegisterMessage } from './types';
+declare function useMessageScrollerController({ autoScroll, defaultScrollPosition, scrollEdgeThreshold, scrollPreviousItemPeek, scrollMargin, }: MessageScrollerProviderProps): {
+    context: MessageScrollerContextValue;
+    registerMessage: MessageScrollerRegisterMessage;
+};
+export { useMessageScrollerController };