@nutui/nutui-react-taro 1.4.4 → 1.4.5

package/dist/esm/range.taro-5d6ff217.js

@@ -0,0 +1,332 @@
+import React__default, { useState, useRef, useEffect, useCallback } from 'react';
+import { u as useTouch } from './useTouch-a2ea68c6.js';
+import { g as getRectByTaro } from './useClientRect-bf69d7b3.js';
+import { T as Toast } from './toast.taro-0804b6b4.js';
+import { u as useConfig } from './configprovider.taro-26882dd2.js';
+
+const defaultProps = {
+    range: false,
+    hiddenRange: false,
+    hiddenTag: false,
+    min: 0,
+    max: 100,
+    step: 1,
+    modelValue: 0,
+    vertical: false,
+    marks: {},
+};
+let startValue;
+let currentValue;
+const Range = (props) => {
+    const { locale } = useConfig();
+    const { className, range, disabled, activeColor, inactiveColor, buttonColor, hiddenRange, hiddenTag, modelValue, button, vertical, marks, dragStart, dragEnd, onChange, onDragStart, onDragEnd, minDesc, maxDesc, curValueDesc, } = { ...defaultProps, ...props };
+    let { min, max, step } = { ...defaultProps, ...props };
+    min = Number(min);
+    max = Number(max);
+    step = Number(step);
+    const [buttonIndex, SetButtonIndex] = useState(0);
+    const [initValue, SetInitValue] = useState();
+    const [dragStatus, SetDragStatus] = useState('start'  );
+    const touch = useTouch();
+    const root = useRef(null);
+    const [marksList, SetMarksList] = useState([]);
+    const [show, SetShow] = useState(false);
+    const [toastMsg, SetToastMsg] = useState('');
+    const toastShow = (msg) => {
+        SetToastMsg(msg);
+        SetShow(true);
+    };
+    useEffect(() => {
+        if (typeof modelValue === 'number') {
+            if (!range && (modelValue < min || modelValue > max)) {
+                SetInitValue(0);
+                toastShow(`${modelValue} ${locale.range.rangeText}`);
+                return;
+            }
+            SetInitValue(modelValue);
+        }
+    }, [modelValue]);
+    useEffect(() => {
+        if (marks) {
+            const marksKeys = Object.keys(marks);
+            const list = marksKeys
+                .map(parseFloat)
+                .sort((a, b) => a - b)
+                .filter((point) => point >= min && point <= max);
+            SetMarksList(list);
+        }
+    }, [marks]);
+    const scope = () => {
+        return Number(max) - Number(min);
+    };
+    const classes = useCallback(() => {
+        const prefixCls = 'nut-range';
+        return [
+            prefixCls,
+            `${disabled ? `${prefixCls}-disabled` : ''}`,
+            `${vertical ? `${prefixCls}-vertical` : ''}`,
+            `${!hiddenRange ? `${prefixCls}-show-number` : ''}`,
+        ]
+            .filter(Boolean)
+            .join(' ');
+    }, [disabled, vertical, hiddenRange]);
+    const containerClasses = useCallback(() => {
+        const prefixCls = 'nut-range-container';
+        return [prefixCls, `${vertical ? `${prefixCls}-vertical` : ''}`, className]
+            .filter(Boolean)
+            .join(' ');
+    }, [vertical, className]);
+    const markClassName = useCallback((mark) => {
+        const classPrefix = 'nut-range-mark';
+        let lowerBound = Number(min);
+        let upperBound = Number(max);
+        if (range) {
+            const [left, right] = modelValue;
+            lowerBound = left;
+            upperBound = right;
+        }
+        else {
+            upperBound = modelValue;
+        }
+        const isActive = mark <= upperBound && mark >= lowerBound;
+        return [
+            `${classPrefix}-text`,
+            `${isActive ? `${classPrefix}-text-active` : ''}`,
+        ]
+            .filter(Boolean)
+            .join(' ');
+    }, [range, modelValue, min, max]);
+    const [rangeName, setRangeName] = useState(classes());
+    const [containerName, setContainerName] = useState(containerClasses());
+    useEffect(() => {
+        setRangeName(classes());
+        setContainerName(containerClasses());
+    }, [classes, containerClasses]);
+    const wrapperStyle = () => {
+        return {
+            background: inactiveColor,
+        };
+    };
+    const buttonStyle = () => {
+        return {
+            borderColor: buttonColor,
+        };
+    };
+    const isRange = (val) => {
+        return !!range && Array.isArray(val);
+    };
+    const calcMainAxis = () => {
+        const modelVal = initValue || initValue === 0 ? initValue : modelValue;
+        if (isRange(modelVal)) {
+            return `${((modelVal[1] - modelVal[0]) * 100) / scope()}%`;
+        }
+        return `${((modelVal - Number(min)) * 100) / scope()}%`;
+    };
+    const calcOffset = () => {
+        const modelVal = initValue || initValue === 0 ? initValue : modelValue;
+        if (isRange(modelVal)) {
+            return `${((modelVal[0] - Number(min)) * 100) / scope()}%`;
+        }
+        return `0%`;
+    };
+    const barStyle = () => {
+        if (vertical) {
+            return {
+                height: calcMainAxis(),
+                top: calcOffset(),
+                background: activeColor,
+                transition: dragStatus ? 'none' : undefined,
+            };
+        }
+        return {
+            width: calcMainAxis(),
+            left: calcOffset(),
+            background: activeColor,
+            transition: dragStatus ? 'none' : undefined,
+        };
+    };
+    const marksStyle = (mark) => {
+        let style = {
+            left: `${((mark - Number(min)) / scope()) * 100}%`,
+        };
+        if (vertical) {
+            style = {
+                top: `${((mark - Number(min)) / scope()) * 100}%`,
+            };
+        }
+        return style;
+    };
+    const tickStyle = (mark) => {
+        let lowerBound = Number(min);
+        let upperBound = Number(max);
+        if (range) {
+            const [left, right] = modelValue;
+            lowerBound = left;
+            upperBound = right;
+        }
+        const isActive = mark <= upperBound && mark >= lowerBound;
+        const style = {
+            background: !isActive ? inactiveColor : activeColor,
+        };
+        return style;
+    };
+    const format = (value) => {
+        value = Math.max(+min, Math.min(value, +max));
+        return Math.round(value / +step) * +step;
+    };
+    const isSameValue = (newValue, oldValue) => {
+        return JSON.stringify(newValue) === JSON.stringify(oldValue);
+    };
+    const handleOverlap = (value) => {
+        if (value[0] > value[1]) {
+            return value.slice(0).reverse();
+        }
+        return value;
+    };
+    const updateValue = (value, end) => {
+        if (isRange(value)) {
+            value = handleOverlap(value).map(format);
+        }
+        else {
+            value = format(value);
+        }
+        const modelVal = initValue || initValue === 0 ? initValue : modelValue;
+        if (!isSameValue(value, modelVal)) {
+            SetInitValue(value);
+        }
+        if ((marks || end) && !isSameValue(value, startValue)) {
+            onChange && onChange(value);
+        }
+    };
+    const click = async (event) => {
+        if (disabled || !root.current) {
+            return;
+        }
+        SetDragStatus('');
+        const rect = await getRectByTaro(root.current);
+        let delta = (event.detail.x ? event.detail.x : event.clientX) - rect.left;
+        let total = rect.width;
+        if (vertical) {
+            delta = (event.detail.y ? event.detail.y : event.clientY) - rect.top;
+            total = rect.height;
+        }
+        const value = Number(min) + (delta / total) * scope();
+        currentValue = initValue || initValue === 0 ? initValue : modelValue;
+        if (isRange(currentValue)) {
+            const [left, right] = currentValue;
+            const middle = (left + right) / 2;
+            if (value <= middle) {
+                updateValue([value, right], true);
+            }
+            else {
+                updateValue([left, value], true);
+            }
+        }
+        else {
+            updateValue(value, true);
+        }
+    };
+    const onTouchStart = (event) => {
+        if (disabled) {
+            return;
+        }
+        touch.start(event);
+        currentValue = initValue || initValue === 0 ? initValue : modelValue;
+        if (isRange(currentValue)) {
+            startValue = currentValue.map(format);
+        }
+        else {
+            startValue = format(currentValue);
+        }
+        SetDragStatus('start');
+    };
+    const onTouchMove = async (event) => {
+        if (disabled || !root.current) {
+            return;
+        }
+        if (dragStatus === 'start') {
+            dragStart && dragStart();
+            onDragStart && onDragStart();
+        }
+        touch.move(event);
+        SetDragStatus('draging');
+        const rect = await getRectByTaro(root.current);
+        let delta = touch.deltaX;
+        let total = rect.width;
+        let diff = (delta / total) * scope();
+        if (vertical) {
+            delta = touch.deltaY;
+            total = rect.height;
+            diff = (delta / total) * scope();
+        }
+        if (isRange(startValue)) {
+            currentValue[buttonIndex] = startValue[buttonIndex] + diff;
+        }
+        else {
+            currentValue = startValue + diff;
+        }
+        updateValue(currentValue);
+    };
+    const onTouchEnd = (event) => {
+        if (disabled) {
+            return;
+        }
+        if (dragStatus === 'draging') {
+            updateValue(currentValue, true);
+            dragEnd && dragEnd();
+            onDragEnd && onDragEnd();
+        }
+        SetDragStatus('');
+    };
+    const curValue = (idx) => {
+        const modelVal = initValue || initValue === 0 ? initValue : modelValue;
+        const value = typeof idx === 'number' ? modelVal[idx] : modelVal;
+        return value;
+    };
+    return (React__default.createElement("div", { className: `${containerName}` },
+        !hiddenRange ? React__default.createElement("div", { className: "min" }, minDesc || +min) : null,
+        React__default.createElement("div", { ref: root, style: wrapperStyle(), className: `${rangeName}`, onClick: (e) => {
+                click(e);
+            } },
+            marksList.length > 0 ? (React__default.createElement("div", { className: "nut-range-mark" }, marksList.map((marks) => {
+                return (React__default.createElement("span", { key: marks, className: markClassName(marks), style: marksStyle(marks) },
+                    marks,
+                    React__default.createElement("span", { className: "nut-range-tick", style: tickStyle(marks) })));
+            }))) : null,
+            React__default.createElement("div", { className: "nut-range-bar", style: barStyle() }, range ? ([0, 1].map((item, index) => {
+                return (React__default.createElement("div", { role: "slider", key: index, className: `${index === 0 ? 'nut-range-button-wrapper-left' : ''}
+                  ${index === 1 ? 'nut-range-button-wrapper-right' : ''}`, tabIndex: disabled ? -1 : 0, "aria-valuemin": +min, "aria-valuenow": curValue(index), "aria-valuemax": +max, "aria-orientation": "horizontal", onTouchStart: (e) => {
+                        if (typeof index === 'number') {
+                            // 实时更新当前拖动的按钮索引
+                            SetButtonIndex(index);
+                        }
+                        onTouchStart(e);
+                    }, onTouchMove: (e) => {
+                        onTouchMove(e);
+                    }, onTouchEnd: (e) => {
+                        onTouchEnd();
+                    }, onTouchCancel: (e) => {
+                        onTouchEnd();
+                    }, onClick: (e) => {
+                        e.stopPropagation();
+                    } }, button || (React__default.createElement("div", { className: "nut-range-button", style: buttonStyle() }, !hiddenTag ? (React__default.createElement("div", { className: "number" }, curValueDesc || curValue(index))) : null))));
+            })) : (React__default.createElement("div", { role: "slider", className: "nut-range-button-wrapper", tabIndex: disabled ? -1 : 0, "aria-valuemin": +min, "aria-valuenow": curValue(), "aria-valuemax": +max, "aria-orientation": "horizontal", onTouchStart: (e) => {
+                    onTouchStart(e);
+                }, onTouchMove: (e) => {
+                    onTouchMove(e);
+                }, onTouchEnd: (e) => {
+                    onTouchEnd();
+                }, onTouchCancel: (e) => {
+                    onTouchEnd();
+                }, onClick: (e) => {
+                    e.stopPropagation();
+                } }, button || (React__default.createElement("div", { className: "nut-range-button", style: buttonStyle() }, !hiddenTag ? (React__default.createElement("div", { className: "number" }, curValueDesc || curValue())) : null)))))),
+        !hiddenRange ? React__default.createElement("div", { className: "max" }, maxDesc || +max) : null,
+        React__default.createElement(Toast, { type: "text", visible: show, msg: toastMsg, onClose: () => {
+                SetShow(false);
+            } })));
+};
+Range.defaultProps = defaultProps;
+Range.displayName = 'NutRange';
+
+export { Range as R };

