@nutui/nutui-react-taro 2.0.0-alpha.1 → 2.0.0-alpha.11

package/dist/esm/table.taro-3946697c.js

@@ -1,95 +0,0 @@
-import React__default, { useState, useEffect } from 'react';
-import classNames from 'classnames';
-import { DownArrow } from '@nutui/icons-react-taro';
-import { c as cn } from './bem-350c1702.js';
-import { u as useConfig } from './configprovider.taro-c8c54556.js';
-import { C as ComponentDefaults } from './typings-d8491423.js';
-
-const defaultProps = {
-    ...ComponentDefaults,
-    className: '',
-    style: {},
-    columns: [],
-    data: [],
-    bordered: true,
-    striped: false,
-    noData: '无数据',
-    sorterIcon: null,
-    showHeader: true,
-};
-const Table = (props) => {
-    const { locale } = useConfig();
-    defaultProps.noData = locale.noData;
-    const { children, className, style, columns, data, bordered, summary, striped, noData, sorterIcon, onSorter, showHeader, ...rest } = {
-        ...defaultProps,
-        ...props,
-    };
-    const [curData, setCurData] = useState(data);
-    useEffect(() => {
-        if (data && String(data) !== String(curData)) {
-            setCurData(data);
-        }
-    }, [data]);
-    const b = cn('table');
-    const classes = classNames({});
-    const cls = classNames(b(), classes, className);
-    const handleSorterClick = (item) => {
-        if (item.sorter) {
-            onSorter && onSorter(item, curData);
-            if (typeof item.sorter === 'function') {
-                setCurData(curData.sort(item.sorter));
-            }
-            else {
-                setCurData(item.sorter === 'default' ? curData.sort() : curData);
-            }
-        }
-    };
-    const cellClasses = (item) => {
-        return {
-            'nut-table__main__head__tr--border': props.bordered,
-            [`nut-table__main__head__tr--align${item.align ? item.align : ''}`]: true,
-        };
-    };
-    const getColumnItem = (value) => {
-        return columns.filter((item) => item.key === value)[0];
-    };
-    const renderHeadCells = () => {
-        return columns.map((item, index) => {
-            return (React__default.createElement("span", { className: classNames('nut-table__main__head__tr__th', cellClasses(item)), key: item.key, onClick: () => handleSorterClick(item) },
-                item.title,
-                "\u00A0",
-                item.sorter && (sorterIcon || React__default.createElement(DownArrow, { size: "12px" }))));
-        });
-    };
-    const sortDataItem = () => {
-        return columns.map((columns) => {
-            return [columns.key, columns.render];
-        });
-    };
-    const renderBodyTds = (item) => {
-        return sortDataItem().map(([value, render], index) => {
-            return (React__default.createElement("span", { className: classNames('nut-table__main__body__tr__td', cellClasses(getColumnItem(value))), key: value }, typeof item[value] === 'function' || typeof render === 'function' ? (React__default.createElement("div", null, render ? render(item) : item[value](item))) : (item[value])));
-        });
-    };
-    const renderBoyTrs = () => {
-        return curData.map((item, index) => {
-            return (React__default.createElement("div", { className: "nut-table__main__body__tr", key: index }, renderBodyTds(item)));
-        });
-    };
-    return (React__default.createElement("div", { className: cls, style: style, ...rest },
-        React__default.createElement("div", { className: classNames('nut-table__main', {
-                'nut-table__main--striped': striped,
-            }) },
-            showHeader && (React__default.createElement("div", { className: "nut-table__main__head" },
-                React__default.createElement("div", { className: "nut-table__main__head__tr" }, renderHeadCells()))),
-            React__default.createElement("div", { className: "nut-table__main__body" }, renderBoyTrs())),
-        summary && (React__default.createElement("div", { className: "nut-table__summary" },
-            React__default.createElement("span", { className: "nut-table__summary__text" }, summary))),
-        curData.length === 0 && (React__default.createElement("div", { className: "nut-table__nodata" },
-            React__default.createElement("div", { className: "nut-table__nodata" },
-                React__default.createElement("div", { className: "nut-table__nodata__text" }, noData))))));
-};
-Table.defaultProps = defaultProps;
-Table.displayName = 'NutTable';
-
-export { Table as T };

