Slider

A slider component for selecting a value within a range.

Installation

npm install fuyukaki-ui

Usage

import { Slider } from 'fuyukaki-ui'

function App() {
  const [value, setValue] = useState(50)

  return (
    <Slider
      value={value}
      onChange={setValue}
    />
  )
}

Basic Example

Value: 50

With Value Display

Sizes

Small

Medium

Large

Custom Range

Range: 0-10, Step: 1

Disabled

Props

Prop	Type	Default
value	number	-
defaultValue	number	0
min	number	0
max	number	100
step	number	1
size	'sm' \| 'md' \| 'lg'	'md'
showValue	boolean	false
disabled	boolean	false
onChange	(value: number) => void	-
onChangeEnd	(value: number) => void	-