@rolder/kit 3.0.0-alpha.11 → 3.0.0-alpha.111

package/dist/index.js

@@ -1,26 +0,0 @@
-import { Conversation, useChatMessage } from "./ai/ui/conversation/index.js";
-import { PromptInput } from "./ai/ui/promptInput/index.js";
-import { convertFileUIPartBlobToDataURL } from "./ai/utils/convertFileUIPartBlobToDataURL.js";
-import { parseAiMessagePart } from "./ai/utils/parseAiMessagePart.js";
-import { DefaultApp } from "./app/DefaultApp.js";
-import { defaultRequestMiddlewares } from "./app/defaultRequestMiddlewares.js";
-import { defaultTheme } from "./app/defaultTheme.js";
-import { getCookie } from "./functions/getCookie.js";
-import { setCookie } from "./functions/setCookie.js";
-import { setCookies } from "./functions/setCookies.js";
-import { useMutation } from "./hooks/useMutation.js";
-import { useMutationWithInvalidate } from "./hooks/useMutationWithInvalidate.js";
-import { getDB } from "./surreal/connection.js";
-import { surrealDeleteFn, surrealUnsubscribeFn } from "./surreal/deafaultCrud.js";
-import { deserialize } from "./surreal/deserialize.js";
-import { encryptionFn } from "./surreal/encryption.js";
-import { Editor, useEditor } from "./ui/editor/index.js";
-import { DefaultError, DefaultNotFound, Forbidden, defaultErrorNotification } from "./ui/error/index.js";
-import { AnimatedChevron } from "./ui/AnimatedChevron.js";
-import { blurOnError, fieldsSchema, useAppForm, useFieldContext, withForm } from "./ui/form/index.js";
-import { HoverPaper, usePaperHover } from "./ui/hoverPaper/index.js";
-import { JsonInput } from "./ui/JsonInput.js";
-import { RouterLink } from "./ui/RouterLink.js";
-import { SaveInput } from "./ui/saveInput/index.js";
-import { ScrollArea, useScrollArea } from "./ui/scrollArea/index.js";
-export { AnimatedChevron, Conversation, DefaultApp, DefaultError, DefaultNotFound, Editor, Forbidden, HoverPaper, JsonInput, PromptInput, RouterLink, SaveInput, ScrollArea, blurOnError, convertFileUIPartBlobToDataURL, defaultErrorNotification, defaultRequestMiddlewares, defaultTheme, deserialize, encryptionFn, fieldsSchema, getCookie, getDB, parseAiMessagePart, setCookie, setCookies, surrealDeleteFn, surrealUnsubscribeFn, useAppForm, useChatMessage, useEditor, useFieldContext, useMutation, useMutationWithInvalidate, usePaperHover, useScrollArea, withForm };

package/dist/surreal/deafaultCrud.d.ts

@@ -1,2 +0,0 @@
-export declare const surrealDeleteFn: import("@tanstack/start-client-core").RequiredFetcher<undefined, (data: string) => string, Promise<void>>;
-export declare const surrealUnsubscribeFn: import("@tanstack/start-client-core").RequiredFetcher<undefined, (data: string) => string, Promise<void>>;

package/dist/ui/editor/Provider.d.ts

@@ -1,17 +0,0 @@
-import type { Editor } from '@tiptap/react';
-import type { EditorProps } from './types';
-interface EditorContext {
-    editor: Editor | null;
-    editable?: boolean;
-    setEditable: (value: boolean) => void;
-    disabledToolbar: boolean;
-    setDisabledToolbar: (value: boolean) => void;
-    focused: boolean;
-    setFocused: (value: boolean) => void;
-    editedByUser: boolean;
-    setEditedByUser: (value: boolean) => void;
-}
-declare const EditorContext: import("react").Context<EditorContext | null>;
-export declare const Provider: ({ children, initialContent, initialEditable, initialDisabledToolbar, onChange, }: EditorProps) => import("react/jsx-runtime").JSX.Element;
-export declare const useEditor: () => EditorContext;
-export {};

package/dist/ui/editor/Provider.js

