Skip to content

Implement Slider and RangeSlider components #1083

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 40 commits into from
Oct 6, 2020
Merged

Implement Slider and RangeSlider components #1083

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
40 commits
Select commit Hold shift + click to select a range
64f7ff2
Implement one-handle Slider as far as possible
mischnic Sep 16, 2020
ae2d0ab
Implement track background using background-* CSS
mischnic Sep 17, 2020
a352071
Clamp fillOffset, isDisabled
mischnic Sep 17, 2020
b61970e
Overwrite signDisplay if not explicitly specified
mischnic Sep 17, 2020
819bb83
Hack labelPosition side into CSS
mischnic Sep 17, 2020
eb283d3
Custom tickLabels and lint
mischnic Sep 17, 2020
ce9ff91
Fix sign, add RTL story
mischnic Sep 17, 2020
9717da1
Deduplicate `@types/react` to silence tsc errors
mischnic Sep 17, 2020
56d9913
PoC RangeSlider
mischnic Sep 17, 2020
c8092f5
Abstract into SliderBase
mischnic Sep 17, 2020
626d552
WIP: tests
mischnic Sep 18, 2020
7ccc4a3
Fix RTL keyboard events
mischnic Sep 21, 2020
43bbd43
More tests
mischnic Sep 21, 2020
ec22612
Test/Fix custom formatOptions
mischnic Sep 21, 2020
c47a0d9
Make RangeSlider actually work, especially RTL
mischnic Sep 21, 2020
dd81c83
Fixup RTL, useDrag1D keyboard listener
mischnic Sep 21, 2020
d5b2ecf
Finish up keyboard tests for Slider
mischnic Sep 21, 2020
7590416
Finish tests
mischnic Sep 22, 2020
6beeffa
Remove docs template
mischnic Sep 22, 2020
c5c3fca
Hover effect only on handles
mischnic Sep 22, 2020
6fd3cb8
Cleanup
mischnic Sep 22, 2020
c239749
Update CI to newer Node 12
mischnic Sep 22, 2020
1ad5b73
Update Spectrum CSS, do RTL properly
mischnic Sep 23, 2020
3a25719
Try to make value label constant width
mischnic Sep 23, 2020
4055429
Remove dragging cursor, active style
mischnic Sep 23, 2020
951d1bf
Remove storybook: textAlign: 'left'
mischnic Sep 23, 2020
514a64f
Polyfill for signDisplay :tada:
mischnic Sep 23, 2020
2dd62cb
Add is-dragged to handles for track clicking
mischnic Sep 24, 2020
21797b7
Switch to trackGradient, fix RTL
mischnic Sep 24, 2020
7957abc
Refactor: remove useSliderBase
mischnic Sep 24, 2020
9cfe118
Fix side label style
mischnic Sep 24, 2020
40456dd
Add missing test for readonly/disabled
mischnic Sep 24, 2020
7cad811
Remove isReadOnly from Spectrum Slider
mischnic Sep 24, 2020
af0c624
Fix constant width value label again
mischnic Sep 24, 2020
33d4452
Fixup RTL track clicking
mischnic Sep 28, 2020
0cb7d9a
Update version
mischnic Oct 1, 2020
6817761
Cleanup
mischnic Oct 2, 2020
ca4fcd7
Slider: forwardRef
mischnic Oct 2, 2020
0ce570e
stately/slider: remove isReadOnly
mischnic Oct 2, 2020
c0e4d59
Use useLocale in aria directly
mischnic Oct 2, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion .chromatic/config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ addParameters({
addDecorator(withA11y);

addDecorator(story => (
<VerticalCenter style={{textAlign: 'left', alignItems: 'center', minHeight: null, boxSizing: 'border-box', display: 'flex', justifyContent: 'center'}}>
<VerticalCenter style={{alignItems: 'center', minHeight: null, boxSizing: 'border-box', display: 'flex', justifyContent: 'center'}}>
{story()}
</VerticalCenter>
));
Expand Down
20 changes: 10 additions & 10 deletions .circleci/config.yml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ orbs:
jobs:
install:
docker:
- image: circleci/node:12.10
- image: circleci/node:12
resource_class: large

working_directory: ~/react-spectrum
Expand Down Expand Up @@ -40,7 +40,7 @@ jobs:

test:
docker:
- image: circleci/node:12.10
- image: circleci/node:12

working_directory: ~/react-spectrum
steps:
Expand All @@ -53,7 +53,7 @@ jobs:

test_17:
docker:
- image: circleci/node:12.10
- image: circleci/node:12

working_directory: ~/react-spectrum
steps:
Expand All @@ -66,7 +66,7 @@ jobs:

lint:
docker:
- image: circleci/node:12.10
- image: circleci/node:12

working_directory: ~/react-spectrum
steps:
Expand All @@ -79,7 +79,7 @@ jobs:

storybook:
docker:
- image: circleci/node:12.10
- image: circleci/node:12
resource_class: large

working_directory: ~/react-spectrum
Expand All @@ -98,7 +98,7 @@ jobs:

storybook-17:
docker:
- image: circleci/node:12.10
- image: circleci/node:12
resource_class: large

working_directory: ~/react-spectrum
Expand All @@ -117,7 +117,7 @@ jobs:

docs:
docker:
- image: circleci/node:12.10
- image: circleci/node:12
resource_class: xlarge

working_directory: ~/react-spectrum
Expand All @@ -136,7 +136,7 @@ jobs:

docs-production:
docker:
- image: circleci/node:12.10
- image: circleci/node:12
resource_class: large

working_directory: ~/react-spectrum
Expand Down Expand Up @@ -176,7 +176,7 @@ jobs:

comment:
docker:
- image: circleci/node:12.10
- image: circleci/node:12
working_directory: ~/react-spectrum
steps:
- checkout
Expand All @@ -192,7 +192,7 @@ jobs:

publish-nightly:
docker:
- image: circleci/node:12.10
- image: circleci/node:12
resource_class: xlarge
working_directory: ~/react-spectrum
steps:
Expand Down
2 changes: 1 addition & 1 deletion .storybook/config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ addParameters({
addDecorator(withA11y);

addDecorator(story => (
<VerticalCenter style={{textAlign: 'left', alignItems: 'center', minHeight: '100vh', boxSizing: 'border-box', display: 'flex', justifyContent: 'center'}}>
<VerticalCenter style={{alignItems: 'center', minHeight: '100vh', boxSizing: 'border-box', display: 'flex', justifyContent: 'center'}}>
{story()}
</VerticalCenter>
));
Expand Down
2 changes: 1 addition & 1 deletion package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -82,7 +82,7 @@
"@testing-library/react": "^10.4.9",
"@testing-library/react-hooks": "^3.4.1",
"@testing-library/user-event": "^12.1.3",
"@types/react": "16.9.23",
"@types/react": "^16.9.23",
"@types/storybook__react": "^4.0.1",
"@typescript-eslint/eslint-plugin": "^2.28.0",
"@typescript-eslint/parser": "^2.28.0",
Expand Down
Loading