Skip to content

Release 4.0.0-1

Pre-release
Pre-release

Choose a tag to compare

@nerdyman nerdyman released this 30 Jan 20:15
· 47 commits to main since this release
npm i react-compare-slider@beta
pnpm i react-compare-slider@beta
yarn add react-compare-slider@beta

Breaking Changes

  • both clip property has been renamed to all
  • position prop has been renamed to defaultPosition
  • useReactCompareSliderRef has been removed
    • Use custom slider or useReactCompareSliderContext detailed below instead
  • Handle now uses the --rcs-handle-color CSS variable to set the default handle colour, previously it used the color inline style
  • Components are no longer wrapped in forwardRef (ref can still be passed as a prop on React 19)

Features

  • Moves props to context so child components can pick up all internal properties used by the slider #180
  • Exposes internal props to children via the useReactCompareSliderContext hook #180
  • Exports individual components, allowing developers to create their own completely bespoke sliders #180
  • Exports the useReactCompareSlider hook to instantiate the custom slider component context #180
    • Allows developers to override all internal props and callbacks used by the slider, helps #158
  • Adds high contrast support to the default slider handle #175
  • Replaces the slider root element button with a div to improve a11y standards #156
  • Uses CSS variables to calculate bounds padding and positioning instead of JS, improving performance #160
  • Exports const objects to easily access CSS variables

Fixes

  • Removes tap highlight styles from handle on iOS #161

Other

  • Upgrades to Storybook v10 using Vitest Playwright test runner
  • Improves testing of components
  • Moves server components tests from custom project in the docs folder to a Storybook server component test
  • Moves from ESLint and Prettier to Biome
  • Documents all exposed properties
  • Uses Sonar for code coverage and reporting