@astral/ui 4.86.0 → 4.87.0

package/components/useScroll/useScroll.d.ts

@@ -0,0 +1,9 @@
+import { type RefObject } from 'react';
+export interface IState {
+    x: number;
+    y: number;
+}
+/**
+ * Хук отслеживает позицию скролла внутри HTML-элемента, на который передан ref.
+ */
+export declare const useScroll: (ref: RefObject<HTMLElement | null>) => IState;

package/components/useScroll/useScroll.js

@@ -0,0 +1,39 @@
+import { useEffect } from 'react';
+import { useRafState } from '../useRafState';
+import { addEventListenerSafe } from '../utils/addEventListenerSafe';
+import { removeEventListenerSafe } from '../utils/removeEventListenerSafe';
+/**
+ * Хук отслеживает позицию скролла внутри HTML-элемента, на который передан ref.
+ */
+export const useScroll = (ref) => {
+    if (process.env.NODE_ENV === 'development' &&
+        (typeof ref !== 'object' || typeof ref.current === 'undefined')) {
+        throw new Error('`useScroll` expects a single ref argument.');
+    }
+    const [state, setState] = useRafState({
+        x: 0,
+        y: 0,
+    });
+    useEffect(() => {
+        const handler = () => {
+            if (ref.current) {
+                setState({
+                    x: ref.current.scrollLeft,
+                    y: ref.current.scrollTop,
+                });
+            }
+        };
+        if (ref.current) {
+            addEventListenerSafe(ref.current, 'scroll', handler, {
+                capture: false,
+                passive: true,
+            });
+        }
+        return () => {
+            if (ref.current) {
+                removeEventListenerSafe(ref.current, 'scroll', handler);
+            }
+        };
+    }, [ref]);
+    return state;
+};

package/components/useSet/index.d.ts

@@ -1 +1 @@
-export { useSet } from './useSet';
+export * from './useSet';

package/components/useSet/index.js

@@ -1 +1 @@
-export { useSet } from './useSet';
+export * from './useSet';

package/components/useSet/public.d.ts

@@ -1 +1 @@
-export { useSet } from './useSet';
+export * from './useSet';

package/components/useSet/public.js

@@ -1 +1 @@
-export { useSet } from './useSet';
+export * from './useSet';

package/components/useSet/useSet.d.ts

@@ -1 +1,14 @@
-export { useSet } from 'react-use';
+export interface IStableActions<TKey> {
+    add: (key: TKey) => void;
+    remove: (key: TKey) => void;
+    toggle: (key: TKey) => void;
+    reset: () => void;
+    clear: () => void;
+}
+export interface IActions<TKey> extends IStableActions<TKey> {
+    has: (key: TKey) => boolean;
+}
+/**
+ * Хук отслеживает состояние Set и предоставляет методы для его изменения.
+ */
+export declare const useSet: <TKey>(initialSet?: Set<TKey>) => [Set<TKey>, IActions<TKey>];

package/components/useSet/useSet.js

@@ -1 +1,26 @@
-export { useSet } from 'react-use';
+import { useCallback, useMemo, useState } from 'react';
+/**
+ * Хук отслеживает состояние Set и предоставляет методы для его изменения.
+ */
+export const useSet = (initialSet = new Set()) => {
+    const [set, setSet] = useState(initialSet);
+    const stableActions = useMemo(() => {
+        const add = (item) => setSet((prevSet) => new Set([...Array.from(prevSet), item]));
+        const remove = (item) => setSet((prevSet) => new Set(Array.from(prevSet).filter((i) => i !== item)));
+        const toggle = (item) => setSet((prevSet) => prevSet.has(item)
+            ? new Set(Array.from(prevSet).filter((i) => i !== item))
+            : new Set([...Array.from(prevSet), item]));
+        return {
+            add,
+            remove,
+            toggle,
+            reset: () => setSet(initialSet),
+            clear: () => setSet(new Set()),
+        };
+    }, [setSet]);
+    const utils = {
+        has: useCallback((item) => set.has(item), [set]),
+        ...stableActions,
+    };
+    return [set, utils];
+};

package/components/useSize/index.d.ts

@@ -0,0 +1 @@
+export { default as useSize } from './useSize';

package/components/useSize/index.js

@@ -0,0 +1 @@
+export { default as useSize } from './useSize';

package/components/useSize/public.d.ts

