Docs
gentleduck libs

gentleduck libs

A collection of tiny, framework-agnostic React libs. Each hook lives in its own folder and can be imported individually or all together.

Installation

npm install @gentleduck/libs
npm install @gentleduck/libs

Available Hooks

  • cn – Utility for conditional className merging.
  • filtered-object – Create a new object with only selected keys or values.
  • group-array – Group array items by a given key or function.
  • group-data-by-numbers – Group numbers into ranges or buckets.
  • parse-date – Parse strings or values into valid Date objects.
  • index.ts – Barrel file that re-exports utilities.

Usage

import { useDebounce } from '@gentleduck/libs'
 
function SearchInput() {
  const [value, setValue] = useState('')
  const debounced = useDebounce(value, 300)
 
  useEffect(() => {
    // trigger API search with `debounced`
  }, [debounced])
 
  return <input value={value} onChange={e => setValue(e.target.value)} />
}
import { useDebounce } from '@gentleduck/libs'
 
function SearchInput() {
  const [value, setValue] = useState('')
  const debounced = useDebounce(value, 300)
 
  useEffect(() => {
    // trigger API search with `debounced`
  }, [debounced])
 
  return <input value={value} onChange={e => setValue(e.target.value)} />
}