react-native-portal/dist/index.js

Translocate your render destination, using mitt. Built with react@16 and react-native in mind.

"use strict";
/*
  @flow weak
 */
var __extends = (this && this.__extends) || (function () {
    var extendStatics = Object.setPrototypeOf ||
        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
    return function (d, b) {
        extendStatics(d, b);
        function __() { this.constructor = d; }
        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
    };
})();
Object.defineProperty(exports, "__esModule", { value: true });
var react_1 = require("react"); // peer-dependancy
var mitt_1 = require("mitt"); // DEPENDANCY #1
var prop_types_1 = require("prop-types"); // DEPENDANCY #2, sorta
if (!prop_types_1.default)
    console.warn('<react-native-portal> no PropTypes available');
var oContextTypes = {
    portalSub: prop_types_1.default.func,
    portalUnsub: prop_types_1.default.func,
    portalSet: prop_types_1.default.func,
    portalGet: prop_types_1.default.func,
};
var PortalProvider = /** @class */ (function (_super) {
    __extends(PortalProvider, _super);
    function PortalProvider() {
        var _this = _super !== null && _super.apply(this, arguments) || this;
        _this._store = {};
        // Subscribe to changes
        _this.portalSub = function (name, callback) {
            var emitter = _this._emitter;
            if (emitter) {
                emitter.on(name, callback);
            }
        };
        // Unsubscribe to changes
        _this.portalUnsub = function (name, callback) {
            var emitter = _this._emitter;
            if (emitter) {
                emitter.off(name, callback);
            }
        };
        // OnChange
        _this.portalSet = function (name, value) {
            var _a = _this, emitter = _a._emitter, store = _a._store;
            store[name] = value;
            emitter.emit(name);
        };
        _this.portalGet = function (name) { return _this.state[name] || null; };
        return _this;
    }
    PortalProvider.prototype.getChildContext = function () {
        return {
            portalSub: this.portalSub,
            portalUnsub: this.portalUnsub,
            portalSet: this.portalSet,
            portalGet: this.portalGet,
        };
    };
    PortalProvider.prototype.componentWillMount = function () {
        this._emitter = new mitt_1.default();
    };
    PortalProvider.prototype.componentWillUnmount = function () {
        this._emitter = null;
    };
    // 변경
    PortalProvider.prototype.render = function () {
        return this.props.children;
    };
    PortalProvider.childContextTypes = oContextTypes;
    return PortalProvider;
}(react_1.Component));
exports.PortalProvider = PortalProvider;
var BlackPortal = /** @class */ (function (_super) {
    __extends(BlackPortal, _super);
    function BlackPortal() {
        return _super !== null && _super.apply(this, arguments) || this;
    }
    BlackPortal.prototype.componentDidMount = function () {
        var _a = this.props, name = _a.name, children = _a.children;
        var portalSet = this.context.portalSet;
        portalSet && portalSet(name, children);
    };
    BlackPortal.prototype.componentWillReceiveProps = function (newProps) {
        var oldProps = this.props;
        var name = newProps.name, children = newProps.children;
        var portalSet = this.context.portalSet;
        if (oldProps.children != newProps.children) {
            portalSet && portalSet(name, children);
        }
    };
    BlackPortal.prototype.componentWillUnmount = function () {
        var name = this.props.name;
        var portalSet = this.context.portalSet;
        portalSet && portalSet(name, null);
    };
    BlackPortal.prototype.render = function () {
        var name = this.props.name;
        return null;
    };
    BlackPortal.contextTypes = oContextTypes;
    return BlackPortal;
}(react_1.Component));
exports.BlackPortal = BlackPortal;
var WhitePortal = /** @class */ (function (_super) {
    __extends(WhitePortal, _super);
    function WhitePortal() {
        var _this = _super !== null && _super.apply(this, arguments) || this;
        _this.forceUpdater = function () { return _this.forceUpdate(); };
        return _this;
    }
    WhitePortal.prototype.componentWillMount = function () {
        var name = this.props.name;
        var portalSub = this.context.portalSub;
        portalSub && portalSub(name, this.forceUpdater);
    };
    WhitePortal.prototype.componentWillUnmount = function () {
        var name = this.props.name;
        var portalUnsub = this.context.portalUnsub;
        portalUnsub && portalUnsub(name, this.forceUpdater);
    };
    WhitePortal.prototype.render = function () {
        var _a = this.props, name = _a.name, children = _a.children, childrenProps = _a.childrenProps;
        var portalGet = this.context.portalGet;
        var portalChildren = (portalGet && portalGet(name)) || children;
        return ((childrenProps && portalChildren
            ? react_1.default.cloneElement(react_1.default.Children.only(portalChildren), childrenProps)
            : portalChildren) || null);
    };
    WhitePortal.contextTypes = oContextTypes;
    return WhitePortal;
}(react_1.Component));
exports.WhitePortal = WhitePortal;