@nadicodeai/ui 0.6.0 → 0.8.0

package/dist/lib/message-scroller-primitive/components.js

@@ -0,0 +1,204 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+// Vendored from @shadcn/react 0.2.1 (upstream github.com/shadcn-ui).
+// Adapted only for repo import paths and formatting; not added as an npm dependency.
+import * as React from "react";
+import { composeRefs, mergeProps, useRender } from "./use-render.js";
+import { USER_SCROLL_KEYS } from "./types.js";
+import { useMessageScrollerController } from "./use-message-scroller-controller.js";
+import { useLatest } from "./utils.js";
+const MessageScrollerContext = React.createContext(null);
+const MessageScrollerItemContext = React.createContext(null);
+function useMessageScrollerContext() {
+    const context = React.useContext(MessageScrollerContext);
+    if (!context) {
+        throw new Error("useMessageScroller must be used within a MessageScroller.");
+    }
+    return context;
+}
+function useMessageScrollerItemContext() {
+    const context = React.useContext(MessageScrollerItemContext);
+    if (!context) {
+        throw new Error("MessageScrollerItem must be used within a MessageScroller.");
+    }
+    return context;
+}
+function useMessageScroller() {
+    const { scrollToEnd, scrollToMessage, scrollToStart } = useMessageScrollerContext();
+    return React.useMemo(() => ({
+        scrollToEnd,
+        scrollToMessage,
+        scrollToStart,
+    }), [scrollToEnd, scrollToMessage, scrollToStart]);
+}
+function useMessageScrollerScrollable() {
+    const { stateStore } = useMessageScrollerContext();
+    return React.useSyncExternalStore(stateStore.subscribe, stateStore.getSnapshot, stateStore.getSnapshot);
+}
+function useMessageScrollerVisibility() {
+    const { observeVisibility, unobserveVisibility, visibilityStore } = useMessageScrollerContext();
+    const subscribe = React.useCallback((listener) => visibilityStore.subscribe(listener, observeVisibility, unobserveVisibility), [observeVisibility, unobserveVisibility, visibilityStore]);
+    return React.useSyncExternalStore(subscribe, visibilityStore.getSnapshot, visibilityStore.getSnapshot);
+}
+function MessageScrollerProvider({ autoScroll = false, children, defaultScrollPosition = "end", scrollEdgeThreshold, scrollPreviousItemPeek, scrollMargin, }) {
+    const { context, registerMessage } = useMessageScrollerController({
+        autoScroll,
+        defaultScrollPosition,
+        scrollEdgeThreshold,
+        scrollPreviousItemPeek,
+        scrollMargin,
+    });
+    return (_jsx(MessageScrollerContext.Provider, { value: context, children: _jsx(MessageScrollerItemContext.Provider, { value: registerMessage, children: children }) }));
+}
+function MessageScroller({ children, ...props }) {
+    const { setRootElement } = useMessageScrollerContext();
+    return (_jsx("div", { ref: setRootElement, ...props, children: children }));
+}
+function MessageScrollerViewport({ "aria-label": ariaLabel, children, onKeyDown, onScroll, onTouchMove, onWheel, preserveScrollOnPrepend = true, ref, role, tabIndex, ...props }) {
+    const { handleResize, preserveScrollOnPrependRef, setViewportElement, syncAfterScroll, userScrollIntent, viewportRef, } = useMessageScrollerContext();
+    preserveScrollOnPrependRef.current = preserveScrollOnPrepend;
+    const setViewportRef = React.useCallback((element) => {
+        setViewportElement(element);
+        composeRefs(ref)?.(element);
+    }, [ref, setViewportElement]);
+    function handleScroll(event) {
+        syncAfterScroll();
+        onScroll?.(event);
+    }
+    function handleWheel(event) {
+        userScrollIntent();
+        onWheel?.(event);
+    }
+    function handleTouchMove(event) {
+        userScrollIntent();
+        onTouchMove?.(event);
+    }
+    function handleKeyDown(event) {
+        if (USER_SCROLL_KEYS.has(event.key)) {
+            userScrollIntent();
+        }
+        onKeyDown?.(event);
+    }
+    React.useEffect(() => {
+        const viewport = viewportRef.current;
+        if (!viewport || typeof ResizeObserver === "undefined") {
+            return;
+        }
+        // Coalesce into rAF: handleResize mutates the spacer inside the observed
+        // content, and resizing an observed element during delivery fires
+        // "ResizeObserver loop completed with undelivered notifications".
+        let frame = 0;
+        const observer = new ResizeObserver(() => {
+            window.cancelAnimationFrame(frame);
+            frame = window.requestAnimationFrame(handleResize);
+        });
+        observer.observe(viewport);
+        return () => {
+            window.cancelAnimationFrame(frame);
+            observer.disconnect();
+        };
+    }, [handleResize, viewportRef]);
+    return (_jsx("div", { ref: setViewportRef, role: role ?? "region", "aria-label": ariaLabel ?? "Messages", tabIndex: tabIndex ?? 0, onKeyDown: handleKeyDown, onScroll: handleScroll, onTouchMove: handleTouchMove, onWheel: handleWheel, ...props, children: children }));
+}
+function MessageScrollerContent({ "aria-relevant": ariaRelevant, children, ref, role, spacerClassName, ...props }) {
+    const { handleContentChange, handleResize, setContentElement, setSpacerElement } = useMessageScrollerContext();
+    const contentRef = React.useRef(null);
+    const setContentRef = React.useCallback((element) => {
+        contentRef.current = element;
+        setContentElement(element);
+        composeRefs(ref)?.(element);
+    }, [ref, setContentElement]);
+    React.useLayoutEffect(() => {
+        const content = contentRef.current;
+        if (!content) {
+            return;
+        }
+        handleContentChange();
+        if (typeof MutationObserver === "undefined") {
+            return;
+        }
+        const observer = new MutationObserver(() => {
+            handleContentChange();
+        });
+        observer.observe(content, { childList: true });
+        return () => observer.disconnect();
+    }, [handleContentChange]);
+    React.useEffect(() => {
+        const content = contentRef.current;
+        if (!content || typeof ResizeObserver === "undefined") {
+            return;
+        }
+        // Coalesce into rAF: handleResize mutates the spacer inside this observed
+        // element, and resizing an observed element during delivery fires
+        // "ResizeObserver loop completed with undelivered notifications".
+        let frame = 0;
+        const observer = new ResizeObserver(() => {
+            window.cancelAnimationFrame(frame);
+            frame = window.requestAnimationFrame(handleResize);
+        });
+        observer.observe(content);
+        return () => {
+            window.cancelAnimationFrame(frame);
+            observer.disconnect();
+        };
+    }, [handleResize]);
+    return (_jsxs("div", { ref: setContentRef, role: role ?? "log", "aria-relevant": ariaRelevant ?? "additions", ...props, children: [children, _jsx("div", { ref: setSpacerElement, "aria-hidden": "true", "data-message-scroller-spacer": "", hidden: true, className: spacerClassName })] }));
+}
+function MessageScrollerItem({ messageId, ref, scrollAnchor = false, ...props }) {
+    const registerMessage = useMessageScrollerItemContext();
+    const elementRef = React.useRef(null);
+    const setItemRef = React.useCallback((element) => {
+        const previousElement = elementRef.current;
+        elementRef.current = element;
+        if (messageId) {
+            registerMessage(messageId, element, previousElement);
+        }
+        composeRefs(ref)?.(element);
+    }, [messageId, ref, registerMessage]);
+    return (_jsx("div", { ref: setItemRef, "data-message-id": messageId, "data-scroll-anchor": scrollAnchor ? "true" : "false", ...props }));
+}
+function MessageScrollerButton({ behavior = "smooth", children, direction = "end", onClick, render, tabIndex, type = "button", ...props }) {
+    const { scrollToEnd, scrollToStart, stateStore } = useMessageScrollerContext();
+    const onClickRef = useLatest(onClick);
+    const subscribe = React.useCallback((listener) => stateStore.subscribe(listener), [stateStore]);
+    const getSnapshot = React.useCallback(() => {
+        const state = stateStore.getSnapshot();
+        return direction === "start" ? state.start : state.end;
+    }, [direction, stateStore]);
+    const isActive = React.useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
+    const handleClick = React.useCallback((event) => {
+        if (!isActive) {
+            return;
+        }
+        onClickRef.current?.(event);
+        if (!event.defaultPrevented) {
+            event.currentTarget.blur();
+            if (direction === "start") {
+                scrollToStart({ behavior });
+            }
+            else {
+                scrollToEnd({ behavior });
+            }
+        }
+    }, [behavior, direction, isActive, onClickRef, scrollToEnd, scrollToStart]);
+    return useRender({
+        defaultTagName: "button",
+        props: mergeProps({
+            type,
+            inert: !isActive,
+            tabIndex: isActive ? tabIndex : -1,
+            children: children ?? _jsxs("span", { children: ["Scroll to ", direction] }),
+            onClick: handleClick,
+        }, props),
+        render,
+        state: {
+            active: isActive,
+            direction,
+        },
+        stateAttributesMapping: {
+            active: (value) => ({
+                "data-active": value ? "true" : "false",
+            }),
+        },
+    });
+}
+export { MessageScroller, MessageScrollerButton, MessageScrollerContent, MessageScrollerItem, MessageScrollerProvider, MessageScrollerViewport, useMessageScroller, useMessageScrollerScrollable, useMessageScrollerVisibility, };

