@flexis/ui/components/Expand/Expand.js

Styleless React Components

"use strict";

var _Object$keys2 = require("@babel/runtime-corejs3/core-js-stable/object/keys");

var _forEachInstanceProperty2 = require("@babel/runtime-corejs3/core-js-stable/instance/for-each");

var _context3, _context4;

var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");

var _Object$defineProperty2 = require("@babel/runtime-corejs3/core-js-stable/object/define-property");

_Object$defineProperty2(exports, "__esModule", {
  value: true
});

var _exportNames = {};
exports.default = void 0;

var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/define-property"));

var _defineProperties = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/define-properties"));

var _getOwnPropertyDescriptors = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors"));

var _forEach = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/for-each"));

var _getOwnPropertyDescriptor = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor"));

var _filter = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/filter"));

var _getOwnPropertySymbols = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols"));

var _keys = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/keys"));

var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));

var _defineProperty3 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));

var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/slicedToArray"));

var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/objectWithoutProperties"));

var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/classCallCheck"));

var _createClass2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/createClass"));

var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/possibleConstructorReturn"));

var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/getPrototypeOf"));

var _inherits2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/inherits"));

var _tslib = require("tslib");

var _react = _interopRequireDefault(require("react"));

var _propTypes = _interopRequireDefault(require("prop-types"));

var _helpers = require("../../helpers");

var _ExpandSt = require("./Expand.st.css");

var _ExpandTitle = require("./ExpandTitle");

_forEachInstanceProperty2(_context3 = _Object$keys2(_ExpandTitle)).call(_context3, function (key) {
  if (key === "default" || key === "__esModule") return;
  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;

  _Object$defineProperty2(exports, key, {
    enumerable: true,
    get: function get() {
      return _ExpandTitle[key];
    }
  });
});

var _ExpandContent = require("./ExpandContent");

_forEachInstanceProperty2(_context4 = _Object$keys2(_ExpandContent)).call(_context4, function (key) {
  if (key === "default" || key === "__esModule") return;
  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;

  _Object$defineProperty2(exports, key, {
    enumerable: true,
    get: function get() {
      return _ExpandContent[key];
    }
  });
});

