@nutui/nutui-react-taro 2.0.0-alpha.4 → 2.0.0-alpha.6

package/dist/esm/checkbox.taro-ae460d3a.js

@@ -1,168 +0,0 @@
-import React, { createContext, useImperativeHandle, useState, useEffect, useCallback, useContext } from 'react';
-import { CheckNormal, CheckDisabled, Checked } from '@nutui/icons-react-taro';
-import { c as cn } from './bem-350c1702.js';
-import { C as ComponentDefaults } from './typings-d8491423.js';
-
-const CheckboxGroupContext = createContext(null);
-
-const defaultProps$1 = {
-    disabled: false,
-    checkedValue: [],
-    max: undefined,
-    textPosition: 'right',
-    direction: 'vertical',
-    onChange: (value) => { },
-    options: [],
-};
-const CheckboxGroup = React.forwardRef((props, ref) => {
-    const { children } = { ...defaultProps$1, ...props };
-    const b = cn('checkboxgroup');
-    const { className, disabled, onChange, checkedValue, max, textPosition, direction, options, ...rest } = props;
-    useImperativeHandle(ref, () => ({
-        toggleAll(state) {
-            if (state === false) {
-                setInnerValue([]);
-            }
-            else {
-                const childrenLabel = [];
-                React.Children.map(children, (child) => {
-                    const childProps = child.props;
-                    childrenLabel.push(childProps.label || child.children);
-                });
-                setInnerValue(childrenLabel);
-            }
-        },
-        toggleReverse() {
-            const childrenLabel = [];
-            React.Children.map(children, (child) => {
-                const childProps = child.props;
-                childrenLabel.push(childProps.label || child.children);
-            });
-            const reverse = childrenLabel.filter((c) => innerValue?.findIndex((v) => v === c) === -1);
-            setInnerValue(reverse);
-        },
-    }));
-    const [innerValue, setInnerValue] = useState(checkedValue || []);
-    useEffect(() => {
-        setInnerValue(checkedValue || []);
-    }, [checkedValue]);
-    const renderOptions = useCallback(() => {
-        return options?.map(({ label, value, disabled, onChange, ...rest }) => {
-            return (React.createElement(Checkbox, { key: value?.toString(), children: label, label: value, ...rest }));
-        });
-    }, [options, max]);
-    return (React.createElement(CheckboxGroupContext.Provider, { value: {
-            textPosition: textPosition || 'left',
-            disabled,
-            max,
-            checkedValue: innerValue || [],
-            check: (value) => {
-                const combined = [...innerValue, value];
-                setInnerValue(combined);
-                onChange && onChange(combined);
-            },
-            uncheck: (value) => {
-                const reduced = innerValue.filter((item) => item !== value);
-                setInnerValue(reduced);
-                onChange && onChange(reduced);
-            },
-        } },
-        React.createElement("div", { className: `${b()} nut-checkboxgroup--${props.direction} ${className || ''}`, ...rest }, options?.length ? renderOptions() : children)));
-});
-CheckboxGroup.defaultProps = defaultProps$1;
-CheckboxGroup.displayName = 'NutCheckboxGroup';
-
-const defaultProps = {
-    ...ComponentDefaults,
-    checked: false,
-    disabled: false,
-    textPosition: 'right',
-    iconSize: 18,
-    icon: 'check-normal',
-    checkedIcon: 'checked',
-    iconClassPrefix: 'nut-icon',
-    iconFontClassName: 'nutui-iconfont',
-    indeterminateIcon: 'check-disabled',
-    onChange: (state, label) => { },
-};
-const Checkbox = (props) => {
-    const { children } = {
-        ...defaultProps,
-        ...props,
-    };
-    const b = cn('checkbox');
-    const { icon, iconSize, label, className, checkedIcon, checked, disabled, onChange, indeterminate, iconClassPrefix, iconFontClassName, indeterminateIcon, ...others } = props;
-    // eslint-disable-next-line prefer-const
-    let { textPosition, ...rest } = others;
-    const ctx = useContext(CheckboxGroupContext);
-    let [innerChecked, setInnerChecked] = useState(checked);
-    // eslint-disable-next-line prefer-const
-    let [innerDisabled, setDisabled] = useState(disabled);
-    const [_indeterminate, setIndeterminate] = useState(indeterminate);
-    useEffect(() => {
-        !ctx && setInnerChecked(checked);
-        setDisabled(disabled);
-        setIndeterminate(indeterminate);
-    }, [disabled, checked, indeterminate]);
-    if (ctx) {
-        if (ctx.textPosition !== undefined) {
-            textPosition = ctx.textPosition;
-        }
-        innerDisabled = ctx.disabled;
-        innerChecked = ctx.checkedValue.includes(label);
-        setInnerChecked = (checked) => {
-            if (ctx.disabled)
-                return;
-            if (checked)
-                ctx.check(label);
-            if (!checked)
-                ctx.uncheck(label);
-        };
-    }
-    const renderIcon = () => {
-        if (!innerChecked) {
-            return React.isValidElement(icon) ? (icon) : (React.createElement(CheckNormal, { size: iconSize, className: color() }));
-        }
-        if (_indeterminate) {
-            return React.isValidElement(indeterminateIcon) ? (indeterminateIcon) : (React.createElement(CheckDisabled, { size: iconSize, className: color() }));
-        }
-        return React.isValidElement(checkedIcon) ? (checkedIcon) : (React.createElement(Checked, { size: iconSize, className: color() }));
-    };
-    const color = () => {
-        if (innerDisabled) {
-            return 'nut-checkbox__icon--disable';
-        }
-        if (innerChecked) {
-            if (_indeterminate) {
-                return 'nut-checkbox__icon--indeterminate';
-            }
-            return 'nut-checkbox__icon';
-        }
-        return 'nut-checkbox__icon--unchecked';
-    };
-    const renderLabel = () => {
-        return (React.createElement("span", { className: `${b('label', { disabled: innerDisabled })} ` }, children || label));
-    };
-    const handleClick = () => {
-        // 禁用的时候直接返回
-        if (disabled)
-            return;
-        // 先转换状态
-        const latestChecked = !innerChecked;
-        // 判断是不是有 context 和 max，有的话需要判断是不是超过最大限制
-        if (ctx && ctx.max !== undefined) {
-            if (latestChecked && ctx.checkedValue.length >= ctx.max)
-                return;
-        }
-        onChange && onChange(latestChecked, label || children);
-        setInnerChecked(latestChecked);
-    };
-    return (React.createElement("div", { className: `${b({ reverse: textPosition === 'left' })} ${className || ''}`, ...rest, onClick: handleClick },
-        renderIcon(),
-        renderLabel()));
-};
-Checkbox.defaultProps = defaultProps;
-Checkbox.displayName = 'NutCheckBox';
-Checkbox.Group = CheckboxGroup;
-
-export { Checkbox as C, CheckboxGroup as a };

