choerodon-ui
Version:
An enterprise-class UI design language and React-based implementation
152 lines (129 loc) • 4.73 kB
JavaScript
import _extends from "@babel/runtime/helpers/extends";
import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
import _createClass from "@babel/runtime/helpers/createClass";
import _inherits from "@babel/runtime/helpers/inherits";
import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
function _createSuper(Derived) {
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;
}
}
return function () {
var Super = _getPrototypeOf(Derived),
result;
if (isNativeReflectConstruct()) {
var NewTarget = _getPrototypeOf(this).constructor;
result = Reflect.construct(Super, arguments, NewTarget);
} else {
result = Super.apply(this, arguments);
}
return _possibleConstructorReturn(this, result);
};
}
import React, { Component } from 'react';
import classNames from 'classnames';
import omit from 'lodash/omit';
import Animate from '../animate';
import addEventListener from '../_util/addEventListener';
import { getPrefixCls } from '../configure';
import getScroll from '../_util/getScroll';
import scrollTo from '../_util/scrollTo';
function getDefaultTarget() {
return window;
}
var BackTop =
/*#__PURE__*/
function (_Component) {
_inherits(BackTop, _Component);
var _super = _createSuper(BackTop);
function BackTop() {
var _this;
_classCallCheck(this, BackTop);
_this = _super.apply(this, arguments);
_this.state = {
visible: false
};
_this.scrollToTop = function (e) {
var _this$props = _this.props,
_this$props$target = _this$props.target,
target = _this$props$target === void 0 ? getDefaultTarget : _this$props$target,
onClick = _this$props.onClick;
scrollTo(0, {
getContainer: target
});
if (typeof onClick === 'function') {
onClick(e);
}
};
_this.handleScroll = function () {
var _this$props2 = _this.props,
visibilityHeight = _this$props2.visibilityHeight,
_this$props2$target = _this$props2.target,
target = _this$props2$target === void 0 ? getDefaultTarget : _this$props2$target;
var scrollTop = getScroll(target(), true);
_this.setState({
visible: scrollTop > visibilityHeight
});
};
return _this;
}
_createClass(BackTop, [{
key: "componentDidMount",
value: function componentDidMount() {
var _this$props$target2 = this.props.target,
target = _this$props$target2 === void 0 ? getDefaultTarget : _this$props$target2;
this.scrollEvent = addEventListener(target(), 'scroll', this.handleScroll);
this.handleScroll();
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (this.scrollEvent) {
this.scrollEvent.remove();
}
}
}, {
key: "render",
value: function render() {
var _this$props3 = this.props,
customizePrefixCls = _this$props3.prefixCls,
_this$props3$classNam = _this$props3.className,
className = _this$props3$classNam === void 0 ? '' : _this$props3$classNam,
propsVisible = _this$props3.visible,
children = _this$props3.children;
var stateVisible = this.state.visible;
var prefixCls = getPrefixCls('back-top', customizePrefixCls);
var classString = classNames(prefixCls, className);
var defaultElement = React.createElement("div", {
className: "".concat(prefixCls, "-content")
}, React.createElement("div", {
className: "".concat(prefixCls, "-icon")
})); // fix https://fb.me/react-unknown-prop
var divProps = omit(this.props, ['prefixCls', 'className', 'children', 'visibilityHeight', 'target', 'visible']);
var visible = 'visible' in this.props ? propsVisible : stateVisible;
var backTopBtn = visible ? React.createElement("div", _extends({}, divProps, {
className: classString,
onClick: this.scrollToTop
}), children || defaultElement) : null;
return React.createElement(Animate, {
component: "",
transitionName: "fade"
}, backTopBtn);
}
}]);
return BackTop;
}(Component);
export { BackTop as default };
BackTop.displayName = 'BackTop';
BackTop.defaultProps = {
visibilityHeight: 400
};
//# sourceMappingURL=index.js.map