package/dist/esm/tabpane.taro-4ca340ef.js

@@ -1,23 +0,0 @@
-import React__default from 'react';
-import classNames from 'classnames';
-import { c as cn } from './bem-350c1702.js';
-
-const defaultProps = {
-    title: '',
-    paneKey: '',
-    activeKey: '',
-    disabled: false,
-};
-const TabPane = (props) => {
-    const { children, paneKey, activeKey, autoHeightClassName, className, disabled, } = {
-        ...defaultProps,
-        ...props,
-    };
-    const b = cn('tabpane');
-    const classes = classNames({
-        active: !disabled && paneKey === activeKey,
-    }, b(''), autoHeightClassName, className);
-    return React__default.createElement("div", { className: classes }, !disabled && children);
-};
-
-export { TabPane as T };

package/dist/esm/tabs.taro-be8cacb5.js

@@ -1,140 +0,0 @@
-import React__default, { useState, useRef, useEffect } from 'react';
-import classNames from 'classnames';
-import { JoySmile } from '@nutui/icons-react-taro';
-import { c as cn } from './bem-350c1702.js';
-import { C as ComponentDefaults } from './typings-d8491423.js';
-import { T as TabPane } from './tabpane.taro-4ca340ef.js';
-
-class Title {
-    title = '';
-    paneKey = '';
-    disabled = false;
-    index = 0;
-    // eslint-disable-next-line no-useless-constructor
-    constructor() { }
-}
-const defaultProps = {
-    ...ComponentDefaults,
-    tabStyle: {},
-    value: 0,
-    color: '',
-    background: '',
-    direction: 'horizontal',
-    type: 'line',
-    titleScroll: false,
-    ellipsis: true,
-    animatedTime: 300,
-    titleGutter: 0,
-    size: 'normal',
-    leftAlign: false,
-    autoHeight: false,
-};
-const pxCheck = (value) => {
-    return Number.isNaN(Number(value)) ? String(value) : `${value}px`;
-};
-const Tabs = (props) => {
-    const { value, color, tabStyle, background, direction, type, titleScroll, ellipsis, animatedTime, titleGutter, size, leftAlign, titleNode, children, onClick, onChange, className, autoHeight, ...rest } = {
-        ...defaultProps,
-        ...props,
-    };
-    const [currentItem, setCurrentItem] = useState({ index: 0 });
-    const titles = useRef([]);
-    useEffect(() => {
-        let currentIndex = 0;
-        titles.current = [];
-        // eslint-disable-next-line consistent-return
-        React__default.Children.forEach(children, (child, idx) => {
-            if (!React__default.isValidElement(child)) {
-                return null;
-            }
-            const title = new Title();
-            const childProps = child?.props;
-            if (childProps?.title || childProps?.paneKey) {
-                title.title = childProps?.title;
-                title.paneKey = getPaneKey(childProps?.paneKey, idx);
-                title.disabled = childProps?.disabled;
-                title.index = idx;
-                if (title.paneKey === value) {
-                    currentIndex = idx;
-                }
-            }
-            titles.current.push(title);
-        });
-        setCurrentItem(titles.current[currentIndex]);
-    }, [children]);
-    const b = cn('tabs');
-    const classes = classNames(direction, b(''), className);
-    const classesTitle = classNames({
-        [type]: type,
-        scrollable: titleScroll,
-        [size]: size,
-    }, `${b('')}__titles`);
-    const titleStyle = {
-        marginLeft: pxCheck(titleGutter),
-        marginRight: pxCheck(titleGutter),
-    };
-    const tabsActiveStyle = {
-        color: type === 'smile' ? color : '',
-        background: type === 'line' ? color : '',
-    };
-    const index = titles.current.findIndex((t) => t.paneKey === value);
-    const contentStyle = {
-        transform: direction === 'horizontal'
-            ? `translate3d(-${index * 100}%, 0, 0)`
-            : `translate3d( 0,-${index * 100}%, 0)`,
-        transitionDuration: `${animatedTime}ms`,
-    };
-    const getPaneKey = (paneKey, index) => {
-        return typeof paneKey === 'string' ? paneKey : String(paneKey || index);
-    };
-    const tabChange = (item, index) => {
-        onClick && onClick(item);
-        if (item.disabled) {
-            return;
-        }
-        setCurrentItem(item);
-        onChange && onChange(item);
-    };
-    return (React__default.createElement("div", { className: classes, ...rest },
-        React__default.createElement("div", { className: classesTitle, style: { ...tabStyle, background } }, !!titleNode && typeof titleNode === 'function'
-            ? titleNode()
-            : titles.current.map((item, index) => {
-                return (React__default.createElement("div", { style: titleStyle, onClick: (e) => tabChange(item), className: classNames({
-                        active: !item.disabled &&
-                            String(item.paneKey) === String(value),
-                        disabled: item.disabled,
-                        'nut-tabs__titles-item-left-align': leftAlign,
-                    }, `${b('')}__titles-item`), key: item.paneKey },
-                    type === 'line' && (React__default.createElement("div", { className: `${b('')}__titles-item__line`, style: tabsActiveStyle })),
-                    type === 'smile' && (React__default.createElement("div", { className: `${b('')}__titles-item__smile`, style: tabsActiveStyle },
-                        React__default.createElement(JoySmile, { color: color }))),
-                    React__default.createElement("div", { className: classNames({
-                            ellipsis: ellipsis &&
-                                !titleScroll &&
-                                direction === 'horizontal',
-                        }, `${b('')}__titles-item__text`) }, item.title)));
-            })),
-        React__default.createElement("div", { className: `${b('')}__content__wrap` },
-            React__default.createElement("div", { className: `${b('')}__content`, style: contentStyle }, React__default.Children.map(children, (child, idx) => {
-                if (!React__default.isValidElement(child)) {
-                    return null;
-                }
-                let childProps = {
-                    ...child.props,
-                    activeKey: value,
-                };
-                if (String(value) !== getPaneKey(child.props?.paneKey, idx) &&
-                    autoHeight) {
-                    childProps = {
-                        ...childProps,
-                        autoHeightClassName: 'inactive',
-                    };
-                }
-                return React__default.cloneElement(child, childProps);
-            })))));
-};
-Tabs.defaultProps = defaultProps;
-Tabs.displayName = 'NutTabs';
-Tabs.TabPane = TabPane;
-
-export { Tabs as T };

