@nutui/nutui-react-taro 1.5.2-beta.0 → 1.5.2-beta.1

package/dist/esm/can-use-dom-3eeb5af4.js

@@ -0,0 +1,6 @@
+const canUseDom = !!(typeof window !== 'undefined' &&
+    typeof document !== 'undefined' &&
+    window.document &&
+    window.document.createElement);
+
+export { canUseDom as c };

package/dist/esm/card.taro-e4c76dad.js

@@ -0,0 +1,33 @@
+import React__default from 'react';
+import classNames from 'classnames';
+import { P as Price } from './price.taro-776ed16e.js';
+import { T as Tag } from './tag.taro-23ba0834.js';
+import { c as cn } from './bem-350c1702.js';
+
+const defaultProps = {};
+const Card = (props) => {
+    const { className, style, imgUrl, title, price, vipPrice, shopDesc, delivery, shopName, shopTagTpl, originTpl, prolistTpl, footerTpl, ...rest } = {
+        ...defaultProps,
+        ...props,
+    };
+    const b = cn('card');
+    return (React__default.createElement("div", { className: classNames(b(), className), style: style, ...rest },
+        React__default.createElement("div", { className: b('left') },
+            React__default.createElement("img", { src: imgUrl, alt: "" })),
+        React__default.createElement("div", { className: b('right') },
+            React__default.createElement("div", { className: b('right__title') }, title),
+            prolistTpl,
+            React__default.createElement("div", { className: b('right__price') },
+                React__default.createElement(Price, { price: price }),
+                originTpl || (React__default.createElement(Price, { className: b('right__price__origin'), price: vipPrice }))),
+            React__default.createElement("div", { className: b('right__other') }, shopTagTpl || (React__default.createElement(React__default.Fragment, null,
+                React__default.createElement(Tag, { type: "danger" }, shopDesc),
+                React__default.createElement(Tag, { plain: true }, delivery)))),
+            React__default.createElement("div", { className: b('right__shop') },
+                React__default.createElement("div", { className: b('right__shop__name') }, shopName),
+                footerTpl))));
+};
+Card.defaultProps = defaultProps;
+Card.displayName = 'NutCard';
+
+export { Card as C };

package/dist/esm/cascader.taro-eb1fb011.js

