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

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

  const sizes = ['xs', 'sm', 'md', 'lg', 'xl', '2xl', '3xl', '4xl', '5xl', '6xl', 'max', 'full']

  return (
      <Wrap>
          {sizes.map((size) => (
              <Button onClick={() => handleSizeClick(size)} key={size}>
              Modal {size}
              </Button>
          ))}

          <Modal size={size} onClose={onClose} isOpen={isOpen}>
              <ModalOverlay />
              <ModalContent>
                  <ModalHeader>Modal title</ModalHeader>
                  <ModalCloseButton />
                  <ModalBody>
                      <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>
                  </ModalBody>
                  <ModalFooter>
                      <Button onClick={onClose}>Close</Button>
                  </ModalFooter>
              </ModalContent>
          </Modal>
      </Wrap>
  )
}