Chore: frontend infrastructure upgrade (#16420)

Co-authored-by: NFish <douxc512@gmail.com>
Co-authored-by: zxhlyh <jasonapring2015@outlook.com>
Co-authored-by: twwu <twwu@dify.ai>
Co-authored-by: jZonG <jzongcode@gmail.com>

web/app/components/datasets/formatted-text/flavours/shared.tsx

@@ -1,22 +1,32 @@
-import { type ComponentProps, type FC, forwardRef } from 'react'
+import type { ComponentProps, FC } from 'react'
 import classNames from '@/utils/classnames'
 
 const baseStyle = 'py-[3px]'
 
 export type SliceContainerProps = ComponentProps<'span'>
 
-export const SliceContainer: FC<SliceContainerProps> = forwardRef((props, ref) => {
+export const SliceContainer: FC<SliceContainerProps> = (
+  {
+    ref,
+    ...props
+  },
+) => {
   const { className, ...rest } = props
   return <span {...rest} ref={ref} className={classNames(
     'group align-bottom mr-1 select-none text-sm',
     className,
   )} />
-})
+}
 SliceContainer.displayName = 'SliceContainer'
 
 export type SliceLabelProps = ComponentProps<'span'> & { labelInnerClassName?: string }
 
-export const SliceLabel: FC<SliceLabelProps> = forwardRef((props, ref) => {
+export const SliceLabel: FC<SliceLabelProps> = (
+  {
+    ref,
+    ...props
+  },
+) => {
   const { className, children, labelInnerClassName, ...rest } = props
   return <span {...rest} ref={ref} className={classNames(
     baseStyle,
@@ -27,12 +37,17 @@ export const SliceLabel: FC<SliceLabelProps> = forwardRef((props, ref) => {
       {children}
     </span>
   </span>
-})
+}
 SliceLabel.displayName = 'SliceLabel'
 
 export type SliceContentProps = ComponentProps<'span'>
 
-export const SliceContent: FC<SliceContentProps> = forwardRef((props, ref) => {
+export const SliceContent: FC<SliceContentProps> = (
+  {
+    ref,
+    ...props
+  },
+) => {
   const { className, children, ...rest } = props
   return <span {...rest} ref={ref} className={classNames(
     baseStyle,
@@ -41,12 +56,17 @@ export const SliceContent: FC<SliceContentProps> = forwardRef((props, ref) => {
   )}>
     {children}
   </span>
-})
+}
 SliceContent.displayName = 'SliceContent'
 
 export type SliceDividerProps = ComponentProps<'span'>
 
-export const SliceDivider: FC<SliceDividerProps> = forwardRef((props, ref) => {
+export const SliceDivider: FC<SliceDividerProps> = (
+  {
+    ref,
+    ...props
+  },
+) => {
   const { className, ...rest } = props
   return <span {...rest} ref={ref} className={classNames(
     baseStyle,
@@ -56,5 +76,5 @@ export const SliceDivider: FC<SliceDividerProps> = forwardRef((props, ref) => {
     {/* use a zero-width space to make the hover area bigger */}
     &#8203;
   </span>
-})
+}
 SliceDivider.displayName = 'SliceDivider'