package/dist/esm/circleprogress.taro-d4943109.js

@@ -1,103 +0,0 @@
-import React, { useState, useRef, useEffect } from 'react';
-import classNames from 'classnames';
-import { a as isObject } from './index-5bcb0ff8.js';
-import { C as ComponentDefaults } from './typings-d8491423.js';
-
-const defaultProps = {
-    ...ComponentDefaults,
-    strokeWidth: 5,
-    radius: 50,
-    strokeLinecap: 'round',
-    color: '#fa2c19',
-    background: '#e5e9f2',
-    clockwise: true,
-};
-const classPrefix = `nut-circleprogress`;
-const CircleProgress = (props) => {
-    const { children, percent, className, radius, background, clockwise, color, strokeWidth, style, strokeLinecap, ...restProps } = {
-        ...defaultProps,
-        ...props,
-    };
-    const [oldValue, setOldValue] = useState(percent);
-    const classes = classNames(className, classPrefix);
-    const refRandomId = Math.random().toString(36).slice(-8);
-    const animateIdRef = useRef(0);
-    const styles = {
-        height: `${Number(radius) * 2}px`,
-        width: `${Number(radius) * 2}px`,
-        ...style,
-    };
-    useEffect(() => {
-        const startTime = Date.now();
-        const startRate = Number(oldValue); // 30
-        const endRate = Number(percent); // 40
-        const duration = Math.abs(((startRate - endRate) * 1000) / +100); // 100
-        const animate = () => {
-            const now = Date.now();
-            const progress = Math.min((now - startTime) / duration, 1);
-            const rate = progress * (endRate - startRate) + startRate;
-            setOldValue(Math.min(Math.max(+rate, 0), 100));
-            if (endRate > startRate ? rate < endRate : rate > endRate) {
-                animateIdRef.current = window.requestAnimationFrame(animate);
-            }
-        };
-        animateIdRef.current = window.requestAnimationFrame(animate);
-        return () => window.cancelAnimationFrame(animateIdRef.current);
-    }, [percent]);
-    const stop = () => {
-        if (!isObject(props.color)) {
-            return [];
-        }
-        const color = props.color;
-        const colorArr = Object.keys(color).sort((a, b) => parseFloat(a) - parseFloat(b));
-        const stopArr = [];
-        colorArr.map((item) => {
-            const obj = {
-                key: '',
-                value: '',
-            };
-            obj.key = item;
-            obj.value = color[item];
-            stopArr.push(obj);
-        });
-        return stopArr;
-    };
-    const transColor = (color) => {
-        return color && color.replace('#', '%23');
-    };
-    const format = (progress) => Math.min(Math.max(+progress, 0), 100);
-    const circleStyle = () => {
-        const stopArr = stop();
-        const stopDom = [];
-        if (stopArr) {
-            stopArr.map((item) => {
-                let obj = '';
-                obj = `%3Cstop offset='${item.key}' stop-color='${transColor(item.value)}'/%3E`;
-                stopDom.push(obj);
-            });
-        }
-        const perimeter = 283;
-        const progress = +oldValue;
-        const offset = (perimeter * Number(format(parseFloat(progress.toFixed(1))))) / 100;
-        const isWise = props.clockwise ? 1 : 0;
-        const color = isObject(props.color)
-            ? `url(%23${refRandomId})`
-            : transColor(props.color);
-        const d = `M 50 50 m 0 -45 a 45 45 0 1 ${isWise} 0 90 a 45 45 0 1, ${isWise} 0 -90`;
-        const pa = `%3Cdefs%3E%3ClinearGradient id='${refRandomId}' x1='100%25' y1='0%25' x2='0%25' y2='0%25'%3E${stopDom}%3C/linearGradient%3E%3C/defs%3E`;
-        const path = `%3Cpath d='${d}' stroke-width='${strokeWidth}' stroke='${transColor(props.background)}' fill='none'/%3E`;
-        const path1 = `%3Cpath d='${d}' stroke-width='${strokeWidth}' stroke-dasharray='${offset},${perimeter}' stroke-linecap='round' stroke='${transColor(color)}' fill='none'/%3E`;
-        return {
-            background: `url("data:image/svg+xml,%3Csvg viewBox='0 0 100 100'  xmlns='http://www.w3.org/2000/svg'%3E${pa}${path}${path1}%3C/svg%3E")`,
-            width: '100%',
-            height: '100%',
-        };
-    };
-    return (React.createElement("div", { className: classes, style: styles, ...restProps },
-        React.createElement("div", { style: circleStyle() }),
-        React.createElement("div", { className: "nut-circleprogress-text" }, children)));
-};
-CircleProgress.defaultProps = defaultProps;
-CircleProgress.displayName = 'NutCircleProgress';
-
-export { CircleProgress as C };