@@ -0,0 +1 @@
+export { default as useSize } from './useSize';

package/components/useSize/public.js

@@ -0,0 +1 @@
+export { default as useSize } from './useSize';

package/components/useSize/useSize.d.ts

@@ -0,0 +1,17 @@
+import * as React from 'react';
+type ElementProps = {
+    style?: React.CSSProperties;
+    children?: React.ReactNode;
+};
+export type Element = ((state: IState) => React.ReactElement<ElementProps>) | React.ReactElement<ElementProps>;
+export interface IState {
+    width: number;
+    height: number;
+}
+/**
+ * Хук отслеживает размеры HTML-элемента.
+ * Создает iframe, который растягивается на весь размер элемента и слушает событие resize.
+ */
+export declare const useSize: (element: Element, { width, height }?: Partial<IState>) => [React.ReactElement<ElementProps>, IState];
+declare const useSizeExport: (element: Element, { width, height }?: Partial<IState>) => [React.ReactElement<ElementProps>, IState];
+export default useSizeExport;

package/components/useSize/useSize.js

@@ -0,0 +1,79 @@
+import * as React from 'react';
+import { addEventListenerSafe } from '../utils/addEventListenerSafe';
+import { isBrowser } from '../utils/isBrowser';
+import { removeEventListenerSafe } from '../utils/removeEventListenerSafe';
+const { useState, useEffect, useRef } = React;
+const defer = (callback) => setTimeout(callback, 35);
+/**
+ * Хук отслеживает размеры HTML-элемента.
+ * Создает iframe, который растягивается на весь размер элемента и слушает событие resize.
+ */
+export const useSize = (element, { width = Infinity, height = Infinity } = {}) => {
+    const [state, setState] = useState({ width, height });
+    const elementNode = typeof element === 'function' ? element(state) : element;
+    const style = elementNode.props.style || {};
+    const ref = useRef(null);
+    let window = null;
+    const setSize = () => {
+        const iframe = ref.current;
+        const size = iframe
+            ? {
+                width: iframe.offsetWidth,
+                height: iframe.offsetHeight,
+            }
+            : { width, height };
+        setState(size);
+    };
+    const onWindow = (windowToListenOn) => {
+        addEventListenerSafe(windowToListenOn, 'resize', setSize);
+        defer(setSize);
+    };
+    useEffect(() => {
+        const iframe = ref.current;
+        if (!iframe) {
+            // iframe will be undefined if component is already unmounted
+            return;
+        }
+        if (iframe.contentWindow) {
+            window = iframe.contentWindow;
+            onWindow(window);
+        }
+        else {
+            const onLoad = () => {
+                addEventListenerSafe(iframe, 'load', onLoad);
+                window = iframe.contentWindow;
+                onWindow(window);
+            };
+            removeEventListenerSafe(iframe, 'load', onLoad);
+        }
+        return () => {
+            if (window) {
+                removeEventListenerSafe(window, 'resize', setSize);
+            }
+        };
+    }, []);
+    style.position = 'relative';
+    const sized = React.cloneElement(elementNode, { style }, ...[
+        React.createElement('iframe', {
+            ref,
+            style: {
+                background: 'transparent',
+                border: 'none',
+                height: '100%',
+                left: 0,
+                position: 'absolute',
+                top: 0,
+                width: '100%',
+                zIndex: -1,
+            },
+        }),
+        ...React.Children.toArray(elementNode.props.children),
+    ]);
+    return [sized, state];
+};
+const useSizeFallback = ((element, { width = Infinity, height = Infinity } = {}) => [
+    typeof element === 'function' ? element({ width, height }) : element,
+    { width, height },
+]);
+const useSizeExport = isBrowser ? useSize : useSizeFallback;
+export default useSizeExport;

package/components/useToggle/useToggle.d.ts

@@ -37,6 +37,7 @@ type UseToggleOptions<TCloseArgs extends Arguments, TOpenArgs extends Arguments>
     onInactive?: CloseHandler<TCloseArgs>;
 };
 /**
+ * @deprecated
  * хук хранящий стейт активности, и предоставляющий методы переключения с проксируемыми аргументами, позволяет уменьшить бойлерплейт код
  */
 export declare const useToggle: <TCloseArgs extends Arguments, TOpenArgs extends Arguments>(params?: UseToggleOptions<TCloseArgs, TOpenArgs> | undefined) => UseToggleResultTuple<TCloseArgs, TOpenArgs>;