@@ -1,80 +0,0 @@
-import { jsx } from "react/jsx-runtime";
-import { Link, getTaskListExtension } from "@mantine/tiptap";
-import extension_highlight from "@tiptap/extension-highlight";
-import extension_placeholder from "@tiptap/extension-placeholder";
-import { TableKit } from "@tiptap/extension-table";
-import extension_task_item from "@tiptap/extension-task-item";
-import extension_task_list from "@tiptap/extension-task-list";
-import extension_text_align from "@tiptap/extension-text-align";
-import { useEditor } from "@tiptap/react";
-import starter_kit from "@tiptap/starter-kit";
-import { createContext, useContext, useEffect, useState } from "react";
-const EditorContext = /*#__PURE__*/ createContext(null);
-const Provider = ({ children, initialContent, initialEditable = true, initialDisabledToolbar, onChange })=>{
-    const editor = useEditor({
-        shouldRerenderOnTransaction: false,
-        immediatelyRender: false,
-        extensions: [
-            starter_kit.configure({
-                link: false
-            }),
-            extension_placeholder.configure({
-                placeholder: 'Документ пуст'
-            }),
-            Link,
-            extension_highlight,
-            extension_text_align.configure({
-                types: [
-                    'heading',
-                    'paragraph'
-                ]
-            }),
-            getTaskListExtension(extension_task_list),
-            extension_task_item.configure({
-                nested: true
-            }),
-            TableKit
-        ],
-        content: initialContent,
-        onUpdate: ({ editor })=>{
-            onChange?.(editor.getHTML());
-        },
-        editable: initialEditable
-    });
-    const [editable, setEditable] = useState(initialEditable);
-    const [disabledToolbar, setDisabledToolbar] = useState(!!initialDisabledToolbar);
-    const [editedByUser, setEditedByUser] = useState(true);
-    const [focused, setFocused] = useState(false);
-    useEffect(()=>{
-        editor?.on('focus', ()=>setFocused(true));
-        editor?.on('blur', ()=>setFocused(false));
-        editor?.on('update', ({ transaction })=>{
-            if (transaction.docChanged && focused) setEditedByUser(true);
-            if (transaction.docChanged && !focused) setEditedByUser(false);
-        });
-    }, [
-        editor,
-        focused
-    ]);
-    const value = {
-        editor,
-        editable,
-        setEditable,
-        disabledToolbar,
-        setDisabledToolbar,
-        editedByUser,
-        setEditedByUser,
-        focused,
-        setFocused
-    };
-    return /*#__PURE__*/ jsx(EditorContext.Provider, {
-        value: value,
-        children: children
-    });
-};
-const Provider_useEditor = ()=>{
-    const context = useContext(EditorContext);
-    if (!context) throw new Error('useEditor must be used within EditorProvider');
-    return context;
-};
-export { Provider, Provider_useEditor as useEditor };

package/dist/ui/editor/types.d.ts

@@ -1,7 +0,0 @@
-export interface EditorProps {
-    children: React.ReactNode;
-    initialContent?: string;
-    initialEditable?: boolean;
-    initialDisabledToolbar?: boolean;
-    onChange?: (value: string) => void;
-}

package/dist/ui/form/fields/PassowrdField.d.ts

@@ -1,2 +0,0 @@
-import { type PasswordInputProps } from '@mantine/core';
-export declare const PassowrdField: (props: PasswordInputProps) => import("react/jsx-runtime").JSX.Element;

package/dist/ui/form/fields/TextPassowrdField.d.ts

@@ -1,2 +0,0 @@
-import { type TextInputProps } from '@mantine/core';
-export declare const TextPassowrdField: (props: TextInputProps) => import("react/jsx-runtime").JSX.Element;

package/dist/ui/form/fields/TextPassowrdField.js

