@hi-ui/hiui 3.9.0-rc.8 → 4.0.0-beta.1

package/es/carousel/index.js

@@ -1,242 +0,0 @@
-"use strict";
-
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = void 0;
-
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-
-var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
-
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-
-var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
-
-var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
-
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
-var _react = _interopRequireWildcard(require("react"));
-
-var _propTypes = _interopRequireDefault(require("prop-types"));
-
-var _icon = _interopRequireDefault(require("../icon"));
-
-var _classnames = _interopRequireDefault(require("classnames"));
-
-require("./style/index");
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (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 = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
-
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
-
-// const url = 'http://i1.mifile.cn/f/i/hiui/docs/'
-var Carousel = /*#__PURE__*/function (_Component) {
-  (0, _inherits2["default"])(Carousel, _Component);
-
-  var _super = _createSuper(Carousel);
-
-  function Carousel(props) {
-    var _this;
-
-    (0, _classCallCheck2["default"])(this, Carousel);
-    _this = _super.call(this, props);
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "resizeRootWidth", function () {
-      _this.setState({
-        rootWidth: _this.rootRef.current.clientWidth
-      }, function () {
-        if (_this.props.duration) {
-          _this.timer && window.clearInterval(_this.timer);
-
-          _this.autoPage();
-        }
-      });
-    });
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleKeyDown", function (evt) {
-      var keyCode = evt.keyCode;
-
-      if ([39, 37].includes(keyCode)) {
-        evt.preventDefault();
-        evt.stopPropagation();
-
-        _this.preNextEvent(keyCode === 37 ? -1 : 1);
-      }
-    });
-    _this.rootRef = /*#__PURE__*/_react["default"].createRef();
-    var defaultActive = props.defaultActive;
-    _this.state = {
-      rootWidth: 0,
-      showArrow: false,
-      active: defaultActive >= props.children.length || defaultActive < 0 ? 0 : defaultActive
-    };
-    _this.timer = null;
-    return _this;
-  }
-
-  (0, _createClass2["default"])(Carousel, [{
-    key: "componentDidMount",
-    value: function componentDidMount() {
-      this.resizeRootWidth();
-      window.addEventListener('resize', this.resizeRootWidth);
-    }
-  }, {
-    key: "componentWillUnmount",
-    value: function componentWillUnmount() {
-      this.timer && window.clearInterval(this.timer);
-      window.removeEventListener('resize', this.resizeRootWidth);
-    }
-  }, {
-    key: "autoPage",
-    value: function autoPage() {
-      var _this2 = this;
-
-      this.timer = window.setInterval(function () {
-        _this2.preNextEvent(1);
-      }, this.props.duration);
-    }
-  }, {
-    key: "pageEvent",
-    value: function pageEvent(active) {
-      this.setState({
-        active: active
-      });
-    }
-  }, {
-    key: "preNextEvent",
-    value: function preNextEvent(val) {
-      var active = this.state.active + val;
-
-      if (active >= this.props.children.length) {
-        active = 0;
-      }
-
-      if (active < 0) {
-        active = this.props.children.length + active;
-      }
-
-      this.setState({
-        active: active
-      });
-    }
-  }, {
-    key: "mouseEvent",
-    value: function mouseEvent(type) {
-      var showArrow = true;
-
-      if (type === 'over') {
-        this.timer && window.clearInterval(this.timer);
-      } else {
-        showArrow = false;
-        this.props.duration && this.autoPage();
-      }
-
-      this.setState({
-        showArrow: showArrow
-      });
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var _this3 = this;
-
-      var _this$state = this.state,
-          rootWidth = _this$state.rootWidth,
-          active = _this$state.active,
-          showArrow = _this$state.showArrow;
-      var _this$props = this.props,
-          showDots = _this$props.showDots,
-          showArrows = _this$props.showArrows,
-          showPages = _this$props.showPages;
-
-      var children = _react["default"].Children.toArray(this.props.children);
-
-      var len = children.length || 0;
-      var arrowCls = (0, _classnames["default"])('hi-carousel__arrows', showArrow && 'hi-carousel__arrows--show');
-      return /*#__PURE__*/_react["default"].createElement("div", {
-        className: "hi-carousel",
-        ref: this.rootRef,
-        tabIndex: "0",
-        onKeyDown: this.handleKeyDown,
-        onMouseOver: this.mouseEvent.bind(this, 'over'),
-        onMouseOut: this.mouseEvent.bind(this, 'out')
-      }, /*#__PURE__*/_react["default"].createElement("div", {
-        className: "hi-carousel__container",
-        style: {
-          width: rootWidth * children.length
-        }
-      }, children.map(function (child, index) {
-        return /*#__PURE__*/_react["default"].cloneElement(child, {
-          key: index,
-          style: _objectSpread({
-            position: 'relative',
-            zIndex: active === index ? 2 : 1,
-            opacity: active === index ? 1 : 0,
-            transition: 'opacity 300ms ease 0s',
-            left: -(rootWidth * index),
-            width: rootWidth,
-            display: 'inline-block',
-            fontSize: 24
-          }, child.props.style)
-        });
-      })), showArrows && /*#__PURE__*/_react["default"].createElement("ul", {
-        className: arrowCls
-      }, /*#__PURE__*/_react["default"].createElement("li", {
-        className: "hi-carousel__arrow",
-        onClick: this.preNextEvent.bind(this, -1)
-      }, /*#__PURE__*/_react["default"].createElement(_icon["default"], {
-        name: "left"
-      })), /*#__PURE__*/_react["default"].createElement("li", {
-        className: "hi-carousel__arrow",
-        onClick: this.preNextEvent.bind(this, 1)
-      }, /*#__PURE__*/_react["default"].createElement(_icon["default"], {
-        name: "right"
-      }))), showDots && /*#__PURE__*/_react["default"].createElement("ul", {
-        className: "hi-carousel__dots"
-      }, children.map(function (_, index) {
-        var cls = (0, _classnames["default"])('hi-carousel__dot', active === index && 'hi-carousel__dot--active');
-        return /*#__PURE__*/_react["default"].createElement("li", {
-          className: cls,
-          key: index,
-          onClick: _this3.pageEvent.bind(_this3, index)
-        });
-      })), showPages && /*#__PURE__*/_react["default"].createElement("div", {
-        className: "hi-carousel__pages"
-      }, /*#__PURE__*/_react["default"].createElement("span", null, active + 1, " / ", len)));
-    }
-  }]);
-  return Carousel;
-}(_react.Component);
-
-Carousel.propTypes = {
-  duration: _propTypes["default"].number,
-  onClick: _propTypes["default"].func,
-  beforeChange: _propTypes["default"].func,
-  afterChange: _propTypes["default"].func,
-  showDots: _propTypes["default"].bool,
-  showArrows: _propTypes["default"].bool,
-  defaultActive: _propTypes["default"].number,
-  showPages: _propTypes["default"].bool
-};
-Carousel.defaultProps = {
-  duration: 0,
-  onClick: function onClick() {},
-  beforeChange: function beforeChange() {},
-  afterChange: function afterChange() {},
-  showDots: true,
-  showArrows: true,
-  defaultActive: 0,
-  showPages: false
-};
-var _default = Carousel;
-exports["default"] = _default;

