@nutui/nutui-react 2.0.0-beta.0 → 2.0.0-beta.1

package/dist/esm/popup2.js

@@ -0,0 +1,184 @@
+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), true).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 { createPortal } from "react-dom";
+import { CSSTransition } from "react-transition-group";
+import classNames from "classnames";
+import { Close } from "@nutui/icons-react";
+import { d as defaultOverlayProps } from "./overlay2.js";
+import Overlay from "./Overlay.js";
+import { C as ComponentDefaults } from "./typings.js";
+var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
+  position: "center",
+  transition: "",
+  overlayStyle: {},
+  overlayClassName: "",
+  closeable: false,
+  closeIconPosition: "top-right",
+  closeIcon: "close",
+  destroyOnClose: false,
+  portal: null,
+  overlay: true,
+  round: false,
+  onOpen: function onOpen() {
+  },
+  onClose: function onClose() {
+  },
+  onClickOverlay: function onClickOverlay(e) {
+    return true;
+  },
+  onClickCloseIcon: function onClickCloseIcon(e) {
+    return true;
+  }
+}, defaultOverlayProps);
+var _zIndex = 1e3;
+var Popup = function Popup2(props) {
+  var _classNames, _classNames2;
+  var children = props.children, visible = props.visible, overlay = props.overlay, closeOnOverlayClick = props.closeOnOverlayClick, overlayStyle = props.overlayStyle, overlayClassName = props.overlayClassName, zIndex = props.zIndex, lockScroll = props.lockScroll, duration = props.duration, closeable = props.closeable, closeIconPosition = props.closeIconPosition, closeIcon = props.closeIcon, left = props.left, title = props.title, style = props.style, transition = props.transition, round = props.round, position = props.position, className = props.className, destroyOnClose = props.destroyOnClose, portal = props.portal, onOpen2 = props.onOpen, onClose2 = props.onClose, onClickOverlay2 = props.onClickOverlay, onClickCloseIcon2 = props.onClickCloseIcon, afterShow = props.afterShow, afterClose = props.afterClose, onClick = props.onClick;
+  var _useState = useState(zIndex || _zIndex), _useState2 = _slicedToArray(_useState, 2), index = _useState2[0], setIndex = _useState2[1];
+  var _useState3 = useState(visible), _useState4 = _slicedToArray(_useState3, 2), innerVisible = _useState4[0], setInnerVisible = _useState4[1];
+  var _useState5 = useState(true), _useState6 = _slicedToArray(_useState5, 2), showChildren = _useState6[0], setShowChildren = _useState6[1];
+  var _useState7 = useState(""), _useState8 = _slicedToArray(_useState7, 2), transitionName = _useState8[0], setTransitionName = _useState8[1];
+  var classPrefix = "nut-popup";
+  var baseStyle = {
+    zIndex: index,
+    animationDuration: "".concat(duration, "s")
+  };
+  var overlayStyles = _objectSpread(_objectSpread({}, overlayStyle), baseStyle);
+  var popStyles = _objectSpread(_objectSpread({}, style), baseStyle);
+  var popClassName = classNames((_classNames = {
+    round
+  }, _defineProperty(_classNames, "".concat(classPrefix), true), _defineProperty(_classNames, "".concat(classPrefix, "-").concat(position), true), _defineProperty(_classNames, "".concat(className || ""), true), _classNames));
+  var closeClasses = classNames((_classNames2 = {}, _defineProperty(_classNames2, "".concat(classPrefix, "__close-icon"), true), _defineProperty(_classNames2, "".concat(classPrefix, "__close-icon--").concat(closeIconPosition), true), _classNames2));
+  var open = function open2() {
+    if (!innerVisible) {
+      setInnerVisible(true);
+      setIndex(++_zIndex);
+    }
+    if (destroyOnClose) {
+      setShowChildren(true);
+    }
+    onOpen2 && onOpen2();
+  };
+  var close = function close2() {
+    if (innerVisible) {
+      setInnerVisible(false);
+      if (destroyOnClose) {
+        setTimeout(function() {
+          setShowChildren(false);
+        }, Number(duration) * 1e3);
+      }
+      onClose2 && onClose2();
+    }
+  };
+  var onHandleClickOverlay = function onHandleClickOverlay2(e) {
+    e.stopPropagation();
+    if (closeOnOverlayClick) {
+      var closed = onClickOverlay2 && onClickOverlay2(e);
+      closed && close();
+    }
+  };
+  var onHandleClick = function onHandleClick2(e) {
+    onClick && onClick(e);
+  };
+  var onHandleClickCloseIcon = function onHandleClickCloseIcon2(e) {
+    var closed = onClickCloseIcon2 && onClickCloseIcon2(e);
+    closed && close();
+  };
+  var onHandleOpened = function onHandleOpened2(e) {
+    afterShow && afterShow();
+  };
+  var onHandleClosed = function onHandleClosed2(e) {
+    afterClose && afterClose();
+  };
+  var resolveContainer = function resolveContainer2(getContainer) {
+    var container = typeof getContainer === "function" ? getContainer() : getContainer;
+    return container || document.body;
+  };
+  var renderToContainer = function renderToContainer2(getContainer, node) {
+    if (getContainer) {
+      var container = resolveContainer(getContainer);
+      return createPortal(node, container);
+    }
+    return node;
+  };
+  var renderIcon = function renderIcon2() {
+    if (closeable) {
+      return React__default.createElement("div", {
+        className: closeClasses,
+        onClick: onHandleClickCloseIcon
+      }, React__default.isValidElement(closeIcon) ? closeIcon : React__default.createElement(Close, {
+        width: 12,
+        height: 12
+      }));
+    }
+    return null;
+  };
+  var renderTitle = function renderTitle2() {
+    return React__default.createElement(React__default.Fragment, null, position === "bottom" && React__default.createElement(React__default.Fragment, null, left && React__default.createElement("div", {
+      className: "".concat(classPrefix, "-left-icon")
+    }, left), title && React__default.createElement("div", {
+      className: "".concat(classPrefix, "-title")
+    }, title)));
+  };
+  var renderPop = function renderPop2() {
+    return React__default.createElement(CSSTransition, {
+      classNames: transitionName,
+      unmountOnExit: true,
+      timeout: 300,
+      "in": innerVisible,
+      onEntered: onHandleOpened,
+      onExited: onHandleClosed
+    }, React__default.createElement("div", {
+      style: popStyles,
+      className: popClassName,
+      onClick: onHandleClick
+    }, renderTitle(), renderIcon(), showChildren ? children : ""));
+  };
+  var renderNode = function renderNode2() {
+    return React__default.createElement(React__default.Fragment, null, overlay ? React__default.createElement(React__default.Fragment, null, React__default.createElement(Overlay, {
+      style: overlayStyles,
+      className: overlayClassName,
+      visible: innerVisible,
+      closeOnOverlayClick,
+      zIndex,
+      lockScroll,
+      duration,
+      onClick: onHandleClickOverlay
+    }), renderPop()) : React__default.createElement(React__default.Fragment, null, renderPop()));
+  };
+  useEffect(function() {
+    visible && open();
+    !visible && close();
+  }, [visible]);
+  useEffect(function() {
+    setTransitionName(transition || "".concat(classPrefix, "-slide-").concat(position));
+  }, [position, transition]);
+  return React__default.createElement(React__default.Fragment, null, renderToContainer(portal, renderNode()));
+};
+Popup.defaultProps = defaultProps;
+Popup.displayName = "NutPopup";
+export {
+  Popup as P
+};