package/dist/esm/tag.taro-0c2567de.js

@@ -1,92 +0,0 @@
-import React__default, { useState, useEffect } from 'react';
-import { Close } from '@nutui/icons-react-taro';
-import classNames from 'classnames';
-import { C as ComponentDefaults } from './typings-d8491423.js';
-
-const defaultProps = {
-    ...ComponentDefaults,
-    type: 'default',
-    color: '',
-    textColor: '',
-    plain: false,
-    round: false,
-    mark: false,
-    closeable: false,
-    closeIcon: null,
-    prefixCls: 'nut-tag',
-    onClose: (e) => { },
-    onClick: (e) => { },
-};
-const Tag = (props) => {
-    const { className, style, color, plain, type, round, prefixCls, children, mark, closeable, closeIcon, textColor, onClick, onClose, } = {
-        ...defaultProps,
-        ...props,
-    };
-    const [btnName, setBtnName] = useState('');
-    const [isTagShow, setIsTagShow] = useState(true);
-    useEffect(() => {
-        setBtnName(classes());
-    }, [
-        type,
-        color,
-        textColor,
-        plain,
-        round,
-        mark,
-        closeable,
-        prefixCls,
-        onClick,
-        onClose,
-        className,
-    ]);
-    const classes = () => {
-        const prefixCls = 'nut-tag';
-        return classNames({
-            [prefixCls]: true,
-            [`${prefixCls}--${type}`]: type,
-            [`${prefixCls}--plain`]: plain,
-            [`${prefixCls}--round`]: round,
-            [`${prefixCls}--mark`]: mark,
-            [`${prefixCls}--close`]: closeable,
-            [`${className}`]: className,
-        });
-    };
-    const handleClick = (e) => {
-        if (props.onClick) {
-            props.onClick(e);
-        }
-    };
-    // 综合考虑 textColor、color、plain 组合使用时的效果
-    const getStyle = () => {
-        const style = {};
-        // 标签内字体颜色
-        if (textColor) {
-            style.color = textColor;
-        }
-        else if (color && plain) {
-            style.color = color;
-        }
-        // 标签背景与边框颜色
-        if (plain) {
-            style.background = '#fff';
-            style.borderColor = color;
-        }
-        else if (color) {
-            style.background = color;
-        }
-        return style;
-    };
-    return (React__default.createElement(React__default.Fragment, null, closeable ? (isTagShow && (React__default.createElement("div", { className: btnName, style: { ...style, ...getStyle() }, onClick: (e) => handleClick(e) },
-        children && React__default.createElement("span", { className: "nut-tag-text" }, children),
-        React__default.isValidElement(closeIcon) ? (React__default.createElement("i", { className: "nut-tag-custom-icon", onClick: (e) => {
-                setIsTagShow(false);
-                props.onClose && props.onClose(e);
-            } }, closeIcon)) : (React__default.createElement(Close, { size: 12, onClick: (e) => {
-                setIsTagShow(false);
-                props.onClose && props.onClose(e);
-            } }))))) : (React__default.createElement("div", { className: btnName, style: { ...style, ...getStyle() }, onClick: (e) => handleClick(e) }, children && React__default.createElement("span", { className: "nut-tag-text" }, children)))));
-};
-Tag.defaultProps = defaultProps;
-Tag.displayName = 'NutTag';
-
-export { Tag as T };

