Drawer

Example

Code


    import React from "react"
    import Drawer from "components/ui/Drawer"

    
    const [isOpen, setIsOpen] = useState(false)

    function onOpen() {
      setIsOpen(true)
    }

    function onClose() {
      setIsOpen(false)
    }

    <Drawer 
      open={isOpen}
      level="base" //base / middle / top
      title="Title"
      description="Description"
      footer={
        <div className="flex items-center justify-end">
          <button
            className="inline-flex justify-center rounded-md border border-transparent px-4 py-2 bg-primary-600 text-base leading-6 font-medium text-white shadow-sm hover:bg-primary-500 focus:outline-none focus:border-primary-700 focus:shadow-outline-primary transition ease-in-out duration-150 sm:text-sm sm:leading-5"
            onClick={onClose}
          >
            Close
          </button>
        </div>
      }
    />