@eccenca/gui-elements/dist/cjs/components/Application/ApplicationViewability.js

GUI elements based on other libraries, usable in React application, written in Typescript.

"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.ApplicationViewability = void 0;
const react_1 = __importDefault(require("react"));
const classnames_1 = __importDefault(require("classnames"));
const constants_1 = require("../../configuration/constants");
/**
 * Sets the viewability of the the contained element regarding media.
 * Can be used to hide elements, e.g. when the page is printed.
 */
const ApplicationViewability = ({ children, show, hide }) => {
    if (!show && !hide) {
        return children;
    }
    if (show === hide) {
        // eslint-disable-next-line no-console
        console.warn("`<ApplicationViewability/>` used with same media type for `hide` and `show`.");
        return children;
    }
    const enhancedClone = react_1.default.cloneElement(children, {
        className: (0, classnames_1.default)(children.props.className, {
            [`${constants_1.CLASSPREFIX}-application__hide--${hide}`]: hide,
            [`${constants_1.CLASSPREFIX}-application__show--${show}`]: show,
        }),
    });
    return enhancedClone;
};
exports.ApplicationViewability = ApplicationViewability;
exports.default = exports.ApplicationViewability;
//# sourceMappingURL=ApplicationViewability.js.map