package/components/useToggle/useToggle.js

@@ -1,5 +1,6 @@
 import { useState } from 'react';
 /**
+ * @deprecated
  * хук хранящий стейт активности, и предоставляющий методы переключения с проксируемыми аргументами, позволяет уменьшить бойлерплейт код
  */
 export const useToggle = (params) => {

package/components/useUpdateEffect/index.d.ts

@@ -1 +1 @@
-export { useUpdateEffect } from './useUpdateEffect';
+export * from './useUpdateEffect';

package/components/useUpdateEffect/index.js

@@ -1 +1 @@
-export { useUpdateEffect } from './useUpdateEffect';
+export * from './useUpdateEffect';

package/components/useUpdateEffect/public.d.ts

@@ -1 +1 @@
-export { useUpdateEffect } from './useUpdateEffect';
+export * from './useUpdateEffect';

package/components/useUpdateEffect/public.js

@@ -1 +1 @@
-export { useUpdateEffect } from './useUpdateEffect';
+export * from './useUpdateEffect';

package/components/useUpdateEffect/useUpdateEffect.d.ts

@@ -1 +1,5 @@
-export { useUpdateEffect } from 'react-use';
+import { useEffect } from 'react';
+/**
+ * Хук, который выполняет эффект только после первого монтирования компонента.
+ */
+export declare const useUpdateEffect: typeof useEffect;

package/components/useUpdateEffect/useUpdateEffect.js

@@ -1 +1,13 @@
-export { useUpdateEffect } from 'react-use';
+import { useEffect } from 'react';
+import { useFirstMountState } from '../useFirstMountState';
+/**
+ * Хук, который выполняет эффект только после первого монтирования компонента.
+ */
+export const useUpdateEffect = (effect, deps) => {
+    const isFirstMount = useFirstMountState();
+    useEffect(() => {
+        if (!isFirstMount) {
+            return effect();
+        }
+    }, deps);
+};

package/components/useWindowScroll/index.d.ts

@@ -0,0 +1 @@
+export * from './useWindowScroll';

package/components/useWindowScroll/index.js

@@ -0,0 +1 @@
+export * from './useWindowScroll';

package/components/useWindowScroll/public.d.ts

@@ -0,0 +1 @@
+export * from './useWindowScroll';

package/components/useWindowScroll/public.js

@@ -0,0 +1 @@
+export * from './useWindowScroll';

package/components/useWindowScroll/useWindowScroll.d.ts

@@ -0,0 +1,8 @@
+export interface IState {
+    x: number;
+    y: number;
+}
+/**
+ * Хук отслеживает позицию скролла в окне браузера.
+ */
+export declare const useWindowScroll: () => IState;

package/components/useWindowScroll/useWindowScroll.js

@@ -0,0 +1,40 @@
+import { useEffect } from 'react';
+import { useRafState } from '../useRafState';
+import { addEventListenerSafe } from '../utils/addEventListenerSafe';
+import { isBrowser } from '../utils/isBrowser';
+import { removeEventListenerSafe } from '../utils/removeEventListenerSafe';
+/**
+ * Хук отслеживает позицию скролла в окне браузера.
+ */
+export const useWindowScroll = () => {
+    const [state, setState] = useRafState(() => ({
+        x: isBrowser ? window.pageXOffset : 0,
+        y: isBrowser ? window.pageYOffset : 0,
+    }));
+    useEffect(() => {
+        const handler = () => {
+            setState((newState) => {
+                const { pageXOffset, pageYOffset } = window;
+                //Check state for change, return same state if no change happened to prevent rerender
+                //(see useState/setState documentation). useState/setState is used internally in useRafState/setState.
+                return newState.x !== pageXOffset || newState.y !== pageYOffset
+                    ? {
+                        x: pageXOffset,
+                        y: pageYOffset,
+                    }
+                    : newState;
+            });
+        };
+        //We have to update window scroll at mount, before subscription.
+        //Window scroll may be changed between render and effect handler.
+        handler();
+        addEventListenerSafe(window, 'scroll', handler, {
+            capture: false,
+            passive: true,
+        });
+        return () => {
+            removeEventListenerSafe(window, 'scroll', handler);
+        };
+    }, []);
+    return state;
+};

package/components/utils/addEventListenerSafe/addEventListenerSafe.d.ts

@@ -0,0 +1 @@
+export declare function addEventListenerSafe<T extends Window | Document | HTMLElement | EventTarget>(obj: T | null, ...args: Parameters<T['addEventListener']>): void;

package/components/utils/addEventListenerSafe/addEventListenerSafe.js

@@ -0,0 +1,5 @@
+export function addEventListenerSafe(obj, ...args) {
+    if (obj?.addEventListener) {
+        obj.addEventListener(...args);
+    }
+}

package/components/utils/addEventListenerSafe/index.d.ts

@@ -0,0 +1 @@
+export * from './addEventListenerSafe';

package/components/utils/addEventListenerSafe/index.js

@@ -0,0 +1 @@
+export * from './addEventListenerSafe';

package/components/utils/isBrowser/index.d.ts

@@ -0,0 +1 @@
+export * from './isBrowser';

package/components/utils/isBrowser/index.js

@@ -0,0 +1 @@
+export * from './isBrowser';

package/components/utils/isBrowser/isBrowser.d.ts

@@ -0,0 +1 @@
+export declare const isBrowser: boolean;

package/components/utils/isBrowser/isBrowser.js

@@ -0,0 +1 @@
+export const isBrowser = typeof window !== 'undefined';

package/components/utils/removeEventListenerSafe/index.d.ts

@@ -0,0 +1 @@
+export * from './removeEventListenerSafe';

package/components/utils/removeEventListenerSafe/index.js

@@ -0,0 +1 @@
+export * from './removeEventListenerSafe';

package/components/utils/removeEventListenerSafe/removeEventListenerSafe.d.ts

@@ -0,0 +1 @@
+export declare function removeEventListenerSafe<T extends Window | Document | HTMLElement | EventTarget>(obj: T | null, ...args: Parameters<T['removeEventListener']>): void;

package/components/utils/removeEventListenerSafe/removeEventListenerSafe.js

@@ -0,0 +1,5 @@
+export function removeEventListenerSafe(obj, ...args) {
+    if (obj?.removeEventListener) {
+        obj.removeEventListener(...args);
+    }
+}

package/components/utils/replaceRaf/constants.d.ts

@@ -0,0 +1 @@
+export declare const defaultFrameDuration: number;

package/components/utils/replaceRaf/constants.js

@@ -0,0 +1 @@
+export const defaultFrameDuration = 1000 / 60;

package/components/utils/replaceRaf/index.d.ts

@@ -0,0 +1 @@
+export * from './replaceRaf';

package/components/utils/replaceRaf/index.js

@@ -0,0 +1 @@
+export * from './replaceRaf';

package/components/utils/replaceRaf/replaceRaf.d.ts

@@ -0,0 +1,18 @@
+export type Stub = {
+    add: (cb: Function) => number;
+    remove: (id: number) => void;
+    flush: (duration?: number) => void;
+    reset: () => void;
+    step: (steps?: number, duration?: number) => void;
+};
+export declare function createStub(frameDuration?: number, startTime?: number): Stub;
+type ReplaceRafOptions = {
+    frameDuration?: number;
+    startTime?: number;
+};
+type ReplaceRafRoot = {
+    requestAnimationFrame: (callback: FrameRequestCallback) => number;
+    cancelAnimationFrame: (handle: number) => void;
+};
+export declare function replaceRaf(roots?: ReplaceRafRoot[], { frameDuration, startTime, }?: ReplaceRafOptions): void;
+export {};

package/components/utils/replaceRaf/replaceRaf.js

@@ -0,0 +1,81 @@
+import { defaultFrameDuration } from './constants';
+const now = () => {
+    if (performance) {
+        return performance.now();
+    }
+    return Date.now();
+};
+export function createStub(frameDuration = defaultFrameDuration, startTime = now()) {
+    const frames = [];
+    let frameId = 0;
+    let currentTime = startTime;
+    const add = (cb) => {
+        const id = ++frameId;
+        const callback = (time) => {
+            cb(time);
+            // remove callback from frames after calling it
+            remove(id);
+        };
+        frames.push({
+            id,
+            callback,
+        });
+        return id;
+    };
+    const remove = (id) => {
+        const index = frames.findIndex((frame) => frame.id === id);
+        if (index === -1) {
+            return;
+        }
+        // remove frame from array
+        frames.splice(index, 1);
+    };
+    const flush = (duration = frameDuration) => {
+        while (frames.length) {
+            step(1, duration);
+        }
+    };
+    const reset = () => {
+        frames.length = 0;
+        currentTime = startTime;
+    };
+    const step = (steps = 1, duration = frameDuration) => {
+        if (steps === 0) {
+            return;
+        }
+        // This line can cause a precision error if both `currentTime`
+        // and `duration` are numbers with decimal components.
+        currentTime = currentTime + duration;
+        const shallow = frames.slice(0);
+        shallow.forEach((frame) => {
+            frame.callback(currentTime);
+        });
+        return step(steps - 1, duration);
+    };
+    const api = {
+        add,
+        remove,
+        reset,
+        flush,
+        step,
+    };
+    return api;
+}
+export function replaceRaf(roots = [], { frameDuration = defaultFrameDuration, startTime = now(), } = {}) {
+    // automatic usage of 'window' or 'global' if no roots are provided
+    if (!roots.length) {
+        roots.push(typeof window !== 'undefined' ? window : global);
+    }
+    // all roots share the same stub
+    const stub = createStub(frameDuration, startTime);
+    roots.forEach((root) => {
+        root.requestAnimationFrame = stub.add;
+        // $FlowFixMe - incorrect typing
+        Object.assign(root.requestAnimationFrame, {
+            step: stub.step,
+            flush: stub.flush,
+            reset: stub.reset,
+        });
+        root.cancelAnimationFrame = stub.remove;
+    });
+}

package/node/components/NotificationList/ListItem/useLogic/useLogic.js

@@ -2,10 +2,10 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useLogic = void 0;
 const react_1 = require("react");
-const react_use_1 = require("react-use");
+const useIntersection_1 = require("../../../useIntersection");
 const useLogic = ({ id, onDelete, onViewNotification, isUnread, }) => {
     const ref = (0, react_1.useRef)(null);
-    const entry = (0, react_use_1.useIntersection)(ref, {
+    const entry = (0, useIntersection_1.useIntersection)(ref, {
         root: null,
         threshold: 0.95,
     });

package/node/components/createGlobalState/createGlobalState.d.ts

@@ -0,0 +1,6 @@
+import { type IHookStateInitAction, type IHookStateSetAction } from './utils/types';
+export declare function createGlobalState<TState>(initialState: IHookStateInitAction<TState>): () => [TState, (state: IHookStateSetAction<TState>) => void];
+export declare function createGlobalState<TState = undefined>(): () => [
+    TState,
+    (state: IHookStateSetAction<TState>) => void
+];

package/node/components/createGlobalState/createGlobalState.js

@@ -0,0 +1,29 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createGlobalState = void 0;
+const react_1 = require("react");
+const useIsomorphicLayoutEffect_1 = require("../useIsomorphicLayoutEffect");
+const resolveHookState_1 = require("./utils/resolveHookState");
+function createGlobalState(initialState) {
+    const store = {
+        state: initialState instanceof Function ? initialState() : initialState,
+        setState(nextState) {
+            store.state = (0, resolveHookState_1.resolveHookState)(nextState, store.state);
+            store.setters.forEach((setter) => setter(store.state));
+        },
+        setters: [],
+    };
+    return () => {
+        const [globalState, stateSetter] = (0, react_1.useState)(store.state);
+        (0, react_1.useEffect)(() => () => {
+            store.setters = store.setters.filter((setter) => setter !== stateSetter);
+        }, []);
+        (0, useIsomorphicLayoutEffect_1.useIsomorphicLayoutEffect)(() => {
+            if (!store.setters.includes(stateSetter)) {
+                store.setters.push(stateSetter);
+            }
+        });
+        return [globalState, store.setState];
+    };
+}
+exports.createGlobalState = createGlobalState;

package/node/components/createGlobalState/index.d.ts

@@ -0,0 +1 @@
+export * from './createGlobalState';

package/node/components/createGlobalState/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./createGlobalState"), exports);

package/node/components/createGlobalState/public.d.ts

@@ -0,0 +1 @@
+export * from './createGlobalState';

package/node/components/createGlobalState/public.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./createGlobalState"), exports);

package/node/components/createGlobalState/utils/index.d.ts

@@ -0,0 +1 @@
+export * from './resolveHookState';

package/node/components/createGlobalState/utils/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./resolveHookState"), exports);

package/node/components/createGlobalState/utils/resolveHookState/index.d.ts

@@ -0,0 +1 @@
+export * from './resolveHookState';