1.1.0 • Published 2 months ago

@react-sandbox/heart v1.1.0

Weekly downloads
-
License
MIT
Repository
github
Last release
2 months ago

Usage

Install

Install the @react-sandbox/heart package:

npm install @react-sandbox/heart

Import

Import the Heart component:

import React, { useState } from 'react'
import Heart from '@react-sandbox/heart'

function App() {
  const [active, setActive] = useState(false)

  return (
    <div>
      <Heart
        width={24}
        height={24}
        active={active}
        onClick={() => setActive(!active)}
      />
    </div>
  )
}

Props

PropTypeDefaultDescription
widthnumberrequiredHeart width
heightnumberrequiredHeart height
activebooleanrequiredHeart fill & animation
onClickfunctionrequiredClick callback function
activeColorstring'#ff0000'Active color
inactiveColorstring'#121212'Inactive color
strokeWidthnumber30Outline stroke width
disabledbooleanfalseDisable usage
ariaLabelstring'Like'Accessibility label
classNamestring-CSS classes
styleReact.CSSProperties-CSS styles

Development

Local

pnpm install
pnpm dev

Tests

pnpm test

Example

Inside test/:

pnpm install
pnpm dev

License

MIT

1.1.0

2 months ago

1.0.0

8 months ago