solid-trigger

Solid Trigger Component

Install

Usage

Include the default styling and then:

import { render } from "solid-js/web";
import Trigger from "solid-trigger";

function HelloWorld() {
  return <div>Hello World!</div>;
}

function Button() {
  return <div>button</div>;
}

render(
  () => (
    <Trigger popup={<HelloWorld />}>
      <Button />
    </Trigger>
  ),
  document.getElementById("app")
);

API

props

name	type	default	description
open	Boolean		whether popup is open
defaultOpen	Boolean		whether popup is open initially
disabled	Boolean	false	Whether to disable
popup	JSX.Element		popup content
placement	string		popup position
showArrow	Boolean	false	whether arrow is open
offset	number	12	offset of the popup
class	string
style	JSX.CSSProperties
trigger	enum	hover	How should the popup be triggered (to show)
strategy	enum	fixed
mouseEnterDelay	number	100	Delay in seconds, before popup is shown on mouse enter
mouseLeaveDelay	number	100	Delay in seconds, before tooltip is hidden on mouse leave
onOpenChange	Function		Callback executed when visibility of the popup is changed
background	string		Background color of popup
transition	Object		Pop-up animation effect
zIndex	number		popup's zIndex

License

solid-trigger is released under the MIT license.