You're Invited:Meet the Socket Team at BlackHat and DEF CON in Las Vegas, Aug 7-8.RSVP
Socket
Socket
Sign inDemoInstall

solid-presence

Package Overview
Dependencies
2
Maintainers
1
Versions
8
Alerts
File Explorer

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

solid-presence

SolidJS utility that manages the presence of an element in the DOM while being aware of pending animations.


Version published
Maintainers
1
Created

Readme

Source
Solid Presence

SolidJS utility that manages the presence of an element in the DOM while being aware of pending animations.

Usage

The utility returns a boolean called present which indicates if the element should be present in the DOM or not.

The state variable can be used to get the current state of the presence. Valid states are present, hiding or hidden.

import createPresence from 'solid-presence'
const DialogContent: Component<{
  open?: boolean
}> = (props) => {
  const [dialogRef, setDialogRef] = createSignal<HTMLElement | null>(null)

  const { present } = createPresence({
    show: () => props.open,
    element: dialogRef,
  })

  return (
    <Show when={present()}>
      <div ref={setDialogRef}>Dialog</div>
    </Show>
  )
}

Further Reading

This utility is from the maintainers of corvu, a collection of unstyled, accessible and customizable UI primitives for SolidJS. It is also documented in the corvu docs under Presence.

Keywords

FAQs

Package last updated on 19 Jun 2024

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc