@clds/trim-slider
This is trimmer component, it was designed to trim video files
Installation
Install the package using Yarn:
yarn add @cld/trim-sliderUsage
import TrimSlider from '@cld/trim-slider';
const MyComponent = () => {
return <TrimSlider />;
};Props
| Name | Required | Type | Default | Description |
|---|---|---|---|---|
| min | No | number | 0 | The minimum value of the slider |
| max | No | number | 100 | The maximum value of the slider |
| step | No | number | 1 | Value to be added or subtracted on each step the slider makes. Must be greater than zero. max - min should be evenly divisible by the step value |
| value | No | [number, number] | [min, max] | An array with 2 numbers, the first value will determine the left handle and the second value will determine the right handle |
| showTooltip | No | boolean | true | Should a tooltip appear above the handles when dragging it |
| disabled | No | boolean | false | Indicates if the slider is disabled |
| tooltipValueRenderer | No | function | (value) => value | This allows you to control the value that will be presented inside the tooltip |
| onChange | No | function | - | Callback called on every value change. The function will be called with two arguments, the new value(s) and the side that was changed, available values are left, right, both. |
| onSlideStart | No | function | - | Callback called on mouse down. The function will be called without any arguments |
| onSlideEnd | No | function | - | Callback called on mouse up. The function will be called without any arguments |
Versioning
This library follows Semantic Versioning.
License
See LICENSE