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

package/dist/style.mjs

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui-react-taro v2.0.0-alpha.4 Fri May 05 2023 16:38:28 GMT+0800 (China Standard Time)
+* @nutui/nutui-react-taro v2.0.0-alpha.5 Wed May 10 2023 15:25:36 GMT+0800 (China Standard Time)
 * (c) 2023 @jdf2e.
 * Released under the MIT License.
 */

package/dist/styles/themes/default.scss

@@ -4,7 +4,6 @@
 @import '../../packages/cell/cell.scss';
 @import '../../packages/cellgroup/cellgroup.scss';
 @import '../../packages/configprovider/configprovider.scss';
-@import '../../packages/icon/icon.scss';
 @import '../../packages/image/image.scss';
 @import '../../packages/overlay/overlay.scss';
 @import '../../packages/col/col.scss';

package/dist/types/index.d.ts

@@ -42,6 +42,7 @@ interface CellGroupProps extends BasicComponent {
     title: ReactNode;
     description: ReactNode;
     children?: ReactNode;
+    divider: boolean;
 }
 declare const CellGroup: FunctionComponent<Partial<CellGroupProps>>;
 
@@ -317,7 +318,7 @@ declare const Elevator: FunctionComponent<Partial<ElevatorProps> & React__defaul
     Context: typeof elevatorContext;
 };
 
