Skip to content
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

Jump to bottom

✨ feat: migrate less to token for Slider #42428

Merged
merged 34 commits into from Jun 15, 2023
Merged

✨ feat: migrate less to token for Slider #42428

Show file tree
Hide file tree
Changes from 28 commits
Commits
Show all changes
34 commits
Select commit Hold shift + click to select a range
8d54233
✨ feat: migrate less to token for Slider
heiyu4585 May 17, 2023
a74e0b2
✨ feat: update snap
heiyu4585 May 23, 2023
b5504d0
✨ feat: update style
heiyu4585 May 24, 2023
01779b4
✨ feat: update style
heiyu4585 May 24, 2023
f00f9b5
✨ feat: test ci
heiyu4585 May 25, 2023
eef37ae
✨ feat: test ci
heiyu4585 May 25, 2023
7c46605
✨ feat: test ci
heiyu4585 May 25, 2023
219f596
✨ feat: test ci
heiyu4585 May 25, 2023
aea900a
✨ feat: update
heiyu4585 May 26, 2023
a854e0d
✨ feat: update snap
heiyu4585 May 26, 2023
0e00031
✨ feat: update
heiyu4585 May 30, 2023
4fea4f1
✨ feat: update
heiyu4585 May 30, 2023
9ccd28e
✨ feat: 删除未使用token
heiyu4585 May 30, 2023
18cdb08
✨ feat: update doc
heiyu4585 May 30, 2023
5ee21cd
✨ feat: update dome
heiyu4585 May 30, 2023
50c869e
✨ feat: update
heiyu4585 Jun 6, 2023
3e86495
✨ feat: test ci
heiyu4585 Jun 6, 2023
66aefac
📝 doc: update doc
heiyu4585 Jun 6, 2023
db1919e
✨ feat: update
heiyu4585 Jun 6, 2023
88c4343
✨ feat: update
heiyu4585 Jun 6, 2023
c5156fb
✨ feat: update
heiyu4585 Jun 6, 2023
95f7b34
✨ feat: update
heiyu4585 Jun 6, 2023
9e6ce37
✨ feat: add demo
heiyu4585 Jun 6, 2023
8cbf9c2
✨ feat: add demo
heiyu4585 Jun 6, 2023
29b31c1
✨ feat: update for reviewer
heiyu4585 Jun 14, 2023
dedc30b
✨ feat: update for reviewer
heiyu4585 Jun 14, 2023
629ea6d
Merge branch 'Slider-token' of https://github.com/heiyu4585/ant-desig…
heiyu4585 Jun 14, 2023
045cae5
✨ feat: update for reviewer
heiyu4585 Jun 14, 2023
40fc62d
✨ feat: update for reviewer
heiyu4585 Jun 14, 2023
02ce5f2
✨ feat: update for reviewer
heiyu4585 Jun 14, 2023
6e3820c
✨ feat: update for reviewer
heiyu4585 Jun 14, 2023
a444f2c
✨ feat: update for reviewer
heiyu4585 Jun 15, 2023
0b74e79
✨ feat: update for reviewer
heiyu4585 Jun 15, 2023
40c4878
Apply suggestions from code review
MadCcc Jun 15, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
365 changes: 365 additions & 0 deletions components/slider/__tests__/__snapshots__/demo-extend.test.ts.snap
View file
Open in desktop
Expand Up @@ -141,6 +141,371 @@ Array [
]
`;

exports[`renders components/slider/demo/component-token.tsx extend context correctly 1`] = `
Array [
<div
class="ant-slider ant-slider-disabled ant-slider-horizontal"
>
<div
class="ant-slider-rail"
/>
<div
class="ant-slider-track"
style="left: 0%; width: 30%;"
/>
<div
class="ant-slider-step"
/>
<div
aria-disabled="true"
aria-valuemax="100"
aria-valuemin="0"
aria-valuenow="30"
class="ant-slider-handle"
role="slider"
style="left: 30%; transform: translateX(-50%);"
/>
<div
class="ant-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast ant-slider-tooltip ant-tooltip-placement-top"
style="--arrow-x: 0px; --arrow-y: 0px; left: -1000vw; top: -1000vh; box-sizing: border-box;"
>
<div
class="ant-tooltip-arrow"
style="position: absolute; bottom: 0px; left: 0px;"
/>
<div
class="ant-tooltip-content"
>
<div
class="ant-tooltip-inner"
role="tooltip"
>
30
</div>
</div>
</div>
</div>,
<div
class="ant-slider ant-slider-horizontal"
>
<div
class="ant-slider-rail"
/>
<div
class="ant-slider-track ant-slider-track-1"
style="left: 20%; width: 30%;"
/>
<div
class="ant-slider-step"
/>
<div
aria-disabled="false"
aria-valuemax="100"
aria-valuemin="0"
aria-valuenow="20"
class="ant-slider-handle ant-slider-handle-1"
role="slider"
style="left: 20%; transform: translateX(-50%);"
tabindex="0"
/>
<div
class="ant-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast ant-slider-tooltip ant-tooltip-placement-top"
style="--arrow-x: 0px; --arrow-y: 0px; left: -1000vw; top: -1000vh; box-sizing: border-box;"
>
<div
class="ant-tooltip-arrow"
style="position: absolute; bottom: 0px; left: 0px;"
/>
<div
class="ant-tooltip-content"
>
<div
class="ant-tooltip-inner"
role="tooltip"
>
20
</div>
</div>
</div>
<div
aria-disabled="false"
aria-valuemax="100"
aria-valuemin="0"
aria-valuenow="50"
class="ant-slider-handle ant-slider-handle-2"
role="slider"
style="left: 50%; transform: translateX(-50%);"
tabindex="0"
/>
<div
class="ant-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast ant-slider-tooltip ant-tooltip-placement-top"
style="--arrow-x: 0px; --arrow-y: 0px; left: -1000vw; top: -1000vh; box-sizing: border-box;"
>
<div
class="ant-tooltip-arrow"
style="position: absolute; bottom: 0px; left: 0px;"
/>
<div
class="ant-tooltip-content"
>
<div
class="ant-tooltip-inner"
role="tooltip"
>
50
</div>
</div>
</div>
</div>,
<div
style="display: inline-block; height: 300px; margin-left: 70px;"
>
<div
class="ant-slider ant-slider-vertical"
>
<div
class="ant-slider-rail"
/>
<div
class="ant-slider-track"
style="bottom: 0%; height: 30%;"
/>
<div
class="ant-slider-step"
/>
<div
aria-disabled="false"
aria-valuemax="100"
aria-valuemin="0"
aria-valuenow="30"
class="ant-slider-handle"
role="slider"
style="bottom: 30%; transform: translateY(50%);"
tabindex="0"
/>
<div
class="ant-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast ant-slider-tooltip ant-tooltip-placement-right"
style="--arrow-x: 0px; --arrow-y: 0px; left: -1000vw; top: -1000vh; box-sizing: border-box;"
>
<div
class="ant-tooltip-arrow"
style="position: absolute; top: 0px; left: 0px;"
/>
<div
class="ant-tooltip-content"
>
<div
class="ant-tooltip-inner"
role="tooltip"
>
30
</div>
</div>
</div>
</div>
</div>,
<div
style="display: inline-block; height: 300px; margin-left: 70px;"
>
<div
class="ant-slider ant-slider-vertical"
>
<div
class="ant-slider-rail"
/>
<div
class="ant-slider-track ant-slider-track-1"
style="bottom: 20%; height: 30%;"
/>
<div
class="ant-slider-step"
/>
<div
aria-disabled="false"
aria-valuemax="100"
aria-valuemin="0"
aria-valuenow="20"
class="ant-slider-handle ant-slider-handle-1"
role="slider"
style="bottom: 20%; transform: translateY(50%);"
tabindex="0"
/>
<div
class="ant-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast ant-slider-tooltip ant-tooltip-placement-right"
style="--arrow-x: 0px; --arrow-y: 0px; left: -1000vw; top: -1000vh; box-sizing: border-box;"
>
<div
class="ant-tooltip-arrow"
style="position: absolute; top: 0px; left: 0px;"
/>
<div
class="ant-tooltip-content"
>
<div
class="ant-tooltip-inner"
role="tooltip"
>
20
</div>
</div>
</div>
<div
aria-disabled="false"
aria-valuemax="100"
aria-valuemin="0"
aria-valuenow="50"
class="ant-slider-handle ant-slider-handle-2"
role="slider"
style="bottom: 50%; transform: translateY(50%);"
tabindex="0"
/>
<div
class="ant-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast ant-slider-tooltip ant-tooltip-placement-right"
style="--arrow-x: 0px; --arrow-y: 0px; left: -1000vw; top: -1000vh; box-sizing: border-box;"
>
<div
class="ant-tooltip-arrow"
style="position: absolute; top: 0px; left: 0px;"
/>
<div
class="ant-tooltip-content"
>
<div
class="ant-tooltip-inner"
role="tooltip"
>
50
</div>
</div>
</div>
</div>
</div>,
<div
style="display: inline-block; height: 300px; margin-left: 70px;"
>
<div
class="ant-slider ant-slider-vertical ant-slider-with-marks"
>
<div
class="ant-slider-rail"
/>
<div
class="ant-slider-track ant-slider-track-1"
style="bottom: 26%; height: 11%;"
/>
<div
class="ant-slider-step"
>
<span
class="ant-slider-dot"
style="bottom: 0%; transform: translateY(50%);"
/>
<span
class="ant-slider-dot ant-slider-dot-active"
style="bottom: 26%; transform: translateY(50%);"
/>
<span
class="ant-slider-dot ant-slider-dot-active"
style="bottom: 37%; transform: translateY(50%);"
/>
<span
class="ant-slider-dot"
style="bottom: 100%; transform: translateY(50%);"
/>
</div>
<div
aria-disabled="false"
aria-valuemax="100"
aria-valuemin="0"
aria-valuenow="26"
class="ant-slider-handle ant-slider-handle-1"
role="slider"
style="bottom: 26%; transform: translateY(50%);"
tabindex="0"
/>
<div
class="ant-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast ant-slider-tooltip ant-tooltip-placement-right"
style="--arrow-x: 0px; --arrow-y: 0px; left: -1000vw; top: -1000vh; box-sizing: border-box;"
>
<div
class="ant-tooltip-arrow"
style="position: absolute; top: 0px; left: 0px;"
/>
<div
class="ant-tooltip-content"
>
<div
class="ant-tooltip-inner"
role="tooltip"
>
26
</div>
</div>
</div>
<div
aria-disabled="false"
aria-valuemax="100"
aria-valuemin="0"
aria-valuenow="37"
class="ant-slider-handle ant-slider-handle-2"
role="slider"
style="bottom: 37%; transform: translateY(50%);"
tabindex="0"
/>
<div
class="ant-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast ant-slider-tooltip ant-tooltip-placement-right"
style="--arrow-x: 0px; --arrow-y: 0px; left: -1000vw; top: -1000vh; box-sizing: border-box;"
>
<div
class="ant-tooltip-arrow"
style="position: absolute; top: 0px; left: 0px;"
/>
<div
class="ant-tooltip-content"
>
<div
class="ant-tooltip-inner"
role="tooltip"
>
37
</div>
</div>
</div>
<div
class="ant-slider-mark"
>
<span
class="ant-slider-mark-text"
style="bottom: 0%; transform: translateY(50%);"
>
0°C
</span>
<span
class="ant-slider-mark-text ant-slider-mark-text-active"
style="bottom: 26%; transform: translateY(50%);"
>
26°C
</span>
<span
class="ant-slider-mark-text ant-slider-mark-text-active"
style="bottom: 37%; transform: translateY(50%);"
>
37°C
</span>
<span
class="ant-slider-mark-text"
style="bottom: 100%; transform: translateY(50%); color: rgb(255, 85, 0);"
>
<strong>
100°C
</strong>
</span>
</div>
</div>
</div>,
]
`;

exports[`renders components/slider/demo/draggableTrack.tsx extend context correctly 1`] = `
<div
class="ant-slider ant-slider-horizontal"
Expand Down