react-reflexible/dist/component.js

Responsible component shift shaper!

"use strict";
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 = require("react");
var style_1 = require("./style");
var FlexibleRender = (function (_super) {
    __extends(FlexibleRender, _super);
    function FlexibleRender() {
        return _super !== null && _super.apply(this, arguments) || this;
    }
    FlexibleRender.prototype.componentDidMount = function () {
        style_1.addStyle();
    };
    FlexibleRender.prototype.componentWillUnmount = function () {
        style_1.removeStyle();
    };
    FlexibleRender.prototype.render = function () {
        var nodes = [
            React.createElement("span", { key: "failback", className: "react-reflexible-failback", "aria-hidden": true }, this.props.failback),
            React.createElement("span", { key: "try", className: "react-reflexible-try" }, this.props.display),
        ];
        return (this.props.fragment
            ? nodes
            : React.createElement("span", { className: "react-reflexible", children: nodes }));
    };
    return FlexibleRender;
}(React.PureComponent));
exports.FlexibleRender = FlexibleRender;
exports.Reoptional = function (_a) {
    var children = _a.children;
    return (React.createElement("span", { className: "react-reflexible-failback", "aria-hidden": true }, children));
};
var OptionalType = (React.createElement(exports.Reoptional, null)).type;
var derefence = function (children) {
    return React.Children.map(children, function (child) {
        if (child && typeof child === 'object' && 'type' in child && child.type === OptionalType) {
            return React.createElement('span', {}, derefence(child.props.children));
        }
        return child;
    });
};
var findOptional = function (children) {
    return React.Children.map(children, function (child) {
        if (child && typeof child === 'object' && 'type' in child && child.type === OptionalType) {
            return child;
        }
        return null;
    }).filter(Boolean);
};
var derefenceOnce = function (children) {
    var result = [];
    React.Children.forEach(children, function (child) {
        if (child && typeof child === 'object' && 'type' in child && child.type === OptionalType) {
            if (child.props.children) {
                result.push.apply(result, [findOptional(child.props.children)]);
            }
        }
    });
    return result.length ? result : null;
};
var SpreadReflexible = (function (_super) {
    __extends(SpreadReflexible, _super);
    function SpreadReflexible() {
        return _super !== null && _super.apply(this, arguments) || this;
    }
    SpreadReflexible.prototype.render = function () {
        var display = [];
        var failback = [];
        var hasFailback = false;
        React.Children.forEach(this.props.children, function (child) {
            if (typeof child === 'object' && child.type === OptionalType) {
                display.push(React.createElement('span', {}, derefence(child.props.children)));
                var failbackElements = findOptional(child.props.children);
                if (failbackElements && failbackElements.length) {
                    failback.push.apply(failback, failbackElements);
                }
                hasFailback = true;
            }
            else {
                display.push(child);
                failback.push(child);
            }
        });
        if (!hasFailback) {
            return display;
        }
        return (React.createElement(FlexibleRender, { display: display, failback: React.createElement(SpreadReflexible, { children: failback.filter(Boolean) }) }));
    };
    return SpreadReflexible;
}(React.PureComponent));
exports.Reflexible = function (_a) {
    var children = _a.children;
    return (React.createElement(SpreadReflexible, null, children));
};
exports.FlexiblePick = function (props) { return (props.try.reduceRight(function (acc, item) { return (acc
    ? React.createElement(FlexibleRender, { display: item, failback: acc })
    : item); }, null)); };