-type Direction$1 = 'right' | 'left';
+type Direction$2 = 'right' | 'left';
 type Position$2 = {
     top?: string;
     bottom?: string;
@@ -329,7 +330,7 @@ interface FixedNavProps extends BasicComponent {
     activeText: string;
     inactiveText: string;
     position: Position$2;
-    type: Direction$1;
+    type: Direction$2;
     onChange: (item: any) => void;
     onSelect: (item: any, event: MouseEvent$1) => void;
     content: React__default.ReactNode;
@@ -636,32 +637,32 @@ interface RadioGroupOptionType {
     onChange?: MouseEventHandler<HTMLDivElement>;
 }
 
-type CheckboxTextPosition = 'left' | 'right';
+type CheckboxLabelPosition = 'left' | 'right';
 type CheckboxDirection = 'horizontal' | 'vertical';
 interface CheckboxGroupProps {
-    disabled: boolean;
-    checkedValue: string[];
+    disabled?: boolean;
+    value?: string[];
+    defaultValue?: string[];
     max: number | undefined;
-    textPosition: CheckboxTextPosition;
+    labelPosition: CheckboxLabelPosition;
     direction: CheckboxDirection;
-    onChange: (value: string[]) => void;
     options: RadioGroupOptionType[];
+    onChange: (value: string[]) => void;
 }
 declare const CheckboxGroup: React__default.ForwardRefExoticComponent<Partial<CheckboxGroupProps> & Omit<React__default.HTMLAttributes<HTMLDivElement>, "onChange"> & React__default.RefAttributes<unknown>>;
 
 interface CheckboxProps extends BasicComponent {
     checked: boolean;
     disabled: boolean;
-    textPosition: 'left' | 'right';
-    iconSize: string | number;
+    defaultChecked: boolean;
+    labelPosition: 'left' | 'right';
     icon: React__default.ReactNode;
-    checkedIcon: React__default.ReactNode;
+    activeIcon: React__default.ReactNode;
     indeterminateIcon: React__default.ReactNode;
-    iconClassPrefix: string;
-    iconFontClassName: string;
+    value: string | number;
     indeterminate: boolean;
     label: string | number;
-    onChange: (state: boolean, label: string) => void;
+    onChange: (value: boolean) => void;
 }
 declare const Checkbox: FunctionComponent<Partial<CheckboxProps> & Omit<React__default.HTMLAttributes<HTMLDivElement>, 'onChange'>> & {
     Group: typeof CheckboxGroup;
@@ -905,11 +906,11 @@ interface PickerProps {
 declare const Picker: React__default.ForwardRefExoticComponent<Partial<PickerProps> & React__default.RefAttributes<unknown>>;
 
 type Position$1 = 'left' | 'right';
-type Direction = 'horizontal' | 'vertical';
+type Direction$1 = 'horizontal' | 'vertical';
 interface RadioGroupProps {
     value: string | number | boolean | null;
     textPosition: Position$1;
-    direction: Direction;
+    direction: Direction$1;
     onChange: (value: string | number | boolean) => void;
     options: RadioGroupOptionType[];
 }
@@ -1284,11 +1285,11 @@ interface DragProps extends BasicComponent {
 }
 declare const Drag: FunctionComponent<Partial<DragProps> & React__default.HTMLAttributes<HTMLDivElement>>;
 
-interface EmptyProps {
-    image: ReactNode;
+interface EmptyProps extends BasicComponent {
+    image?: ReactNode;
     imageSize: number | string;
     description: ReactNode;
-    className: string;
+    status: 'empty' | 'error' | 'network';
 }
 declare const Empty: FunctionComponent<Partial<EmptyProps> & React__default.HTMLAttributes<HTMLDivElement>>;
 
@@ -1411,7 +1412,6 @@ interface SkeletonProps {
 declare const Skeleton: FunctionComponent<Partial<SkeletonProps>>;
 
 type SwipeSide = 'left' | 'right';
-type SwipePosition = SwipeSide | 'cell' | 'outside';
 interface SwipeInstance {
     open: (side: SwipeSide) => void;
     close: () => void;
@@ -1423,10 +1423,6 @@ interface SwipeProps {
     style: React__default.CSSProperties;
     /** 标识符，可以在事件参数中获取到 */
     name?: string | number;
-    /** 指定左侧滑动区域宽度，单位为px */
-    leftWidth?: string | number;
-    /** 指定右侧滑动区域宽度，单位为 px */
-    rightWidth?: string | number;
     /** 左侧滑动区域的内容 */
     leftAction?: React__default.ReactNode;
     /** 右侧滑动区域的内容 */
@@ -1443,10 +1439,10 @@ interface SwipeProps {
     /** 关闭时触发 */
     onClose?: ({ name, position, }: {
         name: string | number;
-        position: SwipePosition;
+        position: SwipeSide;
     }) => void;
     /** 点击时触发 */
-    onActionClick?: (event: Event, position: SwipePosition) => void;
+    onActionClick?: (event: Event, position: SwipeSide) => void;
     onTouchStart?: (event: Event) => void;
     onTouchEnd?: (event: Event) => void;
     onTouchMove?: (event: Event) => void;
@@ -1549,30 +1545,26 @@ interface AvatarProps extends BasicComponent {
     size: string;
     icon: React__default.ReactNode;
     shape: AvatarShape;
-    bgColor: string;
+    background: string;
     color: string;
-    prefixCls: string;
-    url: string;
-    className: string;
-    style: React__default.CSSProperties;
-    activeAvatar: (e: MouseEvent) => void;
-    onActiveAvatar: (e: MouseEvent) => void;
-    onError: (e: any) => void;
+    fit: 'contain' | 'cover' | 'fill' | 'none' | 'scale-down';
+    src: string;
+    alt: string;
+    onClick: (e: MouseEvent) => void;
+    onError: () => void;
 }
 type AvatarShape = 'round' | 'square';
-declare const Avatar: FunctionComponent<Partial<AvatarProps> & React__default.HTMLAttributes<HTMLDivElement>>;
+declare const Avatar: FunctionComponent<Partial<AvatarProps> & Omit<React__default.HTMLAttributes<HTMLDivElement>, 'onClick'>>;
 
-interface AvatarGroupProps {
+interface AvatarGroupProps extends BasicComponent {
     maxContent: string;
-    maxCount: string | number;
-    maxBgColor: string;
+    max: string | number;
+    maxBackground: string;
     maxColor: string;
-    size: string;
-    shape: string;
-    span: string;
-    zIndex: string;
-    className: string;
-    style: React__default.CSSProperties;
+    size: 'large' | 'normal' | 'small';
+    shape: 'round' | 'square';
+    gap: string;
+    level: 'left' | 'right';
 }
 declare const AvatarGroup: FunctionComponent<Partial<AvatarGroupProps> & React__default.HTMLAttributes<HTMLDivElement>>;
 
@@ -1630,9 +1622,10 @@ interface CountDownProps {
 }
 declare const CountDown: React__default.ForwardRefExoticComponent<Partial<CountDownProps> & React__default.RefAttributes<unknown>>;
 
-interface EllipsisProps {
+type Direction = 'start' | 'end' | 'middle';
+interface EllipsisProps extends BasicComponent {
     content: string;
-    direction: string;
+    direction: Direction;
     rows: number | string;
     expandText: string;
     collapseText: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nutui/nutui-react-taro",
-  "version": "2.0.0-alpha.4",
+  "version": "2.0.0-alpha.5",
   "style": "dist/style.css",
   "main": "dist/nutui.react.umd.js",
   "module": "dist/esm/nutui-react.es.js",

package/dist/esm/Icon.js

@@ -1,64 +0,0 @@
-import React from 'react';
-import { c as cn } from './bem-350c1702.js';
-import '@bem-react/classname';
-
-const defaultProps = {
-    name: '',
-    size: '',
-    classPrefix: 'nut-icon',
-    fontClassName: 'nutui-iconfont',
-    color: '',
-    tag: 'i',
-    onClick: (e) => { },
-    className: '',
-};
-function pxCheck(value) {
-    if (value === '') {
-        return value;
-    }
-    if (Number.isNaN(Number(value))) {
-        return String(value);
-    }
-    return `${value}px`;
-}
-function Icon(props) {
-    const { name, size, classPrefix, color, tag, children, className, fontClassName, style, onClick, ...rest } = {
-        ...defaultProps,
-        ...props,
-    };
-    const isImage = name ? name.indexOf('/') !== -1 : false;
-    const type = isImage ? 'img' : tag;
-    const b = cn('icon');
-    const handleClick = (e) => {
-        if (onClick) {
-            onClick(e);
-        }
-    };
-    const hasSrc = () => {
-        if (isImage)
-            return { src: name };
-        return {};
-    };
-    const styles = {};
-    const checkedSize = pxCheck(size);
-    if (checkedSize) {
-        styles.width = styles.height = styles.fontSize = checkedSize;
-    }
-    return React.createElement(type, {
-        className: isImage
-            ? `${b('img')} ${className || ''} `
-            : `${fontClassName} ${b(null)} ${classPrefix}-${name} ${className || ''}`,
-        style: {
-            color,
-            ...styles,
-            ...style,
-        },
-        ...rest,
-        onClick: handleClick,
-        ...hasSrc(),
-    }, children);
-}
-Icon.defaultProps = defaultProps;
-Icon.displayName = 'NutIcon';
-
-export { Icon as default };

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/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 };