package/dist/esm/textarea.taro-a0f79515.js

@@ -1,94 +0,0 @@
-import React__default, { useState, useRef, useEffect } from 'react';
-import { u as useConfig } from './configprovider.taro-c8c54556.js';
-import { c as cn } from './bem-350c1702.js';
-
-const defaultProps = {
-    defaultValue: '',
-    textAlign: 'left',
-    limitshow: false,
-    maxlength: '',
-    rows: '',
-    placeholder: '',
-    readonly: false,
-    disabled: false,
-    autosize: false,
-};
-const TextArea = (props) => {
-    const { locale } = useConfig();
-    const { className, defaultValue, textAlign, limitshow, maxlength, rows, placeholder, readonly, disabled, autosize, style, onChange, onBlur, onFocus, } = { ...defaultProps, ...props };
-    const textareaBem = cn('textarea');
-    const [inputValue, SetInputValue] = useState('');
-    const compositingRef = useRef(false);
-    const [, updateState] = React__default.useState({});
-    const forceUpdate = React__default.useCallback(() => updateState({}), []);
-    useEffect(() => {
-        let initValue = defaultValue;
-        if (initValue && maxlength && [...initValue].length > Number(maxlength)) {
-            initValue = initValue.substring(0, Number(maxlength));
-        }
-        SetInputValue(initValue);
-    }, [defaultValue]);
-    const textChange = (event) => {
-        if (disabled)
-            return;
-        if (readonly)
-            return;
-        const text = event.detail ? event.detail : event.target;
-        if (maxlength &&
-            [...text.value].length > Number(maxlength) &&
-            !compositingRef.current) {
-            text.value = text.value.substring(0, Number(maxlength));
-        }
-        if (text.value === inputValue) {
-            forceUpdate();
-        }
-        else {
-            SetInputValue(text.value);
-        }
-        onChange && onChange(text.value, event);
-    };
-    const textFocus = (event) => {
-        if (disabled)
-            return;
-        if (readonly)
-            return;
-        onFocus && onFocus(event);
-    };
-    const textBlur = (event) => {
-        if (disabled)
-            return;
-        if (readonly)
-            return;
-        const text = event.detail ? event.detail : event.target;
-        onChange && onChange(text.value, event);
-        onBlur && onBlur(event);
-    };
-    const startComposing = () => {
-        compositingRef.current = true;
-    };
-    const endComposing = () => {
-        compositingRef.current = false;
-    };
-    return (React__default.createElement("div", { className: `${textareaBem()} ${disabled ? textareaBem('disabled') : ''} ${className || ''}` },
-        React__default.createElement("textarea", { className: textareaBem('textarea'), style: {
-                textAlign,
-                resize: `${autosize ? 'vertical' : 'none'}`,
-                ...style,
-            }, readOnly: disabled || readonly, value: inputValue, onInput: (e) => {
-                textChange(e);
-            }, onChange: (e) => {
-                textChange(e);
-            }, onBlur: (e) => {
-                textBlur(e);
-            }, onFocus: (e) => {
-                textFocus(e);
-            }, onCompositionEnd: (e) => endComposing(), onCompositionStart: (e) => startComposing(), rows: rows, maxLength: maxlength < 0 ? 0 : maxlength, placeholder: placeholder || locale.placeholder }),
-        limitshow ? (React__default.createElement("div", { className: textareaBem('limit') },
-            [...inputValue].length,
-            "/",
-            maxlength < 0 ? 0 : maxlength)) : null));
-};
-TextArea.defaultProps = defaultProps;
-TextArea.displayName = 'NutTextArea';
-
-export { TextArea as T };