@@ -1,51 +0,0 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import { ActionIcon, TextInput } from "@mantine/core";
-import omgopass from "omgopass";
-import { useFieldContext } from "../context.js";
-const TextPassowrdField = (props)=>{
-    const field = useFieldContext();
-    return /*#__PURE__*/ jsx(TextInput, {
-        label: "Пароль",
-        placeholder: "Введите пароль",
-        rightSection: /*#__PURE__*/ jsx(ActionIcon, {
-            variant: "light",
-            onClick: ()=>field.setValue(omgopass({
-                    minSyllableLength: 2,
-                    maxSyllableLength: 2
-                })),
-            children: /*#__PURE__*/ jsxs("svg", {
-                xmlns: "http://www.w3.org/2000/svg",
-                width: "16",
-                height: "16",
-                viewBox: "0 0 16 16",
-                fill: "none",
-                stroke: "currentColor",
-                strokeWidth: "2",
-                strokeLinecap: "round",
-                strokeLinejoin: "round",
-                role: "img",
-                "aria-label": "Refresh",
-                children: [
-                    /*#__PURE__*/ jsx("path", {
-                        stroke: "none",
-                        d: "M0 0h24v24H0z",
-                        fill: "none"
-                    }),
-                    /*#__PURE__*/ jsx("path", {
-                        d: "M20 11a8.1 8.1 0 0 0 -15.5 -2m-.5 -4v4h4"
-                    }),
-                    /*#__PURE__*/ jsx("path", {
-                        d: "M4 13a8.1 8.1 0 0 0 15.5 2m.5 4v-4h-4"
-                    })
-                ]
-            })
-        }),
-        name: field.name,
-        value: field.state.value || '',
-        onChange: (e)=>field.handleChange(e.target.value),
-        onBlur: field.handleBlur,
-        error: field.state.meta.errors.map((error)=>error.message).join(', '),
-        ...props
-    });
-};
-export { TextPassowrdField };

package/dist/ui/scrollArea/ScrollArea.d.ts

@@ -1,62 +0,0 @@
-import type { ScrollAreaContextValue, ScrollAreaProps } from './types';
-/**
- * ScrollArea Component - Расширенная область прокрутки с автоскроллом
- *
- * @example
- * // Базовое использование
- * <ScrollArea h={300}>
- *   <div>Контент для прокрутки</div>
- * </ScrollArea>
- *
- * @example
- * // С автоскроллом и кнопкой
- * <ScrollArea autoScroll scrollToBottomOnInit h={400}>
- *   <div>Чат сообщения...</div>
- *   <ScrollArea.ScrollButton className="absolute bottom-4 right-4" />
- * </ScrollArea>
- *
- * @example
- * // С кастомными настройками
- * <ScrollArea
- *   autoScroll={true}
- *   animated={true}
- *   nearThreshold={50}
- *   h={300}
- *   scrollbarSize={6}
- *   type="hover"
- * >
- *   {messages.map(msg => <div key={msg.id}>{msg.text}</div>)}
- *   <ScrollArea.ScrollButton
- *     className="absolute bottom-4 right-4"
- *     upIcon={<CustomUpIcon />}
- *     downIcon={<CustomDownIcon />}
- *   />
- * </ScrollArea>
- *
- * @example
- * // Использование хука для доступа к viewport
- * function CustomControl() {
- *   const { isAtBottom, scrollToBottom, viewportRef } = useScrollArea();
- *
- *   const scrollToElement = () => {
- *     const target = viewportRef.current?.querySelector('[data-target]');
- *     target?.scrollIntoView();
- *   };
- *
- *   return (
- *     <button onClick={scrollToBottom} disabled={isAtBottom}>
- *       Прокрутить вниз
- *     </button>
- *   );
- * }
- */
-export declare const ScrollArea: {
-    ({ children, autoScroll, scrollToBottomOnInit, animated, nearThreshold, radius, ...mantineProps }: ScrollAreaProps): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-} & {
-    ScrollButton: {
-        ({ className }: import("./types").ScrollButtonProps): import("react/jsx-runtime").JSX.Element | null;
-        displayName: string;
-    };
-    Provider: import("react").Provider<ScrollAreaContextValue | null>;
-};

package/dist/ui/scrollArea/ScrollArea.js

