Why Gemfury? Push, build, and install  RubyGems npm packages Python packages Maven artifacts PHP packages Go Modules Debian packages RPM packages NuGet packages

Repository URL to install this package:

Details    
@skava/ui / dist / components / features / Portal / Portal.js
Size: Mime:
"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});

const tslib_1 = require("tslib");

const react_1 = tslib_1.__importDefault(require("react"));

const classnames_1 = tslib_1.__importDefault(require("classnames"));

const react_dom_1 = require("react-dom");

const exotic_1 = require("exotic");

const deps_1 = require("./deps");
/**
 * @api https://reactjs.org/docs/portals.html
 */


class Portal extends react_1.default.PureComponent {
  constructor() {
    super(...arguments);
    this.isComponentMounted = false;
  }

  componentWillUnmount() {
    this.isComponentMounted = false;

    if (exotic_1.isObj(this.defaultNode) && exotic_1.isObj(this.defaultNode.classList)) {
      this.defaultNode.classList.remove('visible');

      if (exotic_1.isString(this.props.id) === false) {
        deps_1.removeElement(this.defaultNode);
        this.defaultNode = undefined;
      }
    }
  }
  /**
   * @see https://reactjs.org/docs/reconciliation.html
   */


  componentDidMount() {
    this.isComponentMounted = true;
    this.forceUpdate();
  }
  /**
   * @deprecated
   * @todo remove this, we can access using props...
   */


  get className() {
    return classnames_1.default('portal', this.props.className, {
      visible: this.props.isVisible,
      hidden: this.props.isVisible === false
    });
  }
  /**
   * @todo reduce reading & writing from the DOM here, bad @@perf
   */


  render() {
    /**
     * for best rendering, should not render on server
     */
    if (this.isComponentMounted === false) {
      return null;
    } // if we send an id, find it


    if (exotic_1.isString(this.props.id)) {
      this.defaultNode = deps_1.getElementOrCreate(this.props.id);
      this.defaultNode.className = this.className;
      this.defaultNode.setAttribute('aria-hidden', String(!this.props.isVisible));
    } // otherwise, we could send a dom node
    else if (!this.props.node && exotic_1.isUndefined(this.defaultNode)) {
        this.defaultNode = document.createElement('div');
      } // if we had to create it, we need to append it


    deps_1.appendToBodyIfRequired(this.defaultNode);
    return react_dom_1.createPortal(this.props.children, this.props.node || this.defaultNode);
  }

}

exports.Portal = Portal;
exports.default = Portal; //# sourceMappingURL=Portal.js.map