How to use the docz.usePrevious function in docz

To help you get started, we’ve selected a few docz examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github doczjs / docz / core / docz-theme-default / src / components / shared / Sidebar / index.tsx View on Github external
export const Sidebar: SFC = () => {
  const [hidden, setHidden] = useState(true)
  const [query, setQuery] = useState('')
  const menus = useMenus({ query })
  const windowSize = useWindowSize()
  const isDesktop = windowSize.innerWidth >= breakpoints.desktop
  const prevIsDesktop = usePrevious(isDesktop)

  useEffect(() => {
    if (!hidden && !prevIsDesktop && isDesktop) {
      setHidden(true)
      document.documentElement!.classList.remove('with-overlay')
    }
  })

  const addOverlayClass = (isHidden: boolean) => {
    const method = !isHidden ? 'add' : 'remove'

    if (typeof window !== 'undefined' && !isDesktop) {
      document.documentElement!.classList[method]('with-overlay')
    }
  }
github doczjs / docz / core / docz-theme-default / src / components / shared / Sidebar / MenuLink.tsx View on Github external
({ item, children, onClick, onActiveChange }, ref) => {
    const { linkComponent } = useConfig()
    const [active, setActive] = useState(false)
    const prevActive = usePrevious(active)
    const $el = useRef(ref)
    const Link = useMemo(() => createLink(linkComponent!), [linkComponent])

    const linkProps = {
      children,
      onClick,
    }

    useEffect(() => {
      const isActive = getActiveFromClass($el.current, item.route)
      if (prevActive !== isActive) {
        setActive(isActive)
        $el && checkActiveClass($el.current, isActive)
        onActiveChange && onActiveChange(isActive)
      }
    })

docz

It's has never been so easy to documents your things!

MIT
Latest version published 3 years ago

Package Health Score

59 / 100
Full package analysis