@@ -1,30 +0,0 @@
-import { jsx } from "react/jsx-runtime";
-import { ScrollAreaProvider } from "./context.js";
-import { ScrollAreaButton } from "./ScrollAreaButton.js";
-import { ScrollAreaContent } from "./ScrollAreaContent.js";
-import { useScrollAreaState } from "./useScrollArea.js";
-const ScrollAreaRoot = ({ children, autoScroll = false, scrollToBottomOnInit = false, animated = true, nearThreshold = 100, radius, ...mantineProps })=>{
-    const scrollAreaValue = useScrollAreaState({
-        autoScroll,
-        scrollToBottomOnInit,
-        animated,
-        nearThreshold
-    });
-    const contextValue = {
-        ...scrollAreaValue,
-        radius,
-        mantineProps
-    };
-    return /*#__PURE__*/ jsx(ScrollAreaProvider, {
-        value: contextValue,
-        children: /*#__PURE__*/ jsx(ScrollAreaContent, {
-            children: children
-        })
-    });
-};
-ScrollAreaRoot.displayName = 'ScrollArea';
-const ScrollArea = Object.assign(ScrollAreaRoot, {
-    ScrollButton: ScrollAreaButton,
-    Provider: ScrollAreaProvider
-});
-export { ScrollArea };

package/dist/ui/scrollArea/ScrollAreaButton.d.ts

@@ -1,5 +0,0 @@
-import type { ScrollButtonProps } from './types';
-export declare const ScrollAreaButton: {
-    ({ className }: ScrollButtonProps): import("react/jsx-runtime").JSX.Element | null;
-    displayName: string;
-};

package/dist/ui/scrollArea/ScrollAreaButton.js

@@ -1,51 +0,0 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import { ActionIcon } from "@mantine/core";
-import { useScrollArea } from "./context.js";
-const ScrollAreaButton = ({ className })=>{
-    const { hasScrollableContent, isAboveCenter, scrollToTop, scrollToBottom } = useScrollArea();
-    if (!hasScrollableContent) return null;
-    const isScrollingDown = isAboveCenter;
-    const icon = /*#__PURE__*/ jsxs("svg", {
-        xmlns: "http://www.w3.org/2000/svg",
-        width: "24",
-        height: "24",
-        viewBox: "0 0 24 24",
-        fill: "none",
-        stroke: "currentColor",
-        strokeWidth: "1.5",
-        strokeLinecap: "round",
-        strokeLinejoin: "round",
-        role: "img",
-        "aria-label": "Chevron",
-        style: {
-            transition: 'transform 0.2s ease-in-out',
-            transform: isScrollingDown ? 'rotate(-180deg)' : 'rotate(0deg)'
-        },
-        children: [
-            /*#__PURE__*/ jsx("path", {
-                stroke: "none",
-                d: "M0 0h24v24H0z",
-                fill: "none"
-            }),
-            /*#__PURE__*/ jsx("path", {
-                d: "M6 9l6 6l6 -6"
-            })
-        ]
-    });
-    const handleClick = ()=>{
-        if (isScrollingDown) scrollToBottom();
-        else scrollToTop();
-    };
-    return /*#__PURE__*/ jsx(ActionIcon, {
-        pos: "absolute",
-        bottom: 16,
-        right: 16,
-        variant: "light",
-        onClick: handleClick,
-        className: className,
-        "aria-label": isScrollingDown ? 'Scroll to bottom' : 'Scroll to top',
-        children: icon
-    });
-};
-ScrollAreaButton.displayName = 'ScrollArea.ScrollButton';
-export { ScrollAreaButton };

package/dist/ui/scrollArea/ScrollAreaContent.d.ts

@@ -1,6 +0,0 @@
-export declare const ScrollAreaContent: {
-    ({ children, }: {
-        children: React.ReactNode;
-    }): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};

package/dist/ui/scrollArea/ScrollAreaContent.js

