feat: Image support flip function and fix fallback (#40660)

* bump rc-image 5.15.1

* add flix support

* chore: update snapshot

components/image/PreviewGroup.tsx

@@ -3,6 +3,7 @@ import LeftOutlined from '@ant-design/icons/LeftOutlined';
 import RightOutlined from '@ant-design/icons/RightOutlined';
 import RotateLeftOutlined from '@ant-design/icons/RotateLeftOutlined';
 import RotateRightOutlined from '@ant-design/icons/RotateRightOutlined';
+import SwapOutlined from '@ant-design/icons/SwapOutlined';
 import ZoomInOutlined from '@ant-design/icons/ZoomInOutlined';
 import ZoomOutOutlined from '@ant-design/icons/ZoomOutOutlined';
 import RcImage from 'rc-image';
@@ -22,6 +23,8 @@ export const icons = {
   close: <CloseOutlined />,
   left: <LeftOutlined />,
   right: <RightOutlined />,
+  flipX: <SwapOutlined />,
+  flipY: <SwapOutlined rotate={90} />,
 };
 
 const InternalPreviewGroup: React.FC<GroupConsumerProps> = ({

components/image/__tests__/__snapshots__/index.test.tsx.snap

@@ -178,6 +178,53 @@ exports[`Image Default Group preview props 1`] = `
           </svg>
         </span>
       </li>
+      <li
+        class="ant-image-preview-operations-operation ant-image-preview-operations-operation-flipX"
+      >
+        <span
+          aria-label="swap"
+          class="anticon anticon-swap ant-image-preview-operations-icon"
+          role="img"
+        >
+          <svg
+            aria-hidden="true"
+            data-icon="swap"
+            fill="currentColor"
+            focusable="false"
+            height="1em"
+            viewBox="64 64 896 896"
+            width="1em"
+          >
+            <path
+              d="M847.9 592H152c-4.4 0-8 3.6-8 8v60c0 4.4 3.6 8 8 8h605.2L612.9 851c-4.1 5.2-.4 13 6.3 13h72.5c4.9 0 9.5-2.2 12.6-6.1l168.8-214.1c16.5-21 1.6-51.8-25.2-51.8zM872 356H266.8l144.3-183c4.1-5.2.4-13-6.3-13h-72.5c-4.9 0-9.5 2.2-12.6 6.1L150.9 380.2c-16.5 21-1.6 51.8 25.1 51.8h696c4.4 0 8-3.6 8-8v-60c0-4.4-3.6-8-8-8z"
+            />
+          </svg>
+        </span>
+      </li>
+      <li
+        class="ant-image-preview-operations-operation ant-image-preview-operations-operation-flipY"
+      >
+        <span
+          aria-label="swap"
+          class="anticon anticon-swap ant-image-preview-operations-icon"
+          role="img"
+        >
+          <svg
+            aria-hidden="true"
+            data-icon="swap"
+            fill="currentColor"
+            focusable="false"
+            height="1em"
+            style="transform: rotate(90deg);"
+            viewBox="64 64 896 896"
+            width="1em"
+          >
+            <path
+              d="M847.9 592H152c-4.4 0-8 3.6-8 8v60c0 4.4 3.6 8 8 8h605.2L612.9 851c-4.1 5.2-.4 13 6.3 13h72.5c4.9 0 9.5-2.2 12.6-6.1l168.8-214.1c16.5-21 1.6-51.8-25.2-51.8zM872 356H266.8l144.3-183c4.1-5.2.4-13-6.3-13h-72.5c-4.9 0-9.5 2.2-12.6 6.1L150.9 380.2c-16.5 21-1.6 51.8 25.1 51.8h696c4.4 0 8-3.6 8-8v-60c0-4.4-3.6-8-8-8z"
+            />
+          </svg>
+        </span>
+      </li>
     </ul>
   </div>
   <div>

package.json

@@ -126,7 +126,7 @@
     "rc-drawer": "~6.1.1",
     "rc-dropdown": "~4.0.0",
     "rc-field-form": "~1.27.0",
-    "rc-image": "~5.13.0",
+    "rc-image": "~5.15.1",
     "rc-input": "~0.2.1",
     "rc-input-number": "~7.4.0",
     "rc-mentions": "~2.0.0",