gui-one-nutui-react-taro
Version:
京东风格的轻量级移动端 React 组件库，支持一套代码生成 H5 和小程序
1,590 lines • 570 kB
JavaScript
/*!
* gui-one-nutui-react-taro v1.0.1 Sat Nov 19 2022 23:52:10 GMT+0800 (中国标准时间)
* (c) 2022 @jdf2e.
* Released under the MIT License.
*/
(function(global, factory) {
typeof exports === "object" && typeof module !== "undefined" ? factory(exports, require("react"), require("@tarojs/taro"), require("react-dom")) : typeof define === "function" && define.amd ? define(["exports", "react", "@tarojs/taro", "react-dom"], factory) : (global = typeof globalThis !== "undefined" ? globalThis : global || self, factory((global.nutui = global.nutui || {}, global.nutui.react = {}), global.React, global.Taro, global.ReactDOM));
})(this, function(exports2, React, Taro, ReactDOM) {
"use strict";
function _interopDefaultLegacy(e2) {
return e2 && typeof e2 === "object" && "default" in e2 ? e2 : { "default": e2 };
}
function _interopNamespace(e2) {
if (e2 && e2.__esModule)
return e2;
var n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
if (e2) {
Object.keys(e2).forEach(function(k) {
if (k !== "default") {
var d = Object.getOwnPropertyDescriptor(e2, k);
Object.defineProperty(n, k, d.get ? d : {
enumerable: true,
get: function() {
return e2[k];
}
});
}
});
}
n["default"] = e2;
return Object.freeze(n);
}
var React__default = /* @__PURE__ */ _interopDefaultLegacy(React);
var React__namespace = /* @__PURE__ */ _interopNamespace(React);
var Taro__default = /* @__PURE__ */ _interopDefaultLegacy(Taro);
var ReactDOM__default = /* @__PURE__ */ _interopDefaultLegacy(ReactDOM);
function getAugmentedNamespace(n) {
if (n.__esModule)
return n;
var a = Object.defineProperty({}, "__esModule", { value: true });
Object.keys(n).forEach(function(k) {
var d = Object.getOwnPropertyDescriptor(n, k);
Object.defineProperty(a, k, d.get ? d : {
enumerable: true,
get: function() {
return n[k];
}
});
});
return a;
}
var classname = { exports: {} };
var classname_production_min = {};
function r(r2) {
function e2(e3, i, a, o) {
var f = i ? t + e3 + r2.e + i : t + e3, v = f;
if (a) {
var u = " " + v + r2.m;
for (var s in a)
if (a.hasOwnProperty(s)) {
var p = a[s];
true === p ? v += u + s : p && (v += u + s + n + p);
}
}
if (void 0 !== o)
for (var c = 0, l = o.length; c < l; c++) {
var y = o[c];
if (y && "string" == typeof y.valueOf())
for (var g = y.valueOf().split(" "), d = 0; d < g.length; d++) {
var h = g[d];
h !== f && (v += " " + h);
}
}
return v;
}
var t = r2.n || "", n = r2.v || r2.m;
return function(r3, t2) {
return function(n2, i, a) {
return "string" == typeof n2 ? Array.isArray(i) ? e2(r3, n2, void 0, i) : e2(r3, n2, i, a) : e2(r3, t2, n2, i);
};
};
}
Object.defineProperty(classname_production_min, "__esModule", { value: true });
var e = r({ e: "-", m: "_" });
classname_production_min.cn = e, classname_production_min.withNaming = r;
{
classname.exports = classname_production_min;
}
const cn = classname.exports.withNaming({ n: "nut-", e: "__", m: "--", v: "-" });
const defaultProps$1o = {
name: "",
size: "",
classPrefix: "nut-icon",
fontClassName: "nutui-iconfont",
color: "",
tag: "i",
onClick: (e2) => {
},
className: ""
};
function pxCheck$3(value) {
return Number.isNaN(Number(value)) ? String(value) : `${value}px`;
}
function Icon$1(props) {
const {
name,
size,
classPrefix,
color,
tag,
children,
className,
fontClassName,
style,
onClick,
...rest
} = {
...defaultProps$1o,
...props
};
const isImage = name ? name.indexOf("/") !== -1 : false;
const type = isImage ? "img" : tag;
const b2 = cn("icon");
const handleClick2 = (e2) => {
if (onClick) {
onClick(e2);
}
};
const hasSrc = () => {
if (isImage)
return { src: name };
return {};
};
return React__default["default"].createElement(
type,
{
className: isImage ? `${b2("img")} ${className || ""} ` : `${fontClassName} ${b2(null)} ${classPrefix}-${name} ${className || ""}`,
style: {
color,
fontSize: pxCheck$3(size),
width: pxCheck$3(size),
height: pxCheck$3(size),
...style
},
...rest,
onClick: handleClick2,
...hasSrc()
},
children
);
}
Icon$1.defaultProps = defaultProps$1o;
Icon$1.displayName = "NutIcon";
const ComponentDefaults = {
iconClassPrefix: "nut-icon",
iconFontClassName: "nutui-iconfont"
};
const defaultProps$1n = {
...ComponentDefaults,
className: "",
color: "",
shape: "round",
plain: false,
loading: false,
disabled: false,
type: "default",
size: "normal",
block: false,
icon: "",
style: {},
children: void 0,
onClick: (e2) => {
}
};
const Button = (props) => {
const {
color,
shape,
plain,
loading,
disabled,
type,
size,
block,
icon,
children,
onClick,
className,
style,
iconClassPrefix,
iconFontClassName,
...rest
} = {
...defaultProps$1n,
...props
};
const getStyle = React.useCallback(() => {
const style2 = {};
if (color) {
if (plain) {
style2.color = color;
style2.background = "#fff";
if (!(color == null ? void 0 : color.includes("gradient"))) {
style2.borderColor = color;
}
} else {
style2.color = "#fff";
style2.background = color;
}
}
return style2;
}, [color, plain]);
const classes = React.useCallback(() => {
const prefixCls = "nut-button";
return [
prefixCls,
`${type ? `${prefixCls}--${type}` : ""}`,
`${size ? `${prefixCls}--${size}` : ""}`,
`${shape ? `${prefixCls}--${shape}` : ""}`,
`${plain ? `${prefixCls}--plain` : ""}`,
`${block ? `${prefixCls}--block` : ""}`,
`${disabled ? `${prefixCls}--disabled` : ""}`,
`${loading ? `${prefixCls}--loading` : ""}`
].filter(Boolean).join(" ");
}, [block, disabled, loading, plain, shape, size, type]);
const [btnName, setBtnName] = React.useState(classes());
const [btnStyle, setBtnStyle] = React.useState(getStyle());
React.useEffect(() => {
setBtnName(classes());
setBtnStyle(getStyle());
}, [
className,
color,
shape,
plain,
loading,
disabled,
style,
type,
size,
block,
icon,
children,
onClick,
classes,
getStyle
]);
const handleClick2 = (e2) => {
if (!loading && !disabled && onClick) {
onClick(e2);
}
};
return /* @__PURE__ */ React__default["default"].createElement("button", {
className: `${btnName} ${className}`,
style: { ...btnStyle, ...style },
...rest,
onClick: (e2) => handleClick2(e2)
}, /* @__PURE__ */ React__default["default"].createElement("div", {
className: "nut-button__warp",
style: getStyle()
}, loading && /* @__PURE__ */ React__default["default"].createElement(Icon$1, {
classPrefix: iconClassPrefix,
fontClassName: iconFontClassName,
name: "loading"
}), !loading && icon ? /* @__PURE__ */ React__default["default"].createElement(Icon$1, {
classPrefix: iconClassPrefix,
fontClassName: iconFontClassName,
name: icon
}) : "", children && /* @__PURE__ */ React__default["default"].createElement("div", {
className: icon || loading ? "text" : ""
}, children)));
};
Button.defaultProps = defaultProps$1n;
Button.displayName = "NutButton";
const defaultProps$1m = {
...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,
click: (event) => {
},
onClick: (event) => {
}
};
const Cell = (props) => {
const {
click,
onClick,
title,
subTitle,
desc,
descTextAlign,
isLink,
icon,
roundRadius,
url,
to: to2,
replace,
center,
size,
className,
iconSlot,
linkSlot,
iconClassPrefix,
iconFontClassName,
...rest
} = {
...defaultProps$1m,
...props
};
const b2 = cn("cell");
const handleClick2 = (event) => {
onClick(event);
const link = to2 || url;
replace ? Taro__default["default"].redirectTo({ url: link }) : Taro__default["default"].navigateTo({ url: link });
};
const baseStyle = {
borderRadius: Number.isNaN(Number(roundRadius)) ? String(roundRadius) : `${roundRadius}px`
};
const styles = title || subTitle || icon ? {} : {
textAlign: descTextAlign,
flex: 1
};
return /* @__PURE__ */ React__default["default"].createElement("div", {
className: `${b2(
{ clickable: !!(isLink || to2), center, large: size === "large" },
[className]
)} `,
onClick: (event) => handleClick2(event),
style: baseStyle,
...rest
}, icon || iconSlot ? /* @__PURE__ */ React__default["default"].createElement("div", {
className: b2("icon")
}, iconSlot || (icon ? /* @__PURE__ */ React__default["default"].createElement(Icon$1, {
classPrefix: iconClassPrefix,
fontClassName: iconFontClassName,
name: icon,
className: "icon"
}) : null)) : null, title || subTitle ? /* @__PURE__ */ React__default["default"].createElement("div", {
className: `${b2("title")}`
}, title ? /* @__PURE__ */ React__default["default"].createElement("div", {
className: b2("maintitle")
}, title) : null, subTitle ? /* @__PURE__ */ React__default["default"].createElement("div", {
className: b2("subtitle")
}, subTitle) : null) : null, desc ? /* @__PURE__ */ React__default["default"].createElement("div", {
className: b2("value", {
alone: !title && !subTitle
}),
style: styles
}, desc) : null, !linkSlot && (isLink || to2) ? /* @__PURE__ */ React__default["default"].createElement(Icon$1, {
classPrefix: iconClassPrefix,
fontClassName: iconFontClassName,
name: "right",
className: b2("link")
}) : linkSlot);
};
Cell.defaultProps = defaultProps$1m;
Cell.displayName = "NutCell";
const defaultProps$1l = {
title: "",
desc: "",
className: "",
titleSlot: null,
descSlot: null
};
const CellGroup = (props) => {
const { children, className, title, desc, titleSlot, descSlot } = {
...defaultProps$1l,
...props
};
const b2 = cn("cell-group");
return /* @__PURE__ */ React__default["default"].createElement("div", {
className: b2(null, [className])
}, titleSlot || /* @__PURE__ */ React__default["default"].createElement(React__default["default"].Fragment, null, title ? /* @__PURE__ */ React__default["default"].createElement("div", {
className: b2("title")
}, title) : null), descSlot || /* @__PURE__ */ React__default["default"].createElement(React__default["default"].Fragment, null, desc ? /* @__PURE__ */ React__default["default"].createElement("div", {
className: b2("desc")
}, desc) : null), /* @__PURE__ */ React__default["default"].createElement("div", {
className: b2("wrap")
}, children));
};
CellGroup.defaultProps = defaultProps$1l;
CellGroup.displayName = "NutCellGroup";
var classnames = { exports: {} };
/*!
Copyright (c) 2018 Jed Watson.
Licensed under the MIT License (MIT), see
http://jedwatson.github.io/classnames
*/
(function(module2) {
(function() {
var hasOwn = {}.hasOwnProperty;
function classNames2() {
var classes = [];
for (var i = 0; i < arguments.length; i++) {
var arg = arguments[i];
if (!arg)
continue;
var argType = typeof arg;
if (argType === "string" || argType === "number") {
classes.push(arg);
} else if (Array.isArray(arg)) {
if (arg.length) {
var inner = classNames2.apply(null, arg);
if (inner) {
classes.push(inner);
}
}
} else if (argType === "object") {
if (arg.toString !== Object.prototype.toString && !arg.toString.toString().includes("[native code]")) {
classes.push(arg.toString());
continue;
}
for (var key in arg) {
if (hasOwn.call(arg, key) && arg[key]) {
classes.push(key);
}
}
}
}
return classes.join(" ");
}
if (module2.exports) {
classNames2.default = classNames2;
module2.exports = classNames2;
} else {
window.classNames = classNames2;
}
})();
})(classnames);
var classNames = classnames.exports;
const defaultOverlayProps = {
zIndex: 2e3,
duration: 0.3,
overlayClass: "",
closeOnClickOverlay: true,
visible: false,
lockScroll: true,
overlayStyle: {}
};
const Overlay = (props) => {
const {
children,
zIndex,
duration,
overlayClass,
closeOnClickOverlay,
visible,
lockScroll,
overlayStyle,
...rest
} = {
...defaultOverlayProps,
...props
};
const [show, setShow] = React.useState(visible);
const renderRef = React.useRef(true);
const intervalRef = React.useRef(0);
React.useEffect(() => {
visible && setShow(visible);
lock();
}, [visible]);
React.useEffect(() => {
return () => {
clearTimeout(intervalRef.current);
document.body.classList.remove("nut-overflow-hidden");
};
}, []);
const b2 = cn("overlay");
const classes = classNames(
{
"overlay-fade-leave-active": !renderRef.current && !visible,
"overlay-fade-enter-active": visible,
"first-render": renderRef.current && !visible,
"hidden-render": !visible
},
overlayClass,
b2("")
);
const styles = {
zIndex,
animationDuration: `${props.duration}s`,
...overlayStyle
};
const lock = () => {
if (lockScroll && visible) {
document.body.classList.add("nut-overflow-hidden");
} else {
document.body.classList.remove("nut-overflow-hidden");
}
};
const handleClick2 = (e2) => {
if (closeOnClickOverlay) {
props.onClick && props.onClick(e2);
renderRef.current = false;
const id = setTimeout(() => {
setShow(!visible);
}, duration * 1e3 * 0.8);
intervalRef.current = id;
}
};
return /* @__PURE__ */ React__default["default"].createElement(React__default["default"].Fragment, null, /* @__PURE__ */ React__default["default"].createElement("div", {
className: classes,
style: styles,
...rest,
onClick: handleClick2
}, children));
};
Overlay.defaultProps = defaultOverlayProps;
Overlay.displayName = "NutOverlay";
function _extends$3() {
_extends$3 = Object.assign ? Object.assign.bind() : function(target) {
for (var i = 1; i < arguments.length; i++) {
var source = arguments[i];
for (var key in source) {
if (Object.prototype.hasOwnProperty.call(source, key)) {
target[key] = source[key];
}
}
}
return target;
};
return _extends$3.apply(this, arguments);
}
function _objectWithoutPropertiesLoose$3(source, excluded) {
if (source == null)
return {};
var target = {};
var sourceKeys = Object.keys(source);
var key, i;
for (i = 0; i < sourceKeys.length; i++) {
key = sourceKeys[i];
if (excluded.indexOf(key) >= 0)
continue;
target[key] = source[key];
}
return target;
}
function _setPrototypeOf(o, p) {
_setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf2(o2, p2) {
o2.__proto__ = p2;
return o2;
};
return _setPrototypeOf(o, p);
}
function _inheritsLoose(subClass, superClass) {
subClass.prototype = Object.create(superClass.prototype);
subClass.prototype.constructor = subClass;
_setPrototypeOf(subClass, superClass);
}
function hasClass(element, className) {
if (element.classList)
return !!className && element.classList.contains(className);
return (" " + (element.className.baseVal || element.className) + " ").indexOf(" " + className + " ") !== -1;
}
function addClass(element, className) {
if (element.classList)
element.classList.add(className);
else if (!hasClass(element, className))
if (typeof element.className === "string")
element.className = element.className + " " + className;
else
element.setAttribute("class", (element.className && element.className.baseVal || "") + " " + className);
}
function replaceClassName(origClass, classToRemove) {
return origClass.replace(new RegExp("(^|\\s)" + classToRemove + "(?:\\s|$)", "g"), "$1").replace(/\s+/g, " ").replace(/^\s*|\s*$/g, "");
}
function removeClass$1(element, className) {
if (element.classList) {
element.classList.remove(className);
} else if (typeof element.className === "string") {
element.className = replaceClassName(element.className, className);
} else {
element.setAttribute("class", replaceClassName(element.className && element.className.baseVal || "", className));
}
}
var config$1 = {
disabled: false
};
var TransitionGroupContext = React__default["default"].createContext(null);
var forceReflow = function forceReflow2(node) {
return node.scrollTop;
};
var UNMOUNTED = "unmounted";
var EXITED = "exited";
var ENTERING = "entering";
var ENTERED = "entered";
var EXITING = "exiting";
var Transition = /* @__PURE__ */ function(_React$Component) {
_inheritsLoose(Transition2, _React$Component);
function Transition2(props, context) {
var _this;
_this = _React$Component.call(this, props, context) || this;
var parentGroup = context;
var appear = parentGroup && !parentGroup.isMounting ? props.enter : props.appear;
var initialStatus;
_this.appearStatus = null;
if (props.in) {
if (appear) {
initialStatus = EXITED;
_this.appearStatus = ENTERING;
} else {
initialStatus = ENTERED;
}
} else {
if (props.unmountOnExit || props.mountOnEnter) {
initialStatus = UNMOUNTED;
} else {
initialStatus = EXITED;
}
}
_this.state = {
status: initialStatus
};
_this.nextCallback = null;
return _this;
}
Transition2.getDerivedStateFromProps = function getDerivedStateFromProps(_ref, prevState) {
var nextIn = _ref.in;
if (nextIn && prevState.status === UNMOUNTED) {
return {
status: EXITED
};
}
return null;
};
var _proto = Transition2.prototype;
_proto.componentDidMount = function componentDidMount() {
this.updateStatus(true, this.appearStatus);
};
_proto.componentDidUpdate = function componentDidUpdate(prevProps) {
var nextStatus = null;
if (prevProps !== this.props) {
var status = this.state.status;
if (this.props.in) {
if (status !== ENTERING && status !== ENTERED) {
nextStatus = ENTERING;
}
} else {
if (status === ENTERING || status === ENTERED) {
nextStatus = EXITING;
}
}
}
this.updateStatus(false, nextStatus);
};
_proto.componentWillUnmount = function componentWillUnmount() {
this.cancelNextCallback();
};
_proto.getTimeouts = function getTimeouts() {
var timeout = this.props.timeout;
var exit, enter, appear;
exit = enter = appear = timeout;
if (timeout != null && typeof timeout !== "number") {
exit = timeout.exit;
enter = timeout.enter;
appear = timeout.appear !== void 0 ? timeout.appear : enter;
}
return {
exit,
enter,
appear
};
};
_proto.updateStatus = function updateStatus(mounting, nextStatus) {
if (mounting === void 0) {
mounting = false;
}
if (nextStatus !== null) {
this.cancelNextCallback();
if (nextStatus === ENTERING) {
if (this.props.unmountOnExit || this.props.mountOnEnter) {
var node = this.props.nodeRef ? this.props.nodeRef.current : ReactDOM__default["default"].findDOMNode(this);
if (node)
forceReflow(node);
}
this.performEnter(mounting);
} else {
this.performExit();
}
} else if (this.props.unmountOnExit && this.state.status === EXITED) {
this.setState({
status: UNMOUNTED
});
}
};
_proto.performEnter = function performEnter(mounting) {
var _this2 = this;
var enter = this.props.enter;
var appearing = this.context ? this.context.isMounting : mounting;
var _ref2 = this.props.nodeRef ? [appearing] : [ReactDOM__default["default"].findDOMNode(this), appearing], maybeNode = _ref2[0], maybeAppearing = _ref2[1];
var timeouts2 = this.getTimeouts();
var enterTimeout = appearing ? timeouts2.appear : timeouts2.enter;
if (!mounting && !enter || config$1.disabled) {
this.safeSetState({
status: ENTERED
}, function() {
_this2.props.onEntered(maybeNode);
});
return;
}
this.props.onEnter(maybeNode, maybeAppearing);
this.safeSetState({
status: ENTERING
}, function() {
_this2.props.onEntering(maybeNode, maybeAppearing);
_this2.onTransitionEnd(enterTimeout, function() {
_this2.safeSetState({
status: ENTERED
}, function() {
_this2.props.onEntered(maybeNode, maybeAppearing);
});
});
});
};
_proto.performExit = function performExit() {
var _this3 = this;
var exit = this.props.exit;
var timeouts2 = this.getTimeouts();
var maybeNode = this.props.nodeRef ? void 0 : ReactDOM__default["default"].findDOMNode(this);
if (!exit || config$1.disabled) {
this.safeSetState({
status: EXITED
}, function() {
_this3.props.onExited(maybeNode);
});
return;
}
this.props.onExit(maybeNode);
this.safeSetState({
status: EXITING
}, function() {
_this3.props.onExiting(maybeNode);
_this3.onTransitionEnd(timeouts2.exit, function() {
_this3.safeSetState({
status: EXITED
}, function() {
_this3.props.onExited(maybeNode);
});
});
});
};
_proto.cancelNextCallback = function cancelNextCallback() {
if (this.nextCallback !== null) {
this.nextCallback.cancel();
this.nextCallback = null;
}
};
_proto.safeSetState = function safeSetState(nextState, callback) {
callback = this.setNextCallback(callback);
this.setState(nextState, callback);
};
_proto.setNextCallback = function setNextCallback(callback) {
var _this4 = this;
var active = true;
this.nextCallback = function(event) {
if (active) {
active = false;
_this4.nextCallback = null;
callback(event);
}
};
this.nextCallback.cancel = function() {
active = false;
};
return this.nextCallback;
};
_proto.onTransitionEnd = function onTransitionEnd(timeout, handler) {
this.setNextCallback(handler);
var node = this.props.nodeRef ? this.props.nodeRef.current : ReactDOM__default["default"].findDOMNode(this);
var doesNotHaveTimeoutOrListener = timeout == null && !this.props.addEndListener;
if (!node || doesNotHaveTimeoutOrListener) {
setTimeout(this.nextCallback, 0);
return;
}
if (this.props.addEndListener) {
var _ref3 = this.props.nodeRef ? [this.nextCallback] : [node, this.nextCallback], maybeNode = _ref3[0], maybeNextCallback = _ref3[1];
this.props.addEndListener(maybeNode, maybeNextCallback);
}
if (timeout != null) {
setTimeout(this.nextCallback, timeout);
}
};
_proto.render = function render() {
var status = this.state.status;
if (status === UNMOUNTED) {
return null;
}
var _this$props = this.props, children = _this$props.children;
_this$props.in;
_this$props.mountOnEnter;
_this$props.unmountOnExit;
_this$props.appear;
_this$props.enter;
_this$props.exit;
_this$props.timeout;
_this$props.addEndListener;
_this$props.onEnter;
_this$props.onEntering;
_this$props.onEntered;
_this$props.onExit;
_this$props.onExiting;
_this$props.onExited;
_this$props.nodeRef;
var childProps = _objectWithoutPropertiesLoose$3(_this$props, ["children", "in", "mountOnEnter", "unmountOnExit", "appear", "enter", "exit", "timeout", "addEndListener", "onEnter", "onEntering", "onEntered", "onExit", "onExiting", "onExited", "nodeRef"]);
return /* @__PURE__ */ React__default["default"].createElement(TransitionGroupContext.Provider, {
value: null
}, typeof children === "function" ? children(status, childProps) : React__default["default"].cloneElement(React__default["default"].Children.only(children), childProps));
};
return Transition2;
}(React__default["default"].Component);
Transition.contextType = TransitionGroupContext;
Transition.propTypes = {};
function noop$2() {
}
Transition.defaultProps = {
in: false,
mountOnEnter: false,
unmountOnExit: false,
appear: false,
enter: true,
exit: true,
onEnter: noop$2,
onEntering: noop$2,
onEntered: noop$2,
onExit: noop$2,
onExiting: noop$2,
onExited: noop$2
};
Transition.UNMOUNTED = UNMOUNTED;
Transition.EXITED = EXITED;
Transition.ENTERING = ENTERING;
Transition.ENTERED = ENTERED;
Transition.EXITING = EXITING;
var Transition$1 = Transition;
var _addClass = function addClass$1(node, classes) {
return node && classes && classes.split(" ").forEach(function(c) {
return addClass(node, c);
});
};
var removeClass = function removeClass2(node, classes) {
return node && classes && classes.split(" ").forEach(function(c) {
return removeClass$1(node, c);
});
};
var CSSTransition = /* @__PURE__ */ function(_React$Component) {
_inheritsLoose(CSSTransition2, _React$Component);
function CSSTransition2() {
var _this;
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
_this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;
_this.appliedClasses = {
appear: {},
enter: {},
exit: {}
};
_this.onEnter = function(maybeNode, maybeAppearing) {
var _this$resolveArgument = _this.resolveArguments(maybeNode, maybeAppearing), node = _this$resolveArgument[0], appearing = _this$resolveArgument[1];
_this.removeClasses(node, "exit");
_this.addClass(node, appearing ? "appear" : "enter", "base");
if (_this.props.onEnter) {
_this.props.onEnter(maybeNode, maybeAppearing);
}
};
_this.onEntering = function(maybeNode, maybeAppearing) {
var _this$resolveArgument2 = _this.resolveArguments(maybeNode, maybeAppearing), node = _this$resolveArgument2[0], appearing = _this$resolveArgument2[1];
var type = appearing ? "appear" : "enter";
_this.addClass(node, type, "active");
if (_this.props.onEntering) {
_this.props.onEntering(maybeNode, maybeAppearing);
}
};
_this.onEntered = function(maybeNode, maybeAppearing) {
var _this$resolveArgument3 = _this.resolveArguments(maybeNode, maybeAppearing), node = _this$resolveArgument3[0], appearing = _this$resolveArgument3[1];
var type = appearing ? "appear" : "enter";
_this.removeClasses(node, type);
_this.addClass(node, type, "done");
if (_this.props.onEntered) {
_this.props.onEntered(maybeNode, maybeAppearing);
}
};
_this.onExit = function(maybeNode) {
var _this$resolveArgument4 = _this.resolveArguments(maybeNode), node = _this$resolveArgument4[0];
_this.removeClasses(node, "appear");
_this.removeClasses(node, "enter");
_this.addClass(node, "exit", "base");
if (_this.props.onExit) {
_this.props.onExit(maybeNode);
}
};
_this.onExiting = function(maybeNode) {
var _this$resolveArgument5 = _this.resolveArguments(maybeNode), node = _this$resolveArgument5[0];
_this.addClass(node, "exit", "active");
if (_this.props.onExiting) {
_this.props.onExiting(maybeNode);
}
};
_this.onExited = function(maybeNode) {
var _this$resolveArgument6 = _this.resolveArguments(maybeNode), node = _this$resolveArgument6[0];
_this.removeClasses(node, "exit");
_this.addClass(node, "exit", "done");
if (_this.props.onExited) {
_this.props.onExited(maybeNode);
}
};
_this.resolveArguments = function(maybeNode, maybeAppearing) {
return _this.props.nodeRef ? [_this.props.nodeRef.current, maybeNode] : [maybeNode, maybeAppearing];
};
_this.getClassNames = function(type) {
var classNames2 = _this.props.classNames;
var isStringClassNames = typeof classNames2 === "string";
var prefix2 = isStringClassNames && classNames2 ? classNames2 + "-" : "";
var baseClassName = isStringClassNames ? "" + prefix2 + type : classNames2[type];
var activeClassName = isStringClassNames ? baseClassName + "-active" : classNames2[type + "Active"];
var doneClassName = isStringClassNames ? baseClassName + "-done" : classNames2[type + "Done"];
return {
baseClassName,
activeClassName,
doneClassName
};
};
return _this;
}
var _proto = CSSTransition2.prototype;
_proto.addClass = function addClass2(node, type, phase) {
var className = this.getClassNames(type)[phase + "ClassName"];
var _this$getClassNames = this.getClassNames("enter"), doneClassName = _this$getClassNames.doneClassName;
if (type === "appear" && phase === "done" && doneClassName) {
className += " " + doneClassName;
}
if (phase === "active") {
if (node)
forceReflow(node);
}
if (className) {
this.appliedClasses[type][phase] = className;
_addClass(node, className);
}
};
_proto.removeClasses = function removeClasses(node, type) {
var _this$appliedClasses$ = this.appliedClasses[type], baseClassName = _this$appliedClasses$.base, activeClassName = _this$appliedClasses$.active, doneClassName = _this$appliedClasses$.done;
this.appliedClasses[type] = {};
if (baseClassName) {
removeClass(node, baseClassName);
}
if (activeClassName) {
removeClass(node, activeClassName);
}
if (doneClassName) {
removeClass(node, doneClassName);
}
};
_proto.render = function render() {
var _this$props = this.props;
_this$props.classNames;
var props = _objectWithoutPropertiesLoose$3(_this$props, ["classNames"]);
return /* @__PURE__ */ React__default["default"].createElement(Transition$1, _extends$3({}, props, {
onEnter: this.onEnter,
onEntered: this.onEntered,
onEntering: this.onEntering,
onExit: this.onExit,
onExiting: this.onExiting,
onExited: this.onExited
}));
};
return CSSTransition2;
}(React__default["default"].Component);
CSSTransition.defaultProps = {
classNames: ""
};
CSSTransition.propTypes = {};
var CSSTransition$1 = CSSTransition;
const defaultProps$1k = {
...ComponentDefaults,
position: "center",
transition: "",
style: {},
popClass: "",
closeable: false,
closeIconPosition: "top-right",
closeIcon: "close",
destroyOnClose: true,
teleport: null,
overlay: true,
round: false,
onOpen: () => {
},
onClose: () => {
},
onClick: (e2) => {
},
onOpened: (e2) => {
},
onClosed: (e2) => {
},
onClickOverlay: (e2) => {
},
onClickCloseIcon: (e2) => {
},
...defaultOverlayProps
};
let _zIndex = 2e3;
const Popup = (props) => {
const {
children,
visible,
overlay,
closeOnClickOverlay,
overlayStyle,
overlayClass,
zIndex,
lockScroll,
duration,
closeable,
closeIconPosition,
closeIcon,
style,
transition,
round,
position,
popClass,
className,
destroyOnClose,
teleport,
onOpen,
onClose,
onClickOverlay,
onClickCloseIcon,
onOpened,
onClosed,
onClick,
iconClassPrefix,
iconFontClassName
} = props;
const [index, setIndex] = React.useState(zIndex || _zIndex);
const [innerVisible, setInnerVisible] = React.useState(visible);
const [showChildren, setShowChildren] = React.useState(true);
const [transitionName, setTransitionName] = React.useState("");
const b2 = cn("popup");
const baseStyle = {
zIndex: index,
animationDuration: `${duration}s`
};
const overlayStyles = {
...overlayStyle,
...baseStyle
};
const popStyles = {
...style,
...baseStyle
};
const classes = classNames(
{
round,
[`popup-${position}`]: true,
[`${popClass}`]: true,
[`${className}`]: true
},
b2("")
);
const closeClasses = classNames({
"nutui-popup__close-icon": true,
[`nutui-popup__close-icon--${closeIconPosition}`]: true
});
const open = () => {
if (!innerVisible) {
setInnerVisible(true);
setIndex(++_zIndex);
}
if (destroyOnClose) {
setShowChildren(true);
}
onOpen && onOpen();
};
const close = () => {
if (innerVisible) {
setInnerVisible(false);
if (destroyOnClose) {
setTimeout(() => {
setShowChildren(false);
onClose && onClose();
}, Number(duration) * 1e3);
}
}
};
const onHandleClickOverlay = (e2) => {
if (closeOnClickOverlay) {
onClickOverlay && onClickOverlay(e2);
close();
}
};
const onHandleClick = (e2) => {
onClick && onClick(e2);
};
const onHandleClickCloseIcon = (e2) => {
onClickCloseIcon && onClickCloseIcon(e2);
close();
};
const onHandleOpened = (e2) => {
onOpened && onOpened(e2);
};
const onHandleClosed = (e2) => {
onClosed && onClosed(e2);
};
const resolveContainer = (getContainer) => {
const container = typeof getContainer === "function" ? getContainer() : getContainer;
return container || document.body;
};
const renderToContainer = (getContainer, node) => {
if (getContainer) {
const container = resolveContainer(getContainer);
return ReactDOM.createPortal(node, container);
}
return node;
};
const renderPop = () => {
return /* @__PURE__ */ React__default["default"].createElement(CSSTransition$1, {
classNames: transitionName,
unmountOnExit: true,
timeout: 500,
in: innerVisible,
onEntered: onHandleOpened,
onExited: onHandleClosed
}, /* @__PURE__ */ React__default["default"].createElement("div", {
style: popStyles,
className: classes,
onClick: onHandleClick
}, showChildren ? children : "", closeable ? /* @__PURE__ */ React__default["default"].createElement("div", {
className: closeClasses,
onClick: onHandleClickCloseIcon
}, /* @__PURE__ */ React__default["default"].createElement(Icon$1, {
classPrefix: iconClassPrefix,
fontClassName: iconFontClassName,
name: closeIcon,
size: "12px"
})) : ""));
};
const renderNode = () => {
return /* @__PURE__ */ React__default["default"].createElement(React__default["default"].Fragment, null, overlay ? /* @__PURE__ */ React__default["default"].createElement(React__default["default"].Fragment, null, /* @__PURE__ */ React__default["default"].createElement(Overlay, {
style: overlayStyles,
overlayClass,
visible: innerVisible,
closeOnClickOverlay,
zIndex,
lockScroll,
duration,
onClick: onHandleClickOverlay
}), renderPop()) : /* @__PURE__ */ React__default["default"].createElement(React__default["default"].Fragment, null, renderPop()));
};
React.useEffect(() => {
visible && open();
!visible && close();
}, [visible]);
React.useEffect(() => {
setTransitionName(transition || `popup-slide-${position}`);
}, [position]);
return /* @__PURE__ */ React__default["default"].createElement(React__default["default"].Fragment, null, renderToContainer(teleport, renderNode()));
};
Popup.defaultProps = defaultProps$1k;
Popup.displayName = "NutPopup";
const zhCN = {
save: "\u4FDD\u5B58",
confirm: "\u786E\u8BA4",
cancel: "\u53D6\u6D88",
done: "\u5B8C\u6210",
noData: "\u6682\u65E0\u6570\u636E",
placeholder: "\u8BF7\u8F93\u5165\u5185\u5BB9",
select: "\u8BF7\u9009\u62E9",
video: {
errorTip: "\u89C6\u9891\u52A0\u8F7D\u5931\u8D25",
clickRetry: "\u70B9\u51FB\u91CD\u8BD5"
},
fixednav: {
activeText: "\u6536\u8D77\u5BFC\u822A",
unActiveText: "\u5FEB\u901F\u5BFC\u822A"
},
infiniteloading: {
pullRefreshText: "\u677E\u5F00\u5237\u65B0",
loadText: "\u52A0\u8F7D\u4E2D\u2026\u2026",
loadMoreText: "\u54CE\u5440\uFF0C\u8FD9\u91CC\u662F\u5E95\u90E8\u4E86\u5566"
},
pagination: {
prev: "\u4E0A\u4E00\u9875",
next: "\u4E0B\u4E00\u9875"
},
range: {
rangeText: "\u4E0D\u5728\u8BE5\u533A\u95F4\u5185"
},
calendaritem: {
weekdays: ["\u65E5", "\u4E00", "\u4E8C", "\u4E09", "\u56DB", "\u4E94", "\u516D"],
end: "\u7ED3\u675F",
start: "\u5F00\u59CB",
title: "\u65E5\u5386\u9009\u62E9",
monthTitle: (year, month) => `${year}\u5E74${month}\u6708`,
today: "\u4ECA\u5929",
loadPreviousMonth: "\u52A0\u8F7D\u4E0A\u4E00\u4E2A\u6708",
noEarlierMonth: "\u6CA1\u6709\u66F4\u65E9\u6708\u4EFD"
},
shortpassword: {
title: "\u8BF7\u8F93\u5165\u5BC6\u7801",
desc: "\u60A8\u4F7F\u7528\u4E86\u865A\u62DF\u8D44\u4EA7\uFF0C\u8BF7\u8FDB\u884C\u9A8C\u8BC1",
tips: "\u5FD8\u8BB0\u5BC6\u7801"
},
uploader: {
ready: "\u51C6\u5907\u5B8C\u6210",
readyUpload: "\u51C6\u5907\u4E0A\u4F20",
waitingUpload: "\u7B49\u5F85\u4E0A\u4F20",
uploading: "\u4E0A\u4F20\u4E2D...",
success: "\u4E0A\u4F20\u6210\u529F",
error: "\u4E0A\u4F20\u5931\u8D25",
deleteWord: "\u7528\u6237\u963B\u6B62\u4E86\u5220\u9664\uFF01"
},
countdown: {
day: "\u5929",
hour: "\u65F6",
minute: "\u5206",
second: "\u79D2"
},
address: {
selectRegion: "\u8BF7\u9009\u62E9\u6240\u5728\u5730\u533A",
deliveryTo: "\u914D\u9001\u81F3",
chooseAnotherAddress: "\u9009\u62E9\u5176\u4ED6\u5730\u5740"
},
signature: {
reSign: "\u91CD\u7B7E",
unSupportTpl: "\u5BF9\u4E0D\u8D77\uFF0C\u5F53\u524D\u6D4F\u89C8\u5668\u4E0D\u652F\u6301Canvas\uFF0C\u65E0\u6CD5\u4F7F\u7528\u672C\u63A7\u4EF6\uFF01"
},
ecard: {
chooseText: "\u8BF7\u9009\u62E9\u7535\u5B50\u5361\u9762\u503C",
otherValueText: "\u5176\u4ED6\u9762\u503C",
placeholder: "\u8BF7\u8F93\u51651-5000\u6574\u6570"
},
timeselect: {
pickupTime: "\u53D6\u4EF6\u65F6\u95F4"
},
sku: {
buyNow: "\u7ACB\u5373\u8D2D\u4E70",
buyNumber: "\u8D2D\u4E70\u6570\u91CF",
addToCard: "\u52A0\u5165\u8D2D\u7269\u8F66"
},
skuheader: {
skuId: "\u5546\u54C1\u7F16\u53F7"
},
addresslist: {
addAddress: "\u65B0\u5EFA\u5730\u5740"
},
comment: {
complaintsText: "\u6211\u8981\u6295\u8BC9",
additionalReview: (day) => `\u8D2D\u4E70${day}\u5929\u540E\u8FFD\u8BC4`,
additionalImages: (length) => `${length}\u5F20\u8FFD\u8BC4\u56FE\u7247`
},
searchbar: {
basePlaceholder: "\u4E0A\u4EAC\u4E1C\uFF0C\u8D2D\u597D\u7269",
text: "\u6587\u672C",
test: "\u6D4B\u8BD5",
title1: "\u57FA\u7840\u7528\u6CD5",
title2: "\u641C\u7D22\u6846\u5F62\u72B6\u53CA\u6700\u5927\u957F\u5EA6",
title3: "\u641C\u7D22\u6846\u5185\u5916\u80CC\u666F\u8BBE\u7F6E",
title4: "\u641C\u7D22\u6846\u6587\u672C\u8BBE\u7F6E",
title5: "\u81EA\u5B9A\u4E49\u56FE\u6807\u8BBE\u7F6E",
title6: "\u6570\u636E\u6539\u53D8\u76D1\u542C"
},
audio: {
back: "\u5FEB\u9000",
forward: "\u5FEB\u8FDB",
pause: "\u6682\u505C",
start: "\u5F00\u59CB",
mute: "\u9759\u97F3",
tips: "onPlayEnd\u4E8B\u4EF6\u5728loop=false\u65F6\u624D\u4F1A\u89E6\u53D1"
},
datepicker: {
year: "\u5E74",
month: "\u6708",
day: "\u65E5",
hour: "\u65F6",
min: "\u5206",
seconds: "\u79D2"
},
pullToRefresh: {
pullingText: "\u4E0B\u62C9\u5237\u65B0",
canReleaseText: "\u677E\u5F00\u5237\u65B0",
refreshingText: "\u52A0\u8F7D\u4E2D...",
completeText: "\u5237\u65B0\u6210\u529F"
}
};
const defaultProps$1j = {
locale: zhCN
};
const defaultConfigRef$1 = {
current: {
locale: zhCN
}
};
const getDefaultConfig$1 = () => {
return defaultConfigRef$1.current;
};
const useConfig$1 = () => {
var _a;
return (_a = React.useContext(ConfigContext$1)) != null ? _a : getDefaultConfig$1();
};
const ConfigContext$1 = React.createContext(null);
const ConfigProvider = (props) => {
const { children, ...config2 } = { ...defaultProps$1j, ...props };
const parentConfig = useConfig$1();
return /* @__PURE__ */ React__default["default"].createElement(ConfigContext$1.Provider, {
value: {
...parentConfig,
...config2
}
}, children);
};
ConfigProvider.defaultProps = defaultProps$1j;
ConfigProvider.displayName = "NutConfigProvider";
const defaultProps$1i = {};
const Layout = (props) => {
({ ...defaultProps$1i, ...props });
return /* @__PURE__ */ React__default["default"].createElement("div", {
className: "nut-layout"
}, "Layout");
};
Layout.defaultProps = defaultProps$1i;
Layout.displayName = "NutLayout";
const DataContext$2 = React.createContext({});
const defaultProps$1h = {
span: "24",
offset: "0",
gutter: "0"
};
const Col = (props) => {
const {
className,
style = {},
span,
offset,
children,
onClick
} = {
...defaultProps$1h,
...props
};
const [colName, setColName] = React.useState("");
const [colStyle, setColStyle] = React.useState({});
const { gutter } = React.useContext(DataContext$2);
const classs = () => {
const prefixCls = "nut-col";
return `${prefixCls} ${prefixCls}-${span} ${gutter ? `${prefixCls}-gutter` : ""} ${prefixCls}-${offset}`;
};
const getStyle = () => {
const style2 = {};
style2.paddingLeft = `${gutter / 2}px`;
style2.paddingRight = `${gutter / 2}px`;
return style2;
};
React.useEffect(() => {
setColName(classs);
setColStyle(getStyle);
}, [span, offset, gutter]);
return /* @__PURE__ */ React__default["default"].createElement("div", {
className: `${colName} ${className}`,
style: { ...style, ...colStyle },
onClick: (e2) => {
onClick && onClick(e2, "col");
}
}, children);
};
Col.defaultProps = defaultProps$1h;
Col.displayName = "NutCol";
const defaultProps$1g = {
type: "",
justify: "start",
align: "flex-start",
wrap: "nowrap",
gutter: "0"
};
const Row = (props) => {
const {
className,
style = {},
children,
type,
justify,
align,
wrap,
gutter,
onClick
} = {
...defaultProps$1g,
...props
};
const prefixCls = "nut-row";
const getClass = (prefix2, type2) => {
const classType = type2 ? `nut-row-${prefix2}-${type2}` : "";
const className2 = prefix2 ? classType : `nut-row-${type2}`;
return className2;
};
const getClasses = () => {
return `
${getClass("", type)}
${getClass("justify", justify)}
${getClass("align", align)}
${getClass("flex", wrap)}
${prefixCls}
`;
};
const parentRow = {
gutter
};
return /* @__PURE__ */ React__default["default"].createElement(DataContext$2.Provider, {
value: parentRow
}, React__default["default"].createElement(
"div",
{
className: `${getClasses()} ${className}`,
style,
onClick: (e2) => {
onClick && onClick(e2, "row");
}
},
children
));
};
Row.defaultProps = defaultProps$1g;
Row.displayName = "NutRow";
const defaultProps$1f = {
contentPosition: "center",
dashed: false,
hairline: true,
direction: "horizontal"
};
const Divider = (props) => {
const {
children,
contentPosition,
dashed,
hairline,
styles,
className,
direction,
...rest
} = {
...defaultProps$1f,
...props
};
const dividerBem = cn("divider");
const classes = direction === "horizontal" ? classNames({
[dividerBem()]: true,
[dividerBem("center")]: children,
[dividerBem("left")]: contentPosition === "left",
[dividerBem("right")]: contentPosition === "right",
[dividerBem("dashed")]: dashed,
[dividerBem("hairline")]: hairline
}) : classNames({
[dividerBem()]: true,
[dividerBem("vertical")]: direction === "vertical"
});
return /* @__PURE__ */ React__default["default"].createElement("div", {
className: `${classes} ${className || ""}`,
style: styles,
...rest
}, children);
};
Divider.defaultProps = defaultProps$1f;
Divider.displayName = "NutDivider";
const defaultProps$1e = {
columnNum: 4,
border: true,
gutter: 0,
center: true,
square: false,
reverse: false,
direction: "vertical",
iconSize: 28,
iconColor: ""
};
const Grid = (props) => {
useConfig$1();
const {
children,
columnNum,
border,
gutter,
center,
square,
reverse,
direction,
style,
iconSize,
iconColor,
className,
...rest
} = { ...defaultProps$1e, ...props };
const childrenDom = React__default["default"].Children.toArray(children);
const pxCheck2 = (value) => {
return Number.isNaN(Number(value)) ? String(value) : `${value}px`;
};
const b2 = cn("grid");
const rootClass = () => {
const prefixCls = b2();
return `${className} ${prefixCls} ${border && !gutter ? `${b2("border")}` : ""}`;
};
const rootStyle = () => {
let styleSelf = {};
if (style) {
styleSelf = style;
}
if (gutter) {
styleSelf.paddingLeft = pxCheck2(gutter);
}
return styleSelf;
};
return /* @__PURE__ */ React__default["default"].createElement("div", {
className: rootClass(),
style: rootStyle(),
...rest
}, childrenDom.map((item, idex) => {
return React__default["default"].cloneElement(item, {
index: idex,
columnNum,
center,
border,
gutter,
square,
reverse,
direction,
parentIconSize: iconSize,
parentIconColor: iconColor
});
}));
};
Grid.defaultProps = defaultProps$1e;
Grid.displayName = "NutGrid";
const defaultProps$1d = {
...ComponentDefaults,
text: "",
icon: "",
iconSize: "",
iconColor: "",
parentIconSize: "",
parentIconColor: "",
columnNum: 4,
border: true,
gutter: 0,
center: true,
square: false,
reverse: false,
direction: "vertical"
};
const GridItem = (props) => {
useConfig$1();
const {
children,
columnNum,
index,
gutter,
square,
text,
icon,
iconColor,
iconSize,
parentIconSize,
parentIconColor,
border,
center,
reverse,
direction,
iconClassPrefix,
iconFontClassName,
onClick,
...rest
} = {
...defaultProps$1d,
...props
};
const b2 = cn("grid-item");
const pxCheck2 = (value) => {
return Number.isN