function SizeExample() {
    const [size, setSize] = React.useState('')
    const { isOpen, onOpen, onClose } = useDisclosure()

    const handleClick = (newSize) => {
        setSize(newSize)
        onOpen()
    }

    const sizes = ['xs', 'sm', 'md', 'lg', 'xl', 'full']

    return (
        <Wrap>
            {sizes.map((size) => (
                <Button onClick={() => handleClick(size)} key={size}>
                    Drawer {size}
                </Button>
            ))}
            <Drawer onClose={onClose} isOpen={isOpen} size={size}>
                <DrawerOverlay />
                <DrawerContent>
                    <DrawerCloseButton />
                    <DrawerHeader>Drawer title</DrawerHeader>
                    <DrawerBody>
                        <Text>
                            Lorem ipsum dolor sit amet, consectetuer adipiscing
                            elit. Phasellus hendrerit. Pellentesque aliquet nibh
                            nec urna. In nisi neque, aliquet vel, dapibus id,
                            mattis vel, nisi. Sed pretium, ligula sollicitudin
                            laoreet viverra, tortor libero sodales leo, eget
                            blandit nunc tortor eu nibh. Nullam mollis. Ut
                            justo. Suspendisse potenti.
                        </Text>
                        <Text>
                            Sed egestas, ante et vulputate volutpat, eros pede
                            semper est, vitae luctus metus libero eu augue.
                            Morbi purus libero, faucibus adipiscing, commodo
                            quis, gravida id, est. Sed lectus. Praesent
                            elementum hendrerit tortor. Sed semper lorem at
                            felis. Vestibulum volutpat, lacus a ultrices
                            sagittis, mi neque euismod dui, eu pulvinar nunc
                            sapien ornare nisl. Phasellus pede arcu, dapibus eu,
                            fermentum et, dapibus sed, urna.
                        </Text>
                    </DrawerBody>
                    <DrawerFooter>
                        <Button variant="ghost" onClick={onClose}>
                            Cancel
                        </Button>
                        <Button>Primary action</Button>
                    </DrawerFooter>
                </DrawerContent>
            </Drawer>
        </Wrap>
    )
}