react-component / react-component/slider

Examples for custom handle and track style are misleading

Open
#727 0 comments 3 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
TypeScript
Stars
3.1k
Forks
768
Avg merge
11d 22h
Merged PRs (30d)
5

Description

Hello 👋 ,
I really like the new docs, it's much more convenient than previous one.

Just noticed, that in slider examples the same implementation marked as old api, will be deprecated and The recommended new api at the same time.

https://slider.react-component.now.sh/demo/slider#slider

<div style={style}>
  <p>
    Slider with custom handle and track style.<strong>(old api, will be deprecated)</strong>
  </p>
  <Slider
    defaultValue={30}
    railStyle={{ backgroundColor: 'red', height: 10 }}
    trackStyle={{ backgroundColor: 'blue', height: 10 }}
    handleStyle={{
      borderColor: 'blue',
      height: 28,
      width: 28,
      marginLeft: -14,
      marginTop: -9,
      backgroundColor: 'black',
    }}
  />
</div>
<div style={style}>
  <p>
    Slider with custom handle and track style.<strong>(The recommended new api)</strong>
  </p>
  <Slider
    defaultValue={30}
    trackStyle={{ backgroundColor: 'blue', height: 10 }}
    handleStyle={{
      borderColor: 'blue',
      height: 28,
      width: 28,
      marginLeft: -14,
      marginTop: -9,
      backgroundColor: 'black',
    }}
    railStyle={{ backgroundColor: 'red', height: 10 }}
  />
</div>

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Open the linked slider demo and inspect the custom handle and track style examples shown in the issue. Compare their labels and prop implementations; done means the examples no longer present the same implementation as both deprecated and recommended.

Written by the indexing model from the issue text.

Assessment

Tech stack
react, typescript
Domain
documentation
Issue type
Documentation
Difficulty
1/5
Estimated time
Under an hour
Activity status
Stale
Clarity
Clearly specified
Newbie friendliness
38/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.