@@ -0,0 +1,438 @@
+import React__default, { useState, useEffect } from 'react';
+import classNames from 'classnames';
+import { P as Popup } from './popup.taro-01676bff.js';
+import { T as Tabs } from './tabs.taro-6a7524a4.js';
+import { T as TabPane } from './tabpane.taro-4ca340ef.js';
+import { I as Icon } from './icon.taro-296a1bec.js';
+import { c as cn } from './bem-350c1702.js';
+
+const defaultProps$1 = {
+    data: {
+        text: '',
+        value: '',
+        paneKey: '',
+        disabled: false,
+        loading: false,
+        children: [],
+    },
+    activeColor: '#fa2c19',
+    checked: false,
+    checkedIcon: 'checklist',
+    chooseItem: () => { },
+};
+const InternalCascaderItem = (props, ref) => {
+    const { data, checked, checkedIcon, chooseItem, activeColor } = {
+        ...defaultProps$1,
+        ...props,
+    };
+    const b = cn('cascader-item');
+    const classes = classNames({
+        active: checked,
+        disabled: data.disabled,
+    }, b(''));
+    const classesTitle = classNames({
+        [`${b('')}__title`]: true,
+    });
+    return (React__default.createElement("div", { style: { color: checked ? activeColor : '' }, className: classes, onClick: () => {
+            chooseItem(data);
+        } },
+        React__default.createElement("div", { className: classesTitle }, data.text),
+        data.loading ? (React__default.createElement(Icon, { color: "#969799", className: "nut-cascader-item__icon-loading", name: "loading" })) : (React__default.createElement(Icon, { className: `${checked ? b('icon-check') : ''}`, name: checked ? checkedIcon : '' }))));
+};
+const CascaderItem = React__default.forwardRef(InternalCascaderItem);
+CascaderItem.defaultProps = defaultProps$1;
+CascaderItem.displayName = 'NutCascaderItem';
+
+const formatTree = (tree, parent, config) => tree.map((node) => {
+    const { value: valueKey = 'value', text: textKey = 'text', children: childrenKey = 'children', } = config;
+    const { [valueKey]: value, [textKey]: text, [childrenKey]: children, ...others } = node;
+    const newNode = {
+        loading: false,
+        ...others,
+        level: parent ? ((parent && parent.level) || 0) + 1 : 0,
+        value,
+        text,
+        children,
+        _parent: parent,
+    };
+    if (newNode.children && newNode.children.length) {
+        newNode.children = formatTree(newNode.children, newNode, config);
+    }
+    return newNode;
+});
+const eachTree = (tree, cb) => {
+    let i = 0;
+    let node;
+    while ((node = tree[i++])) {
+        if (cb(node) === true) {
+            break;
+        }
+        if (node.children && node.children.length) {
+            eachTree(node.children, cb);
+        }
+    }
+};
+const defaultConvertConfig = {
+    topId: null,
+    idKey: 'id',
+    pidKey: 'pid',
+    sortKey: '',
+};
+const convertListToOptions = (list, options) => {
+    const mergedOptions = {
+        ...defaultConvertConfig,
+        ...(options || {}),
+    };
+    const { topId, idKey, pidKey, sortKey } = mergedOptions;
+    let result = [];
+    let map = {};
+    list.forEach((node) => {
+        node = { ...node };
+        const { [idKey]: id, [pidKey]: pid } = node;
+        const children = (map[pid] = map[pid] || []);
+        // const children = map[pid] || []
+        if (!result.length && pid === topId) {
+            result = children;
+        }
+        children.push(node);
+        node.children = map[id] || (map[id] = []);
+    });
+    if (sortKey) {
+        Object.keys(map).forEach((i) => {
+            if (map[i].length > 1) {
+                map[i].sort((a, b) => a[sortKey] - b[sortKey]);
+            }
+        });
+    }
+    map = null;
+    return result;
+};
+
+class Tree {
+    nodes;
+    config;
+    constructor(nodes, config) {
+        this.config = {
+            value: 'value',
+            text: 'text',
+            children: 'children',
+            ...(config || {}),
+        };
+        this.nodes = formatTree(nodes, null, this.config);
+    }
+    updateChildren(nodes, parent) {
+        if (!parent) {
+            this.nodes = formatTree(nodes, null, this.config);
+        }
+        else {
+            parent.children = formatTree(nodes, parent, this.config);
+        }
+    }
+    // for test
+    getNodeByValue(value) {
+        let foundNode;
+        eachTree(this.nodes, (node) => {
+            if (node.value === value) {
+                foundNode = node;
+                return true;
+            }
+            return null;
+        });
+        return foundNode;
+    }
+    getPathNodesByValue(value) {
+        if (!value.length) {
+            return [];
+        }
+        const pathNodes = [];
+        let currentNodes = this.nodes;
+        while (currentNodes && currentNodes.length) {
+            const foundNode = currentNodes.find((node) => node.value === value[node.level]);
+            if (!foundNode) {
+                break;
+            }
+            pathNodes.push(foundNode);
+            currentNodes = foundNode.children;
+        }
+        return pathNodes;
+    }
+    isLeaf = (node, lazy) => {
+        const { leaf, children } = node;
+        const hasChildren = Array.isArray(children) && Boolean(children.length);
+        return leaf || (!hasChildren && !lazy);
+    };
+    hasChildren = (node, lazy) => {
+        const isLeaf = this.isLeaf(node, lazy);
+        if (isLeaf) {
+            return false;
+        }
+        const { children } = node;
+        return Array.isArray(children) && Boolean(children.length);
+    };
+}
+
+const defaultProps = {
+    className: '',
+    style: {},
+    activeColor: '#fa2c19',
+    checkedIcon: 'checklist',
+    tabsColor: '',
+    poppable: true,
+    visible: false,
+    options: [],
+    value: [],
+    title: '',
+    textKey: 'text',
+    valueKey: 'value',
+    childrenKey: 'children',
+    convertConfig: {},
+    closeable: false,
+    closeIconPosition: 'top-right',
+    closeIcon: 'close',
+    lazy: false,
+    lazyLoad: () => { },
+    onClose: () => { },
+    onChange: () => { },
+    onPathChange: () => { },
+    ...Popup.defaultProps,
+};
+const InternalCascader = (props, ref) => {
+    const { className, style, tabsColor, poppable, visible, options, value, title, textKey, valueKey, childrenKey, convertConfig, closeable, closeIconPosition, closeIcon, lazy, lazyLoad, onClose, onChange, onPathChange, } = { ...defaultProps, ...props };
+    const [tabvalue, setTabvalue] = useState('c1');
+    const [optionsData, setOptionsData] = useState([]);
+    const isLazy = () => state.configs.lazy && Boolean(state.configs.lazyLoad);
+    const [state] = useState({
+        optionsData: [],
+        panes: [
+            {
+                nodes: [],
+                selectedNode: [],
+                paneKey: '',
+            },
+        ],
+        innerValue: value,
+        tree: new Tree([], {}),
+        tabsCursor: 0,
+        initLoading: false,
+        currentProcessNode: [],
+        configs: {
+            lazy,
+            lazyLoad,
+            valueKey,
+            textKey,
+            childrenKey,
+            convertConfig,
+        },
+        lazyLoadMap: new Map(),
+    });
+    const b = cn('cascader');
+    const classes = classNames(b(''));
+    const classesPane = classNames({
+        [`${b('')}-pane`]: true,
+    });
+    useEffect(() => {
+        initData();
+    }, []);
+    useEffect(() => {
+        if (value !== state.innerValue) {
+            state.innerValue = value;
+        }
+    }, [value]);
+    useEffect(() => {
+        initData();
+    }, [options]);
+    const initData = async () => {
+        // 初始化开始处理数据
+        state.lazyLoadMap.clear();
+        if (convertConfig && Object.keys(convertConfig).length > 0) {
+            state.optionsData = convertListToOptions(options, convertConfig);
+        }
+        else {
+            state.optionsData = options;
+        }
+        state.tree = new Tree(state.optionsData, {
+            value: state.configs.valueKey,
+            text: state.configs.textKey,
+            children: state.configs.childrenKey,
+        });
+        if (isLazy() && !state.tree.nodes.length) {
+            await invokeLazyLoad({
+                root: true,
+                loading: true,
+                text: '',
+                value: '',
+            });
+        }
+        state.panes = [
+            {
+                nodes: state.tree.nodes,
+                selectedNode: null,
+                paneKey: 'c1',
+            },
+        ];
+        syncValue();
+        setOptionsData(state.panes);
+    };
+    // 处理有默认值时的数据
+    const syncValue = async () => {
+        const currentValue = state.innerValue;
+        if (currentValue === undefined || !state.tree.nodes.length) {
+            return;
+        }
+        if (currentValue.length === 0) {
+            state.tabsCursor = 0;
+            return;
+        }
+        let needToSync = currentValue;
+        if (isLazy() && Array.isArray(currentValue) && currentValue.length) {
+            needToSync = [];
+            const parent = state.tree.nodes.find((node) => node.value === currentValue[0]);
+            if (parent) {
+                needToSync = [parent.value];
+                state.initLoading = true;
+                const last = await currentValue
+                    .slice(1)
+                    .reduce(async (p, value) => {
+                    const parent = await p;
+                    await invokeLazyLoad(parent);
+                    const node = parent?.children?.find((item) => item.value === value);
+                    if (node) {
+                        needToSync.push(value);
+                    }
+                    return Promise.resolve(node);
+                }, Promise.resolve(parent));
+                await invokeLazyLoad(last);
+                state.initLoading = false;
+            }
+        }
+        if (needToSync.length && currentValue === value) {
+            const pathNodes = state.tree.getPathNodesByValue(needToSync);
+            pathNodes.forEach((node, index) => {
+                state.tabsCursor = index;
+                // 当有默认值时，不触发 chooseItem 里的 emit 事件
+                chooseItem(node, true);
+            });
+        }
+    };
+    const invokeLazyLoad = async (node) => {
+        if (!node) {
+            return;
+        }
+        if (!state.configs.lazyLoad) {
+            node.leaf = true;
+            return;
+        }
+        if (state.tree.isLeaf(node, isLazy()) ||
+            state.tree.hasChildren(node, isLazy())) {
+            return;
+        }
+        node.loading = true;
+        const parent = node.root ? null : node;
+        let lazyLoadPromise = state.lazyLoadMap.get(node);
+        if (!lazyLoadPromise) {
+            lazyLoadPromise = new Promise((resolve) => {
+                // 外部必须resolve
+                state.configs.lazyLoad?.(node, resolve);
+            });
+            state.lazyLoadMap.set(node, lazyLoadPromise);
+        }
+        const nodes = await lazyLoadPromise;
+        if (Array.isArray(nodes) && nodes.length > 0) {
+            state.tree.updateChildren(nodes, parent);
+        }
+        else {
+            // 如果加载完成后没有提供子节点，作为叶子节点处理
+            node.leaf = true;
+        }
+        node.loading = false;
+        state.lazyLoadMap.delete(node);
+    };
+    const close = () => {
+        onClose && onClose();
+    };
+    const closePopup = () => {
+        close();
+    };
+    /* type: 是否是静默模式，是的话不触发事件
+    tabsCursor: tab的索引 */
+    const chooseItem = async (node, type) => {
+        // console.log('chooseItem', node)
+        if ((!type && node.disabled) || !state.panes[state.tabsCursor]) {
+            return;
+        }
+        // 如果没有子节点
+        if (state.tree.isLeaf(node, isLazy())) {
+            node.leaf = true;
+            state.panes[state.tabsCursor].selectedNode = node;
+            state.panes = state.panes.slice(0, node.level + 1);
+            if (!type) {
+                const pathNodes = state.panes.map((item) => item.selectedNode);
+                const optionParams = pathNodes.map((item) => item.value);
+                onChange(optionParams, pathNodes);
+                onPathChange(optionParams, pathNodes);
+            }
+            setOptionsData(state.panes);
+            close();
+            return;
+        }
+        // 如果有子节点，滑到下一个
+        if (state.tree.hasChildren(node, isLazy())) {
+            const level = node.level + 1;
+            state.panes[state.tabsCursor].selectedNode = node;
+            state.panes = state.panes.slice(0, level);
+            state.tabsCursor = level;
+            state.panes.push({
+                nodes: node.children || [],
+                selectedNode: null,
+                paneKey: `c${state.tabsCursor + 1}`,
+            });
+            setTabvalue(`c${state.tabsCursor + 1}`);
+            setOptionsData(state.panes);
+            if (!type) {
+                const pathNodes = state.panes.map((item) => item.selectedNode);
+                const optionParams = pathNodes.map((item) => item?.value);
+                onPathChange(optionParams, pathNodes);
+            }
+            return;
+        }
+        state.currentProcessNode = node;
+        if (node.loading) {
+            return;
+        }
+        await invokeLazyLoad(node);
+        if (state.currentProcessNode === node) {
+            state.panes[state.tabsCursor].selectedNode = node;
+            chooseItem(node, type);
+        }
+        setOptionsData(state.panes);
+    };
+    const renderItem = () => {
+        return (React__default.createElement("div", { className: `${classes} ${className}`, style: style },
+            poppable && React__default.createElement("div", { className: b('title') }, title),
+            React__default.createElement(Tabs, { value: tabvalue, titleNode: () => {
+                    return optionsData.map((pane, index) => (React__default.createElement("div", { onClick: () => {
+                            setTabvalue(pane.paneKey);
+                            state.tabsCursor = index;
+                        }, className: `nut-tabs__titles-item ${tabvalue === pane.paneKey ? 'active' : ''}`, key: pane.paneKey },
+                        React__default.createElement("span", { className: "nut-tabs__titles-item__text" },
+                            !state.initLoading &&
+                                state.panes.length &&
+                                pane?.selectedNode?.text,
+                            !state.initLoading &&
+                                state.panes.length &&
+                                !pane?.selectedNode?.text &&
+                                '请选择',
+                            !(!state.initLoading && state.panes.length) && 'Loading...'),
+                        React__default.createElement("span", { className: "nut-tabs__titles-item__line", style: { background: tabsColor } }))));
+                } }, !state.initLoading && state.panes.length ? (optionsData.map((pane) => (React__default.createElement(TabPane, { key: pane.paneKey, paneKey: pane.paneKey },
+                React__default.createElement("div", { className: classesPane }, pane.nodes &&
+                    pane.nodes.map((node, index) => (React__default.createElement(CascaderItem, { key: index, ...props, data: node, checked: pane.selectedNode?.value === node.value, chooseItem: (node) => chooseItem(node, false) })))))))) : (React__default.createElement(TabPane, null,
+                React__default.createElement("div", { className: classesPane }))))));
+    };
+    return (React__default.createElement(React__default.Fragment, null, poppable ? (React__default.createElement(Popup, { popClass: "cascadar-popup", visible: visible, position: "bottom", round: true, closeable: closeable, closeIconPosition: closeIconPosition, closeIcon: closeIcon, onClickOverlay: closePopup, onClickCloseIcon: closePopup }, renderItem())) : (renderItem())));
+};
+const Cascader = React__default.forwardRef(InternalCascader);
+Cascader.defaultProps = defaultProps;
+Cascader.displayName = 'NutCascader';
+
+export { Cascader as C };