package/dist/lib/message-scroller-primitive/geometry.d.ts

@@ -0,0 +1,55 @@
+import type { MessageScrollerScrollable, MessageScrollerScrollAlign, MessageScrollerVisibilityState } from "./types";
+declare function getMessageScrollerScrollable({ content, scrollEdgeThreshold, spacer, viewport, }: {
+    content: HTMLElement | null;
+    scrollEdgeThreshold: number;
+    spacer: HTMLElement | null;
+    viewport: HTMLElement | null;
+}): MessageScrollerScrollable;
+declare function getMessageScrollerVisibilityState({ content, scrollMargin, scrollPreviousItemPeek, spacer, viewport, visibleMessageIds, }: {
+    content: HTMLElement | null;
+    scrollMargin: number;
+    scrollPreviousItemPeek: number;
+    spacer: HTMLElement | null;
+    viewport: HTMLElement | null;
+    visibleMessageIds: Set<string>;
+}): MessageScrollerVisibilityState;
+declare function getMessageScrollerItems(content: HTMLElement, spacer: HTMLElement | null): HTMLElement[];
+declare function getNewScrollAnchor(items: HTMLElement[], previousItemCount: number): HTMLElement | null;
+declare function getUnanchoredScrollAnchor(items: HTMLElement[], handledAnchors: {
+    has(element: HTMLElement): boolean;
+}): HTMLElement | null;
+declare function hasMultipleNewScrollAnchors(items: HTMLElement[], previousItemCount: number): boolean;
+declare function getLastScrollAnchor(items: HTMLElement[]): HTMLElement | null;
+declare function getFirstVisibleMessageItem({ content, spacer, viewport, }: {
+    content: HTMLElement;
+    spacer: HTMLElement | null;
+    viewport: HTMLElement;
+}): HTMLElement | null;
+declare function getElementScrollTop({ align, element, scrollMargin, spacer, viewport, }: {
+    align: MessageScrollerScrollAlign;
+    element: HTMLElement;
+    scrollMargin: number;
+    spacer: HTMLElement | null;
+    viewport: HTMLElement;
+}): number;
+declare function getElementTop(element: HTMLElement, viewport: HTMLElement): number;
+declare function getElementViewportTop(element: HTMLElement, viewport: HTMLElement): number;
+declare function getTailSpacerHeight({ content, scrollTop, spacer, viewport, }: {
+    content: HTMLElement;
+    scrollTop: number;
+    spacer: HTMLElement | null;
+    viewport: HTMLElement;
+}): number;
+declare function getContentBottom({ content, spacer, viewport, }: {
+    content: HTMLElement;
+    spacer: HTMLElement | null;
+    viewport: HTMLElement;
+}): number;
+declare function getMaxScrollTop(viewport: HTMLElement): number;
+declare function getContentBlockPadding(spacer: HTMLElement | null): {
+    end: number;
+    start: number;
+};
+declare function getFlexGap(element: HTMLElement | null): number;
+export { getContentBlockPadding, getContentBottom, getElementScrollTop, getElementTop, getElementViewportTop, getFirstVisibleMessageItem, getFlexGap, getLastScrollAnchor, getMaxScrollTop, getMessageScrollerItems, getMessageScrollerScrollable, getMessageScrollerVisibilityState, getNewScrollAnchor, getTailSpacerHeight, getUnanchoredScrollAnchor, hasMultipleNewScrollAnchors, };
+//# sourceMappingURL=geometry.d.ts.map