package/dist/esm/px-check.js

@@ -0,0 +1,6 @@
+var pxCheck = function pxCheck2(value) {
+  return Number.isNaN(Number(value)) ? String(value) : "".concat(value, "px");
+};
+export {
+  pxCheck as p
+};

package/dist/esm/radio2.js

@@ -0,0 +1,127 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+var _excluded = ["children", "className", "style", "checked", "defaultChecked", "shape", "value", "icon", "activeIcon", "onChange"], _excluded2 = ["labelPosition", "disabled"];
+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), true).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, { useContext } from "react";
+import { CheckChecked, CheckNormal } from "@nutui/icons-react";
+import classNames from "classnames";
+import RadioGroup from "./RadioGroup.js";
+import { C as ComponentDefaults } from "./typings.js";
+import { u as usePropsValue } from "./use-props-value.js";
+var RadioContext = React__default.createContext(null);
+var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
+  disabled: false,
+  shape: "round",
+  value: "",
+  labelPosition: "right",
+  icon: null,
+  activeIcon: null,
+  onChange: function onChange(checked) {
+  }
+});
+var Radio = function Radio2(props) {
+  var classPrefix = "nut-radio";
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), children = _defaultProps$props.children, className = _defaultProps$props.className, style = _defaultProps$props.style, checked = _defaultProps$props.checked, defaultChecked = _defaultProps$props.defaultChecked, shape = _defaultProps$props.shape, value = _defaultProps$props.value, icon = _defaultProps$props.icon, activeIcon = _defaultProps$props.activeIcon, onChange2 = _defaultProps$props.onChange, others = _objectWithoutProperties(_defaultProps$props, _excluded);
+  var labelPosition = others.labelPosition, disabled = others.disabled, rest = _objectWithoutProperties(others, _excluded2);
+  var _usePropsValue = usePropsValue({
+    value: checked,
+    defaultValue: defaultChecked,
+    finalValue: false,
+    onChange: onChange2
+  }), _usePropsValue2 = _slicedToArray(_usePropsValue, 2), checkedStatement = _usePropsValue2[0], setCheckedStatement = _usePropsValue2[1];
+  var context = useContext(RadioContext);
+  if (context) {
+    checkedStatement = context.value === value;
+    if (context.labelPosition !== void 0) {
+      labelPosition = context.labelPosition;
+    }
+    if (context.disabled !== void 0) {
+      disabled = context.disabled;
+    }
+    setCheckedStatement = function setCheckedStatement2(value2) {
+      if (value2) {
+        context.check(props.value === void 0 ? "" : props.value);
+      } else {
+        context.uncheck();
+      }
+    };
+  }
+  var renderLabel = function renderLabel2() {
+    return React__default.createElement("div", {
+      className: classNames("".concat(classPrefix, "__label"), _defineProperty({}, "".concat(classPrefix, "__label--disabled"), disabled))
+    }, children);
+  };
+  var renderButton = function renderButton2() {
+    var _classNames2;
+    return React__default.createElement("div", {
+      className: classNames("".concat(classPrefix, "__button"), (_classNames2 = {}, _defineProperty(_classNames2, "".concat(classPrefix, "__button--active"), checkedStatement), _defineProperty(_classNames2, "".concat(classPrefix, "__button--disabled"), disabled), _classNames2))
+    }, children);
+  };
+  var color = function color2() {
+    var _ref;
+    return _ref = {}, _defineProperty(_ref, "".concat(classPrefix, "__icon--disable"), disabled), _defineProperty(_ref, "".concat(classPrefix, "__icon"), checkedStatement), _defineProperty(_ref, "".concat(classPrefix, "__icon--unchecked"), !checkedStatement), _ref;
+  };
+  var renderIcon = function renderIcon2() {
+    var icon2 = props.icon, activeIcon2 = props.activeIcon;
+    if (checkedStatement) {
+      return React__default.isValidElement(activeIcon2) ? React__default.cloneElement(activeIcon2, _objectSpread(_objectSpread({}, activeIcon2.props), {}, {
+        className: classNames(color())
+      })) : React__default.createElement(CheckChecked, {
+        className: classNames(color())
+      });
+    }
+    return React__default.isValidElement(icon2) ? React__default.cloneElement(icon2, _objectSpread(_objectSpread({}, icon2.props), {}, {
+      className: classNames(color())
+    })) : React__default.createElement(CheckNormal, {
+      className: classNames(color())
+    });
+  };
+  var reverse = labelPosition === "left";
+  var renderRadioItem = function renderRadioItem2() {
+    if (shape === "button") {
+      return renderButton();
+    }
+    if (reverse) {
+      return React__default.createElement(React__default.Fragment, null, renderLabel(), renderIcon());
+    }
+    return React__default.createElement(React__default.Fragment, null, renderIcon(), renderLabel());
+  };
+  var handleClick = function handleClick2(e) {
+    if (disabled || checkedStatement)
+      return;
+    setCheckedStatement(!checkedStatement);
+  };
+  return React__default.createElement("div", _objectSpread({
+    className: "".concat(classPrefix, " ").concat(className, " ").concat(reverse ? "".concat(classPrefix, "--reverse") : ""),
+    style,
+    onClick: handleClick
+  }, rest), renderRadioItem());
+};
+Radio.defaultProps = defaultProps;
+Radio.displayName = "NutRadio";
+Radio.Group = RadioGroup;
+export {
+  Radio as R,
+  RadioContext as a
+};