package/dist/esm/col.taro-4477c9f7.js

@@ -1,43 +0,0 @@
-import React, { useState, useContext, useEffect } from 'react';
-import classNames from 'classnames';
-import { D as DataContext } from './UserContext-0aac9a82.js';
-import { C as ComponentDefaults } from './typings-d8491423.js';
-
-const defaultProps = {
-    ...ComponentDefaults,
-    span: '24',
-    offset: '0',
-    gutter: '0',
-};
-const Col = (props) => {
-    const { className, style, span, offset, children, onClick } = {
-        ...defaultProps,
-        ...props,
-    };
-    const [colName, setColName] = useState('');
-    const [colStyle, setColStyle] = useState({});
-    const { gutter } = useContext(DataContext);
-    const classs = () => {
-        // 定义col的class类
-        const prefixCls = 'nut-col';
-        return `${prefixCls} ${prefixCls}-${span} ${gutter ? `${prefixCls}-gutter` : ''} ${prefixCls}-${offset}`;
-    };
-    const getStyle = () => {
-        // 定义col的style类
-        const style = {};
-        style.paddingLeft = `${gutter / 2}px`;
-        style.paddingRight = `${gutter / 2}px`;
-        return style;
-    };
-    useEffect(() => {
-        setColName(classs);
-        setColStyle(getStyle);
-    }, [span, offset, gutter]);
-    return (React.createElement("div", { className: classNames(colName, className), style: { ...style, ...colStyle }, onClick: (e) => {
-            onClick && onClick(e, 'col');
-        } }, children));
-};
-Col.defaultProps = defaultProps;
-Col.displayName = 'NutCol';
-
-export { Col as C };

