import React, { type PropsWithChildren } from 'react'
import { useMedia } from '../hooks'

type HideProps = { mq: symbol } & PropsWithChildren

export const Hide: React.FunctionComponent<HideProps> = ({ children, ...props }) => {
    const { isVisible } = useMedia(props)

    return !isVisible
        ? children
        : null
}