package/dist/esm/timedetail.taro-fce4e614.js

@@ -1,44 +0,0 @@
-import React__default, { useState, useEffect } from 'react';
-import { c as cn } from './bem-350c1702.js';
-import { u as useConfig } from './configprovider.taro-c8c54556.js';
-
-const defaultProps = {
-    className: '',
-    currentKey: 0,
-    currentTime: [],
-    times: [],
-    select: () => null,
-};
-const TimeDetail = (props) => {
-    useConfig();
-    const { children, times, className, currentKey, currentTime, select } = {
-        ...defaultProps,
-        ...props,
-    };
-    const b = cn('timedetail');
-    const [renderData, setRenderData] = useState([]);
-    useEffect(() => {
-        const currentData = times.find((timesItem) => String(timesItem.key) === String(currentKey));
-        const renderData = currentData ? currentData.list : [];
-        // 根据选中的日期回显当前日期可配送的时间
-        setRenderData(renderData);
-    }, [times, currentKey]);
-    // 选中时间的回调
-    const handleTime = (time) => {
-        select(time);
-    };
-    // 选中的配送时间增加 active 类名
-    const getDetailClass = (item) => {
-        let initClass = 'nut-timedetail__item';
-        const curTimeData = currentTime.find((item) => String(item.key) === String(currentKey));
-        if (curTimeData && curTimeData.list && curTimeData.list.includes(item)) {
-            initClass += ' nut-timedetail__item-active';
-        }
-        return initClass;
-    };
-    return (React__default.createElement("div", { className: `${b()} ${className || ''}` }, renderData.map((item, index) => (React__default.createElement("span", { className: getDetailClass(item), key: item, onClick: () => handleTime(item) }, item)))));
-};
-TimeDetail.defaultProps = defaultProps;
-TimeDetail.displayName = 'NutTimeDetail';
-
-export { TimeDetail as T };

package/dist/esm/timepannel.taro-fd3d008d.js

@@ -1,22 +0,0 @@
-import React__default from 'react';
-import { c as cn } from './bem-350c1702.js';
-import { u as useConfig } from './configprovider.taro-c8c54556.js';
-
-const defaultProps = {
-    className: '',
-    date: '',
-    curKey: 0,
-};
-const TimePannel = (props) => {
-    useConfig();
-    const { children, className, date, curKey, change } = {
-        ...defaultProps,
-        ...props,
-    };
-    const b = cn('timepannel');
-    return (React__default.createElement("div", { className: `${b()} ${className || ''}`, onClick: () => change(curKey) }, date));
-};
-TimePannel.defaultProps = defaultProps;
-TimePannel.displayName = 'NutTimePannel';
-
-export { TimePannel as T };

package/dist/esm/timeselect.taro-a4b86771.js