package/dist/lib/message-scroller-primitive/geometry.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"geometry.d.ts","sourceRoot":"","sources":["../../../src/lib/message-scroller-primitive/geometry.ts"],"names":[],"mappings":"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"}

package/dist/lib/message-scroller-primitive/geometry.js

@@ -0,0 +1,199 @@
+// Vendored from @shadcn/react 0.2.1 (upstream github.com/shadcn-ui).
+// Adapted only for repo import paths and formatting; not added as an npm dependency.
+import { EMPTY_MESSAGE_SCROLLER_SCROLLABLE, EMPTY_MESSAGE_SCROLLER_VISIBILITY_STATE, SCROLL_POSITION_EPSILON, } from "./types.js";
+function getMessageScrollerScrollable({ content, scrollEdgeThreshold, spacer, viewport, }) {
+    if (!viewport || !content) {
+        return EMPTY_MESSAGE_SCROLLER_SCROLLABLE;
+    }
+    const contentBottom = getContentBottom({ content, spacer, viewport });
+    return {
+        start: viewport.scrollTop > scrollEdgeThreshold,
+        end: contentBottom - viewport.scrollTop - viewport.clientHeight > scrollEdgeThreshold,
+    };
+}
+function getMessageScrollerVisibilityState({ content, scrollMargin, scrollPreviousItemPeek, spacer, viewport, visibleMessageIds, }) {
+    if (!content || !viewport) {
+        return EMPTY_MESSAGE_SCROLLER_VISIBILITY_STATE;
+    }
+    const viewportRect = viewport.getBoundingClientRect();
+    // The reading line sits scrollPreviousItemPeek below scrollMargin: anchored
+    // turns land there with the previous turn peeking above. A row only peeking in
+    // that band has not been read down to yet, so it counts as neither visible nor
+    // current.
+    const lineTop = viewportRect.top + scrollMargin + scrollPreviousItemPeek;
+    const trackByLayout = typeof IntersectionObserver === "undefined";
+    const visible = [];
+    let currentAnchorId = null;
+    // Walk rows in document order so visible ids come out top-to-bottom.
+    for (const item of getMessageScrollerItems(content, spacer)) {
+        const messageId = item.dataset.messageId;
+        if (!messageId) {
+            continue;
+        }
+        const isAnchor = item.dataset.scrollAnchor === "true";
+        // Anchors need a rect to place the current line; non-anchors lean on the
+        // observer set (or a rect in the no-observer fallback).
+        const rect = isAnchor || trackByLayout ? item.getBoundingClientRect() : null;
+        const isVisible = trackByLayout && rect
+            ? rect.bottom > lineTop && rect.top < viewportRect.bottom
+            : visibleMessageIds.has(messageId);
+        if (isVisible) {
+            visible.push(messageId);
+        }
+        // Current is the last anchor to have reached the reading line: the turn you
+        // scrolled to (placed at the line) wins over newer turns lower down, the
+        // previous turn peeking above the line has been passed, and it stays current
+        // even after its header scrolls above the viewport.
+        if (isAnchor && rect && rect.top <= lineTop + SCROLL_POSITION_EPSILON) {
+            currentAnchorId = messageId;
+        }
+    }
+    if (visible.length === 0 && currentAnchorId === null) {
+        return EMPTY_MESSAGE_SCROLLER_VISIBILITY_STATE;
+    }
+    return {
+        currentAnchorId,
+        visibleMessageIds: visible,
+    };
+}
+function getMessageScrollerItems(content, spacer) {
+    return Array.from(content.children).filter((child) => child instanceof HTMLElement && child !== spacer);
+}
+function getNewScrollAnchor(items, previousItemCount) {
+    for (let index = previousItemCount; index < items.length; index++) {
+        const item = items[index];
+        if (item?.dataset.scrollAnchor === "true") {
+            return item;
+        }
+    }
+    return null;
+}
+function getUnanchoredScrollAnchor(items, handledAnchors) {
+    for (const item of items) {
+        if (item.dataset.scrollAnchor === "true" && !handledAnchors.has(item)) {
+            return item;
+        }
+    }
+    return null;
+}
+function hasMultipleNewScrollAnchors(items, previousItemCount) {
+    let count = 0;
+    for (let index = previousItemCount; index < items.length; index++) {
+        const item = items[index];
+        if (item?.dataset.scrollAnchor !== "true") {
+            continue;
+        }
+        count += 1;
+        if (count > 1) {
+            return true;
+        }
+    }
+    return false;
+}
+function getLastScrollAnchor(items) {
+    for (let index = items.length - 1; index >= 0; index--) {
+        const item = items[index];
+        if (item?.dataset.scrollAnchor === "true") {
+            return item;
+        }
+    }
+    return null;
+}
+function getFirstVisibleMessageItem({ content, spacer, viewport, }) {
+    const viewportRect = viewport.getBoundingClientRect();
+    for (const item of getMessageScrollerItems(content, spacer)) {
+        if (!item.dataset.messageId) {
+            continue;
+        }
+        const rect = item.getBoundingClientRect();
+        if (rect.bottom > viewportRect.top && rect.top < viewportRect.bottom) {
+            return item;
+        }
+    }
+    return null;
+}
+function getElementScrollTop({ align, element, scrollMargin, spacer, viewport, }) {
+    const elementTop = getElementTop(element, viewport);
+    const elementHeight = element.getBoundingClientRect().height;
+    const contentPadding = getContentBlockPadding(spacer);
+    if (align === "center") {
+        const insetHeight = Math.max(0, viewport.clientHeight - contentPadding.start - contentPadding.end);
+        return elementTop - contentPadding.start - (insetHeight - elementHeight) / 2 - scrollMargin;
+    }
+    if (align === "end") {
+        return elementTop - viewport.clientHeight + elementHeight + contentPadding.end + scrollMargin;
+    }
+    if (align === "nearest") {
+        const elementBottom = elementTop + elementHeight;
+        const viewportTop = viewport.scrollTop + contentPadding.start;
+        const viewportBottom = viewport.scrollTop + viewport.clientHeight - contentPadding.end;
+        if (elementTop >= viewportTop && elementBottom <= viewportBottom) {
+            return viewport.scrollTop;
+        }
+        if (elementTop < viewportTop) {
+            return elementTop - contentPadding.start - scrollMargin;
+        }
+        return elementBottom - viewport.clientHeight + contentPadding.end + scrollMargin;
+    }
+    return elementTop - contentPadding.start - scrollMargin;
+}
+function getElementTop(element, viewport) {
+    const elementRect = element.getBoundingClientRect();
+    const viewportRect = viewport.getBoundingClientRect();
+    return elementRect.top - viewportRect.top + viewport.scrollTop;
+}
+function getElementViewportTop(element, viewport) {
+    return element.getBoundingClientRect().top - viewport.getBoundingClientRect().top;
+}
+function getTailSpacerHeight({ content, scrollTop, spacer, viewport, }) {
+    const contentBottom = getContentBottom({ content, spacer, viewport });
+    return scrollTop + viewport.clientHeight - contentBottom;
+}
+function getContentBottom({ content, spacer, viewport, }) {
+    const items = getMessageScrollerItems(content, spacer);
+    const padding = getBlockPadding(content);
+    const viewportRect = viewport.getBoundingClientRect();
+    const scrollTop = viewport.scrollTop;
+    let contentBottom = padding.start + padding.end;
+    for (const item of items) {
+        const rect = item.getBoundingClientRect();
+        contentBottom = Math.max(contentBottom, rect.bottom - viewportRect.top + scrollTop + padding.end);
+    }
+    return contentBottom;
+}
+function getMaxScrollTop(viewport) {
+    return Math.max(0, viewport.scrollHeight - viewport.clientHeight);
+}
+function getBlockPadding(element) {
+    const style = window.getComputedStyle(element);
+    return {
+        end: readCssPixel(style.paddingBlockEnd || style.paddingBottom),
+        start: readCssPixel(style.paddingBlockStart || style.paddingTop),
+    };
+}
+function getContentBlockPadding(spacer) {
+    const content = spacer?.parentElement;
+    if (!content) {
+        return {
+            end: 0,
+            start: 0,
+        };
+    }
+    return getBlockPadding(content);
+}
+function getFlexGap(element) {
+    if (!element) {
+        return 0;
+    }
+    const style = window.getComputedStyle(element);
+    const gap = style.rowGap === "normal" ? style.gap : style.rowGap;
+    return readCssPixel(gap);
+}
+function readCssPixel(value) {
+    if (!value) {
+        return 0;
+    }
+    const number = Number.parseFloat(value);
+    return Number.isFinite(number) ? number : 0;
+}
+export { getContentBlockPadding, getContentBottom, getElementScrollTop, getElementTop, getElementViewportTop, getFirstVisibleMessageItem, getFlexGap, getLastScrollAnchor, getMaxScrollTop, getMessageScrollerItems, getMessageScrollerScrollable, getMessageScrollerVisibilityState, getNewScrollAnchor, getTailSpacerHeight, getUnanchoredScrollAnchor, hasMultipleNewScrollAnchors, };

