im-ui-mobile 0.1.10 → 0.1.12

package/components/im-avatar/im-avatar.vue

@@ -10,7 +10,7 @@
 </template>
 
 <script setup lang="ts">
-import { computed } from 'vue';
+import { ref, computed, watch, nextTick, useSlots } from 'vue'
 
 interface Props {
 	id?: number;

package/components/im-badge/im-badge.vue

@@ -35,7 +35,7 @@
 </template>
 
 <script setup lang="ts">
-import { computed, useSlots } from 'vue'
+import { ref, computed, watch, nextTick, useSlots } from 'vue'
 
 // 定义Props
 interface BadgeProps {

package/components/im-button/im-button.vue

@@ -57,7 +57,7 @@
 </template>
 
 <script setup lang="ts">
-import { computed } from 'vue'
+import { ref, computed, watch, nextTick, useSlots } from 'vue'
 import { validator } from '../../index'
 
 // 定义类型

package/components/im-card/im-card.vue

@@ -91,7 +91,7 @@
 </template>
 
 <script setup lang="ts">
-import { computed } from 'vue'
+import { ref, computed, watch, nextTick, useSlots } from 'vue'
 import type { CSSProperties } from 'vue'
 import ImButton from '../im-button/im-button.vue'
 

package/components/im-cell/im-cell.vue

@@ -96,7 +96,7 @@
 </template>
 
 <script setup lang="ts">
-import { computed, useSlots } from 'vue'
+import { ref, computed, watch, nextTick, useSlots } from 'vue'
 
 // 定义类型
 type CellType = 'default' | 'primary' | 'success' | 'warning' | 'danger' | 'info'

package/components/im-cell-switch/im-cell-switch.vue

@@ -45,7 +45,7 @@
 </template>
 
 <script setup lang="ts">
-import { ref, computed, watch } from 'vue'
+import { ref, computed, watch, nextTick, useSlots } from 'vue'
 import ImCell from '../im-cell/im-cell.vue'
 
 // 定义 Props 接口

package/components/im-chat-item/im-chat-item.vue

@@ -15,7 +15,7 @@
 			<view class="chat-content">
 				<view class="chat-at-text">{{ atText }}</view>
 				<view class="chat-send-name" v-if="isShowSendName">{{ chat.sendNickName + ':&nbsp;' }}</view>
-				<view v-if="!isTextMessage" class="chat-content-text">{{ chat.lastContent }}</view>
+				<view v-if="!isTextMessage" class="chat-content-text">{{ chat.lastMessage }}</view>
 				<rich-text v-else class="chat-content-text" :nodes="nodesText"></rich-text>
 				<view v-if="chat.isDnd" class="icon iconfont icon-dnd"></view>
 				<im-badge v-if="chat.unreadCount > 0" size="small" :max="99" :value="chat.unreadCount" />
@@ -25,7 +25,7 @@
 </template>
 
 <script setup lang="ts">
-import { computed } from 'vue'
+import { ref, computed, watch, nextTick, useSlots } from 'vue'
 import ImAvatar from '../im-avatar/im-avatar.vue'
 import ImBadge from '../im-badge/im-badge.vue'
 import { datetime, dom, messageType, emoji } from '../../index'
@@ -82,7 +82,7 @@ const isTextMessage = computed(() => {
 });
 
 const nodesText = computed(() => {
-	const text = dom.html2Escape(props.chat?.lastContent || '');
+	const text = dom.html2Escape(props.chat?.lastMessage || '');
 	return emoji.transform(text, 'emoji-small');
 });
 

package/components/im-col/im-col.vue

@@ -1,22 +1,17 @@
 <template>
-  <view 
-    class="im-col"
-    :class="[
-      `im-col--span-${span}`,
-      `im-col--offset-${offset}`,
-      `im-col--order-${order}`,
-      `im-col--align-self-${alignSelf}`,
-      { 'im-col--gutter': hasGutter }
-    ]"
-    :style="colStyle"
-    @tap="handleClick"
-  >
+  <view class="im-col" :class="[
+    `im-col--span-${span}`,
+    `im-col--offset-${offset}`,
+    `im-col--order-${order}`,
+    `im-col--align-self-${alignSelf}`,
+    { 'im-col--gutter': hasGutter }
+  ]" :style="colStyle" @tap="handleClick">
     <slot></slot>
   </view>
 </template>
 
 <script setup lang="ts">