@@ -1,133 +0,0 @@
-import React__default, { useState, useEffect } from 'react';
-import { P as Popup } from './popup.taro-020bf791.js';
-import { T as TimePannel } from './timepannel.taro-fd3d008d.js';
-import { T as TimeDetail } from './timedetail.taro-fce4e614.js';
-import { c as cn } from './bem-350c1702.js';
-import { u as useConfig } from './configprovider.taro-c8c54556.js';
-
-const defaultProps = {
-    className: '',
-    style: {},
-    visible: false,
-    height: '20%',
-    multiple: false,
-    currentKey: 0,
-    currentTime: [],
-    title: '取件时间',
-    dates: [],
-    times: [],
-};
-const TimeSelect = (props) => {
-    useConfig();
-    const { visible, className, height, title, currentKey, currentTime, dates, times, multiple, select, pannelChange, timeChange, onSelect, onPannelChange, onTimeChange, } = {
-        ...defaultProps,
-        ...props,
-    };
-    const [activeKey, setActiveKey] = useState(currentKey);
-    const [activeTime, setActiveTime] = useState(currentTime.length
-        ? currentTime
-        : [
-            {
-                key: currentKey,
-                list: [],
-            },
-        ]);
-    const [popVisible, setPopVisible] = useState(visible);
-    const popStyle = {
-        width: '100%',
-        height,
-    };
-    const b = cn('timeselect');
-    // popup 的关闭回调, 执行 select 函数更改外部 visible
-    const closeFun = () => {
-        if (onSelect) {
-            onSelect(activeTime);
-        }
-        else if (select) {
-            select(activeTime);
-        }
-    };
-    // 选择配送时间回调
-    const handleSelectTime = (time) => {
-        let curTimeData = {};
-        let curIndex = -1;
-        for (let i = 0; i < activeTime.length; i++) {
-            if (String(activeTime[i].key) === String(activeKey)) {
-                curTimeData = activeTime[i];
-                curIndex = i;
-                break;
-            }
-        }
-        const curTimeIndex = curTimeData.list.findIndex((item) => String(item) === String(time));
-        if (curTimeIndex === -1) {
-            curTimeData.list.push(time);
-        }
-        else {
-            curTimeData.list.splice(curTimeIndex, 1);
-        }
-        const resultTimeData = [...activeTime];
-        resultTimeData.splice(curIndex, 1, curTimeData);
-        setActiveTime(resultTimeData);
-        if (onTimeChange) {
-            onTimeChange(time, resultTimeData);
-        }
-        else if (timeChange) {
-            timeChange(time, resultTimeData);
-        }
-    };
-    // 选择日期的回调
-    const handleChange = (pannelKey) => {
-        const resultTimeData = [...activeTime];
-        if (String(pannelKey) !== String(activeKey)) {
-            setActiveKey?.(pannelKey);
-            if (multiple) {
-                const curTimeDataIndex = activeTime.findIndex((item) => String(item.key) === String(pannelKey));
-                if (curTimeDataIndex === -1) {
-                    resultTimeData.push({
-                        key: pannelKey,
-                        list: [],
-                    });
-                    setActiveTime(resultTimeData);
-                }
-            }
-            else {
-                setActiveTime([
-                    {
-                        key: pannelKey,
-                        list: [],
-                    },
-                ]);
-            }
-        }
-        if (onPannelChange) {
-            onPannelChange(pannelKey, resultTimeData);
-        }
-        else if (pannelChange) {
-            pannelChange(pannelKey, resultTimeData);
-        }
-    };
-    // 选中的日期增加 active 类名
-    const getTimePannelClass = (dataItem) => {
-        if (String(dataItem['paneKey']) === String(activeKey)) {
-            return 'nut-timepannel-active';
-        }
-        return '';
-    };
-    // 根据外部传入 visible 进行组件的显隐展示
-    useEffect(() => {
-        setPopVisible(visible);
-    }, [visible]);
-    return (React__default.createElement(React__default.Fragment, null,
-        React__default.createElement(Popup, { closeable: true, round: true, visible: popVisible, position: "bottom", style: popStyle, onClose: () => {
-                closeFun();
-            } },
-            React__default.createElement("div", { className: `${b()} ${className || ''}` },
-                React__default.createElement("div", { className: "nut-timeselect__title" }, title),
-                React__default.createElement("div", { className: "nut-timeselect__content" },
-                    React__default.createElement("div", { className: "nut-timeselect__content-left" }, dates.map((dataItem, index) => (React__default.createElement(TimePannel, { date: dataItem.date, className: getTimePannelClass(dataItem), key: String(dataItem['paneKey'] || index), curKey: String(dataItem['paneKey'] || index), change: handleChange })))),
-                    React__default.createElement(TimeDetail, { times: times, currentKey: String(activeKey), currentTime: activeTime, select: handleSelectTime }))))));
-};
-TimeSelect.defaultProps = defaultProps;
-TimeSelect.displayName = 'NutTimeSelect';
-
-export { TimeSelect as T };