package/dist/lib/message-scroller-primitive/index.d.ts

@@ -0,0 +1,12 @@
+import { MessageScrollerButton as Button, MessageScrollerContent as Content, MessageScrollerItem as Item, MessageScrollerProvider as Provider, MessageScroller as Root, MessageScrollerViewport as Viewport } from "./components";
+export declare const MessageScroller: {
+    Provider: typeof Provider;
+    Root: typeof Root;
+    Viewport: typeof Viewport;
+    Content: typeof Content;
+    Item: typeof Item;
+    Button: typeof Button;
+};
+export { useMessageScroller, useMessageScrollerScrollable, useMessageScrollerVisibility, } from "./components";
+export type { MessageScrollerDefaultScrollPosition, MessageScrollerScrollAlign, MessageScrollerScrollOptions, MessageScrollerScrollable, MessageScrollerVisibilityState, } from "./types";
+//# sourceMappingURL=index.d.ts.map

package/dist/lib/message-scroller-primitive/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/lib/message-scroller-primitive/index.ts"],"names":[],"mappings":"AAGA,OAAO,EACL,qBAAqB,IAAI,MAAM,EAC/B,sBAAsB,IAAI,OAAO,EACjC,mBAAmB,IAAI,IAAI,EAC3B,uBAAuB,IAAI,QAAQ,EACnC,eAAe,IAAI,IAAI,EACvB,uBAAuB,IAAI,QAAQ,EACpC,MAAM,cAAc,CAAC;AAEtB,eAAO,MAAM,eAAe;;;;;;;CAO3B,CAAC;AAEF,OAAO,EACL,kBAAkB,EAClB,4BAA4B,EAC5B,4BAA4B,GAC7B,MAAM,cAAc,CAAC;AAEtB,YAAY,EACV,oCAAoC,EACpC,0BAA0B,EAC1B,4BAA4B,EAC5B,yBAAyB,EACzB,8BAA8B,GAC/B,MAAM,SAAS,CAAC"}