@@ -1,29 +0,0 @@
-import { jsx } from "react/jsx-runtime";
-import { Box, ScrollArea, getRadius } from "@mantine/core";
-import { useContext } from "react";
-import { ScrollAreaContext } from "./context.js";
-const ScrollAreaContent = ({ children })=>{
-    const fullContext = useContext(ScrollAreaContext);
-    if (!fullContext) throw new Error('ScrollAreaContent must be used within ScrollArea');
-    const { _callbackRef, mantineProps, radius, _contentResizeRef } = fullContext;
-    return /*#__PURE__*/ jsx(ScrollArea, {
-        classNames: {
-            viewport: 'rolder-scroll-area-viewport',
-            content: 'rolder-scroll-area-content',
-            scrollbar: 'rolder-scroll-area-scrollbar'
-        },
-        style: {
-            '--radius': radius ? getRadius(radius) : void 0
-        },
-        ...mantineProps,
-        viewportRef: _callbackRef,
-        children: /*#__PURE__*/ jsx(Box, {
-            h: "100%",
-            w: "100%",
-            ref: _contentResizeRef,
-            children: children
-        })
-    });
-};
-ScrollAreaContent.displayName = 'ScrollArea.Content';
-export { ScrollAreaContent };

package/dist/ui/scrollArea/context.d.ts

@@ -1,28 +0,0 @@
-import type { ScrollAreaContextValue, ScrollAreaHook } from './types';
-/** Внутренний контекст для передачи состояния ScrollArea */
-export declare const ScrollAreaContext: import("react").Context<ScrollAreaContextValue | null>;
-export declare const ScrollAreaProvider: import("react").Provider<ScrollAreaContextValue | null>;
-/**
- * Хук для доступа к состоянию и методам ScrollArea
- *
- * @returns Объект с индикаторами позиции, методами управления и ref на viewport
- *
- * @example
- * ```tsx
- * function MyComponent() {
- *   const { isAtBottom, scrollToTop, viewportRef } = useScrollArea();
- *
- *   const scrollToElement = () => {
- *     const target = viewportRef.current?.querySelector('[data-target]');
- *     target?.scrollIntoView();
- *   };
- *
- *   return (
- *     <button onClick={scrollToTop} disabled={isAtTop}>
- *       В начало
- *     </button>
- *   );
- * }
- * ```
- */
-export declare const useScrollArea: () => ScrollAreaHook;

package/dist/ui/scrollArea/context.js

@@ -1,10 +0,0 @@
-import { createContext, useContext } from "react";
-const ScrollAreaContext = /*#__PURE__*/ createContext(null);
-const ScrollAreaProvider = ScrollAreaContext.Provider;
-const useScrollArea = ()=>{
-    const context = useContext(ScrollAreaContext);
-    if (!context) throw new Error('useScrollArea must be used within ScrollArea');
-    const { _callbackRef, mantineProps: _, radius: __, ...publicAPI } = context;
-    return publicAPI;
-};
-export { ScrollAreaContext, ScrollAreaProvider, useScrollArea };

package/dist/ui/scrollArea/types.d.ts

