Component <SlideModal />

Props

Props	Type	Meaning	Possible values
horizontalPosition	string	Change modal horizontal position on the screen	left / right
maxWidth	string / number	Change modal max width	from 0 to any number or string with units
fullWidth	boolean	Set modal width to full width but limited by maxWidth prop	true / false
isOpen	boolean	Set modal status	true / false
handleClose	function	Actions, after modal x-mark was clicked	() => void

---

Positions

const SlideModalPosition = ({ horizontalPosition }) => {
  const [isModal, setModal] = useState(false)

  return (
    <>
      <button onClick={() => setModal(true)}>Modal {horizontalPosition}</button>

      <SlideModal
        horizontalPosition={horizontalPosition}
        isOpen={isModal}
        handleClose={() => setModal(false)}
      >
        Hello my dear friend!
      </SlideModal>
    </>
  )
}

---

Sizes

const SlideModalSize = ({ maxWidth }) => {
  const [isModal, setModal] = useState(false)

  return (
    <>
      <button onClick={() => setModal(true)}>{maxWidth} width modal</button>

      <SlideModal
        maxWidth={maxWidth}
        isOpen={isModal}
        handleClose={() => setModal(false)}
        fullWidth
      >
        Hello my dear friend!
      </SlideModal>
    </>
  )
}