package/dist/lib/message-scroller-primitive/index.js

@@ -0,0 +1,12 @@
+// Vendored from @shadcn/react 0.2.1 (upstream github.com/shadcn-ui).
+// Adapted only for repo import paths and formatting; not added as an npm dependency.
+import { MessageScrollerButton as Button, MessageScrollerContent as Content, MessageScrollerItem as Item, MessageScrollerProvider as Provider, MessageScroller as Root, MessageScrollerViewport as Viewport, } from "./components.js";
+export const MessageScroller = {
+    Provider,
+    Root,
+    Viewport,
+    Content,
+    Item,
+    Button,
+};
+export { useMessageScroller, useMessageScrollerScrollable, useMessageScrollerVisibility, } from "./components.js";

package/dist/lib/message-scroller-primitive/stores.d.ts

@@ -0,0 +1,7 @@
+import type { MessageScrollerScrollable, MessageScrollerStore, MessageScrollerVisibilityState, MessageScrollerVisibilityStore } from "./types";
+declare function createMessageScrollerStore<T>(initialSnapshot: T, isEqual: (a: T, b: T) => boolean): MessageScrollerStore<T>;
+declare function createMessageScrollerVisibilityStore(): MessageScrollerVisibilityStore;
+declare function areScrollStatesEqual(current: MessageScrollerScrollable, next: MessageScrollerScrollable): boolean;
+declare function areVisibilityStatesEqual(current: MessageScrollerVisibilityState, next: MessageScrollerVisibilityState): boolean;
+export { areScrollStatesEqual, areVisibilityStatesEqual, createMessageScrollerStore, createMessageScrollerVisibilityStore, };
+//# sourceMappingURL=stores.d.ts.map