@@ -1,65 +0,0 @@
-import type { MantineRadius, ScrollAreaProps as MantineScrollAreaProps } from '@mantine/core';
-import type { ReactNode } from 'react';
-export interface ScrollAreaProps extends Omit<MantineScrollAreaProps, 'children'> {
-    /** Включение автоскролла при добавлении контента (по умолчанию false) */
-    autoScroll?: boolean;
-    /** Прокрутить к концу при инициализации компонента (по умолчанию false) */
-    scrollToBottomOnInit?: boolean;
-    /** Анимированная прокрутка (по умолчанию true) */
-    animated?: boolean;
-    /** Отступ для near-зон в пикселях (по умолчанию 100) */
-    nearThreshold?: number;
-    /** Радиус для viewport и scrollbar на тот случай, когда они "торчат" углами*/
-    radius?: MantineRadius;
-    /** Дочерние элементы - автоматически оборачиваются в ScrollArea.Content */
-    children: ReactNode;
-}
-export interface ScrollAreaHook {
-    /** Точно в начале (scrollTop === 0) */
-    isAtTop: boolean;
-    /** В пределах nearThreshold от начала */
-    isNearTop: boolean;
-    /** Точно в конце (scrollTop + clientHeight >= scrollHeight) */
-    isAtBottom: boolean;
-    /** В пределах nearThreshold от конца */
-    isNearBottom: boolean;
-    /** Выше центральной точки области прокрутки */
-    isAboveCenter: boolean;
-    /** Есть контент требующий прокрутки */
-    hasScrollableContent: boolean;
-    /** Прокрутить к началу области */
-    scrollToTop: (animated?: boolean) => void;
-    /** Прокрутить к концу области */
-    scrollToBottom: (animated?: boolean) => void;
-    /** React ref на viewport элемент для прямого доступа к DOM */
-    viewportRef: React.RefObject<HTMLDivElement | null>;
-}
-export interface ScrollAreaState extends ScrollAreaHook {
-    /** Внутренний callback ref для подключения к Mantine ScrollArea */
-    _callbackRef: (node: HTMLDivElement | null) => void;
-    /** Внутренний ref для наблюдения за изменениями контента */
-    _contentResizeRef: (node: HTMLDivElement | null) => void;
-}
-export interface ScrollAreaContextValue extends ScrollAreaState {
-    /** Радиус для viewport и scrollbar на тот случай, когда они "торчат" углами*/
-    radius?: MantineRadius;
-    /** Пропсы Mantine ScrollArea, переданные в корневой компонент */
-    mantineProps: Omit<MantineScrollAreaProps, 'children'>;
-}
-export interface ScrollButtonProps {
-    /** CSS классы для стилизации кнопки */
-    className?: string;
-    /** Иконка для прокрутки вверх (по умолчанию IconChevronUp) */
-    upIcon?: ReactNode;
-    /** Иконка для прокрутки вниз (по умолчанию IconChevronDown) */
-    downIcon?: ReactNode;
-}
-/** Внутренний тип для отслеживания позиции скролла */
-export interface ScrollPosition {
-    /** Текущая позиция скролла сверху */
-    scrollTop: number;
-    /** Высота видимой области */
-    clientHeight: number;
-    /** Общая высота прокручиваемого контента */
-    scrollHeight: number;
-}

package/dist/ui/scrollArea/useScrollArea.d.ts

@@ -1,9 +0,0 @@
-import type { ScrollAreaState } from './types';
-interface UseScrollAreaOptions {
-    autoScroll?: boolean;
-    scrollToBottomOnInit?: boolean;
-    animated?: boolean;
-    nearThreshold?: number;
-}
-export declare const useScrollAreaState: (options?: UseScrollAreaOptions) => ScrollAreaState;
-export {};

package/dist/ui/scrollArea/useScrollArea.js