package/dist/esm/rate.taro-10197384.js

@@ -1,119 +1,72 @@
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 import React__default, { useState, useEffect } from 'react';
 import { c as cn } from './bem-893ad28d.js';
 import { I as Icon } from './icon-8dc4de10.js';
 import { C as ComponentDefaults } from './typings-1c5f2628.js';
-var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
-  count: 5,
-  modelValue: 0,
-  minimizeValue: 0,
-  iconSize: 18,
-  activeColor: '',
-  voidColor: '',
-  checkedIcon: 'star-fill-n',
-  uncheckedIcon: 'star-n',
-  disabled: false,
-  readonly: false,
-  allowHalf: false,
-  spacing: 14
-});
-var Rate = function Rate(props) {
-  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props),
-    className = _defaultProps$props.className,
-    style = _defaultProps$props.style,
-    count = _defaultProps$props.count,
-    modelValue = _defaultProps$props.modelValue,
-    minimizeValue = _defaultProps$props.minimizeValue,
-    iconSize = _defaultProps$props.iconSize,
-    activeColor = _defaultProps$props.activeColor,
-    voidColor = _defaultProps$props.voidColor,
-    checkedIcon = _defaultProps$props.checkedIcon,
-    uncheckedIcon = _defaultProps$props.uncheckedIcon,
-    disabled = _defaultProps$props.disabled,
-    readonly = _defaultProps$props.readonly,
-    allowHalf = _defaultProps$props.allowHalf,
-    spacing = _defaultProps$props.spacing,
-    onChange = _defaultProps$props.onChange,
-    iconClassPrefix = _defaultProps$props.iconClassPrefix,
-    iconFontClassName = _defaultProps$props.iconFontClassName;
-  var b = cn('rate');
-  var bi = cn('rate-item');
-  var _useState = useState([1, 2, 3, 4, 5]),
-    _useState2 = _slicedToArray(_useState, 2),
-    countArray = _useState2[0],
-    setCountArray = _useState2[1];
-  var _useState3 = useState(0),
-    _useState4 = _slicedToArray(_useState3, 2),
-    score = _useState4[0],
-    setScore = _useState4[1];
-  useEffect(function () {
-    var tmp = [];
-    for (var i = 1; i <= Number(count); i++) {
-      tmp.push(i);
-    }
-    setCountArray(tmp);
-  }, [count]);
-  useEffect(function () {
-    setScore(Math.max(Number(modelValue), Number(minimizeValue)));
-  }, [modelValue]);
-  var pxCheck = function pxCheck(value) {
-    return Number.isNaN(Number(value)) ? String(value) : "".concat(value, "px");
-  };
-  var _onClick = function onClick(e, index) {
-    e.preventDefault();
-    e.stopPropagation();
-    if (disabled || readonly) return;
-    var value = 0;
-    if (!(index === 1 && score === index)) {
-      value = index;
-    }
-    value = Math.max(value, Number(minimizeValue));
-    setScore(value);
-    onChange && onChange(value);
-  };
-  var onHalfClick = function onHalfClick(event, n) {
-    event.preventDefault();
-    event.stopPropagation();
-    var value = Math.max(Number(minimizeValue), n - 0.5);
-    setScore(value);
-    onChange && onChange(value);
-  };
-  return React__default.createElement("div", {
-    className: "".concat(b(), " ").concat(className),
-    style: style
-  }, countArray.map(function (n) {
-    return React__default.createElement("div", {
-      className: bi(),
-      key: n,
-      onClick: function onClick(event) {
-        return _onClick(event, n);
-      },
-      style: {
-        marginRight: pxCheck(spacing)
-      }
-    }, React__default.createElement(Icon, {
-      classPrefix: iconClassPrefix,
-      fontClassName: iconFontClassName,
-      size: iconSize,
-      className: "".concat(bi('icon'), " ").concat(disabled || n > score ? bi('icon--disabled') : ''),
-      name: n <= score ? checkedIcon : uncheckedIcon,
-      color: n <= score ? activeColor : voidColor
-    }), allowHalf && score > n - 1 && React__default.createElement(Icon, {
-      classPrefix: iconClassPrefix,
-      fontClassName: iconFontClassName,
-      onClick: function onClick(event) {
-        return onHalfClick(event, n);
-      },
-      className: "".concat(bi('icon'), " ").concat(bi('icon--half')),
-      color: n <= score ? activeColor : voidColor,
-      size: iconSize,
-      name: checkedIcon
-    }));
-  }));
+
+const defaultProps = {
+    ...ComponentDefaults,
+    count: 5,
+    modelValue: 0,
+    minimizeValue: 0,
+    iconSize: 18,
+    activeColor: '',
+    voidColor: '',
+    checkedIcon: 'star-fill-n',
+    uncheckedIcon: 'star-n',
+    disabled: false,
+    readonly: false,
+    allowHalf: false,
+    spacing: 14,
+};
+const Rate = (props) => {
+    const { className, style, count, modelValue, minimizeValue, iconSize, activeColor, voidColor, checkedIcon, uncheckedIcon, disabled, readonly, allowHalf, spacing, onChange, iconClassPrefix, iconFontClassName, } = {
+        ...defaultProps,
+        ...props,
+    };
+    const b = cn('rate');
+    const bi = cn('rate-item');
+    const [countArray, setCountArray] = useState([1, 2, 3, 4, 5]);
+    const [score, setScore] = useState(0);
+    useEffect(() => {
+        const tmp = [];
+        for (let i = 1; i <= Number(count); i++) {
+            tmp.push(i);
+        }
+        setCountArray(tmp);
+    }, [count]);
+    useEffect(() => {
+        setScore(Math.max(Number(modelValue), Number(minimizeValue)));
+    }, [modelValue]);
+    const pxCheck = (value) => {
+        return Number.isNaN(Number(value)) ? String(value) : `${value}px`;
+    };
+    const onClick = (e, index) => {
+        e.preventDefault();
+        e.stopPropagation();
+        if (disabled || readonly)
+            return;
+        let value = 0;
+        if (!(index === 1 && score === index)) {
+            value = index;
+        }
+        value = Math.max(value, Number(minimizeValue));
+        setScore(value);
+        onChange && onChange(value);
+    };
+    const onHalfClick = (event, n) => {
+        event.preventDefault();
+        event.stopPropagation();
+        const value = Math.max(Number(minimizeValue), n - 0.5);
+        setScore(value);
+        onChange && onChange(value);
+    };
+    return (React__default.createElement("div", { className: `${b()} ${className}`, style: style }, countArray.map((n) => {
+        return (React__default.createElement("div", { className: bi(), key: n, onClick: (event) => onClick(event, n), style: { marginRight: pxCheck(spacing) } },
+            React__default.createElement(Icon, { classPrefix: iconClassPrefix, fontClassName: iconFontClassName, size: iconSize, className: `${bi('icon')} ${disabled || n > score ? bi('icon--disabled') : ''}`, name: n <= score ? checkedIcon : uncheckedIcon, color: n <= score ? activeColor : voidColor }),
+            allowHalf && score > n - 1 && (React__default.createElement(Icon, { classPrefix: iconClassPrefix, fontClassName: iconFontClassName, onClick: (event) => onHalfClick(event, n), className: `${bi('icon')} ${bi('icon--half')}`, color: n <= score ? activeColor : voidColor, size: iconSize, name: checkedIcon }))));
+    })));
 };
 Rate.defaultProps = defaultProps;
 Rate.displayName = 'NutRate';