package/dist/esm/raf.js

@@ -0,0 +1,15 @@
+var _window = window;
+function requestAniFrame() {
+  if (typeof _window !== "undefined") {
+    return _window.requestAnimationFrame || _window.webkitRequestAnimationFrame || function(callback) {
+      _window.setTimeout(callback, 1e3 / 60);
+    };
+  }
+  return function(callback) {
+    setTimeout(callback, 1e3 / 60);
+  };
+}
+var requestAniFrame$1 = requestAniFrame();
+export {
+  requestAniFrame$1 as r
+};

package/dist/esm/render.js

@@ -0,0 +1,95 @@
+import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
+import _typeof from "@babel/runtime/helpers/typeof";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _regeneratorRuntime from "@babel/runtime/regenerator";
+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), true).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 * as ReactDOM from "react-dom";
+var fullClone = _objectSpread({}, ReactDOM);
+var version = fullClone.version, reactRender = fullClone.render, unmountComponentAtNode = fullClone.unmountComponentAtNode;
+var createRoot;
+try {
+  var mainVersion = Number((version || "").split(".")[0]);
+  if (mainVersion >= 18 && fullClone.createRoot) {
+    createRoot = fullClone.createRoot;
+  }
+} catch (e) {
+}
+function toggleWarning(skip) {
+  var __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED = fullClone.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
+  if (__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED && _typeof(__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED) === "object") {
+    __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.usingClientEntryPoint = skip;
+  }
+}
+var MARK = "__nutui_react_root__";
+function legacyRender(node, container) {
+  reactRender(node, container);
+}
+function concurrentRender(node, container) {
+  toggleWarning(true);
+  var root = container[MARK] || createRoot(container);
+  toggleWarning(false);
+  root.render(node);
+  container[MARK] = root;
+}
+function render(node, container) {
+  if (createRoot) {
+    concurrentRender(node, container);
+    return;
+  }
+  legacyRender(node, container);
+}
+function legacyUnmount(container) {
+  return unmountComponentAtNode(container);
+}
+function concurrentUnmount(_x) {
+  return _concurrentUnmount.apply(this, arguments);
+}
+function _concurrentUnmount() {
+  _concurrentUnmount = _asyncToGenerator(/* @__PURE__ */ _regeneratorRuntime.mark(function _callee(container) {
+    return _regeneratorRuntime.wrap(function _callee$(_context) {
+      while (1)
+        switch (_context.prev = _context.next) {
+          case 0:
+            return _context.abrupt("return", Promise.resolve().then(function() {
+              var _container$MARK;
+              (_container$MARK = container[MARK]) === null || _container$MARK === void 0 ? void 0 : _container$MARK.unmount();
+              delete container[MARK];
+            }));
+          case 1:
+          case "end":
+            return _context.stop();
+        }
+    }, _callee);
+  }));
+  return _concurrentUnmount.apply(this, arguments);
+}
+function unmount(container) {
+  if (createRoot) {
+    return concurrentUnmount(container);
+  }
+  return legacyUnmount(container);
+}
+export {
+  render as r,
+  unmount as u
+};