package/dist/lib/message-scroller-primitive/stores.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"stores.d.ts","sourceRoot":"","sources":["../../../src/lib/message-scroller-primitive/stores.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EACV,yBAAyB,EACzB,oBAAoB,EACpB,8BAA8B,EAC9B,8BAA8B,EAC/B,MAAM,SAAS,CAAC;AA4CjB,iBAAS,0BAA0B,CAAC,CAAC,EACnC,eAAe,EAAE,CAAC,EAClB,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,KAAK,OAAO,GAC/B,oBAAoB,CAAC,CAAC,CAAC,CAEzB;AAED,iBAAS,oCAAoC,IAAI,8BAA8B,CAE9E;AAED,iBAAS,oBAAoB,CAAC,OAAO,EAAE,yBAAyB,EAAE,IAAI,EAAE,yBAAyB,WAEhG;AAED,iBAAS,wBAAwB,CAC/B,OAAO,EAAE,8BAA8B,EACvC,IAAI,EAAE,8BAA8B,WAarC;AAED,OAAO,EACL,oBAAoB,EACpB,wBAAwB,EACxB,0BAA0B,EAC1B,oCAAoC,GACrC,CAAC"}

package/dist/lib/message-scroller-primitive/stores.js

@@ -0,0 +1,53 @@
+// Vendored from @shadcn/react 0.2.1 (upstream github.com/shadcn-ui).
+// Adapted only for repo import paths and formatting; not added as an npm dependency.
+import { EMPTY_MESSAGE_SCROLLER_VISIBILITY_STATE } from "./types.js";
+// Generic useSyncExternalStore backing: a stable snapshot (referentially equal
+// while isEqual holds, so subscribers only re-render on real transitions) plus
+// optional reference-counting via the subscribe-time lifecycle callbacks.
+function createExternalStore(initialSnapshot, isEqual) {
+    let snapshot = initialSnapshot;
+    const listeners = new Set();
+    return {
+        getSnapshot: () => snapshot,
+        hasListeners: () => listeners.size > 0,
+        setSnapshot: (nextSnapshot) => {
+            if (isEqual(snapshot, nextSnapshot)) {
+                return;
+            }
+            snapshot = nextSnapshot;
+            listeners.forEach((listener) => listener());
+        },
+        subscribe: (listener, onFirstSubscribe, onLastUnsubscribe) => {
+            const wasEmpty = listeners.size === 0;
+            listeners.add(listener);
+            if (wasEmpty) {
+                onFirstSubscribe?.();
+            }
+            return () => {
+                listeners.delete(listener);
+                if (listeners.size === 0) {
+                    onLastUnsubscribe?.();
+                }
+            };
+        },
+    };
+}
+function createMessageScrollerStore(initialSnapshot, isEqual) {
+    return createExternalStore(initialSnapshot, isEqual);
+}
+function createMessageScrollerVisibilityStore() {
+    return createExternalStore(EMPTY_MESSAGE_SCROLLER_VISIBILITY_STATE, areVisibilityStatesEqual);
+}
+function areScrollStatesEqual(current, next) {
+    return current.start === next.start && current.end === next.end;
+}
+function areVisibilityStatesEqual(current, next) {
+    if (current.currentAnchorId !== next.currentAnchorId) {
+        return false;
+    }
+    if (current.visibleMessageIds.length !== next.visibleMessageIds.length) {
+        return false;
+    }
+    return current.visibleMessageIds.every((messageId, index) => messageId === next.visibleMessageIds[index]);
+}
+export { areScrollStatesEqual, areVisibilityStatesEqual, createMessageScrollerStore, createMessageScrollerVisibilityStore, };