+
 export { Rate as R };

package/dist/esm/row.taro-37a895de.js

@@ -1,49 +1,45 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 import React__default from 'react';
 import { D as DataContext } from './UserContext-be8097d2.js';
-var defaultProps = {
-  type: '',
-  justify: 'start',
-  align: 'flex-start',
-  wrap: 'nowrap',
-  gutter: '0'
+
+const defaultProps = {
+    type: '',
+    justify: 'start',
+    align: 'flex-start',
+    wrap: 'nowrap',
+    gutter: '0',
 };
-var Row = function Row(props) {
-  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props),
-    className = _defaultProps$props.className,
-    _defaultProps$props$s = _defaultProps$props.style,
-    style = _defaultProps$props$s === void 0 ? {} : _defaultProps$props$s,
-    children = _defaultProps$props.children,
-    type = _defaultProps$props.type,
-    justify = _defaultProps$props.justify,
-    align = _defaultProps$props.align,
-    wrap = _defaultProps$props.wrap,
-    gutter = _defaultProps$props.gutter,
-    _onClick = _defaultProps$props.onClick;
-  var prefixCls = 'nut-row';
-  var getClass = function getClass(prefix, type) {
-    var classType = type ? "nut-row-".concat(prefix, "-").concat(type) : '';
-    var className = prefix ? classType : "nut-row-".concat(type);
-    return className;
-  };
-  var getClasses = function getClasses() {
-    return "\n    ".concat(getClass('', type), "\n    ").concat(getClass('justify', justify), "\n    ").concat(getClass('align', align), "\n    ").concat(getClass('flex', wrap), "\n    ").concat(prefixCls, "\n   ");
-  };
-  var parentRow = {
-    gutter: gutter
-  };
-  return React__default.createElement(DataContext.Provider, {
-    value: parentRow
-  }, React__default.createElement('div', {
-    className: "".concat(getClasses(), " ").concat(className),
-    style: style,
-    onClick: function onClick(e) {
-      _onClick && _onClick(e, 'row');
-    }
-  }, children));
+const Row = (props) => {
+    const { className, style = {}, children, type, justify, align, wrap, gutter, onClick, } = {
+        ...defaultProps,
+        ...props,
+    };
+    const prefixCls = 'nut-row';
+    const getClass = (prefix, type) => {
+        const classType = type ? `nut-row-${prefix}-${type}` : '';
+        const className = prefix ? classType : `nut-row-${type}`;
+        return className;
+    };
+    const getClasses = () => {
+        return `
+    ${getClass('', type)}
+    ${getClass('justify', justify)}
+    ${getClass('align', align)}
+    ${getClass('flex', wrap)}
+    ${prefixCls}
+   `;
+    };
+    const parentRow = {
+        gutter,
+    };
+    return (React__default.createElement(DataContext.Provider, { value: parentRow }, React__default.createElement('div', {
+        className: `${getClasses()} ${className}`,
+        style,
+        onClick: (e) => {
+            onClick && onClick(e, 'row');
+        },
+    }, children)));
 };
 Row.defaultProps = defaultProps;
 Row.displayName = 'NutRow';
+
 export { Row as R };