Skip to content

Commit

Permalink
demo: Table drag handle use useContext (#48588)
Browse files Browse the repository at this point in the history
  • Loading branch information
@linxianxi
linxianxi committed Apr 24, 2024
1 parent b9d90f8 commit 11a160c
Show file tree
Hide file tree
Showing 6 changed files with 230 additions and 141 deletions.
147 changes: 91 additions & 56 deletions components/table/__tests__/__snapshots__/demo-extend.test.ts.snap
View file
Expand Up @@ -4363,13 +4363,18 @@ Array [
<table
style="table-layout: auto;"
>
<colgroup />
<colgroup>
<col
style="width: 80px;"
/>
</colgroup>
<thead
class="ant-table-thead"
>
<tr>
<th
class="ant-table-cell"
style="text-align: center;"
/>
<th
class="ant-table-cell"
Expand Down Expand Up @@ -4405,27 +4410,37 @@ Array [
>
<td
class="ant-table-cell"
style="text-align: center;"
>
<span
aria-label="menu"
class="anticon anticon-menu"
role="img"
<button
class="ant-btn ant-btn-text ant-btn-sm ant-btn-icon-only"
style="cursor: move;"
type="button"
>
<svg
aria-hidden="true"
data-icon="menu"
fill="currentColor"
focusable="false"
height="1em"
viewBox="64 64 896 896"
width="1em"
>
<path
d="M904 160H120c-4.4 0-8 3.6-8 8v64c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-64c0-4.4-3.6-8-8-8zm0 624H120c-4.4 0-8 3.6-8 8v64c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-64c0-4.4-3.6-8-8-8zm0-312H120c-4.4 0-8 3.6-8 8v64c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-64c0-4.4-3.6-8-8-8z"
/>
</svg>
</span>
<span
class="ant-btn-icon"
>
<span
aria-label="holder"
class="anticon anticon-holder"
role="img"
>
<svg
aria-hidden="true"
data-icon="holder"
fill="currentColor"
focusable="false"
height="1em"
viewBox="64 64 896 896"
width="1em"
>
<path
d="M300 276.5a56 56 0 1056-97 56 56 0 00-56 97zm0 284a56 56 0 1056-97 56 56 0 00-56 97zM640 228a56 56 0 10112 0 56 56 0 00-112 0zm0 284a56 56 0 10112 0 56 56 0 00-112 0zM300 844.5a56 56 0 1056-97 56 56 0 00-56 97zM640 796a56 56 0 10112 0 56 56 0 00-112 0z"
/>
</svg>
</span>
</span>
</button>
</td>
<td
class="ant-table-cell"
Expand All @@ -4440,7 +4455,7 @@ Array [
<td
class="ant-table-cell"
>
Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text
Long text Long
</td>
</tr>
<tr
Expand All @@ -4454,27 +4469,37 @@ Array [
>
<td
class="ant-table-cell"
style="text-align: center;"
>
<span
aria-label="menu"
class="anticon anticon-menu"
role="img"
<button
class="ant-btn ant-btn-text ant-btn-sm ant-btn-icon-only"
style="cursor: move;"
type="button"
>
<svg
aria-hidden="true"
data-icon="menu"
fill="currentColor"
focusable="false"
height="1em"
viewBox="64 64 896 896"
width="1em"
>
<path
d="M904 160H120c-4.4 0-8 3.6-8 8v64c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-64c0-4.4-3.6-8-8-8zm0 624H120c-4.4 0-8 3.6-8 8v64c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-64c0-4.4-3.6-8-8-8zm0-312H120c-4.4 0-8 3.6-8 8v64c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-64c0-4.4-3.6-8-8-8z"
/>
</svg>
</span>
<span
class="ant-btn-icon"
>
<span
aria-label="holder"
class="anticon anticon-holder"
role="img"
>
<svg
aria-hidden="true"
data-icon="holder"
fill="currentColor"
focusable="false"
height="1em"
viewBox="64 64 896 896"
width="1em"
>
<path
d="M300 276.5a56 56 0 1056-97 56 56 0 00-56 97zm0 284a56 56 0 1056-97 56 56 0 00-56 97zM640 228a56 56 0 10112 0 56 56 0 00-112 0zm0 284a56 56 0 10112 0 56 56 0 00-112 0zM300 844.5a56 56 0 1056-97 56 56 0 00-56 97zM640 796a56 56 0 10112 0 56 56 0 00-112 0z"
/>
</svg>
</span>
</span>
</button>
</td>
<td
class="ant-table-cell"
Expand Down Expand Up @@ -4503,27 +4528,37 @@ Array [
>
<td
class="ant-table-cell"
style="text-align: center;"
>
<span
aria-label="menu"
class="anticon anticon-menu"
role="img"
<button
class="ant-btn ant-btn-text ant-btn-sm ant-btn-icon-only"
style="cursor: move;"
type="button"
>
<svg
aria-hidden="true"
data-icon="menu"
fill="currentColor"
focusable="false"
height="1em"
viewBox="64 64 896 896"
width="1em"
>
<path
d="M904 160H120c-4.4 0-8 3.6-8 8v64c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-64c0-4.4-3.6-8-8-8zm0 624H120c-4.4 0-8 3.6-8 8v64c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-64c0-4.4-3.6-8-8-8zm0-312H120c-4.4 0-8 3.6-8 8v64c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-64c0-4.4-3.6-8-8-8z"
/>
</svg>
</span>
<span
class="ant-btn-icon"
>
<span
aria-label="holder"
class="anticon anticon-holder"
role="img"
>
<svg
aria-hidden="true"
data-icon="holder"
fill="currentColor"
focusable="false"
height="1em"
viewBox="64 64 896 896"
width="1em"
>
<path
d="M300 276.5a56 56 0 1056-97 56 56 0 00-56 97zm0 284a56 56 0 1056-97 56 56 0 00-56 97zM640 228a56 56 0 10112 0 56 56 0 00-112 0zm0 284a56 56 0 10112 0 56 56 0 00-112 0zM300 844.5a56 56 0 1056-97 56 56 0 00-56 97zM640 796a56 56 0 10112 0 56 56 0 00-112 0z"
/>
</svg>
</span>
</span>
</button>
</td>
<td
class="ant-table-cell"
Expand Down
153 changes: 94 additions & 59 deletions components/table/__tests__/__snapshots__/demo.test.ts.snap
View file
Expand Up @@ -3821,13 +3821,18 @@ exports[`renders components/table/demo/drag-sorting-handler.tsx correctly 1`] =
<table
style="table-layout:auto"
>
<colgroup />
<colgroup>
<col
style="width:80px"
/>
</colgroup>
<thead
class="ant-table-thead"
>
<tr>
<th
class="ant-table-cell"
style="text-align:center"
/>
<th
class="ant-table-cell"
Expand Down Expand Up @@ -3863,27 +3868,37 @@ exports[`renders components/table/demo/drag-sorting-handler.tsx correctly 1`] =
>
<td
class="ant-table-cell"
style="text-align:center"
>
<span
aria-label="menu"
class="anticon anticon-menu"
role="img"
style="touch-action:none;cursor:move"
>
<svg
aria-hidden="true"
data-icon="menu"
fill="currentColor"
focusable="false"
height="1em"
viewBox="64 64 896 896"
width="1em"
<button
class="ant-btn ant-btn-text ant-btn-sm ant-btn-icon-only"
style="cursor:move"
type="button"
>
<span
class="ant-btn-icon"
>
<path
d="M904 160H120c-4.4 0-8 3.6-8 8v64c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-64c0-4.4-3.6-8-8-8zm0 624H120c-4.4 0-8 3.6-8 8v64c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-64c0-4.4-3.6-8-8-8zm0-312H120c-4.4 0-8 3.6-8 8v64c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-64c0-4.4-3.6-8-8-8z"
/>
</svg>
</span>
<span
aria-label="holder"
class="anticon anticon-holder"
role="img"
>
<svg
aria-hidden="true"
data-icon="holder"
fill="currentColor"
focusable="false"
height="1em"
viewBox="64 64 896 896"
width="1em"
>
<path
d="M300 276.5a56 56 0 1056-97 56 56 0 00-56 97zm0 284a56 56 0 1056-97 56 56 0 00-56 97zM640 228a56 56 0 10112 0 56 56 0 00-112 0zm0 284a56 56 0 10112 0 56 56 0 00-112 0zM300 844.5a56 56 0 1056-97 56 56 0 00-56 97zM640 796a56 56 0 10112 0 56 56 0 00-112 0z"
/>
</svg>
</span>
</span>
</button>
</td>
<td
class="ant-table-cell"
Expand All @@ -3898,7 +3913,7 @@ exports[`renders components/table/demo/drag-sorting-handler.tsx correctly 1`] =
<td
class="ant-table-cell"
>
Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text
Long text Long
</td>
</tr>
<tr
Expand All @@ -3912,27 +3927,37 @@ exports[`renders components/table/demo/drag-sorting-handler.tsx correctly 1`] =
>
<td
class="ant-table-cell"
style="text-align:center"
>
<span
aria-label="menu"
class="anticon anticon-menu"
role="img"
style="touch-action:none;cursor:move"
>
<svg
aria-hidden="true"
data-icon="menu"
fill="currentColor"
focusable="false"
height="1em"
viewBox="64 64 896 896"
width="1em"
<button
class="ant-btn ant-btn-text ant-btn-sm ant-btn-icon-only"
style="cursor:move"
type="button"
>
<span
class="ant-btn-icon"
>
<path
d="M904 160H120c-4.4 0-8 3.6-8 8v64c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-64c0-4.4-3.6-8-8-8zm0 624H120c-4.4 0-8 3.6-8 8v64c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-64c0-4.4-3.6-8-8-8zm0-312H120c-4.4 0-8 3.6-8 8v64c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-64c0-4.4-3.6-8-8-8z"
/>
</svg>
</span>
<span
aria-label="holder"
class="anticon anticon-holder"
role="img"
>
<svg
aria-hidden="true"
data-icon="holder"
fill="currentColor"
focusable="false"
height="1em"
viewBox="64 64 896 896"
width="1em"
>
<path
d="M300 276.5a56 56 0 1056-97 56 56 0 00-56 97zm0 284a56 56 0 1056-97 56 56 0 00-56 97zM640 228a56 56 0 10112 0 56 56 0 00-112 0zm0 284a56 56 0 10112 0 56 56 0 00-112 0zM300 844.5a56 56 0 1056-97 56 56 0 00-56 97zM640 796a56 56 0 10112 0 56 56 0 00-112 0z"
/>
</svg>
</span>
</span>
</button>
</td>
<td
class="ant-table-cell"
Expand Down Expand Up @@ -3961,27 +3986,37 @@ exports[`renders components/table/demo/drag-sorting-handler.tsx correctly 1`] =
>
<td
class="ant-table-cell"
style="text-align:center"
>
<span
aria-label="menu"
class="anticon anticon-menu"
role="img"
style="touch-action:none;cursor:move"
>
<svg
aria-hidden="true"
data-icon="menu"
fill="currentColor"
focusable="false"
height="1em"
viewBox="64 64 896 896"
width="1em"
<button
class="ant-btn ant-btn-text ant-btn-sm ant-btn-icon-only"
style="cursor:move"
type="button"
>
<span
class="ant-btn-icon"
>
<path
d="M904 160H120c-4.4 0-8 3.6-8 8v64c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-64c0-4.4-3.6-8-8-8zm0 624H120c-4.4 0-8 3.6-8 8v64c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-64c0-4.4-3.6-8-8-8zm0-312H120c-4.4 0-8 3.6-8 8v64c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-64c0-4.4-3.6-8-8-8z"
/>
</svg>
</span>
<span
aria-label="holder"
class="anticon anticon-holder"
role="img"
>
<svg
aria-hidden="true"
data-icon="holder"
fill="currentColor"
focusable="false"
height="1em"
viewBox="64 64 896 896"
width="1em"
>
<path
d="M300 276.5a56 56 0 1056-97 56 56 0 00-56 97zm0 284a56 56 0 1056-97 56 56 0 00-56 97zM640 228a56 56 0 10112 0 56 56 0 00-112 0zm0 284a56 56 0 10112 0 56 56 0 00-112 0zM300 844.5a56 56 0 1056-97 56 56 0 00-56 97zM640 796a56 56 0 10112 0 56 56 0 00-112 0z"
/>
</svg>
</span>
</span>
</button>
</td>
<td
class="ant-table-cell"
Expand Down

0 comments on commit 11a160c

Please sign in to comment.