-import { computed, inject } from 'vue'
+import { ref, computed, watch, nextTick, useSlots, inject } from 'vue'
 
 // 定义 Props
 interface Props {
@@ -26,14 +21,14 @@ interface Props {
   order?: number | string
   alignSelf?: 'auto' | 'start' | 'end' | 'center' | 'stretch'
   flex?: string
-  
+
   // 响应式配置
   xs?: number | string
   sm?: number | string
   md?: number | string
   lg?: number | string
   xl?: number | string
-  
+
   // 样式配置
   width?: string
   height?: string
@@ -42,7 +37,7 @@ interface Props {
   bgColor?: string
   borderColor?: string
   borderRadius?: string
-  
+
   // 点击事件
   clickable?: boolean
 }
@@ -59,13 +54,13 @@ const props = withDefaults(defineProps<Props>(), {
   order: 0,
   alignSelf: 'auto',
   flex: 'none',
-  
+
   xs: 0,
   sm: 0,
   md: 0,
   lg: 0,
   xl: 0,
-  
+
   width: 'auto',
   height: 'auto',
   margin: '0',
@@ -73,7 +68,7 @@ const props = withDefaults(defineProps<Props>(), {
   bgColor: 'transparent',
   borderColor: 'transparent',
   borderRadius: '0',
-  
+
   clickable: false
 })
 
@@ -107,28 +102,28 @@ const colStyle = computed(() => {
     order: props.order,
     alignSelf: props.alignSelf
   }
-  
+
   // 设置 flex
   if (props.flex !== 'none') {
     style.flex = props.flex
   }
-  
+
   // 设置边框
   if (props.borderColor !== 'transparent') {
     style.borderWidth = '2rpx'
     style.borderStyle = 'solid'
   }
-  
+
   // 设置 gutter
   if (hasGutter.value) {
-    const gutter = typeof rowContext.gutter === 'number' 
-      ? `${rowContext.gutter}rpx` 
+    const gutter = typeof rowContext.gutter === 'number'
+      ? `${rowContext.gutter}rpx`
       : rowContext.gutter
-    
+
     style.paddingLeft = `calc(${gutter} / 2)`
     style.paddingRight = `calc(${gutter} / 2)`
   }
-  
+
   return style
 })
 
@@ -144,43 +139,43 @@ const handleClick = (event: any) => {
 .im-col {
   box-sizing: border-box;
   position: relative;
-  
+
   // 基本 span 类
   @for $i from 1 through 24 {
     &--span-#{$i} {
       width: calc(100% * $i / 24);
     }
-    
+
     &--offset-#{$i} {
       margin-left: calc(100% * $i / 24);
     }
-    
+
     &--order-#{$i} {
       order: $i;
     }
   }
-  
+
   // 对齐方式
   &--align-self-auto {
     align-self: auto;
   }
-  
+
   &--align-self-start {
     align-self: flex-start;
   }
-  
+
   &--align-self-end {
     align-self: flex-end;
   }
-  
+
   &--align-self-center {
     align-self: center;
   }
-  
+
   &--align-self-stretch {
     align-self: stretch;
   }
-  
+
   // 点击效果
   &:active {
     &.im-col--clickable {

package/components/im-context-menu/im-context-menu.vue

@@ -13,7 +13,7 @@
 </template>
 
 <script setup lang="ts">
-import { ref } from 'vue'
+import { ref, computed, watch, nextTick, useSlots } from 'vue'
 
 interface Props {
 	items?: any[];

package/components/im-dialog/im-dialog.vue

@@ -96,7 +96,7 @@
 </template>
 
 <script setup lang="ts">
-import { ref, computed, watch, nextTick } from 'vue'
+import { ref, computed, watch, nextTick, useSlots } from 'vue'
 import type { Modal as ModalType } from 'im-ui-mobile'
 import ImModal from '../im-modal/im-modal.vue'
 

package/components/im-group-rtc-join/im-group-rtc-join.vue

@@ -22,11 +22,11 @@
 </template>
 
 <script setup lang="ts">
+import { ref, computed, watch, nextTick, useSlots } from 'vue'
 import ImAvatar from '../im-avatar/im-avatar.vue'
 import ImPopup from '../im-popup/im-popup.vue'
 import ImModal from '../im-modal/im-modal.vue'
-import { ref } from 'vue';
-import { UserInfo } from '../../libs';
+import { UserInfo } from '../../libs'
 
 interface Props {
 	groupId?: number;

package/components/im-parse/im-parse.vue

@@ -2,94 +2,62 @@
   <view class="im-parse" :class="customClass" :style="customStyle">
     <!-- 解析模式 -->
     <template v-if="mode === 'html' && content">
-      <rich-text v-if="useRichText"
-       :id="richTextId"
-        :nodes="dom.nodesToHtml(parsedNodes)"
-      />
-      <view 
-        v-else
-        class="im-parse__html"
-        v-html="content"
-        @tap="handleHtmlTap"
-      />
+      <rich-text v-if="useRichText" :id="richTextId" :nodes="dom.nodesToHtml(parsedNodes)" />
+      <view v-else class="im-parse__html" v-html="content" @tap="handleHtmlTap" />
     </template>
-    
+
     <!-- 文本模式 -->
     <template v-else-if="mode === 'text' && content">
-      <text 
-        class="im-parse__text"
-        :style="textStyle"
-        @tap="handleTextTap"
-      >
+      <text class="im-parse__text" :style="textStyle" @tap="handleTextTap">
         {{ processedText }}
       </text>
     </template>
-    
+
     <!-- Markdown 模式 -->
     <template v-else-if="mode === 'markdown' && content">
       <view class="im-parse__markdown">
         <template v-for="(node, index) in markdownNodes" :key="index">
           <!-- 标题 -->
-          <view 
-            v-if="node.type === 'heading'"
-            class="im-parse__heading"
-            :class="`im-parse__heading--${node.depth}`"
-          >
+          <view v-if="node.type === 'heading'" class="im-parse__heading" :class="`im-parse__heading--${node.depth}`">
             <text>{{ node.text }}</text>
           </view>
-          
+
           <!-- 段落 -->
-          <view 
-            v-else-if="node.type === 'paragraph'"
-            class="im-parse__paragraph"
-          >
+          <view v-else-if="node.type === 'paragraph'" class="im-parse__paragraph">
             <text>{{ node.text }}</text>
           </view>
-          
+
           <!-- 列表 -->
-          <view 
-            v-else-if="node.type === 'list'"
-            class="im-parse__list"
-            :class="{ 'im-parse__list--ordered': node.ordered }"
-          >
-            <view 
-              v-for="(item, itemIndex) in node.items"
-              :key="itemIndex"
-              class="im-parse__list-item"
-            >
+          <view v-else-if="node.type === 'list'" class="im-parse__list"
+            :class="{ 'im-parse__list--ordered': node.ordered }">
+            <view v-for="(item, itemIndex) in node.items" :key="itemIndex" class="im-parse__list-item">
               <view class="im-parse__list-marker">
                 {{ node.ordered ? `${Number(itemIndex) + 1}.` : '•' }}
               </view>
               <text class="im-parse__list-text">{{ item }}</text>
             </view>
           </view>
-          
+
           <!-- 引用 -->
-          <view 
-            v-else-if="node.type === 'blockquote'"
-            class="im-parse__blockquote"
-          >
+          <view v-else-if="node.type === 'blockquote'" class="im-parse__blockquote">
             <text>{{ node.text }}</text>
           </view>
-          
+
           <!-- 代码块 -->
-          <view 
-            v-else-if="node.type === 'code'"
-            class="im-parse__code-block"
-          >
+          <view v-else-if="node.type === 'code'" class="im-parse__code-block">
             <text class="im-parse__code-text">{{ node.text }}</text>
           </view>
         </template>
       </view>
     </template>
-    
+
     <!-- JSON 模式 -->
     <template v-else-if="mode === 'json' && content">
       <view class="im-parse__json">
         <pre class="im-parse__json-pre">{{ formattedJson }}</pre>
       </view>
     </template>
-    
+
     <!-- 默认插槽 -->
     <slot v-if="!content" name="default"></slot>
   </view>
@@ -97,7 +65,7 @@
 
 <script setup lang="ts">
 import { ref, computed, watch } from 'vue'
-import type{LinkData,ParseOptions} from "../../types/components/parse";
+import type { LinkData, ParseOptions } from "../../types/components/parse";
 import { emoji, dom } from '../../index'
 
 // 定义 Props
@@ -105,19 +73,19 @@ interface Props {
   // 内容
   content?: string
   modelValue?: string
-  
+
   // 解析选项
   options?: ParseOptions
 
   // 解析模式
   mode?: 'html' | 'text' | 'markdown' | 'json'
   encoding?: 'utf-8' | 'base64' | 'url'
-  
+
   // 通用配置
   maxLength?: number
   ellipsis?: string
   lines?: number
-  
+
   // HTML 配置
   useRichText?: boolean
   space?: 'ensp' | 'emsp' | 'nbsp'
@@ -125,19 +93,19 @@ interface Props {
   allowTags?: string[]
   allowAttributes?: Record<string, string[]>
   allowDomains?: string[]
-  
+
   // 样式配置
   customClass?: string
   customStyle?: string | Record<string, string>
   textStyle?: string | Record<string, string>
-  
+
   // 功能配置
   autolink?: boolean
   emoji?: boolean
   highlight?: boolean
   lazyLoad?: boolean
   errorFallback?: string
-  
+
   // 事件配置
   preventDefault?: boolean
 }
@@ -146,7 +114,7 @@ interface Props {
 interface Emits {
   (e: 'update:modelValue', value: string): void
   (e: 'click', event: any): void
-  (e:'link-click',link: LinkData, event?: Event):void
+  (e: 'link-click', link: LinkData, event?: Event): void
   (e: 'linkpress', url: string): void
   (e: 'imageerror', src: string, error: Error): void
   (e: 'imageload', src: string): void
@@ -158,7 +126,7 @@ interface Emits {
 const props = withDefaults(defineProps<Props>(), {
   content: '',
   modelValue: '',
-  
+
   options: () => ({
     enableLinks: true,
     openExternalInNewWindow: true,
@@ -168,39 +136,39 @@ const props = withDefaults(defineProps<Props>(), {
 
   mode: 'html',
   encoding: 'utf-8',
-  
+
   maxLength: 0,
   ellipsis: '...',
   lines: 0,
-  
+
   useRichText: true,
   space: 'ensp',
   filterTags: () => ['script', 'style', 'iframe', 'object', 'embed'],
   allowTags: () => [],
   allowAttributes: () => ({}),
   allowDomains: () => [],
-  
+
   customClass: '',
   customStyle: () => ({}),
   textStyle: () => ({}),
-  
+
   autolink: true,
   emoji: false,
   highlight: false,
   lazyLoad: false,
   errorFallback: '解析失败',
-  
+
   preventDefault: false
 })
 
 const emit = defineEmits<Emits>()
 
 // 响应式状态
-const richTextId = ref('richTextId'+new Date().getTime())
+const richTextId = ref('richTextId' + new Date().getTime())
 const parsedNodes = ref<any[]>([])
 const markdownNodes = ref<any[]>([])
 const lastError = ref<Error | null>(null)
-const extractedLinks = ref<Array<{id: string, data: LinkData}>>([]) // 提取的链接数据
+const extractedLinks = ref<Array<{ id: string, data: LinkData }>>([]) // 提取的链接数据
 
 // 计算内容
 const computedContent = computed(() => {
@@ -211,7 +179,7 @@ const computedContent = computed(() => {
 const decodedContent = computed(() => {
   const content = computedContent.value
   if (!content) return ''
-  
+
   try {
     switch (props.encoding) {
       case 'base64':
@@ -231,27 +199,27 @@ const decodedContent = computed(() => {
 // 处理文本内容
 const processedText = computed(() => {
   let text = decodedContent.value
-  
+
   // 处理长度限制
   if (props.maxLength > 0 && text.length > props.maxLength) {
     text = text.substring(0, props.maxLength) + props.ellipsis
   }
-  
+
   // 自动链接
   if (props.autolink) {
     text = autoLink(text)
   }
-  
+
   // 表情符号
   if (props.emoji || (emoji as any).containEmoji(text)) {
     text = parseEmoji(text)
   }
-  
+
   // 语法高亮
   if (props.highlight) {
     text = highlightText(text)
   }
-  
+
   return text
 })
 
@@ -263,7 +231,7 @@ onMounted(() => {
 // 解析 HTML 节点
 const parseHtml = async (html: string) => {
   if (!html) return []
-  
+
   try {
     // 简单的 HTML 解析器
     const nodes = parseHtmlToNodes(html)
@@ -279,7 +247,7 @@ const parseHtml = async (html: string) => {
 // 解析 Markdown
 const parseMarkdown = (markdown: string) => {
   if (!markdown) return []
-  
+
   try {
     const nodes = parseMarkdownToNodes(markdown)
     emit('parse-success', nodes)
@@ -296,7 +264,7 @@ const formattedJson = computed(() => {
   try {
     const content = decodedContent.value
     if (!content) return ''
-    
+
     const obj = JSON.parse(content)
     return JSON.stringify(obj, null, 2)
   } catch (error) {
@@ -307,14 +275,14 @@ const formattedJson = computed(() => {
 // 简单的 HTML 解析器
 const parseHtmlToNodes = (html: string): any[] => {
   const nodes: any[] = []
-  
+
   // 移除危险标签
   let safeHtml = html
   props.filterTags.forEach(tag => {
     const regex = new RegExp(`<${tag}[^>]*>.*?</${tag}>`, 'gis')
     safeHtml = safeHtml.replace(regex, '')
   })
-  
+
   // 简化的解析逻辑
   // 实际项目中可以使用更完善的 HTML 解析库
   const textMatch = safeHtml.match(/>(.*?)</)
@@ -324,7 +292,7 @@ const parseHtmlToNodes = (html: string): any[] => {
       text: textMatch[1]
     })
   }
-  
+
   return nodes
 }
 
@@ -332,12 +300,12 @@ const parseHtmlToNodes = (html: string): any[] => {
 const parseMarkdownToNodes = (markdown: string): any[] => {
   const nodes: any[] = []
   const lines = markdown.split('\n')
-  
+
   for (let i = 0; i < lines.length; i++) {
     const line = lines[i].trim()
-    
+
     if (!line) continue
-    
+
     // 标题
     const headingMatch = line.match(/^(#{1,6})\s+(.+)$/)
     if (headingMatch) {
@@ -348,7 +316,7 @@ const parseMarkdownToNodes = (markdown: string): any[] => {
       })
       continue
     }
-    
+
     // 列表项
     const listMatch = line.match(/^[\*\-\+]\s+(.+)$/)
     if (listMatch) {
@@ -358,7 +326,7 @@ const parseMarkdownToNodes = (markdown: string): any[] => {
         i++
         items.push(lines[i].replace(/^[\*\-\+]\s+/, ''))
       }
-      
+
       nodes.push({
         type: 'list',
         ordered: false,
@@ -366,7 +334,7 @@ const parseMarkdownToNodes = (markdown: string): any[] => {
       })
       continue
     }
-    
+
     // 数字列表
     const orderedListMatch = line.match(/^\d+\.\s+(.+)$/)
     if (orderedListMatch) {
@@ -375,7 +343,7 @@ const parseMarkdownToNodes = (markdown: string): any[] => {
         i++
         items.push(lines[i + 1].replace(/^\d+\.\s+/, ''))
       }
-      
+
       nodes.push({
         type: 'list',
         ordered: true,
@@ -383,7 +351,7 @@ const parseMarkdownToNodes = (markdown: string): any[] => {
       })
       continue
     }
-    
+
     // 引用
     if (line.startsWith('> ')) {
       nodes.push({
@@ -392,18 +360,18 @@ const parseMarkdownToNodes = (markdown: string): any[] => {
       })
       continue
     }
-    
+
     // 代码块
     if (line.startsWith('```')) {
       const language = line.substring(3).trim() || ''
       const codeLines = []
-      
+
       while (i + 1 < lines.length && !lines[i + 1].startsWith('```')) {
         i++
         codeLines.push(lines[i])
       }
       i++ // 跳过结束的 ```
-      
+
       nodes.push({
         type: 'code',
         language,
@@ -411,14 +379,14 @@ const parseMarkdownToNodes = (markdown: string): any[] => {
       })
       continue
     }
-    
+
     // 普通段落
     nodes.push({
       type: 'paragraph',
       text: line
     })
   }
-  
+
   return nodes
 }
 
@@ -440,13 +408,13 @@ const parseEmoji = (text: string): string => {
     ':*': '😘',
     '<3': '❤️'
   }
-  
+
   let result = text
   Object.keys(emojiMap).forEach(key => {
     const k = key.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')
     result = result.replace(new RegExp(k, 'g'), emojiMap[k])
   })
-  
+
   return result
 }
 
@@ -455,12 +423,12 @@ const highlightText = (text: string): string => {
   // 简单的关键词高亮
   const keywords = ['important', 'urgent', 'note', 'warning', 'info']
   let result = text
-  
+
   keywords.forEach(keyword => {
     const regex = new RegExp(`\\b${keyword}\\b`, 'gi')
     result = result.replace(regex, `<span class="highlight">${keyword}</span>`)
   })
-  
+
   return result
 }
 
@@ -469,11 +437,11 @@ const handleLinkPress = (event: any) => {
   const url = event.detail?.href
   if (url) {
     emit('linkpress', url)
-    
+
     if (props.preventDefault) {
       return
     }
-    
+
     // 检查域名是否允许
     if (props.allowDomains.length > 0) {
       try {
@@ -489,7 +457,7 @@ const handleLinkPress = (event: any) => {
         console.error('解析URL失败:', error)
       }
     }
-    
+
     // 跳转到链接
     uni.navigateTo({
       url: `/pages/webview/webview?url=${encodeURIComponent(url)}`
@@ -504,31 +472,31 @@ const handleLinkPress = (event: any) => {
 const parseHtmlWithLinks = (html: string): { nodes: any[], links: LinkData[] } => {
   const links: LinkData[] = []
   let linkIndex = 0
-  
+
   // 使用正则表达式匹配 a 标签
   const linkRegex = /<a\s+(?:[^>]*?\s+)?href=(["'])(.*?)\1[^>]*?>(.*?)<\/a>/gi
-  
+
   // 替换链接为可点击元素
   const processedHtml = html.replace(linkRegex, (match, quote, url, text) => {
     // 清理 URL
     const cleanUrl = url.trim()
     const cleanText = text.replace(/<[^>]*>/g, '').trim()
-    
+
     // 检查是否为外部链接
-    const isExternal = /^(https?:)?\/\//i.test(cleanUrl) && 
-                      !cleanUrl.includes(location.hostname)
-    
+    const isExternal = /^(https?:)?\/\//i.test(cleanUrl) &&
+      !cleanUrl.includes(location.hostname)
+
     const linkData: LinkData = {
       url: cleanUrl,
       text: cleanText,
       isExternal
     }
-    
+
     links.push(linkData)
-    
+
     // 生成唯一的 ID
     const linkId = `link-${linkIndex++}`
-    
+
     // 替换为可点击的富文本节点
     return `<span 
               data-link-id="${linkId}" 
@@ -537,7 +505,7 @@ const parseHtmlWithLinks = (html: string): { nodes: any[], links: LinkData[] } =
               class="im-parse-link"
             >${cleanText}</span>`
   })
-  
+
   // 解析电子邮件（如果启用）
   let finalHtml = processedHtml
   if (props.options?.parseEmail) {
@@ -550,7 +518,7 @@ const parseHtmlWithLinks = (html: string): { nodes: any[], links: LinkData[] } =
         isExternal: false
       }
       links.push(linkData)
-      
+
       return `<span 
                 data-link-id="${emailId}" 
                 data-link-url="mailto:${email}"
@@ -559,7 +527,7 @@ const parseHtmlWithLinks = (html: string): { nodes: any[], links: LinkData[] } =
               >${email}</span>`
     })
   }
-  
+
   // 解析电话号码（如果启用）
   if (props.options?.parsePhone) {
     const phoneRegex = /(\+?\d[\d\s\-\(\)]{7,}\d)/g
@@ -572,7 +540,7 @@ const parseHtmlWithLinks = (html: string): { nodes: any[], links: LinkData[] } =
         isExternal: false
       }
       links.push(linkData)
-      
+
       return `<span 
                 data-link-id="${phoneId}" 
                 data-link-url="tel:${cleanPhone}"
@@ -581,13 +549,13 @@ const parseHtmlWithLinks = (html: string): { nodes: any[], links: LinkData[] } =
               >${phone}</span>`
     })
   }
-  
+
   // 提取链接信息到响应式数组
   extractedLinks.value = links.map((link, index) => ({
     id: `link-${index}`,
     data: link
   }))
-  
+
   // 返回解析后的节点（这里简化处理，实际可能需要更复杂的 HTML 解析）
   return {
     nodes: [{
@@ -610,12 +578,12 @@ const parseHtmlWithLinks = (html: string): { nodes: any[], links: LinkData[] } =
 const handleLinkClick = (linkData: LinkData, event?: Event) => {
   // 触发自定义事件
   emit('link-click', linkData, event)
-  
+
   // 调用用户提供的回调
   if (props.options?.onLinkClick) {
     props.options.onLinkClick(linkData, event)
   }
-  
+
   // 执行默认行为（在 uniapp 中）
   handleDefaultLinkBehavior(linkData)
 }
@@ -625,7 +593,7 @@ const handleLinkClick = (linkData: LinkData, event?: Event) => {
  */
 const handleDefaultLinkBehavior = (linkData: LinkData) => {
   const { url, isExternal } = linkData
-  
+
   // 处理邮件链接
   if (url.startsWith('mailto:')) {
     uni.makePhoneCall({
@@ -639,7 +607,7 @@ const handleDefaultLinkBehavior = (linkData: LinkData) => {
     })
     return
   }
-  
+
   // 处理电话链接
   if (url.startsWith('tel:')) {
     uni.makePhoneCall({
@@ -653,7 +621,7 @@ const handleDefaultLinkBehavior = (linkData: LinkData) => {
     })
     return
   }
-  
+
   // 处理网页链接
   if (/^(https?:)?\/\//i.test(url)) {
     // 在 uniapp 中打开网页
@@ -691,7 +659,7 @@ const handleDefaultLinkBehavior = (linkData: LinkData) => {
 const handleRichTextItemClick = (event: any) => {
   console.log('click', event)
   const { dataset } = event.detail || {}
-  
+
   if (dataset && dataset.linkId) {
     const linkItem = extractedLinks.value.find(item => item.id === dataset.linkId)
     if (linkItem) {
@@ -701,7 +669,7 @@ const handleRichTextItemClick = (event: any) => {
         ...linkItem.data,
         url: decodedUrl
       }
-      
+
       handleLinkClick(linkData, event)
     }
   }
@@ -758,7 +726,7 @@ const handleImageLoad = (src: string) => {
 // 重新解析
 const reparse = async () => {
   lastError.value = null
-  
+
   if (props.mode === 'html') {
     // parsedNodes.value = await parseHtml(decodedContent.value)
     initParse()
@@ -823,28 +791,29 @@ defineExpose({
   width: 100%;
   word-break: break-word;
   line-height: 1.6;
-  
+
   &__html {
+
     // HTML 样式
     :deep(img) {
       max-width: 100%;
       height: auto;
       vertical-align: middle;
     }
-    
+
     :deep(a) {
       color: #409eff;
       text-decoration: none;
-      
+
       &:active {
         opacity: 0.7;
       }
     }
-    
+
     :deep(p) {
       margin: 16rpx 0;
     }
-    
+
     :deep(h1),
     :deep(h2),
     :deep(h3),
@@ -854,33 +823,33 @@ defineExpose({
       margin: 32rpx 0 16rpx;
       font-weight: bold;
     }
-    
+
     :deep(h1) {
       font-size: 40rpx;
     }
-    
+
     :deep(h2) {
       font-size: 36rpx;
     }
-    
+
     :deep(h3) {
       font-size: 32rpx;
     }
-    
+
     :deep(h4) {
       font-size: 28rpx;
     }
-    
+
     :deep(ul),
     :deep(ol) {
       margin: 16rpx 0;
       padding-left: 48rpx;
     }
-    
+
     :deep(li) {
       margin: 8rpx 0;
     }
-    
+
     :deep(blockquote) {
       margin: 16rpx 0;
       padding: 16rpx 32rpx;
@@ -888,7 +857,7 @@ defineExpose({
       border-left: 8rpx solid #ddd;
       color: #666;
     }
-    
+
     :deep(code) {
       padding: 4rpx 8rpx;
       background-color: #f5f5f5;
@@ -896,44 +865,44 @@ defineExpose({
       font-family: Consolas, Monaco, 'Courier New', monospace;
       font-size: 90%;
     }
-    
+
     :deep(pre) {
       margin: 16rpx 0;
       padding: 24rpx;
       background-color: #f5f5f5;
       border-radius: 8rpx;
       overflow-x: auto;
-      
+
       code {
         padding: 0;
         background-color: transparent;
       }
     }
-    
+
     :deep(table) {
       width: 100%;
       border-collapse: collapse;
       margin: 16rpx 0;
-      
+
       th,
       td {
         padding: 16rpx;
         border: 2rpx solid #ddd;
         text-align: left;
       }
-      
+
       th {
         background-color: #f5f5f5;
         font-weight: bold;
       }
     }
   }
-  
+
   &__text {
     display: block;
     width: 100%;
   }
-  
+
   &__markdown {
     .highlight {
       background-color: #fffbe6;
@@ -942,70 +911,70 @@ defineExpose({
       color: #d48806;
     }
   }
-  
+
   &__heading {
     margin: 32rpx 0 16rpx;
     font-weight: bold;
-    
+
     &--1 {
       font-size: 40rpx;
     }
-    
+
     &--2 {
       font-size: 36rpx;
     }
-    
+
     &--3 {
       font-size: 32rpx;
     }
-    
+
     &--4 {
       font-size: 28rpx;
     }
-    
+
     &--5 {
       font-size: 26rpx;
     }
-    
+
     &--6 {
       font-size: 24rpx;
     }
   }
-  
+
   &__paragraph {
     margin: 16rpx 0;
   }
-  
+
   &__list {
     margin: 16rpx 0;
-    
+
     &--ordered {
       padding-left: 48rpx;
       list-style-type: decimal;
     }
-    
+
     &:not(.im-parse__list--ordered) {
       padding-left: 48rpx;
       list-style-type: disc;
     }
   }
-  
+
   &__list-item {
     display: flex;
     align-items: flex-start;
     margin: 8rpx 0;
   }
-  
+
   &__list-marker {
     margin-right: 16rpx;
     min-width: 32rpx;
     text-align: right;
   }
-  
+
   &__list-text {
     flex: 1;
   }
-  
+
   &__blockquote {
     margin: 16rpx 0;
     padding: 16rpx 32rpx;
@@ -1013,7 +982,7 @@ defineExpose({
     border-left: 8rpx solid #ddd;
     color: #666;
   }
-  
+
   &__code-block {
     margin: 16rpx 0;
     padding: 24rpx;
@@ -1021,18 +990,18 @@ defineExpose({
     border-radius: 8rpx;
     overflow-x: auto;
   }
-  
+
   &__code-text {
     font-family: Consolas, Monaco, 'Courier New', monospace;
     font-size: 90%;
     white-space: pre;
   }
-  
+
   &__json {
     width: 100%;
     overflow-x: auto;
   }
-  
+
   &__json-pre {
     margin: 0;
     padding: 24rpx;

package/components/im-read-receipt/im-read-receipt.vue

@@ -107,7 +107,7 @@ const loadReadedUser = async (userIds: number[]) => {
 			displayName: '',
 			avatar: '',
 			isDnd: false,
-			lastContent: '',
+			lastMessage: '',
 			unreadCount: 0,
 			hotMinIdx: 0,
 			readedMessageIdx: 0,

package/components/im-sku/im-sku.vue

@@ -142,6 +142,7 @@
 </template>
 
 <script lang="ts" setup>
+import { ref, computed, watch, nextTick } from 'vue'
 import type {
     SkuProps,
     SkuEmits,

package/components/im-stepper/im-stepper.vue

@@ -17,8 +17,7 @@
             buttonStyle,
             isMinusDisabled ? disabledButtonStyle : {},
             isMinusActive ? buttonActiveStyle : {}
-        ]"
-            @click="onMinusClick">
+        ]" @click="onMinusClick">
             <im-icon v-if="minusIcon" :name="minusIcon" :size="iconSize" :color="buttonTextColorComputed" />
             <text v-else-if="minusText" class="im-stepper-button-text" :style="{ color: buttonTextColorComputed }">
                 {{ minusText }}
@@ -57,6 +56,7 @@
 </template>
 
 <script lang="ts" setup>
+import { ref, computed, watch, nextTick, onMounted } from 'vue'
 import type { StepperProps, StepperEmits } from '../../types/components/stepper'
 import ImIcon from '../im-icon/im-icon.vue'
 

package/components/im-virtual-list/im-virtual-list.vue

@@ -1,6 +1,6 @@
 <template>
     <!-- 虚拟列表容器 -->
-    <scroll-view class="virtual-list" :scroll-y="true" :scroll-with-animation="true" :show-scrollbar="false"
+    <scroll-view class="im-virtual-list" :scroll-y="true" :scroll-with-animation="true" :show-scrollbar="false"
         :enhanced="true" :bounces="false" :lower-threshold="lowerThreshold" :upper-threshold="upperThreshold"
         :scroll-top="scrollTop" :scroll-into-view="scrollIntoViewId" @scroll="handleScroll"
         @scrolltolower="handleScrollToLower" @scrolltoupper="handleScrollToUpper">
@@ -313,7 +313,7 @@ const clearScrollTimer = () => {
 const measureContainer = () => {
     nextTick(() => {
         const query = uni.createSelectorQuery().in(getCurrentInstance())
-        query.select('.virtual-list').boundingClientRect((rect: any) => {
+        query.select('.im-virtual-list').boundingClientRect((rect: any) => {
             if (rect && rect.height) {
                 containerHeight.value = rect.height
             }
@@ -379,7 +379,7 @@ defineExpose({
 </script>
 
 <style lang="scss" scoped>
-.virtual-list {
+.im-virtual-list {
     // min-height: 200rpx;
     // height: 100vh;
 }

package/libs/index.ts

@@ -25,7 +25,7 @@ export interface Chat {
   displayName: string
   avatar: string
   isDnd: boolean
-  lastContent: string
+  lastMessage: string
   lastSendTime?: number
   unreadCount: number
   hotMinIdx: number

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "im-ui-mobile",
-  "version": "0.1.10",
+  "version": "0.1.12",
   "description": "A Vue3.0 + Typescript instant messaging component library for Uniapp",
   "type": "module",
   "main": "index.js",

package/types/components/nav-bar.d.ts

@@ -9,6 +9,7 @@ declare interface NavBarAction {
     disabled?: boolean
     badge?: string | number
     data?: any
+    click?: Function
 }
 
 declare interface NavBarProps {

package/types/components/sku.d.ts

@@ -1,6 +1,6 @@
 import { AllowedComponentProps, VNodeProps } from '../common'
 
-export interface _SkuAttr {
+declare interface _SkuAttr {
     /** 属性名称 */
     name: string;
     /** 属性值列表 */
@@ -11,7 +11,7 @@ export interface _SkuAttr {
     required?: boolean;
 }
 
-export interface _SkuAttrValue {
+declare interface _SkuAttrValue {
     /** 属性值名称 */
     name: string;
     /** 属性值ID */
@@ -26,7 +26,7 @@ export interface _SkuAttrValue {
     previewImgUrl?: string;
 }
 
-export interface _SkuSpec {
+declare interface _SkuSpec {
     /** 规格名称 */
     name: string;
     /** 规格值列表 */
@@ -37,7 +37,7 @@ export interface _SkuSpec {
     required?: boolean;
 }
 
-export interface _SkuValue {
+declare interface _SkuValue {
     /** 规格值名称 */
     name: string;
     /** 规格值ID */
@@ -52,7 +52,7 @@ export interface _SkuValue {
     previewImgUrl?: string;
 }
 
-export interface _SkuItem {
+declare interface _SkuItem {
     /** SKU ID */
     id: string | number;
     /** 商品ID */
@@ -75,7 +75,7 @@ export interface _SkuItem {
     disabled?: boolean;
 }
 
-export interface _SkuGoodsInfo {
+declare interface _SkuGoodsInfo {
     /** 商品ID */
     id: string | number;
     /** 商品标题 */
@@ -100,7 +100,7 @@ export interface _SkuGoodsInfo {
     unit?: string;
 }
 
-export interface _SelectedSku {
+declare interface _SelectedSku {
     /** 选中的属性组合 */
     selectedAttrs: Record<string, string>;
     /** 选中的规格组合 */

package/types/index.d.ts

@@ -49,7 +49,7 @@ import validator, {
     validatePassword
 } from './utils/validator.d.ts'
 import { EmojiType, EmojiCategoryType } from './components/emoji-picker'
-import * as base64 from "./utils/base64.d.ts";
+import * as base64 from "./utils/base64.d.ts"
 
 declare module 'im-ui-mobile' {
     export function install(): void
@@ -123,4 +123,6 @@ declare module 'im-ui-mobile' {
         TERMINAL_TYPE,
         MESSAGE_STATUS,
     }
+
+    export * from './components/sku.d.ts'
 }

package/types/libs/index.d.ts

@@ -22,7 +22,7 @@ export interface Chat {
     displayName: string;
     avatar: string;
     isDnd: boolean;
-    lastContent: string;
+    lastMessage: string;
     lastSendTime?: number;
     unreadCount: number;
     hotMinIdx: number;