Security News
Highlights from the 2024 Rails Community Survey
A record 2,709 developers participated in the 2024 Ruby on Rails Community Survey, revealing key tools, practices, and trends shaping the Rails ecosystem.
react-laag
Advanced tools
Visit the website for more examples and docs [here](https://www.react-laag.com).
Primitives to build things like tooltips, dropdown menu's and pop-overs.
Basically any kind of layer that can be toggled. Focus on what your layer should look like, and let react-laag take care of where and when to show it.
Visit the website for more examples and docs here.
npm install --save react-laag
or
yarn add react-laag
import React from "react";
import { ToggleLayer, anchor } from "react-laag";
function Example() {
return (
<ToggleLayer
// provide placement config
placement={{ anchor: anchor.BOTTOM_CENTER }}
// render-prop to render our layer
renderLayer={({ layerProps, isOpen }) =>
// only render on `isOpen`
isOpen && (
<div
// for calculation stuff
ref={layerProps.ref}
style={{
// inject calculated positional styles
...layerProps.style
// add your own styles
}}
/>
)
}
>
{({ toggle, triggerRef }) => (
<div
// only the `triggerRef` is required...
ref={triggerRef}
// ...the rest is up to you
onClick={toggle}
style={{}}
/>
)}
</ToggleLayer>
);
}
...or use the hook:
import React from "react";
import { useToggleLayer, anchor } from "react-laag";
function Example() {
const [element, toggleLayerProps] = useToggleLayer(
// render the layer
({ layerProps, isOpen }) => isOpen && <div {...layerProps} />,
// provide some options, like placement
{ placement: { anchor: anchor.BOTTOM_CENTER } }
);
return (
<div>
{element}
<div onClick={toggleLayerProps.openFromMouseEvent}>Click me!</div>
</div>
);
}
MIT © everweij
FAQs
Unknown package
The npm package react-laag receives a total of 46,453 weekly downloads. As such, react-laag popularity was classified as popular.
We found that react-laag demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
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.
Security News
A record 2,709 developers participated in the 2024 Ruby on Rails Community Survey, revealing key tools, practices, and trends shaping the Rails ecosystem.
Security News
In 2023, data breaches surged 78% from zero-day and supply chain attacks, but developers are still buried under alerts that are unable to prevent these threats.
Security News
Solo open source maintainers face burnout and security challenges, with 60% unpaid and 60% considering quitting.