uview-pro 0.6.14 → 0.6.16

package/components/u-step/u-step.vue

@@ -42,6 +42,14 @@
         <view class="u-steps__item__line" :class="['u-steps__item__line--' + mode]" v-if="showLine">
             <u-line :direction="direction" length="100%" :hair-line="false" :color="unActiveColor"></u-line>
         </view>
+        <!-- 横排模式下补左半连接线：节点宽度不一致时避免与上一个节点之间连线断开 -->
+        <view
+            class="u-steps__item__line"
+            :class="['u-steps__item__line--left--' + mode]"
+            v-if="direction === 'row' && childIndex > 0"
+        >
+            <u-line :direction="direction" length="100%" :hair-line="false" :color="unActiveColor"></u-line>
+        </view>
     </view>
 </template>
 <script lang="ts">
@@ -60,6 +68,8 @@ export default {
 import { computed } from 'vue';
 import { $u, useChildren } from '../..';
 import { StepProps } from './types';
+import uIcon from '../u-icon/u-icon.vue';
+import uLine from '../u-line/u-line.vue';
 
 const props = defineProps(StepProps);
 
@@ -154,6 +164,8 @@ $u-steps-item-dot-width: 20rpx;
     flex-direction: column;
 
     &--row {
+        // 步骤多时禁止收缩到内容宽度以下，超宽交给容器横向滚动，避免文字遮挡
+        flex: 1 0 auto;
         align-items: center;
         @include vue-flex;
         flex-direction: column;
@@ -162,17 +174,31 @@ $u-steps-item-dot-width: 20rpx;
             position: absolute;
             z-index: 0;
 
+            // 右半线：自本节点圆心向右伸至自身右边缘，与下一节点的左半线无缝衔接
             &--dot {
-                width: calc(100% - #{$u-steps-item-dot-width});
+                width: calc(50% - #{$u-steps-item-dot-width} / 2);
                 top: calc(#{$u-steps-item-dot-width} / 2);
                 left: calc(#{$u-steps-item-dot-width} / 2 + 50%);
             }
 
+            // 左半线：自自身左边缘向左半圆心（不含圆心），补偿右半线在宽度不同时够不到下一节点圆心
+            &--left--dot {
+                width: calc(50% - #{$u-steps-item-dot-width} / 2);
+                top: calc(#{$u-steps-item-dot-width} / 2);
+                right: calc(#{$u-steps-item-dot-width} / 2 + 50%);
+            }
+
             &--number {
-                width: calc(100% - $u-steps-item-number-width);
+                width: calc(50% - #{$u-steps-item-number-width} / 2);
                 top: calc(#{$u-steps-item-number-width} / 2);
                 left: calc(#{$u-steps-item-number-width} / 2 + 50%);
             }
+
+            &--left--number {
+                width: calc(50% - #{$u-steps-item-number-width} / 2);
+                top: calc(#{$u-steps-item-number-width} / 2);
+                right: calc(#{$u-steps-item-number-width} / 2 + 50%);
+            }
         }
     }
 
@@ -250,6 +276,8 @@ $u-steps-item-dot-width: 20rpx;
     }
 
     &__desc--row {
+        // 保持单行，超宽由容器横向滚动承载
+        white-space: nowrap;
         color: $u-type-info;
         font-size: 24rpx;
     }

package/components/u-steps/u-steps.vue

@@ -55,6 +55,7 @@ export default {
 import { computed, getCurrentInstance } from 'vue';
 import { StepsProps } from './types';
 import { $u, useParent } from '../..';
+import uStep from '../u-step/u-step.vue';
 
 /**
  * steps 步骤条
@@ -75,7 +76,19 @@ const props = defineProps(StepsProps);
 
 const { children } = useParent('u-steps');
 // 计算方向样式
-const directionStyle = computed(() => ({ flexDirection: props.direction as 'row' | 'column' }));
+const directionStyle = computed(() => {
+    const isRow = props.direction === 'row';
+    return {
+        flexDirection: props.direction as 'row' | 'column',
+        ...(isRow
+            ? {
+                  // 内容总宽超出一行时横向滚动，避免右侧节点被截断
+                  overflowX: 'auto',
+                  flexWrap: 'nowrap'
+              }
+            : {})
+    };
+});
 
 defineExpose({
     props,

package/components/u-switch/u-switch.vue

@@ -35,6 +35,7 @@ import { computed, nextTick } from 'vue';
 import { $u, useChildren } from '../..';
 import { SwitchProps } from './types';
 import type { SizeType } from '../../types/global';
+import uLoading from '../u-loading/u-loading.vue';
 
 /**
  * switch 开关选择器

package/components/u-tabbar/u-tabbar.vue

@@ -103,6 +103,9 @@ import { ref, computed, onMounted } from 'vue';
 import { $u } from '../..';
 import { TabbarProps } from './types';
 import type { TabbarItem } from '../../types/global';
+import uBadge from '../u-badge/u-badge.vue';
+import uGap from '../u-gap/u-gap.vue';
+import uIcon from '../u-icon/u-icon.vue';
 
 /**
  * u-tabbar 底部导航栏

package/components/u-tabs/u-tabs.vue

@@ -51,6 +51,7 @@ export default {
 import { ref, computed, watch, onMounted, nextTick, getCurrentInstance } from 'vue';
 import { $u } from '../..';
 import { TabsProps } from './types';
+import uBadge from '../u-badge/u-badge.vue';
 
 /**
  * tabs 标签

package/components/u-tabs-swiper/u-tabs-swiper.vue

@@ -44,6 +44,7 @@ import { ref, computed, watch, nextTick, onMounted, getCurrentInstance } from 'v
 import colorGradient from '../../libs/function/colorGradient';
 import { TabsSwiperProps } from './types';
 import { $u } from '../..';
+import uBadge from '../u-badge/u-badge.vue';
 
 /**
  * tabsSwiper 全屏选项卡

package/components/u-tag/u-tag.vue

@@ -46,6 +46,7 @@ export default {
 import { computed } from 'vue';
 import { TagProps } from './types';
 import { $u } from '../../';
+import uIcon from '../u-icon/u-icon.vue';
 
 /**
  * tag 提示

package/components/u-text/u-text.vue

@@ -85,6 +85,8 @@ export default {
 import { computed } from 'vue';
 import { TextProps } from './types';
 import { $u } from '../../';
+import uIcon from '../u-icon/u-icon.vue';
+import uLink from '../u-link/u-link.vue';
 
 /**
  * Text 文本

package/components/u-textarea/u-textarea.vue

@@ -91,6 +91,7 @@ import { ref, computed, watch, nextTick } from 'vue';
 import { TextareaProps } from './types';
 import { $u, useChildren } from '../../';
 import type { SizeType } from '../../types/global';
+import uIcon from '../u-icon/u-icon.vue';
 
 /**
  * Textarea 文本域

package/components/u-toast/u-toast.vue

@@ -60,6 +60,9 @@ import {
     getEventWithCurrentPage,
     type ToastPayload
 } from './service';
+import uIcon from '../u-icon/u-icon.vue';
+import uLoading from '../u-loading/u-loading.vue';
+import uMask from '../u-mask/u-mask.vue';
 
 /**
  * toast 消息提示

package/components/u-upload/u-upload.vue

@@ -245,6 +245,8 @@ import { ref, watch, computed } from 'vue';
 import { $u, useLocale } from '../..';
 import { UploadProps } from './types';
 import type { UploadFileItem } from '../../types/global';
+import uIcon from '../u-icon/u-icon.vue';
+import uLineProgress from '../u-line-progress/u-line-progress.vue';
 
 /**
  * upload 文件上传

package/package.json

@@ -2,12 +2,31 @@
     "id": "uview-pro",
     "name": "uview-pro",
     "displayName": "【支持鸿蒙】uView Pro｜基于Vue3+TS的高质量UI组件库，支持多主题、暗黑模式、多语言",
-    "version": "0.6.14",
+    "version": "0.6.16",
     "description": "uView Pro是基于Vue3+TS的多平台UI框架，提供80+高质量组件、便捷工具和常用模板，支持多主题、暗黑模式、多语言，支持H5/APP/鸿蒙/小程序多端开发。已在鸿蒙应用商店上架，欢迎体验！",
     "main": "index.ts",
     "module": "index.ts",
     "browser": "index.ts",
-    "types": "index.ts",
+    "types": "index.d.ts",
+    "exports": {
+        ".": {
+            "types": "./index.d.ts",
+            "import": "./index.ts",
+            "require": "./index.ts",
+            "default": "./index.ts"
+        },
+        "./plugins": {
+            "types": "./plugins/index.ts",
+            "import": "./plugins/index.mjs",
+            "require": "./plugins/index.cjs",
+            "default": "./plugins/index.mjs"
+        },
+        "./types": "./types/index.d.ts",
+        "./types/*": "./types/*.d.ts",
+        "./components/*": "./components/*",
+        "./libs/*": "./libs/*",
+        "./*": "./*"
+    },
     "keywords": [
         "uview-pro",
         "vue3",

package/plugins/root/page.ts

@@ -1,77 +1,77 @@
-import { parseSFC, findNode } from './utils';
-
-/**
- * 页面模板转换：将页面内容包裹在 <global-root-view> 中
- *
- * <global-root-view> 是 App.root.vue 注册的全局组件，
- * 其模板中包含 <slot />，页面内容通过插槽传入。
- *
- * 处理逻辑：
- * 1. 解析 SFC，定位 <template> 标签的起止位置
- * 2. 提取模板内容，查找 PageMeta 节点（如有则提取到包裹层外部）
- * 3. 将剩余内容包裹在 <global-root-view>...</global-root-view> 中
- *
- * 降级机制：当 vue/compiler-sfc 不可用（如 HBuilderX 项目）时，
- * 使用正则匹配 <page-meta> 标签替代 AST 解析。
- */
-export async function transformPage(code: string) {
-    const sfc = await parseSFC(code);
-
-    // 用正则定位 <template> 开头标签
-    const openMatch = code.match(/<template\b[^>]*>/);
-    if (!openMatch) return null;
-
-    // 使用 lastIndexOf 定位最后一个 </template>，即根 <template> 的闭合标签
-    // 避免匹配到模板内具名插槽 <template #slot> 的闭合标签
-    const closeTagStart = code.lastIndexOf('</template>');
-    if (closeTagStart === -1) return null;
-
-    const openTagEnd = openMatch.index! + openMatch[0].length;
-    const content = code.slice(openTagEnd, closeTagStart);
-
-    let pageMetaSource = '';
-    let newContent = content;
-
-    if (sfc?.template) {
-        // AST 模式：通过 vue/compiler-sfc 解析，精确定位 PageMeta 节点
-        const pageMetaNode = findNode(sfc, 'PageMeta');
-        if (pageMetaNode) {
-            pageMetaSource = pageMetaNode.loc.source;
-            const metaStart = pageMetaNode.loc.start.offset;
-            const metaEnd = pageMetaNode.loc.end.offset;
-
-            // pageMetaNode.loc 的 offset 是相对于整个文件的，转换为相对于 content 的位置
-            const metaStartInContent = metaStart - openTagEnd;
-            const metaEndInContent = metaEnd - openTagEnd;
-
-            newContent = content.slice(0, metaStartInContent) + content.slice(metaEndInContent);
-        }
-    } else {
-        // 降级模式：vue/compiler-sfc 不可用，用正则匹配 <page-meta> 标签
-        const pageMetaMatch = content.match(/<page-meta\b[^>]*>[\s\S]*?<\/page-meta>/);
-        if (pageMetaMatch) {
-            pageMetaSource = pageMetaMatch[0];
-            newContent = content.replace(pageMetaMatch[0], '');
-        } else {
-            // 也匹配自闭合的 <page-meta ... />
-            const selfClosingMatch = content.match(/<page-meta\b[^>]*\/>/);
-            if (selfClosingMatch) {
-                pageMetaSource = selfClosingMatch[0];
-                newContent = content.replace(selfClosingMatch[0], '');
-            }
-        }
-    }
-
-    // page-meta 放在包裹层外部，内容包裹在 <global-root-view> 中
-    const wrappedContent = `\n${pageMetaSource}\n<global-root-view>${newContent}</global-root-view>\n`;
-
-    return {
-        code: code.slice(0, openTagEnd) + wrappedContent + code.slice(closeTagStart),
-        map: {
-            version: 3 as const,
-            sources: [] as string[],
-            names: [] as string[],
-            mappings: ''
-        }
-    };
-}
+import { parseSFC, findNode } from './utils';
+
+/**
+ * 页面模板转换：将页面内容包裹在 <global-root-view> 中
+ *
+ * <global-root-view> 是 App.root.vue 注册的全局组件，
+ * 其模板中包含 <slot />，页面内容通过插槽传入。
+ *
+ * 处理逻辑：
+ * 1. 解析 SFC，定位 <template> 标签的起止位置
+ * 2. 提取模板内容，查找 PageMeta 节点（如有则提取到包裹层外部）
+ * 3. 将剩余内容包裹在 <global-root-view>...</global-root-view> 中
+ *
+ * 降级机制：当 vue/compiler-sfc 不可用（如 HBuilderX 项目）时，
+ * 使用正则匹配 <page-meta> 标签替代 AST 解析。
+ */
+export async function transformPage(code: string) {
+    const sfc = await parseSFC(code);
+
+    // 用正则定位 <template> 开头标签
+    const openMatch = code.match(/<template\b[^>]*>/);
+    if (!openMatch) return null;
+
+    // 使用 lastIndexOf 定位最后一个 </template>，即根 <template> 的闭合标签
+    // 避免匹配到模板内具名插槽 <template #slot> 的闭合标签
+    const closeTagStart = code.lastIndexOf('</template>');
+    if (closeTagStart === -1) return null;
+
+    const openTagEnd = openMatch.index! + openMatch[0].length;
+    const content = code.slice(openTagEnd, closeTagStart);
+
+    let pageMetaSource = '';
+    let newContent = content;
+
+    if (sfc?.template) {
+        // AST 模式：通过 vue/compiler-sfc 解析，精确定位 PageMeta 节点
+        const pageMetaNode = findNode(sfc, 'PageMeta');
+        if (pageMetaNode) {
+            pageMetaSource = pageMetaNode.loc.source;
+            const metaStart = pageMetaNode.loc.start.offset;
+            const metaEnd = pageMetaNode.loc.end.offset;
+
+            // pageMetaNode.loc 的 offset 是相对于整个文件的，转换为相对于 content 的位置
+            const metaStartInContent = metaStart - openTagEnd;
+            const metaEndInContent = metaEnd - openTagEnd;
+
+            newContent = content.slice(0, metaStartInContent) + content.slice(metaEndInContent);
+        }
+    } else {
+        // 降级模式：vue/compiler-sfc 不可用，用正则匹配 <page-meta> 标签
+        const pageMetaMatch = content.match(/<page-meta\b[^>]*>[\s\S]*?<\/page-meta>/);
+        if (pageMetaMatch) {
+            pageMetaSource = pageMetaMatch[0];
+            newContent = content.replace(pageMetaMatch[0], '');
+        } else {
+            // 也匹配自闭合的 <page-meta ... />
+            const selfClosingMatch = content.match(/<page-meta\b[^>]*\/>/);
+            if (selfClosingMatch) {
+                pageMetaSource = selfClosingMatch[0];
+                newContent = content.replace(selfClosingMatch[0], '');
+            }
+        }
+    }
+
+    // page-meta 放在包裹层外部，内容包裹在 <global-root-view> 中
+    const wrappedContent = `\n${pageMetaSource}\n<global-root-view>${newContent}</global-root-view>\n`;
+
+    return {
+        code: code.slice(0, openTagEnd) + wrappedContent + code.slice(closeTagStart),
+        map: {
+            version: 3 as const,
+            sources: [] as string[],
+            names: [] as string[],
+            mappings: ''
+        }
+    };
+}

package/plugins/root/root.ts

@@ -1,53 +1,53 @@
-/**
- * 创建一个最小的 sourcemap，用于满足 Vite/Rollup 的 sourcemap 要求。
- *
- * 这是一个空映射的 sourcemap（mappings 为空字符串），不提供精确的源码映射，
- * 但可以避免 "Sourcemap is likely to be incorrect" 警告。
- * 调试器会回退到显示转换后的代码，不影响功能。
- *
- * 纯 JS 实现，无需第三方依赖。
- */
-function createEmptySourcemap() {
-    return {
-        version: 3 as const,
-        sources: [] as string[],
-        names: [] as string[],
-        mappings: ''
-    };
-}
-
-/**
- * 向 main.ts 注入 App.root.vue 的导入和全局注册
- *
- * 流程：
- * 1. 在文件顶部插入 `import GlobalRootView from "./App.root.vue"`
- * 2. 在 createSSRApp 之后插入 `app.component("global-root-view", GlobalRootView)`
- *
- * 注：GlobalRootView 仅为 main.ts 中的局部变量名，
- *     实际组件就是 App.root.vue，页面通过 <global-root-view> 标签使用。
- */
-export function registerRootApp(code: string, fileName: string = 'App.root') {
-    const importCode = `import GlobalRootView from "./${fileName}.vue";`;
-    const vueUseComponentCode = `app.component("global-root-view", GlobalRootView);`;
-
-    let newCode = importCode + '\n' + code;
-
-    // 在 createSSRApp 赋值语句之后插入组件注册代码
-    const ssrAppMatch = newCode.match(/(const\s+app\s*=\s*createSSRApp\([^)]+\);)/);
-    if (ssrAppMatch) {
-        newCode = newCode.replace(/(const\s+app\s*=\s*createSSRApp\([^)]+\);)/, `$1\n    ${vueUseComponentCode}`);
-    } else {
-        // 兜底：在 return { 之前插入
-        newCode = newCode.replace(/(createApp[\s\S]*?)(return\s*\{)/, `$1${vueUseComponentCode}\n    $2`);
-    }
-
-    return { code: newCode, map: createEmptySourcemap() };
-}
-
-/**
- * App.root.vue 模板中已使用 <slot /> 作为子内容插槽，
- * 无需替换，直接透传。
- */
-export function rebuildRootApp(code: string) {
-    return { code, map: createEmptySourcemap() };
-}
+/**
+ * 创建一个最小的 sourcemap，用于满足 Vite/Rollup 的 sourcemap 要求。
+ *
+ * 这是一个空映射的 sourcemap（mappings 为空字符串），不提供精确的源码映射，
+ * 但可以避免 "Sourcemap is likely to be incorrect" 警告。
+ * 调试器会回退到显示转换后的代码，不影响功能。
+ *
+ * 纯 JS 实现，无需第三方依赖。
+ */
+function createEmptySourcemap() {
+    return {
+        version: 3 as const,
+        sources: [] as string[],
+        names: [] as string[],
+        mappings: ''
+    };
+}
+
+/**
+ * 向 main.ts 注入 App.root.vue 的导入和全局注册
+ *
+ * 流程：
+ * 1. 在文件顶部插入 `import GlobalRootView from "./App.root.vue"`
+ * 2. 在 createSSRApp 之后插入 `app.component("global-root-view", GlobalRootView)`
+ *
+ * 注：GlobalRootView 仅为 main.ts 中的局部变量名，
+ *     实际组件就是 App.root.vue，页面通过 <global-root-view> 标签使用。
+ */
+export function registerRootApp(code: string, fileName: string = 'App.root') {
+    const importCode = `import GlobalRootView from "./${fileName}.vue";`;
+    const vueUseComponentCode = `app.component("global-root-view", GlobalRootView);`;
+
+    let newCode = importCode + '\n' + code;
+
+    // 在 createSSRApp 赋值语句之后插入组件注册代码
+    const ssrAppMatch = newCode.match(/(const\s+app\s*=\s*createSSRApp\([^)]+\);)/);
+    if (ssrAppMatch) {
+        newCode = newCode.replace(/(const\s+app\s*=\s*createSSRApp\([^)]+\);)/, `$1\n    ${vueUseComponentCode}`);
+    } else {
+        // 兜底：在 return { 之前插入
+        newCode = newCode.replace(/(createApp[\s\S]*?)(return\s*\{)/, `$1${vueUseComponentCode}\n    $2`);
+    }
+
+    return { code: newCode, map: createEmptySourcemap() };
+}
+
+/**
+ * App.root.vue 模板中已使用 <slot /> 作为子内容插槽，
+ * 无需替换，直接透传。
+ */
+export function rebuildRootApp(code: string) {
+    return { code, map: createEmptySourcemap() };
+}

package/types/index.d.ts

@@ -1,14 +1,15 @@
-/// <reference path="./components.d.ts" />
-/// <reference path="./uni-app.d.ts" />
-
-export * from './global';
-
-declare global {
-    interface Uni {
-        $u: typeof import('../libs').$u;
-    }
-}
-
-declare module 'uview-pro' {
-    export function install(): void;
-}
+/// <reference path="./components.d.ts" />
+/// <reference path="./uni-app.d.ts" />
+
+export * from './global';
+export * from '../libs';
+
+declare global {
+    interface Uni {
+        $u: typeof import('../libs').$u;
+    }
+}
+
+declare module 'uview-pro' {
+    export function install(app: any, options?: import('./global').UViewProOptions): void;
+}