@elacity-js/uikit/dist/components/MHidden.js

React / Material UI Design kit for Elacity project

import { useMediaQuery } from '@mui/material';

const MHidden = ({ width, children, alsoIf }) => {
    const breakpoint = width.substring(0, 2);
    const hiddenUp = useMediaQuery((theme) => theme.breakpoints.up(breakpoint));
    const hiddenDown = useMediaQuery((theme) => theme.breakpoints.down(breakpoint));
    if (alsoIf) {
        return null;
    }
    if (width.includes('Down')) {
        return (hiddenDown ? null : children);
    }
    if (width.includes('Up')) {
        return (hiddenUp ? null : children);
    }
    return null;
};

export { MHidden as default };
//# sourceMappingURL=MHidden.js.map