package/dist/esm/tabbaritem2.js

@@ -0,0 +1,70 @@
+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), true).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 classNames from "classnames";
+import { C as ComponentDefaults } from "./typings.js";
+import { B as Badge } from "./badge2.js";
+var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
+  title: "",
+  icon: null,
+  active: false,
+  index: 0,
+  value: "",
+  dot: false,
+  max: 99,
+  top: "0",
+  right: "5"
+});
+var TabbarItem = function TabbarItem2(props) {
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), className = _defaultProps$props.className, style = _defaultProps$props.style, title = _defaultProps$props.title, icon = _defaultProps$props.icon, active = _defaultProps$props.active, activeColor = _defaultProps$props.activeColor, inactiveColor = _defaultProps$props.inactiveColor, index = _defaultProps$props.index, value = _defaultProps$props.value, dot = _defaultProps$props.dot, max = _defaultProps$props.max, top = _defaultProps$props.top, right = _defaultProps$props.right, handleClick = _defaultProps$props.handleClick;
+  var classPrefix = "nut-tabbar-item";
+  var tabbarItemClass = classNames(className, classPrefix, _defineProperty({}, "".concat(classPrefix, "-active"), active));
+  var boxPrefix = "".concat(classPrefix, "__icon-box");
+  var titleClass = classNames(boxPrefix, "".concat(boxPrefix, "-nav"), _defineProperty({}, "".concat(boxPrefix, "-large"), !icon));
+  var badgeProps = {
+    value,
+    dot,
+    max,
+    top,
+    right,
+    color: activeColor
+  };
+  return React__default.createElement("div", {
+    className: tabbarItemClass,
+    style: _objectSpread({
+      color: active ? activeColor : inactiveColor
+    }, style),
+    onClick: function onClick() {
+      return handleClick(index);
+    }
+  }, icon ? React__default.createElement(React__default.Fragment, null, React__default.createElement(Badge, _objectSpread({}, badgeProps), React__default.createElement("div", {
+    className: boxPrefix
+  }, icon)), React__default.createElement("div", {
+    className: titleClass
+  }, title)) : React__default.createElement(Badge, _objectSpread({}, badgeProps), React__default.createElement("div", {
+    className: titleClass
+  }, title)));
+};
+export {
+  TabbarItem as T
+};