@carbon/ibm-security/es/components/Panel/Panel.js

Carbon for Cloud & Cognitive IBM Security UI components

import _readOnlyError from "@babel/runtime/helpers/readOnlyError";
import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
import _createClass from "@babel/runtime/helpers/createClass";
import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
import _inherits from "@babel/runtime/helpers/inherits";
import _defineProperty from "@babel/runtime/helpers/defineProperty";
function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
/**
 * @file Panel.
 * @copyright IBM Security 2019
 */

import PropTypes from 'prop-types';
import { Component } from 'react';

/**
 * Panel component.
 * @param {Record<string, any>} props Panel props.
 * @returns {Panel} Panel instance.
 */
var Panel = /*#__PURE__*/function (_Component) {
  function Panel() {
    var _this;
    _classCallCheck(this, Panel);
    for (var _len = arguments.length, _args = new Array(_len), _key = 0; _key < _len; _key++) {
      _args[_key] = arguments[_key];
    }
    _this = _callSuper(this, Panel, [].concat(_args));
    _defineProperty(_this, "state", {
      active: false
    });
    /**
     * Handles when the panel has been requested to close.
     * @param {Event} event Event object generated from close request.
     * @param {...any} args The arguments passed via render props.
     */
    _defineProperty(_this, "handleClose", function (event) {
      event.stopPropagation();
      if (_this.state.active) {
        var _this$props;
        for (var _len2 = arguments.length, args = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {
          args[_key2 - 1] = arguments[_key2];
        }
        (_this$props = _this.props).onClose.apply(_this$props, [event].concat(args));
        _this.setState({
          active: false
        });
      }
    });
    /**
     * Handles when the panel has been requested to open.
     * @param {Event} event Event object generated from open request.
     * @param {...any} args The arguments passed via render props.
     */
    _defineProperty(_this, "handleOpen", function (event) {
      event.stopPropagation();
      if (!_this.state.active) {
        var _this$props2;
        for (var _len3 = arguments.length, args = new Array(_len3 > 1 ? _len3 - 1 : 0), _key3 = 1; _key3 < _len3; _key3++) {
          args[_key3 - 1] = arguments[_key3];
        }
        (_this$props2 = _this.props).onOpen.apply(_this$props2, [event].concat(args));
        _this.setState({
          active: true
        });
      }
    });
    /**
     * Handles when the panel has been requested to toggle.
     * @param {Event} event Event object generated from toggle request.
     * @param {...any} args The arguments passed via render props.
     */
    _defineProperty(_this, "toggleActive", function (event) {
      for (var _len4 = arguments.length, args = new Array(_len4 > 1 ? _len4 - 1 : 0), _key4 = 1; _key4 < _len4; _key4++) {
        args[_key4 - 1] = arguments[_key4];
      }
      if (_this.state.active) {
        var _this$props3;
        (_this$props3 = _this.props).onClose.apply(_this$props3, [event].concat(args));
        _this.setState({
          active: !_this.state.active
        });
      } else if (_this.props.shouldPanelOpen) {
        var _this$props4;
        (_this$props4 = _this.props).onOpen.apply(_this$props4, [event].concat(args));
        _this.setState({
          active: !_this.state.active
        });
      }
    });
    return _this;
  }
  _inherits(Panel, _Component);
  return _createClass(Panel, [{
    key: "render",
    value: function render() {
      var _this$props5 = this.props,
        children = _this$props5.children,
        render = _this$props5.render;
      var renderProps = {
        active: this.state.active,
        handleClose: this.handleClose,
        handleOpen: this.handleOpen,
        toggleActive: this.toggleActive
      };
      if (render !== undefined) {
        return render(renderProps);
      }
      if (children !== undefined) {
        return children(renderProps);
      }
      return null;
    }
  }]);
}(Component);
_defineProperty(Panel, "propTypes", {
  /** @type {Node} Child elements. */
  children: PropTypes.node,
  /** @type {function(...args)} Function to call when the panel closes. */
  onClose: PropTypes.func,
  /** @type {function(...args)} Function to call when the panel opens. */
  onOpen: PropTypes.func,
  /** @type {function(...props)} Render function for the contents of the table. */
  render: PropTypes.func,
  /** @type {bool} specifies whether the Panel should open or not */
  shouldPanelOpen: PropTypes.bool
});
_defineProperty(Panel, "defaultProps", {
  children: undefined,
  onClose: function onClose() {},
  onOpen: function onOpen() {},
  render: undefined,
  shouldPanelOpen: true
});
export { Panel as default };