@vimeo/iris/utils/HOCs/withIris.js

Vimeo Design System

'use strict';

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

var tslib_es6 = require('../../tslib.es6-3ec409b7.js');
var React = require('react');
var styled = require('styled-components');

var version = '0.151.0';
function withIris(Component, $$iris, path, debug) {
    if ($$iris === void 0) { $$iris = true; }
    if (path === void 0) { path = null; }
    if (debug === void 0) { debug = false; }
    var name = Component.name;
    var component = name === null || name === void 0 ? void 0 : name.replace('Component', '');
    var dev = { path: path };
    if ($$iris === true && process.env.NODE_ENV === 'development') {
        $$iris = { version: version, component: component, dev: dev };
    }
    // Universal Iris Hooks
    var ComponentWithIris = function (_a) {
        var theme = _a.theme, props = tslib_es6.__rest(_a, ["theme"]);
        // const errors = useIrisError(props);
        var themeFromContext = React.useContext(styled.ThemeContext);
        theme = theme || themeFromContext;
        // props = withAnalytics({ $$iris, props });
        return Component(tslib_es6.__assign({ 
            // errors,
            theme: theme }, props));
    };
    if (process.env.NODE_ENV === 'development') {
        var name_1 = Component.name;
        var component_1 = name_1 === null || name_1 === void 0 ? void 0 : name_1.replace('Component', '');
        var dev_1 = { path: path, debug: debug };
        var RefComponentWithIris = React.forwardRef(function (props, ref) {
            React.useEffect(function () {
                if (debug || (props && props.debug)) {
                    if (ref)
                        console.log({ Component: Component, ref: ref });
                    if (!ref)
                        console.warn('@vimeo/iris: bad ref\n\n', {
                            $$iris: $$iris,
                            Component: Component,
                            ref: ref,
                            path: path,
                        });
                }
            });
            return ComponentWithIris(tslib_es6.__assign({ forwardRef: ref }, props));
        });
        RefComponentWithIris['$$iris'] = { version: version, component: component_1, dev: dev_1 };
        return RefComponentWithIris;
    }
    else {
        return React.forwardRef(function (props, ref) {
            return ComponentWithIris(tslib_es6.__assign({ forwardRef: ref }, props));
        });
    }
}
var soPretty = "\n  background: linear-gradient(to right, red, yellow, cyan, blue, violet, pink);\n  font-size: 1.25rem;\n  font-weight: 800;\n  padding: 0.25rem 1.25rem 0.3rem 0.5rem;\n  color: white;\n  text-shadow:\n  -1px -1px 0 rgba(0,0,0,0.334),\n  1px -1px 0 rgba(0,0,0,0.334),\n  -1px 2px 5px rgba(0,0,0,0.334),\n  1px 2px 5px rgba(0,0,0,0.334);\n  border-radius: 0.25rem;\n  font-family: 'Helvetica Neue', Helvetica, sans-serif;\n";
if (process.env.NODE_ENV === 'development')
    console.log("\n\n%c @vimeo/iris: ".concat(version), soPretty, '\n\n\n');

exports.withIris = withIris;