From 550f60ff764970ecae4fdea3a262be05db5b5720 Mon Sep 17 00:00:00 2001
From: miracles1919 <516571350@qq.com>
Date: Thu, 31 Mar 2022 14:06:44 +0800
Subject: [PATCH] docs: update draggable demo with rtl mode (#34785)

* docs: update draggable demo with rtl mode

* test: update tabs demo snapshot
---
 .../__tests__/__snapshots__/demo-extend.test.ts.snap     | 9 +++------
 .../tabs/__tests__/__snapshots__/demo.test.js.snap       | 9 +++------
 components/tabs/demo/custom-tab-bar-node.md              | 6 +++++-
 3 files changed, 11 insertions(+), 13 deletions(-)

diff --git a/components/tabs/__tests__/__snapshots__/demo-extend.test.ts.snap b/components/tabs/__tests__/__snapshots__/demo-extend.test.ts.snap
index ba07286225..5be629b968 100644
--- a/components/tabs/__tests__/__snapshots__/demo-extend.test.ts.snap
+++ b/components/tabs/__tests__/__snapshots__/demo-extend.test.ts.snap
@@ -945,8 +945,7 @@ exports[`renders ./components/tabs/demo/custom-tab-bar-node.md extend context co
         style="transform:translate(0px, 0px)"
       >
         <div
-          class=""
-          style="margin-right:24px"
+          class="dragnode "
         >
           <div
             class="ant-tabs-tab ant-tabs-tab-active"
@@ -962,8 +961,7 @@ exports[`renders ./components/tabs/demo/custom-tab-bar-node.md extend context co
           </div>
         </div>
         <div
-          class=""
-          style="margin-right:24px"
+          class="dragnode "
         >
           <div
             class="ant-tabs-tab"
@@ -979,8 +977,7 @@ exports[`renders ./components/tabs/demo/custom-tab-bar-node.md extend context co
           </div>
         </div>
         <div
-          class=""
-          style="margin-right:24px"
+          class="dragnode "
         >
           <div
             class="ant-tabs-tab"
diff --git a/components/tabs/__tests__/__snapshots__/demo.test.js.snap b/components/tabs/__tests__/__snapshots__/demo.test.js.snap
index 0b3a6273ae..8948380c37 100644
--- a/components/tabs/__tests__/__snapshots__/demo.test.js.snap
+++ b/components/tabs/__tests__/__snapshots__/demo.test.js.snap
@@ -831,8 +831,7 @@ exports[`renders ./components/tabs/demo/custom-tab-bar-node.md correctly 1`] = `
         style="transform:translate(0px, 0px)"
       >
         <div
-          class=""
-          style="margin-right:24px"
+          class="dragnode "
         >
           <div
             class="ant-tabs-tab ant-tabs-tab-active"
@@ -848,8 +847,7 @@ exports[`renders ./components/tabs/demo/custom-tab-bar-node.md correctly 1`] = `
           </div>
         </div>
         <div
-          class=""
-          style="margin-right:24px"
+          class="dragnode "
         >
           <div
             class="ant-tabs-tab"
@@ -865,8 +863,7 @@ exports[`renders ./components/tabs/demo/custom-tab-bar-node.md correctly 1`] = `
           </div>
         </div>
         <div
-          class=""
-          style="margin-right:24px"
+          class="dragnode "
         >
           <div
             class="ant-tabs-tab"
diff --git a/components/tabs/demo/custom-tab-bar-node.md b/components/tabs/demo/custom-tab-bar-node.md
index d82f1880d5..c6fd1a0688 100644
--- a/components/tabs/demo/custom-tab-bar-node.md
+++ b/components/tabs/demo/custom-tab-bar-node.md
@@ -50,7 +50,7 @@ const DraggableTabNode = ({ index, children, moveNode }) => {
   });
   drop(drag(ref));
   return (
-    <div ref={ref} style={{ marginRight: 24 }} className={isOver ? dropClassName : ''}>
+    <div ref={ref} className={`dragnode ${isOver ? dropClassName : ''}`}>
       {children}
     </div>
   );
@@ -152,4 +152,8 @@ ReactDOM.render(
   background: #fefefe;
   transition: all 0.3s;
 }
+
+.dragnode {
+  margin-inline-end: 24px;
+}
 ```