package/es/carousel/style/index.css

@@ -1 +0,0 @@
-.hi-carousel{width:100%;color:#fff;overflow:hidden;position:relative;outline:none}.hi-carousel__container{height:100%;-webkit-transition:all 500ms;transition:all 500ms}.hi-carousel__dots{position:absolute;bottom:24px;margin:0;padding:0;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%);max-width:50%;display:-webkit-box;display:-ms-flexbox;display:flex;z-index:2}.hi-carousel__dot{width:24px;height:4px;background:rgba(255,255,255,0.4);border-radius:2px;display:inline-block;margin-left:4px;cursor:pointer;-webkit-transition:all 1s;transition:all 1s}.hi-carousel__dot--active:not(.hi-carousel__dot--sign){background:#fff;width:48px}.hi-carousel__dot--sign{width:24px}.hi-carousel__arrows{position:absolute;width:100%;list-style:none;margin:0;padding:0;top:50%;-webkit-transform:translateY(-28px);transform:translateY(-28px);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;visibility:hidden;height:0;z-index:2}.hi-carousel__arrows--show{visibility:visible}.hi-carousel__arrow{width:56px;height:56px;background:rgba(0,0,0,0.25);border-radius:50%;text-align:center;line-height:56px;color:#fff;font-size:32px;margin-left:24px;cursor:pointer}.hi-carousel__arrow:hover{background:rgba(0,0,0,0.45)}.hi-carousel__arrow:last-child{margin-right:24px}.hi-carousel__pages{width:46px;height:22px;border-radius:16px;position:absolute;bottom:24px;right:24px;background:rgba(0,0,0,0.5);line-height:22px;font-size:14px;text-align:center;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:0.5;z-index:2}

package/es/carousel/style/index.js

@@ -1,3 +0,0 @@
-"use strict";
-
-require("./index.css");