@@ -1,146 +0,0 @@
-import { useDebouncedCallback, useMergedRef, useResizeObserver } from "@mantine/hooks";
-import { useCallback, useEffect, useRef, useState } from "react";
-const useScrollAreaState = (options = {})=>{
-    const { autoScroll = false, scrollToBottomOnInit = false, animated = true, nearThreshold = 32 } = options;
-    const scrollAreaRef = useRef(null);
-    const isUserInteractingRef = useRef(false);
-    const userInteractionTimeoutRef = useRef(void 0);
-    const isInitializedRef = useRef(false);
-    const [contentResizeRef, contentRect] = useResizeObserver();
-    const [scrollPosition, setScrollPosition] = useState({
-        scrollTop: 0,
-        clientHeight: 0,
-        scrollHeight: 0
-    });
-    const isAtTop = 0 === scrollPosition.scrollTop;
-    const isAtBottom = scrollPosition.scrollTop + scrollPosition.clientHeight >= scrollPosition.scrollHeight;
-    const isNearTop = scrollPosition.scrollTop <= nearThreshold;
-    const isNearBottom = scrollPosition.scrollTop + scrollPosition.clientHeight >= scrollPosition.scrollHeight - nearThreshold;
-    const isAboveCenter = scrollPosition.scrollTop < (scrollPosition.scrollHeight - scrollPosition.clientHeight) / 2;
-    const hasScrollableContent = scrollPosition.scrollHeight > scrollPosition.clientHeight;
-    const debouncedUpdatePosition = useDebouncedCallback((element)=>{
-        const newPosition = {
-            scrollTop: element.scrollTop,
-            clientHeight: element.clientHeight,
-            scrollHeight: element.scrollHeight
-        };
-        setScrollPosition(newPosition);
-    }, {
-        delay: 16
-    });
-    const scrollToTop = useCallback((isAnimated)=>{
-        const element = scrollAreaRef.current;
-        if (!element) return;
-        const shouldAnimate = isAnimated ?? animated;
-        if (shouldAnimate) element.scrollTo({
-            top: 0,
-            behavior: 'smooth'
-        });
-        else element.scrollTop = 0;
-    }, [
-        animated
-    ]);
-    const scrollToBottom = useCallback((isAnimated)=>{
-        const element = scrollAreaRef.current;
-        if (!element) return;
-        const shouldAnimate = isAnimated ?? animated;
-        if (shouldAnimate) element.scrollTo({
-            top: element.scrollHeight,
-            behavior: 'smooth'
-        });
-        else element.scrollTop = element.scrollHeight;
-        const scrollHeightBefore = element.scrollHeight;
-        setTimeout(()=>{
-            const scrollHeightAfter = element.scrollHeight;
-            const diff = element.scrollHeight - (element.scrollTop + element.clientHeight);
-            if (diff > 1 && scrollHeightAfter !== scrollHeightBefore) element.scrollTop = element.scrollHeight;
-        }, 50);
-    }, [
-        animated
-    ]);
-    const performAutoScroll = useCallback(()=>{
-        if (!autoScroll || isUserInteractingRef.current || !scrollAreaRef.current) return;
-        if (isAtBottom) scrollToBottom(false);
-    }, [
-        autoScroll,
-        isAtBottom,
-        scrollToBottom
-    ]);
-    const handleUserInteraction = useCallback(()=>{
-        isUserInteractingRef.current = true;
-        if (userInteractionTimeoutRef.current) clearTimeout(userInteractionTimeoutRef.current);
-        userInteractionTimeoutRef.current = setTimeout(()=>{
-            isUserInteractingRef.current = false;
-        }, 150);
-    }, []);
-    const handleScroll = useCallback((event)=>{
-        const element = event.target;
-        debouncedUpdatePosition(element);
-    }, [
-        debouncedUpdatePosition
-    ]);
-    useEffect(()=>{
-        if (!scrollToBottomOnInit || isInitializedRef.current) return;
-        if (hasScrollableContent) {
-            scrollToBottom(animated);
-            isInitializedRef.current = true;
-        }
-    }, [
-        scrollToBottomOnInit,
-        hasScrollableContent,
-        scrollToBottom,
-        animated
-    ]);
-    useEffect(()=>{
-        const element = scrollAreaRef.current;
-        if (!element || 0 === contentRect.height) return;
-        debouncedUpdatePosition(element);
-        const timeoutId = setTimeout(performAutoScroll, 10);
-        return ()=>clearTimeout(timeoutId);
-    }, [
-        contentRect.height,
-        debouncedUpdatePosition,
-        performAutoScroll
-    ]);
-    useEffect(()=>{
-        const element = scrollAreaRef.current;
-        if (!element) return;
-        const events = [
-            'wheel',
-            'touchstart',
-            'touchmove',
-            'mousedown'
-        ];
-        element.addEventListener('scroll', handleScroll);
-        events.forEach((event)=>{
-            element.addEventListener(event, handleUserInteraction);
-        });
-        debouncedUpdatePosition(element);
-        return ()=>{
-            element.removeEventListener('scroll', handleScroll);
-            events.forEach((event)=>{
-                element.removeEventListener(event, handleUserInteraction);
-            });
-            if (userInteractionTimeoutRef.current) clearTimeout(userInteractionTimeoutRef.current);
-        };
-    }, [
-        handleScroll,
-        handleUserInteraction,
-        debouncedUpdatePosition
-    ]);
-    const callbackRef = useMergedRef(scrollAreaRef);
-    return {
-        isAtTop,
-        isNearTop,
-        isAtBottom,
-        isNearBottom,
-        isAboveCenter,
-        hasScrollableContent,
-        scrollToTop,
-        scrollToBottom,
-        viewportRef: scrollAreaRef,
-        _callbackRef: callbackRef,
-        _contentResizeRef: contentResizeRef
-    };
-};
-export { useScrollAreaState };