fix(comp:text): ellipsis doesn't work when there're line breaks

packages/components/text/demo/Lines.md

@@ -0,0 +1,7 @@
+---
+order: 1
+title:
+  zh: 多行内容
+  en: Multiple lines
+---
+

packages/components/text/demo/Lines.vue

@@ -0,0 +1,11 @@
+<script lang="ts" setup>
+const lines = Array.from(new Array(20)).map((_, idx) => `192.168.0.1 ${idx}`)
+</script>
+
+<template>
+  <IxText class="demo-text-expand-lines" :ellipsis="{ rows: 4, expandable: true }">
+    <template v-for="line in lines" :key="line">
+      <span>{{ line }}<br /></span>
+    </template>
+  </IxText>
+</template>

packages/components/text/src/Text.tsx

@@ -5,11 +5,11 @@
  * found in the LICENSE file at https://github.com/IDuxFE/idux/blob/main/LICENSE
  */
 
-import { type Slot, computed, defineComponent, normalizeClass, shallowRef } from 'vue'
+import { type Slot, VNode, computed, defineComponent, normalizeClass, shallowRef } from 'vue'
 
 import { isObject, isString } from 'lodash-es'
 
-import { getFirstValidNode } from '@idux/cdk/utils'
+import { flattenNode, getFirstValidNode } from '@idux/cdk/utils'
 import { useGlobalConfig } from '@idux/components/config'
 import { IxTooltip } from '@idux/components/tooltip'
 
@@ -85,9 +85,8 @@
       return <IxTooltip {...(copied.value ? copyTooltip.value[1] : copyTooltip.value[0])}>{node}</IxTooltip>
     }
 
-    const renderMeasureElement = () => {
+    const renderMeasureElement = (nodes: VNode[] | undefined) => {
       const { tag: Tag } = props
-      const nodes = slots.default?.()
 
       return (
         <Tag ref={measureRef} class={`${mergedPrefixCls.value}-inner`} style={measureElementStyle}>
@@ -103,79 +102,79 @@
 
       return (
         <Tag ref={rowMeasureRef} class={`${mergedPrefixCls.value}-inner`} style={rowMeasureElementStyle}>
-          {slots.default?.()}
+          lg
         </Tag>
       )
     }
 
     return () => {
       const { tag: Tag, tooltip } = props
       const prefixCls = mergedPrefixCls.value
       const isNative = tooltip === 'native'
       const titleSlot = slots.title || slots.default
 
       const hasExpandIcon = !!slots.expandIcon || !!expandIconRenderer.value
       const expandNode =
         expandable.value && hasExpandIcon ? (
           <div class={`${prefixCls}-expand-icon`} onClick={toggleExpanded}>
             {(slots.expandIcon ?? expandIconRenderer.value)!({ expanded: expanded.value })}
           </div>
         ) : undefined
 
-      const contentNodes = slots.default?.()
+      const contentNodes = flattenNode(slots.default?.())
 
       let node = (
         <Tag
           ref={innerRef}
           class={`${prefixCls}-inner`}
           title={isNative && isEllipsis.value ? getStringBySlot(titleSlot) : undefined}
           onClick={expandable.value && !hasExpandIcon ? toggleExpanded : undefined}
           {...attrs}
         >
           {!isSimple.value && isEllipsis.value && !expanded.value && measureStatus.value === 'none'
             ? renderClampedContent(contentNodes)
             : contentNodes}
           {!isSimple.value && isEllipsis.value && !expanded.value && renderEllipsisNode()}
         </Tag>
       )
 
       if (isEllipsis.value && !expanded.value && tooltip && !isNative) {
         const tooltipProps = isObject(tooltip) ? tooltip : {}
         node = (
           <IxTooltip {...tooltipProps} v-slots={{ title: titleSlot }}>
             {node}
           </IxTooltip>
         )
       }
 
       const classes = normalizeClass({
         [prefixCls]: true,
         [`${prefixCls}-simple`]: isSimple.value,
         [`${prefixCls}-ellipsis`]: isEllipsis.value,
         [`${prefixCls}-expandable`]: expandable.value,
         [`${prefixCls}-has-expand-icon`]: hasExpandIcon,
       })
 
       onRender(contentNodes)
 
       if (measureStatus.value !== 'none') {
         onMeasureRender()
       }
 
       return (
         <div ref={contentRef} class={classes}>
           {node}
           {slots.suffix?.()}
           {renderCopyNode()}
           {isEllipsis.value && expandNode}
-          {measureStatus.value !== 'none' && renderMeasureElement()}
+          {measureStatus.value !== 'none' && renderMeasureElement(contentNodes)}
           {measureStatus.value === 'preparing' && renderRowMeasureElement()}
         </div>
       )
     }
   },
 })
 
 function getStringBySlot(slot: Slot | undefined) {
   const validNode = getFirstValidNode(slot?.())
   if (!validNode) {