package/dist/esm/collapse.taro-89bcadf2.js

@@ -1,79 +0,0 @@
-import React, { memo, useState, useEffect } from 'react';
-import classNames from 'classnames';
-import { c as cn } from './bem-350c1702.js';
-
-const defaultProps = {
-    activeName: ['0'],
-    accordion: false,
-    expandIcon: null,
-    rotate: 180,
-};
-function areEqual(prevProps, nextProps) {
-    return (prevProps.children === nextProps.children &&
-        JSON.stringify(prevProps.activeName) ===
-            JSON.stringify(nextProps.activeName));
-}
-const Collapse = memo((props) => {
-    const { className, style, children, activeName, accordion, expandIcon, rotate, onChange, } = {
-        ...defaultProps,
-        ...props,
-    };
-    const childrenDom = React.Children.toArray(children);
-    const [defaultOpenIndex, setDefaultOpenIndex] = useState([]);
-    const handleActiveName = () => {
-        let activeArr = [];
-        if (!Array.isArray(activeName)) {
-            activeArr.push(activeName.toString());
-        }
-        else {
-            // 数组
-            if (accordion && activeName.length > 1) {
-                console.warn('手风琴模式不支持传递多个打开页签');
-            }
-            const activeNameStr = activeName.map((item) => {
-                return item.toString();
-            });
-            activeArr = [...activeNameStr];
-        }
-        return activeArr;
-    };
-    const colBem = cn('collapse');
-    useEffect(() => {
-        const activeArr = handleActiveName();
-        setDefaultOpenIndex(activeArr);
-    }, [activeName]);
-    const onToggle = (isOpen, name) => {
-        let newOpenIndex = [...defaultOpenIndex];
-        if (isOpen) {
-            // 当前状态为true，则变为false,闭合
-            const removeIndex = newOpenIndex.findIndex((value) => {
-                return value === name;
-            });
-            newOpenIndex.splice(removeIndex, 1);
-        }
-        else {
-            // 当前状态为false，变为true，展开
-            // eslint-disable-next-line no-lonely-if
-            if (accordion) {
-                newOpenIndex = [name];
-            }
-            else {
-                newOpenIndex.push(name);
-            }
-        }
-        setDefaultOpenIndex(newOpenIndex);
-        onChange && onChange(!isOpen, name);
-    };
-    return (React.createElement("div", { className: classNames(colBem(), className), style: style }, childrenDom.map((item) => {
-        return React.cloneElement(item, {
-            isOpen: defaultOpenIndex.includes(item.props.name),
-            onToggle: (isOpen, name) => onToggle(isOpen, name),
-            expandIcon: item.props.expandIcon || expandIcon,
-            rotate,
-        });
-    })));
-}, areEqual);
-Collapse.defaultProps = defaultProps;
-Collapse.displayName = 'NutCollapse';
-
-export { Collapse as C };

package/dist/esm/collapseitem-0e228cec.js

