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

type DisplayProps = { mq: symbol } & PropsWithChildren

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

    return isVisible
        ? children
        : null
}