package/dist/lib/message-scroller-primitive/types.d.ts

@@ -0,0 +1,89 @@
+import type * as React from "react";
+import type { UseRenderComponentProps } from "./use-render";
+declare const DEFAULT_SCROLL_EDGE_THRESHOLD = 8;
+declare const DEFAULT_SCROLL_PREVIOUS_ITEM_PEEK = 64;
+declare const DEFAULT_SCROLL_MARGIN = 0;
+declare const SCROLL_POSITION_EPSILON = 0.5;
+declare const AUTOSCROLLING_CLEAR_DELAY = 180;
+declare const USER_SCROLL_KEYS: Set<string>;
+type MessageScrollerMode = "following-bottom" | "free-scrolling" | "anchored-to-message" | "settling-jump";
+type MessageScrollerDefaultScrollPosition = "start" | "end" | "last-anchor";
+type MessageScrollerButtonDirection = "start" | "end";
+type MessageScrollerScrollAlign = "start" | "center" | "end" | "nearest";
+type MessageScrollerScrollOptions = {
+    align?: MessageScrollerScrollAlign;
+    behavior?: ScrollBehavior;
+    scrollMargin?: number;
+};
+type MessageScrollerScrollable = {
+    start: boolean;
+    end: boolean;
+};
+type MessageScrollerVisibilityState = {
+    currentAnchorId: string | null;
+    visibleMessageIds: string[];
+};
+type MessageScrollerProviderProps = {
+    children?: React.ReactNode;
+    autoScroll?: boolean;
+    defaultScrollPosition?: MessageScrollerDefaultScrollPosition;
+    scrollEdgeThreshold?: number;
+    scrollPreviousItemPeek?: number;
+    scrollMargin?: number;
+};
+type MessageScrollerProps = React.ComponentProps<"div">;
+type MessageScrollerViewportProps = React.ComponentProps<"div"> & {
+    preserveScrollOnPrepend?: boolean;
+};
+type MessageScrollerContentProps = React.ComponentProps<"div"> & {
+    spacerClassName?: string;
+};
+type MessageScrollerItemProps = React.ComponentProps<"div"> & {
+    messageId?: string;
+    scrollAnchor?: boolean;
+};
+type MessageScrollerButtonRenderState = {
+    active: boolean;
+    direction: MessageScrollerButtonDirection;
+};
+type MessageScrollerButtonProps = UseRenderComponentProps<"button", MessageScrollerButtonRenderState> & {
+    behavior?: ScrollBehavior;
+    direction?: MessageScrollerButtonDirection;
+};
+type MessageScrollerStore<T> = {
+    getSnapshot: () => T;
+    setSnapshot: (nextSnapshot: T) => void;
+    subscribe: (listener: () => void) => () => void;
+};
+type MessageScrollerVisibilityStore = {
+    getSnapshot: () => MessageScrollerVisibilityState;
+    hasListeners: () => boolean;
+    setSnapshot: (nextSnapshot: MessageScrollerVisibilityState) => void;
+    subscribe: (listener: () => void, onFirstSubscribe: () => void, onLastUnsubscribe: () => void) => () => void;
+};
+type MessageScrollerRegisterMessage = (messageId: string, element: HTMLElement | null, removedElement?: HTMLElement | null) => void;
+type MessageScrollerContextValue = {
+    handleContentChange: () => void;
+    handleResize: () => void;
+    observeVisibility: () => void;
+    preserveScrollOnPrependRef: React.RefObject<boolean>;
+    scrollToEnd: (options?: MessageScrollerScrollOptions) => boolean;
+    scrollToMessage: (messageId: string, options?: MessageScrollerScrollOptions) => boolean;
+    scrollToStart: (options?: MessageScrollerScrollOptions) => boolean;
+    setContentElement: (element: HTMLDivElement | null) => void;
+    setRootElement: (element: HTMLDivElement | null) => void;
+    setSpacerElement: (element: HTMLDivElement | null) => void;
+    setViewportElement: (element: HTMLDivElement | null) => void;
+    stateStore: MessageScrollerStore<MessageScrollerScrollable>;
+    syncAfterScroll: () => void;
+    unobserveVisibility: () => void;
+    userScrollIntent: () => void;
+    viewportRef: React.RefObject<HTMLDivElement | null>;
+    visibilityStore: MessageScrollerVisibilityStore;
+};
+declare const EMPTY_MESSAGE_SCROLLER_SCROLLABLE: MessageScrollerScrollable;
+declare const EMPTY_VISIBLE_MESSAGE_IDS: string[];
+declare const EMPTY_MESSAGE_SCROLLER_VISIBILITY_STATE: MessageScrollerVisibilityState;
+export { AUTOSCROLLING_CLEAR_DELAY, DEFAULT_SCROLL_EDGE_THRESHOLD, DEFAULT_SCROLL_MARGIN, DEFAULT_SCROLL_PREVIOUS_ITEM_PEEK, EMPTY_MESSAGE_SCROLLER_SCROLLABLE, EMPTY_MESSAGE_SCROLLER_VISIBILITY_STATE, EMPTY_VISIBLE_MESSAGE_IDS, SCROLL_POSITION_EPSILON, USER_SCROLL_KEYS, };
+export type { MessageScrollerButtonDirection, MessageScrollerButtonProps, MessageScrollerButtonRenderState, MessageScrollerContentProps, MessageScrollerContextValue, MessageScrollerDefaultScrollPosition, MessageScrollerItemProps, MessageScrollerMode, MessageScrollerProps, MessageScrollerProviderProps, MessageScrollerRegisterMessage, MessageScrollerScrollAlign, MessageScrollerScrollOptions, MessageScrollerScrollable, MessageScrollerStore, MessageScrollerViewportProps, MessageScrollerVisibilityState, MessageScrollerVisibilityStore, };
+//# sourceMappingURL=types.d.ts.map

package/dist/lib/message-scroller-primitive/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/lib/message-scroller-primitive/types.ts"],"names":[],"mappings":"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"}