@@ -1,68 +0,0 @@
-import React, { useState, useCallback, useEffect } from 'react';
-import { c as cn } from './bem-350c1702.js';
-
-const defaultProps = {
-    title: null,
-    name: '',
-    isOpen: false,
-    expandIcon: null,
-    disabled: false,
-    rotate: 180,
-    subTitle: null,
-    childnull: true,
-};
-const CollapseItem = (props) => {
-    const { children, title, isOpen, onToggle, name, disabled, expandIcon, rotate, subTitle, childnull, ...rest } = {
-        ...defaultProps,
-        ...props,
-    };
-    const [domHeight, setDomHeight] = useState(-1); // 保存content的高度
-    const [currHeight, setCurrHeight] = useState('auto'); // 设置content的高度
-    const [update, setUpdate] = useState(false);
-    const [iconStyle, setIconStyle] = useState({
-        transform: 'translateY(-50%)',
-    });
-    const colBem = cn('collapse-item');
-    const measuredRef = useCallback((node) => {
-        if (node !== null) {
-            setDomHeight(node.getBoundingClientRect().height);
-        }
-    }, [update]);
-    useEffect(() => {
-        // 一开始content都有高度，在这里根据isOpen，改变其高度
-        setTimeout(() => {
-            if (domHeight !== -1) {
-                isOpen ? setCurrHeight(`${domHeight}px`) : setCurrHeight('0px');
-            }
-            const newIconStyle = isOpen
-                ? { transform: `translateY(-50%) rotate(${rotate}deg)` }
-                : { transform: 'translateY(-50%)' };
-            setIconStyle(newIconStyle);
-        }, 10);
-    }, [isOpen, domHeight, rotate]);
-    useEffect(() => {
-        if (!isOpen) {
-            setCurrHeight('0px');
-        }
-        else {
-            setCurrHeight('auto');
-        }
-        setUpdate(!update);
-    }, [children, isOpen]);
-    return (React.createElement("div", { className: colBem(), ...rest },
-        React.createElement("div", { className: colBem('header', { disabled }), onClick: () => {
-                if (disabled)
-                    return;
-                onToggle && onToggle(isOpen, name);
-            } },
-            React.createElement("div", { className: colBem('title') }, title),
-            React.createElement("div", { className: colBem('sub-title') }, subTitle),
-            React.createElement("div", { className: colBem('icon-box') },
-                React.createElement("div", { className: colBem('icon'), style: iconStyle }, expandIcon))),
-        childnull && (React.createElement("div", { className: colBem('content'), style: { height: currHeight }, ref: measuredRef },
-            React.createElement("div", { className: colBem('content-text') }, children)))));
-};
-CollapseItem.defaultProps = defaultProps;
-CollapseItem.displayName = 'NutCollapseItem';
-
-export { CollapseItem as C };

package/dist/esm/configprovider-9960f0fb.js

@@ -1,19 +0,0 @@
-import { createContext, useContext } from 'react';
-import 'lodash.kebabcase';
-import { z as zhCN } from './zh-CN-b4f493ba.js';
-
-const defaultConfigRef = {
-    current: {
-        locale: zhCN,
-    },
-};
-const getDefaultConfig = () => {
-    return defaultConfigRef.current;
-};
-// 创建一个 Context 对象
-const ConfigContext = createContext(null);
-const useConfig = () => {
-    return useContext(ConfigContext) ?? getDefaultConfig();
-};
-
-export { useConfig as u };

package/dist/esm/configprovider.taro-43a3c646.js

@@ -1,45 +0,0 @@
-import React, { createContext, useContext, useMemo } from 'react';
-import kebabCase from 'lodash.kebabcase';
-import { z as zhCN } from './zh-CN-b4f493ba.js';
-
-const defaultProps = {
-    locale: zhCN,
-};
-const defaultConfigRef = {
-    current: {
-        locale: zhCN,
-    },
-};
-const setDefaultConfig = (config) => {
-    defaultConfigRef.current = config;
-};
-const getDefaultConfig = () => {
-    return defaultConfigRef.current;
-};
-// 创建一个 Context 对象
-const ConfigContext = createContext(null);
-const useConfig = () => {
-    return useContext(ConfigContext) ?? getDefaultConfig();
-};
-function convertThemeVarsToCSSVars(themeVars) {
-    const cssVars = {};
-    Object.keys(themeVars).forEach((key) => {
-        cssVars[`--${kebabCase(key)}`] = themeVars[key];
-    });
-    return cssVars;
-}
-const ConfigProvider = (props) => {
-    const { children, ...config } = { ...defaultProps, ...props };
-    const parentConfig = useConfig();
-    const theme = config.theme || {};
-    const style = useMemo(() => convertThemeVarsToCSSVars(theme), [theme]);
-    return (React.createElement(ConfigContext.Provider, { value: {
-            ...parentConfig,
-            ...config,
-        } },
-        React.createElement("div", { style: style }, children)));
-};
-ConfigProvider.defaultProps = defaultProps;
-ConfigProvider.displayName = 'NutConfigProvider';
-
-export { ConfigProvider as C, getDefaultConfig as g, setDefaultConfig as s, useConfig as u };