@nutui/nutui-react-taro 2.0.0-alpha.0 → 2.0.0-alpha.10

package/dist/esm/sticky.taro-b5bde7b1.js

@@ -1,136 +0,0 @@
-import React__default, { useRef, useEffect, useState, useMemo, useCallback } from 'react';
-import classNames from 'classnames';
-import { getEnv, usePageScroll, getSystemInfoSync } from '@tarojs/taro';
-import { C as ComponentDefaults } from './typings-d8491423.js';
-import { g as getRectByTaro } from './use-client-rect-1f8ed1fe.js';
-import { g as getScrollParent } from './get-scroll-parent-b4a07e65.js';
-
-function useWatch(dep, callback, config = { immediate: false }) {
-    const { immediate } = config;
-    const prev = useRef();
-    const inited = useRef(false);
-    const stop = useRef(false);
-    useEffect(() => {
-        const execute = () => callback(prev.current);
-        if (!stop.current) {
-            if (!inited.current) {
-                inited.current = true;
-                if (immediate) {
-                    execute();
-                }
-            }
-            else {
-                execute();
-            }
-            prev.current = dep;
-        }
-    }, [dep]);
-    return () => {
-        stop.current = true;
-    };
-}
-
-const defaultProps = {
-    ...ComponentDefaults,
-    position: 'top',
-    zIndex: 2000,
-};
-const classPrefix = 'nut-sticky';
-const Sticky = (props) => {
-    const { position, zIndex, threshold, style, children, container, className, onChange, ...rest } = { ...defaultProps, ...props };
-    const stickyRef = useRef(null);
-    const rootRef = useRef(null);
-    const [rootRect, setRootRect] = useState({});
-    const [fixed, setFixed] = useState(false);
-    const [transform, setTransform] = useState(0); // 相对容器偏移距离
-    useWatch(fixed, () => {
-        onChange && onChange(fixed);
-    });
-    const rootStyle = useMemo(() => {
-        if (!fixed) {
-            return {
-                height: '',
-                width: '',
-            };
-        }
-        const style = {};
-        if (rootRect.height) {
-            style.height = rootRect.height;
-        }
-        if (rootRect.width) {
-            style.width = rootRect.width;
-        }
-        return style;
-    }, [fixed, rootRect.height, rootRect.width]);
-    const stickyStyle = useMemo(() => {
-        if (!fixed) {
-            return {
-                height: '',
-                width: '',
-                [position]: '',
-            };
-        }
-        const style = {};
-        if (rootRect.height)
-            style.height = rootRect.height;
-        if (rootRect.width)
-            style.width = rootRect.width;
-        style.transform = `translate3d(0, ${transform}px, 0)`;
-        style[position] = threshold;
-        style.zIndex = zIndex;
-        return style;
-    }, [fixed, rootRect.height, rootRect.width, transform, position]);
-    const handleScroll = async (scrollTop) => {
-        const curRootRect = await getRectByTaro(rootRef.current);
-        const stickyRect = await getRectByTaro(stickyRef.current);
-        if (curRootRect && stickyRect) {
-            setRootRect(curRootRect);
-            if (position === 'top') {
-                if (container) {
-                    const containerRect = await getRectByTaro(container.current);
-                    const difference = containerRect.bottom - threshold - curRootRect.height;
-                    const curTransform = difference < 0 ? difference : 0;
-                    setTransform(curTransform);
-                    const curFixed = threshold > curRootRect.top && containerRect.bottom > 0;
-                    setFixed(curFixed);
-                }
-                else {
-                    setFixed(threshold > curRootRect.top);
-                }
-            }
-            else {
-                const windowHeight = getSystemInfoSync().windowHeight;
-                setFixed(windowHeight - threshold < curRootRect.bottom);
-            }
-        }
-        else {
-            console.log('getRectByTaro获取失败', { stickyRect, curRootRect });
-        }
-    };
-    const getElement = useCallback(() => {
-        return getScrollParent(rootRef.current);
-    }, []);
-    useEffect(() => {
-        if (getEnv() === 'WEB' && getElement() !== window) {
-            window.addEventListener('touchmove', handleScroll, true);
-            window.addEventListener('scroll', handleScroll, true);
-            return () => {
-                window.removeEventListener('touchmove', handleScroll);
-                window.removeEventListener('scroll', handleScroll);
-            };
-        }
-    }, []);
-    usePageScroll((res) => {
-        if (getEnv() === 'WEAPP') {
-            handleScroll(res.scrollTop);
-        }
-    });
-    return (React__default.createElement("div", { ref: rootRef, style: rootStyle, className: classNames(classPrefix, className), ...rest },
-        React__default.createElement("div", { className: classNames('nut-sticky--box', {
-                'nut-sticky--fixed': fixed,
-            }), ref: stickyRef, style: stickyStyle }, children)));
-};
-Sticky.defaultProps = defaultProps;
-Sticky.displayName = 'NutSticky';
-
-export { Sticky as S };

package/dist/esm/subsidenavbar.taro-3cce8442.js