package/dist/esm/cell.taro-a10a74d3.js

@@ -0,0 +1,64 @@
+import React__default from 'react';
+import { redirectTo, navigateTo } from '@tarojs/taro';
+import { c as cn } from './bem-350c1702.js';
+import { I as Icon } from './icon.taro-296a1bec.js';
+import { C as ComponentDefaults } from './typings-b9828dba.js';
+
+const defaultProps = {
+    ...ComponentDefaults,
+    title: null,
+    subTitle: null,
+    desc: '',
+    descTextAlign: 'right',
+    isLink: false,
+    icon: '',
+    roundRadius: '6px',
+    url: '',
+    to: '',
+    replace: false,
+    center: false,
+    size: '',
+    className: '',
+    iconSlot: null,
+    linkSlot: null,
+    onClick: (event) => { },
+};
+const Cell = (props) => {
+    const { children, onClick, title, subTitle, desc, descTextAlign, isLink, icon, roundRadius, url, to, replace, center, size, className, iconSlot, linkSlot, iconClassPrefix, iconFontClassName, ...rest } = {
+        ...defaultProps,
+        ...props,
+    };
+    const b = cn('cell');
+    const handleClick = (event) => {
+        onClick(event);
+        const link = to || url;
+        if (link) {
+            replace ? redirectTo({ url: link }) : navigateTo({ url: link });
+        }
+    };
+    const baseStyle = {
+        borderRadius: Number.isNaN(Number(roundRadius))
+            ? String(roundRadius)
+            : `${roundRadius}px`,
+    };
+    const styles = title || subTitle || icon
+        ? { textAlign: descTextAlign }
+        : {
+            textAlign: descTextAlign,
+            flex: 1,
+        };
+    return (React__default.createElement("div", { className: `${b({ clickable: !!(isLink || to), center, large: size === 'large' }, [className])} `, onClick: (event) => handleClick(event), style: baseStyle, ...rest }, children || (React__default.createElement(React__default.Fragment, null,
+        icon || iconSlot ? (React__default.createElement("div", { className: b('icon') }, iconSlot ||
+            (icon ? (React__default.createElement(Icon, { classPrefix: iconClassPrefix, fontClassName: iconFontClassName, name: icon, className: "icon" })) : null))) : null,
+        title || subTitle ? (React__default.createElement("div", { className: `${b('title')}` },
+            title ? React__default.createElement("div", { className: b('maintitle') }, title) : null,
+            subTitle ? (React__default.createElement("div", { className: b('subtitle') }, subTitle)) : null)) : null,
+        desc ? (React__default.createElement("div", { className: b('value', {
+                alone: !title && !subTitle,
+            }), style: styles }, desc)) : null,
+        !linkSlot && (isLink || to) ? (React__default.createElement(Icon, { classPrefix: iconClassPrefix, fontClassName: iconFontClassName, name: "right", className: b('link') })) : (linkSlot)))));
+};
+Cell.defaultProps = defaultProps;
+Cell.displayName = 'NutCell';
+
+export { Cell as C };

package/dist/esm/cellgroup.taro-abe501bc.js

@@ -0,0 +1,25 @@
+import React__default from 'react';
+import { c as cn } from './bem-350c1702.js';
+
+const defaultProps = {
+    title: '',
+    desc: '',
+    className: '',
+    titleSlot: null,
+    descSlot: null,
+};
+const CellGroup = (props) => {
+    const { children, className, title, desc, titleSlot, descSlot } = {
+        ...defaultProps,
+        ...props,
+    };
+    const b = cn('cell-group');
+    return (React__default.createElement("div", { className: b(null, [className]) },
+        titleSlot || (React__default.createElement(React__default.Fragment, null, title ? React__default.createElement("div", { className: b('title') }, title) : null)),
+        descSlot || React__default.createElement(React__default.Fragment, null, desc ? React__default.createElement("div", { className: b('desc') }, desc) : null),
+        React__default.createElement("div", { className: b('wrap') }, children)));
+};
+CellGroup.defaultProps = defaultProps;
+CellGroup.displayName = 'NutCellGroup';
+
+export { CellGroup as C };