function ownKeys(object, enumerableOnly) { var keys = (0, _keys.default)(object); if (_getOwnPropertySymbols.default) { var symbols = (0, _getOwnPropertySymbols.default)(object); if (enumerableOnly) symbols = (0, _filter.default)(symbols).call(symbols, function (sym) { return (0, _getOwnPropertyDescriptor.default)(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) { var _context; (0, _forEach.default)(_context = ownKeys(Object(source), true)).call(_context, function (key) { (0, _defineProperty3.default)(target, key, source[key]); }); } else if (_getOwnPropertyDescriptors.default) { (0, _defineProperties.default)(target, (0, _getOwnPropertyDescriptors.default)(source)); } else { var _context2; (0, _forEach.default)(_context2 = ownKeys(Object(source))).call(_context2, function (key) { (0, _defineProperty2.default)(target, key, (0, _getOwnPropertyDescriptor.default)(source, key)); }); } } return target; }

var _createElement = _react.default.createElement;
var PureComponent = _react.default.PureComponent,
    Children = _react.default.Children,
    cloneElement = _react.default.cloneElement;

var Expand =
/** @class */
function () {
  var Expand = /*#__PURE__*/function (_PureComponent) {
    (0, _inherits2.default)(Expand, _PureComponent);

    function Expand(props) {
      var _this;

      (0, _classCallCheck2.default)(this, Expand);
      _this = (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(Expand).call(this, props));
      var defaultActive = props.defaultActive;
      _this.state = {
        active: defaultActive
      };
      return _this;
    }

    (0, _createClass2.default)(Expand, [{
      key: "render",
      value: function render() {
        var _this$props = this.props,
            className = _this$props.className,
            disabled = _this$props.disabled,
            children = _this$props.children,
            props = (0, _objectWithoutProperties2.default)(_this$props, ["className", "disabled", "children"]);
        var active = this.state.active;

        var _Children$toArray = Children.toArray(children),
            _Children$toArray2 = (0, _slicedToArray2.default)(_Children$toArray, 2),
            title = _Children$toArray2[0],
            content = _Children$toArray2[1];

        return _createElement("div", (0, _extends2.default)({}, (0, _helpers.omit)(props, ['defaultActive', 'active', 'onToggle']), {
          className: (0, _ExpandSt.style)(_ExpandSt.classes.root, {
            active: active,
            disabled: disabled
          }, className),
          "aria-disabled": disabled
        }), cloneElement(title, {
          'onClick': this.onToggle,
          'aria-haspopup': true,
          'aria-expanded': active,
          'aria-disabled': disabled,
          'disabled': disabled
        }), cloneElement(content, _objectSpread({}, (0, _helpers.getAriaLabelProps)({
          role: 'region',
          labelledBy: title.props.id
        }, content.props), {
          'aria-hidden': !active
        })));
      }
    }, {
      key: "onToggle",
      value: function onToggle(event) {
        this.toggleActiveState(null, event);
      }
    }, {
      key: "toggleActiveState",
      value: function toggleActiveState(forceState) {
        var event = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
        var _this$props2 = this.props,
            activeProp = _this$props2.active,
            onToggle = _this$props2.onToggle,
            disabled = _this$props2.disabled;

        if (disabled) {
          return;
        }

        var active = this.state.active;
        var nextActive = typeof forceState === 'boolean' ? forceState : !active;

        if (nextActive === active) {
          return;
        }

        if (typeof activeProp !== 'boolean') {
          this.setState(function () {
            return {
              active: nextActive
            };
          });
        }

        if (typeof onToggle === 'function') {
          onToggle(nextActive, event);
        }
      }
    }], [{
      key: "getDerivedStateFromProps",
      value: function getDerivedStateFromProps(_ref, _ref2) {
        var active = _ref.active,
            disabled = _ref.disabled;
        var prevActive = _ref2.active;
        var nextActive = !disabled && (typeof active === 'boolean' ? active : prevActive);

        if (nextActive === prevActive) {
          return null;
        }

        return {
          active: nextActive
        };
      }
    }]);
    return Expand;
  }(PureComponent);

  process.env.NODE_ENV !== "production" ? Expand.propTypes = {
    onToggle: _propTypes.default.func,
    defaultActive: _propTypes.default.bool,
    active: _propTypes.default.bool,
    disabled: _propTypes.default.bool,
    children: _propTypes.default.arrayOf(_propTypes.default.element).isRequired
  } : void 0;
  Expand.defaultProps = {
    defaultActive: false,
    disabled: false
  };
  (0, _tslib.__decorate)([(0, _helpers.Bind)()], Expand.prototype, "onToggle", null);
  return Expand;
}();

var _default = Expand;
exports.default = _default;
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9jb21wb25lbnRzL0V4cGFuZC9FeHBhbmQudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7QUFBQTs7QUFTQTs7QUFDQTs7QUFNQTs7QUFLQTs7QUFBQTtBQUFBO0FBQUE7O0FBQUE7QUFBQTtBQUFBO0FBQUE7QUFBQTtBQUFBO0FBQUE7O0FBQ0E7O0FBQUE7QUFBQTtBQUFBOztBQUFBO0FBQUE7QUFBQTtBQUFBO0FBQUE7QUFBQTtBQUFBOzs7Ozs7Ozs7OztBQW1CQSxJQUFBLE1BQUE7QUFBQTtBQUFBLFlBQUE7QUFBQSxNQUFxQixNQUFyQjtBQUFBOztBQXdDQyxvQkFBWSxLQUFaLEVBQWlCO0FBQUE7O0FBQUE7QUFFaEIsOEdBQU0sS0FBTjtBQUZnQixVQUtmLGFBTGUsR0FNWixLQU5ZLENBS2YsYUFMZTtBQVFoQixZQUFLLEtBQUwsR0FBYTtBQUNaLFFBQUEsTUFBTSxFQUFFO0FBREksT0FBYjtBQVJnQjtBQVdoQjs7QUFuREY7QUFBQTtBQUFBLCtCQXFETztBQUFBLDBCQU9ELEtBQUssS0FQSjtBQUFBLFlBR0osU0FISSxlQUdKLFNBSEk7QUFBQSxZQUlKLFFBSkksZUFJSixRQUpJO0FBQUEsWUFLSixRQUxJLGVBS0osUUFMSTtBQUFBLFlBTUQsS0FOQztBQUFBLFlBU0osTUFUSSxHQVVELEtBQUssS0FWSixDQVNKLE1BVEk7O0FBQUEsZ0NBY0QsUUFBUSxDQUFDLE9BQVQsQ0FBaUIsUUFBakIsQ0FkQztBQUFBO0FBQUEsWUFZSixLQVpJO0FBQUEsWUFhSixPQWJJOztBQWdCTCxlQUNDLGlEQUNLLG1CQUFLLEtBQUwsRUFBWSxDQUNmLGVBRGUsRUFFZixRQUZlLEVBR2YsVUFIZSxDQUFaLENBREw7QUFNQyxVQUFBLFNBQVMsRUFBRSxxQkFBTSxrQkFBUSxJQUFkLEVBQW9CO0FBQzlCLFlBQUEsTUFBTSxFQUFOLE1BRDhCO0FB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