@@ -1,63 +0,0 @@
-import React__default, { useState, useContext, useRef, useCallback, useEffect } from 'react';
-import { O as OffsetContext } from './offsetContext-c2a746fa.js';
-
-const defaultProps = {
-    open: true,
-};
-const SubSideNavBar = (props) => {
-    const { title, key, children, onClick, open, ...rest } = {
-        ...defaultProps,
-        ...props,
-    };
-    const [subShow, setSubShow] = useState(open);
-    const offset = useContext(OffsetContext);
-    const listRef = useRef(null);
-    const setListLevel = useCallback((nodeList, level = 1) => {
-        const titleClass = nodeList[0].className;
-        if (titleClass.includes('nut-subsidenavbar__title')) {
-            const left = offset * (level + 1);
-            nodeList[0].style.paddingLeft = `${left}px`;
-        }
-        const childNodes = nodeList[1] &&
-            nodeList[1].children &&
-            Array.from(nodeList[1].children).filter((item) => item.nodeType !== 3 && item.nodeType !== 8);
-        childNodes.forEach((item) => {
-            const itemClass = item.className;
-            if (itemClass.includes('nut-subsidenavbar__item')) {
-                const left = offset * (level + 2);
-                item.style.paddingLeft = `${left}px`;
-            }
-            if (itemClass.includes('nut-subsidenavbar__list')) {
-                let level = item.getAttribute('level')
-                    ? Number(item.getAttribute('level'))
-                    : 1;
-                level += 1;
-                item.setAttribute('level', level.toString());
-                item.children && setListLevel(item.children, level);
-            }
-        });
-    }, [offset]);
-    const clickFn = (e) => {
-        e.stopPropagation();
-        setSubShow(!subShow);
-        const isShow = !subShow;
-        onClick && onClick({ title, key, isShow });
-    };
-    useEffect(() => {
-        const childNodes = listRef.current?.children;
-        listRef.current?.setAttribute('level', '1');
-        childNodes && setListLevel(childNodes);
-    }, [setListLevel]);
-    const divClass = subShow
-        ? 'nut-subsidenavbar__list  nutShow'
-        : 'nut-subsidenavbar__list  nutHide';
-    const iconClass = subShow ? 'arrow-icon arrow-down' : 'arrow-icon arrow-up';
-    return (React__default.createElement("div", { className: divClass, ref: listRef, onClick: clickFn, ...rest },
-        React__default.createElement("div", { className: "nut-subsidenavbar__title border-bt" },
-            title,
-            " ",
-            React__default.createElement("i", { className: iconClass })),
-        React__default.createElement("div", { className: "nut-subsidenavbar__content" }, children)));
-};
-
-export { SubSideNavBar as S };

package/dist/esm/supports-passive-c85ef996.js

@@ -1,18 +0,0 @@
-import { c as canUseDom } from './can-use-dom-3eeb5af4.js';
-
-let passiveSupported = false;
-if (canUseDom) {
-    try {
-        const opts = Object.defineProperty({}, 'passive', {
-            get() {
-                passiveSupported = true;
-            },
-        });
-        window.addEventListener('test-passive-supported', null, opts);
-    }
-    catch (e) {
-        console.log(e);
-    }
-}
-
-export { passiveSupported as p };

package/dist/esm/swipe.taro-350c9a94.js

