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

fix: Checkbox in Tree should align self start with text #44827

Merged
merged 1 commit into from Sep 13, 2023
Merged

fix: Checkbox in Tree should align self start with text #44827

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
320 changes: 320 additions & 0 deletions components/tree/__tests__/__snapshots__/demo-extend.test.ts.snap
View file
Open in desktop
Expand Up @@ -3889,6 +3889,326 @@ exports[`renders components/tree/demo/line.tsx extend context correctly 1`] = `

exports[`renders components/tree/demo/line.tsx extend context correctly 2`] = `[]`;

exports[`renders components/tree/demo/multiple-line.tsx extend context correctly 1`] = `
<div
class="ant-tree ant-tree-icon-hide"
role="tree"
>
<div>
<input
aria-label="for screen reader"
style="width: 0px; height: 0px; display: flex; overflow: hidden; opacity: 0; border: 0px; padding: 0px; margin: 0px;"
tabindex="0"
value=""
/>
</div>
<div
aria-hidden="true"
class="ant-tree-treenode"
style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden; border: 0px; padding: 0px;"
>
<div
class="ant-tree-indent"
>
<div
class="ant-tree-indent-unit"
/>
</div>
</div>
<div
class="ant-tree-list"
style="width: 200px; position: relative;"
>
<div
class="ant-tree-list-holder"
>
<div>
<div
class="ant-tree-list-holder-inner"
style="display: flex; flex-direction: column;"
>
<div
aria-grabbed="false"
class="ant-tree-treenode ant-tree-treenode-switcher-open ant-tree-treenode-checkbox-checked ant-tree-treenode-leaf-last"
draggable="false"
>
<span
aria-hidden="true"
class="ant-tree-indent"
/>
<span
class="ant-tree-switcher ant-tree-switcher_open"
>
<span
aria-label="caret-down"
class="anticon anticon-caret-down ant-tree-switcher-icon"
role="img"
>
<svg
aria-hidden="true"
data-icon="caret-down"
fill="currentColor"
focusable="false"
height="1em"
viewBox="0 0 1024 1024"
width="1em"
>
<path
d="M840.4 300H183.6c-19.7 0-30.7 20.8-18.5 35l328.4 380.8c9.4 10.9 27.5 10.9 37 0L858.9 335c12.2-14.2 1.2-35-18.5-35z"
/>
</svg>
</span>
</span>
<span
class="ant-tree-checkbox ant-tree-checkbox-checked"
>
<span
class="ant-tree-checkbox-inner"
/>
</span>
<span
class="ant-tree-node-content-wrapper ant-tree-node-content-wrapper-open"
title="parent 1"
>
<span
class="ant-tree-title"
>
parent 1
</span>
</span>
</div>
<div
aria-grabbed="false"
class="ant-tree-treenode ant-tree-treenode-disabled ant-tree-treenode-switcher-open ant-tree-treenode-checkbox-checked ant-tree-treenode-selected"
draggable="false"
>
<span
aria-hidden="true"
class="ant-tree-indent"
>
<span
class="ant-tree-indent-unit ant-tree-indent-unit-start ant-tree-indent-unit-end"
/>
</span>
<span
class="ant-tree-switcher ant-tree-switcher_open"
>
<span
aria-label="caret-down"
class="anticon anticon-caret-down ant-tree-switcher-icon"
role="img"
>
<svg
aria-hidden="true"
data-icon="caret-down"
fill="currentColor"
focusable="false"
height="1em"
viewBox="0 0 1024 1024"
width="1em"
>
<path
d="M840.4 300H183.6c-19.7 0-30.7 20.8-18.5 35l328.4 380.8c9.4 10.9 27.5 10.9 37 0L858.9 335c12.2-14.2 1.2-35-18.5-35z"
/>
</svg>
</span>
</span>
<span
class="ant-tree-checkbox ant-tree-checkbox-checked ant-tree-checkbox-disabled"
>
<span
class="ant-tree-checkbox-inner"
/>
</span>
<span
class="ant-tree-node-content-wrapper ant-tree-node-content-wrapper-open"
title="parent 1-0"
>
<span
class="ant-tree-title"
>
parent 1-0
</span>
</span>
</div>
<div
aria-grabbed="false"
class="ant-tree-treenode ant-tree-treenode-switcher-close"
draggable="false"
>
<span
aria-hidden="true"
class="ant-tree-indent"
>
<span
class="ant-tree-indent-unit ant-tree-indent-unit-start ant-tree-indent-unit-end"
/>
<span
class="ant-tree-indent-unit ant-tree-indent-unit-start"
/>
</span>
<span
class="ant-tree-switcher ant-tree-switcher-noop"
/>
<span
class="ant-tree-checkbox ant-tree-checkbox-disabled"
>
<span
class="ant-tree-checkbox-inner"
/>
</span>
<span
class="ant-tree-node-content-wrapper ant-tree-node-content-wrapper-normal"
title="This is a very very very very long text"
>
<span
class="ant-tree-title"
>
This is a very very very very long text
</span>
</span>
</div>
<div
aria-grabbed="false"
class="ant-tree-treenode ant-tree-treenode-switcher-close ant-tree-treenode-leaf-last"
draggable="false"
>
<span
aria-hidden="true"
class="ant-tree-indent"
>
<span
class="ant-tree-indent-unit ant-tree-indent-unit-start ant-tree-indent-unit-end"
/>
<span
class="ant-tree-indent-unit ant-tree-indent-unit-start"
/>
</span>
<span
class="ant-tree-switcher ant-tree-switcher-noop"
/>
<span
class="ant-tree-checkbox"
>
<span
class="ant-tree-checkbox-inner"
/>
</span>
<span
class="ant-tree-node-content-wrapper ant-tree-node-content-wrapper-normal"
title="This is also a very very very very very long text"
>
<span
class="ant-tree-title"
>
This is also a very very very very very long text
</span>
</span>
</div>
<div
aria-grabbed="false"
class="ant-tree-treenode ant-tree-treenode-switcher-open ant-tree-treenode-checkbox-checked ant-tree-treenode-leaf-last"
draggable="false"
>
<span
aria-hidden="true"
class="ant-tree-indent"
>
<span
class="ant-tree-indent-unit ant-tree-indent-unit-start ant-tree-indent-unit-end"
/>
</span>
<span
class="ant-tree-switcher ant-tree-switcher_open"
>
<span
aria-label="caret-down"
class="anticon anticon-caret-down ant-tree-switcher-icon"
role="img"
>
<svg
aria-hidden="true"
data-icon="caret-down"
fill="currentColor"
focusable="false"
height="1em"
viewBox="0 0 1024 1024"
width="1em"
>
<path
d="M840.4 300H183.6c-19.7 0-30.7 20.8-18.5 35l328.4 380.8c9.4 10.9 27.5 10.9 37 0L858.9 335c12.2-14.2 1.2-35-18.5-35z"
/>
</svg>
</span>
</span>
<span
class="ant-tree-checkbox ant-tree-checkbox-checked"
>
<span
class="ant-tree-checkbox-inner"
/>
</span>
<span
class="ant-tree-node-content-wrapper ant-tree-node-content-wrapper-open"
title="parent 1-1"
>
<span
class="ant-tree-title"
>
parent 1-1
</span>
</span>
</div>
<div
aria-grabbed="false"
class="ant-tree-treenode ant-tree-treenode-switcher-close ant-tree-treenode-checkbox-checked ant-tree-treenode-leaf-last"
draggable="false"
>
<span
aria-hidden="true"
class="ant-tree-indent"
>
<span
class="ant-tree-indent-unit ant-tree-indent-unit-start ant-tree-indent-unit-end"
/>
<span
class="ant-tree-indent-unit ant-tree-indent-unit-end"
/>
</span>
<span
class="ant-tree-switcher ant-tree-switcher-noop"
/>
<span
class="ant-tree-checkbox ant-tree-checkbox-checked"
>
<span
class="ant-tree-checkbox-inner"
/>
</span>
<span
class="ant-tree-node-content-wrapper ant-tree-node-content-wrapper-normal"
title=""
>
<span
class="ant-tree-title"
>
<span
style="color: rgb(22, 119, 255);"
>
sss
</span>
</span>
</span>
</div>
</div>
</div>
</div>
</div>
</div>
`;

exports[`renders components/tree/demo/multiple-line.tsx extend context correctly 2`] = `[]`;

exports[`renders components/tree/demo/search.tsx extend context correctly 1`] = `
<div>
<span
Expand Down