@botonic/react 0.20.1-alpha.1 → 0.20.1

package/src/webchat/components/portal-modal/index.js

@@ -1,5 +0,0 @@
-export * from './backdrop'
-export * from './constants'
-export * from './content'
-export * from './portal'
-export * from './portal-modal-component'

package/src/webchat/components/portal-modal/portal-modal-component.jsx

@@ -1,72 +0,0 @@
-import React, { useEffect, useRef, useState } from 'react'
-
-import { Backdrop } from './backdrop'
-import {
-  MODAL_ACTIVE_CLASSNAME,
-  MODAL_CONTENT_CLASSNAME,
-  MODAL_PORTAL_CLASS_NAME,
-} from './constants'
-import { ModalContent } from './content'
-import { Portal } from './portal'
-
-const ESCAPE_KEY_CODE = 27
-
-export function PortalModalComponent({
-  open,
-  onClose,
-  locked,
-  children,
-  customContent,
-}) {
-  const [active, setActive] = useState(false)
-
-  const backdrop = useRef(null)
-
-  useEffect(() => {
-    const { current } = backdrop
-    const transitionEnd = () => setActive(open)
-    const keyHandler = e =>
-      !locked && [ESCAPE_KEY_CODE].indexOf(e.which) >= 0 && onClose()
-    const clickHandler = e => !locked && e.target === current && onClose()
-
-    if (current) {
-      current.addEventListener('transitionend', transitionEnd)
-      current.addEventListener('click', clickHandler)
-      window.addEventListener('keyup', keyHandler)
-    }
-
-    if (open) {
-      window.setTimeout(() => {
-        document.activeElement.blur()
-        setActive(open)
-      }, 10)
-    }
-
-    return () => {
-      if (current) {
-        current.removeEventListener('transitionend', transitionEnd)
-        current.removeEventListener('click', clickHandler)
-      }
-      window.removeEventListener('keyup', keyHandler)
-    }
-  }, [open, locked, onClose])
-
-  return (
-    (open || active) && (
-      <Portal className={MODAL_PORTAL_CLASS_NAME}>
-        <Backdrop
-          ref={backdrop}
-          className={active && open && MODAL_ACTIVE_CLASSNAME}
-        >
-          {customContent ? (
-            customContent
-          ) : (
-            <ModalContent className={MODAL_CONTENT_CLASSNAME}>
-              {children}
-            </ModalContent>
-          )}
-        </Backdrop>
-      </Portal>
-    )
-  )
-}

package/src/webchat/components/portal-modal/portal.jsx

@@ -1,21 +0,0 @@
-import { useEffect, useMemo } from 'react'
-import { createPortal } from 'react-dom'
-
-import { BOTONIC_PORTAL_CLASS_LIST_NAME } from './constants'
-
-export function Portal({ children, parent, className }) {
-  const element = useMemo(() => document.createElement('div'), [])
-
-  useEffect(() => {
-    const target = parent && parent.appendChild ? parent : document.body
-    const classList = [BOTONIC_PORTAL_CLASS_LIST_NAME]
-
-    if (className) className.split(' ').forEach(item => classList.push(item))
-    classList.forEach(item => element.classList.add(item))
-    target.appendChild(element)
-
-    return () => target.removeChild(element)
-  }, [element, parent, className])
-
-  return createPortal(children, element)
-}