@@ -1,177 +0,0 @@
-import React__default, { forwardRef, useRef, useState, useMemo, useImperativeHandle, useEffect } from 'react';
-import classNames from 'classnames';
-import { useReady, nextTick } from '@tarojs/taro';
-import { c as cn } from './bem-350c1702.js';
-import { u as useTouch } from './use-touch-db24bb5c.js';
-import { g as getRectByTaro } from './use-client-rect-1f8ed1fe.js';
-
-function preventDefault(event, isStopPropagation) {
-    if (typeof event.cancelable !== 'boolean' || event.cancelable) {
-        event.preventDefault();
-    }
-    if (isStopPropagation) {
-        event.stopPropagation();
-    }
-}
-const defaultProps = {
-    name: '',
-    leftWidth: 0,
-    rightWidth: 0,
-};
-const Swipe = forwardRef((props, instanceRef) => {
-    const swipeBem = cn('swipe');
-    const touch = useTouch();
-    // 获取元素的时候要在页面 onReady 后，需要参考小程序的事件周期
-    useReady(() => {
-        const getWidth = async () => {
-            if (leftWrapper.current) {
-                const leftRect = await getRectByTaro(leftWrapper.current);
-                setActionWidth((v) => ({ ...v, left: leftRect.width }));
-            }
-            if (rightWrapper.current) {
-                const rightRect = await getRectByTaro(rightWrapper.current);
-                setActionWidth((v) => ({ ...v, right: rightRect.width }));
-            }
-        };
-        nextTick(() => getWidth());
-    });
-    const { children, className, style } = { ...defaultProps, ...props };
-    const root = useRef();
-    const opened = useRef(false);
-    const lockClick = useRef(false);
-    const startOffset = useRef(0);
-    const [state, setState] = useState({
-        offset: 0,
-        dragging: false,
-    });
-    const [actionWidth, setActionWidth] = useState({
-        left: 0,
-        right: 0,
-    });
-    const wrapperStyle = {
-        transform: `translate3d(${state.offset}px, 0, 0)`,
-        transitionDuration: state.dragging ? '0s' : '.6s',
-    };
-    const leftWidth = useMemo(() => (props.leftWidth ? props.leftWidth : actionWidth.left), [props.leftWidth, actionWidth.left]);
-    const rightWidth = useMemo(() => (props.rightWidth ? props.rightWidth : actionWidth.right), [props.rightWidth, actionWidth.right]);
-    const onTouchStart = async (event) => {
-        if (leftWrapper.current) {
-            const leftRect = await getRectByTaro(leftWrapper.current);
-            setActionWidth((v) => ({ ...v, left: leftRect.width }));
-        }
-        if (rightWrapper.current) {
-            const rightRect = await getRectByTaro(rightWrapper.current);
-            setActionWidth((v) => ({ ...v, right: rightRect.width }));
-        }
-        if (!props.disabled) {
-            startOffset.current = state.offset;
-            touch.start(event);
-            props.onTouchStart && props.onTouchStart(event);
-        }
-    };
-    const onTouchMove = (event) => {
-        if (props.disabled) {
-            return;
-        }
-        touch.move(event);
-        props.onTouchMove && props.onTouchMove(event);
-        if (touch.isHorizontal()) {
-            lockClick.current = true;
-            const newState = { ...state, dragging: true };
-            const isEdge = !opened || touch.deltaX * startOffset.current < 0;
-            if (isEdge) {
-                preventDefault(event, true);
-            }
-            newState.offset = rangeCalculation(touch.deltaX + startOffset.current, -rightWidth || 0, leftWidth || 0);
-            setState(newState);
-        }
-    };
-    const onTouchEnd = (event) => {
-        if (state.dragging) {
-            setState((v) => ({ ...v, dragging: false }));
-            toggle(state.offset > 0 ? 'left' : 'right');
-            setTimeout(() => {
-                lockClick.current = false;
-            }, 0);
-            props.onTouchEnd && props.onTouchEnd(event);
-        }
-    };
-    const toggle = (side) => {
-        const offset = Math.abs(state.offset);
-        const base = 0.3;
-        const baseNum = opened ? 1 - base : base;
-        const width = side === 'left' ? leftWidth : rightWidth;
-        if (width && offset > Number(width) * baseNum) {
-            open(side);
-        }
-        else {
-            close(side);
-        }
-    };
-    const open = (side) => {
-        opened.current = true;
-        const offset = side === 'left' ? leftWidth : -rightWidth;
-        const name = props.name;
-        props.onOpen?.({ name, position: side });
-        setState((v) => ({ ...v, offset: Number(offset) || 0 }));
-    };
-    const close = (position) => {
-        if (opened.current) {
-            opened.current = false;
-            props.onClose?.({
-                name: props.name,
-                position: position || 'left',
-            });
-        }
-        setState((v) => ({ ...v, offset: 0 }));
-    };
-    const rangeCalculation = (num, min, max) => {
-        return Math.min(Math.max(Number(num), Number(min)), Number(max));
-    };
-    const leftWrapper = useRef(null);
-    const rightWrapper = useRef(null);
-    const renderActionContent = (side) => {
-        if (props[`${side}Action`]) {
-            return (React__default.createElement("div", { id: "left", ref: side === 'left' ? leftWrapper : rightWrapper, className: `${swipeBem(side)}`, onClick: (e) => handleOperate(e, side) }, props[`${side}Action`]));
-        }
-        return null;
-    };
-    const handleOperate = (event, position) => {
-        event.stopPropagation();
-        if (props.beforeClose) {
-            props.beforeClose(position);
-        }
-        else {
-            props.onActionClick && props.onActionClick(event, position);
-        }
-    };
-    useImperativeHandle(instanceRef, () => ({
-        open,
-        close: () => close(),
-    }));
-    useEffect(() => {
-        const handler = (event) => {
-            const targets = [root];
-            if (targets.some((targetItem) => {
-                const targetElement = targetItem.current || targetItem;
-                return !targetElement || targetElement?.contains(event.target);
-            })) {
-                return;
-            }
-            close();
-        };
-        document.addEventListener('touchstart', handler);
-        return () => {
-            document.removeEventListener('touchstart', handler);
-        };
-    }, []);
-    return (React__default.createElement("div", { ref: root, className: classNames(swipeBem(), className), onTouchStart: (e) => onTouchStart(e), onTouchMove: (e) => onTouchMove(e), onTouchEnd: (e) => onTouchEnd(e), style: style },
-        React__default.createElement("div", { className: `${swipeBem('wrapper')}`, style: wrapperStyle },
-            renderActionContent('left'),
-            children,
-            renderActionContent('right'))));
-});
-Swipe.defaultProps = defaultProps;
-Swipe.displayName = 'NutSwipe';
-
-export { Swipe as S };