123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152 |
- "use strict";
-
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
- var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
-
- exports.__esModule = true;
- exports.default = void 0;
-
- var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
- var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
-
- var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));
-
- var _classnames = _interopRequireDefault(require("classnames"));
-
- var _style = _interopRequireDefault(require("dom-helpers/style"));
-
- var _react = _interopRequireDefault(require("react"));
-
- var _end = _interopRequireDefault(require("dom-helpers/transition/end"));
-
- var _Transition = _interopRequireWildcard(require("react-transition-group/Transition"));
-
- var _triggerBrowserReflow = _interopRequireDefault(require("./utils/triggerBrowserReflow"));
-
- var _createChainedFunction = _interopRequireDefault(require("./utils/createChainedFunction"));
-
- var _collapseStyles;
-
- var MARGINS = {
- height: ['marginTop', 'marginBottom'],
- width: ['marginLeft', 'marginRight']
- };
-
- function getDimensionValue(dimension, elem) {
- var offset = "offset" + dimension[0].toUpperCase() + dimension.slice(1);
- var value = elem[offset];
- var margins = MARGINS[dimension];
- return value + parseInt((0, _style.default)(elem, margins[0]), 10) + parseInt((0, _style.default)(elem, margins[1]), 10);
- }
-
- var collapseStyles = (_collapseStyles = {}, _collapseStyles[_Transition.EXITED] = 'collapse', _collapseStyles[_Transition.EXITING] = 'collapsing', _collapseStyles[_Transition.ENTERING] = 'collapsing', _collapseStyles[_Transition.ENTERED] = 'collapse show', _collapseStyles);
- var defaultProps = {
- in: false,
- timeout: 300,
- mountOnEnter: false,
- unmountOnExit: false,
- appear: false,
- dimension: 'height',
- getDimensionValue: getDimensionValue
- };
-
- var Collapse =
- /*#__PURE__*/
- function (_React$Component) {
- (0, _inheritsLoose2.default)(Collapse, _React$Component);
-
- function Collapse() {
- 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.handleEnter = function (elem) {
- elem.style[_this.getDimension()] = '0';
- };
-
- _this.handleEntering = function (elem) {
- var dimension = _this.getDimension();
-
- elem.style[dimension] = _this._getScrollDimensionValue(elem, dimension);
- };
-
- _this.handleEntered = function (elem) {
- elem.style[_this.getDimension()] = null;
- };
-
- _this.handleExit = function (elem) {
- var dimension = _this.getDimension();
-
- elem.style[dimension] = _this.props.getDimensionValue(dimension, elem) + "px";
- (0, _triggerBrowserReflow.default)(elem);
- };
-
- _this.handleExiting = function (elem) {
- elem.style[_this.getDimension()] = null;
- };
-
- return _this;
- }
-
- var _proto = Collapse.prototype;
-
- _proto.getDimension = function getDimension() {
- return typeof this.props.dimension === 'function' ? this.props.dimension() : this.props.dimension;
- }
- /* -- Expanding -- */
- ;
-
- // for testing
- _proto._getScrollDimensionValue = function _getScrollDimensionValue(elem, dimension) {
- var scroll = "scroll" + dimension[0].toUpperCase() + dimension.slice(1);
- return elem[scroll] + "px";
- };
-
- _proto.render = function render() {
- var _this2 = this;
-
- var _this$props = this.props,
- onEnter = _this$props.onEnter,
- onEntering = _this$props.onEntering,
- onEntered = _this$props.onEntered,
- onExit = _this$props.onExit,
- onExiting = _this$props.onExiting,
- className = _this$props.className,
- children = _this$props.children,
- props = (0, _objectWithoutPropertiesLoose2.default)(_this$props, ["onEnter", "onEntering", "onEntered", "onExit", "onExiting", "className", "children"]);
- delete props.dimension;
- delete props.getDimensionValue;
- var handleEnter = (0, _createChainedFunction.default)(this.handleEnter, onEnter);
- var handleEntering = (0, _createChainedFunction.default)(this.handleEntering, onEntering);
- var handleEntered = (0, _createChainedFunction.default)(this.handleEntered, onEntered);
- var handleExit = (0, _createChainedFunction.default)(this.handleExit, onExit);
- var handleExiting = (0, _createChainedFunction.default)(this.handleExiting, onExiting);
- return _react.default.createElement(_Transition.default, (0, _extends2.default)({
- addEndListener: _end.default
- }, props, {
- "aria-expanded": props.role ? props.in : null,
- onEnter: handleEnter,
- onEntering: handleEntering,
- onEntered: handleEntered,
- onExit: handleExit,
- onExiting: handleExiting
- }), function (state, innerProps) {
- return _react.default.cloneElement(children, (0, _extends2.default)({}, innerProps, {
- className: (0, _classnames.default)(className, children.props.className, collapseStyles[state], _this2.getDimension() === 'width' && 'width')
- }));
- });
- };
-
- return Collapse;
- }(_react.default.Component);
-
- Collapse.defaultProps = defaultProps;
- var _default = Collapse;
- exports.default = _default;
- module.exports = exports["default"];
|