@hlw-uni/mp-vue 2.3.3 → 2.3.6

package/dist/components/hlw-reward-ad/types.d.ts

@@ -0,0 +1,10 @@
+export interface HlwRewardAdResult {
+    /** 是否播放成功 */
+    success: boolean;
+    /** 广告是否完整播放结束 */
+    isEnded: boolean;
+    /** 广告加载是否失败 */
+    loadFailed?: boolean;
+    /** 加载/播放失败时的错误对象 */
+    err?: any;
+}

package/dist/core/theme/index.d.ts

@@ -1,9 +1,8 @@
 import { ComputedRef } from 'vue';
 import { Store } from 'pinia';
 
-export { themePresets, type ThemePreset, fontSizePresets, type FontSizePreset, fontFamilyPresets, type FontFamilyPreset } from '../../stores/theme';
+export { fontSizePresets, type FontSizePreset, fontFamilyPresets, type FontFamilyPreset } from '../../stores/theme';
 export declare function useTheme(): {
-    theme: ComputedRef<string>;
     fontSize: ComputedRef<string>;
     fontSizeClass: ComputedRef<string>;
     setFontSize: (size: string) => void;
@@ -11,7 +10,6 @@ export declare function useTheme(): {
     fontFamilyClass: ComputedRef<string>;
     setFontFamily: (font: string) => void;
     store: Store<"theme", {
-        theme: string;
         fontSize: string;
         fontFamily: string;
     }, {}, {

package/dist/index.d.ts

@@ -11,6 +11,7 @@ export * from './core';
 export * from './utils';
 export type { HlwMenuItem } from './components/hlw-menu/types';
 export type { HlwPagingRef, HlwPagingInstance } from './components/hlw-paging/types';
+export type { HlwRewardAdResult } from './components/hlw-reward-ad/types';
 export { useApp } from './app';
 export { hlw, type HlwInstance } from './hlw';
 export { vCopy } from './directives';

package/dist/index.js

@@ -8,28 +8,6 @@ var __publicField = (obj, key, value) => {
   return value;
 };
 
-  const themePresets = [
-    {
-      id: "white-theme",
-      name: "白色主题",
-      color: "#ffffff"
-    },
-    {
-      id: "light-theme",
-      name: "简洁主题",
-      color: "var(--bg-page, #f8f8f8)"
-    },
-    {
-      id: "mono-theme",
-      name: "单色主题",
-      color: "var(--primary-color, #3b82f6)"
-    },
-    {
-      id: "color-theme",
-      name: "颜色主题",
-      color: "var(--primary-color, #3b82f6)"
-    }
-  ];
   const fontSizePresets = [
     {
       id: "small",
@@ -76,7 +54,6 @@ var __publicField = (obj, key, value) => {
   ];
   const useThemeStore = pinia.defineStore("theme", {
     state: () => ({
-      theme: "white-theme",
       fontSize: "standard",
       fontFamily: "system"
     }),
@@ -97,7 +74,6 @@ var __publicField = (obj, key, value) => {
   });
   function useTheme() {
     const store = useThemeStore();
-    const theme = vue.computed(() => store.theme);
     const fontSize = vue.computed(() => store.fontSize);
     const fontSizeClass = vue.computed(() => {
       const found = fontSizePresets.find((p) => p.id === store.fontSize);
@@ -115,7 +91,6 @@ var __publicField = (obj, key, value) => {
       store.setFontFamily(font);
     }
     return {
-      theme,
       fontSize,
       fontSizeClass,
       setFontSize,
@@ -125,15 +100,7 @@ var __publicField = (obj, key, value) => {
       store
     };
   }
-  function initTheme(defaultTheme = "mono-theme") {
-    const hasCachedTheme = uni.getStorageSync("theme");
-    if (!hasCachedTheme) {
-      const store = useThemeStore();
-      const validThemes = themePresets.map((t) => t.id);
-      if (validThemes.includes(defaultTheme)) {
-        store.theme = defaultTheme;
-      }
-    }
+  function initTheme(defaultTheme) {
   }
   function useMsg() {
     function toast(opts) {
@@ -1202,7 +1169,6 @@ var __publicField = (obj, key, value) => {
   exports2.showRewardAd = showRewardAd;
   exports2.signText = signText;
   exports2.switchTab = switchTab;
-  exports2.themePresets = themePresets;
   exports2.toBoolean = toBoolean;
   exports2.toNumber = toNumber;
   exports2.toQuery = toQuery;

package/dist/index.mjs

@@ -7,28 +7,6 @@ var __publicField = (obj, key, value) => {
 import { computed, ref, onBeforeUpdate, onUnmounted, createSSRApp } from "vue";
 import { defineStore } from "pinia";
 import { onShareAppMessage, onShareTimeline } from "@dcloudio/uni-app";
-const themePresets = [
-  {
-    id: "white-theme",
-    name: "白色主题",
-    color: "#ffffff"
-  },
-  {
-    id: "light-theme",
-    name: "简洁主题",
-    color: "var(--bg-page, #f8f8f8)"
-  },
-  {
-    id: "mono-theme",
-    name: "单色主题",
-    color: "var(--primary-color, #3b82f6)"
-  },
-  {
-    id: "color-theme",
-    name: "颜色主题",
-    color: "var(--primary-color, #3b82f6)"
-  }
-];
 const fontSizePresets = [
   {
     id: "small",
@@ -75,7 +53,6 @@ const fontFamilyPresets = [
 ];
 const useThemeStore = defineStore("theme", {
   state: () => ({
-    theme: "white-theme",
     fontSize: "standard",
     fontFamily: "system"
   }),
@@ -96,7 +73,6 @@ const useThemeStore = defineStore("theme", {
 });
 function useTheme() {
   const store = useThemeStore();
-  const theme = computed(() => store.theme);
   const fontSize = computed(() => store.fontSize);
   const fontSizeClass = computed(() => {
     const found = fontSizePresets.find((p) => p.id === store.fontSize);
@@ -114,7 +90,6 @@ function useTheme() {
     store.setFontFamily(font);
   }
   return {
-    theme,
     fontSize,
     fontSizeClass,
     setFontSize,
@@ -124,15 +99,7 @@ function useTheme() {
     store
   };
 }
-function initTheme(defaultTheme = "mono-theme") {
-  const hasCachedTheme = uni.getStorageSync("theme");
-  if (!hasCachedTheme) {
-    const store = useThemeStore();
-    const validThemes = themePresets.map((t) => t.id);
-    if (validThemes.includes(defaultTheme)) {
-      store.theme = defaultTheme;
-    }
-  }
+function initTheme(defaultTheme) {
 }
 function useMsg() {
   function toast(opts) {
@@ -1202,7 +1169,6 @@ export {
   showRewardAd,
   signText,
   switchTab,
-  themePresets,
   toBoolean,
   toNumber,
   toQuery,

package/dist/stores/theme.d.ts

@@ -1,10 +1,4 @@
 import { StoreDefinition } from 'pinia';
-export interface ThemePreset {
-    id: string;
-    name: string;
-    color: string;
-}
-export declare const themePresets: ThemePreset[];
 export interface FontSizePreset {
     id: string;
     name: string;
@@ -18,7 +12,6 @@ export interface FontFamilyPreset {
 }
 export declare const fontFamilyPresets: FontFamilyPreset[];
 export declare const useThemeStore: StoreDefinition<"theme", {
-    theme: string;
     fontSize: string;
     fontFamily: string;
 }, {}, {

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@hlw-uni/mp-vue",
-    "version": "2.3.3",
+    "version": "2.3.6",
     "description": "hlw-uni工具集",
     "main": "dist/index.js",
     "module": "dist/index.mjs",

package/src/components/hlw-add-mini/index.vue

@@ -86,8 +86,8 @@ const top = computed(() => {
         try {
             const menuButtonInfo = uni.getMenuButtonBoundingClientRect();
             if (menuButtonInfo && menuButtonInfo.bottom > 0) {
-                // 胶囊底部高度 + 6px 作为气泡定位的顶部基准，使箭头离胶囊更近
-                return `${menuButtonInfo.bottom + 2}px`;
+                // 胶囊底部高度 + 12px 作为气泡定位的顶部基准，避免箭头与胶囊重叠
+                return `${menuButtonInfo.bottom + 12}px`;
             }
         } catch (e) {
             // 跨端环境不支持或报错时，执行安全降级计算

package/src/components/hlw-avatar-upload/index.vue

@@ -1,10 +1,7 @@
 <template>
     <view class="hlw-avatar-upload">
         <button class="avatar-wrapper" open-type="chooseAvatar" @chooseavatar="onChooseAvatar" @click="onClick">
-            <hlw-avatar :src="props.src || ''" :name="props.name || '微信用户'" :size="props.size" :border="props.border" />
-            <view class="edit-avatar">
-                <span class="iconfont icon-xiangji edit-avatar-icon" />
-            </view>
+            <slot />
         </button>
     </view>
 </template>
@@ -12,24 +9,6 @@
 <script setup lang="ts">
 defineOptions({ name: "HlwAvatarUpload" });
 
-interface Props {
-    /** 当前头像的网络/本地路径 */
-    src?: string;
-    /** 无头像时的备用展示昵称 */
-    name?: string;
-    /** 头像尺寸，可选 'small' | 'medium' | 'large' */
-    size?: "small" | "medium" | "large";
-    /** 边框线宽 */
-    border?: number;
-}
-
-const props = withDefaults(defineProps<Props>(), {
-    src: "",
-    name: "微信用户",
-    size: "large",
-    border: 3,
-});
-
 const emit = defineEmits<{
     (e: "onAvatar", filePath: string): void;
 }>();
@@ -58,13 +37,15 @@ function onClick() {
 
 <style scoped>
 .hlw-avatar-upload {
-    display: inline-block;
+    display: block;
+    width: 100%;
+    height: 100%;
 }
 
 .avatar-wrapper {
-    position: relative;
-    display: inline-block;
-    border-radius: 50%;
+    display: block;
+    width: 100%;
+    height: 100%;
     margin: 0;
     padding: 0;
     background: transparent;
@@ -78,26 +59,4 @@ function onClick() {
     border: none;
     display: none;
 }
-
-.edit-avatar {
-    position: absolute;
-    bottom: -8rpx;
-    right: -8rpx;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    width: 44rpx;
-    height: 44rpx;
-    margin: 0;
-    padding: 0;
-    border: 1rpx solid #e2e8f0; /* 圆角灰线 */
-    border-radius: 999rpx;
-    background: #ffffff; /* 白色背景 */
-    color: #64748b; /* 灰色相机图标 */
-    box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.08);
-}
-
-.edit-avatar .edit-avatar-icon {
-    font-size: 22rpx;
-}
 </style>

package/src/components/hlw-nav-bar/index.vue

@@ -1,14 +1,11 @@
 <template>
-    <view class="navbar" :class="theme">
+    <view class="navbar" :class="[props.border ? '' : 'no-border']">
         <view :style="bar_style"></view>
-        <view class="header" :style="{ height: header_height + 'px' }">
+        <view class="header" :style="{ height: header_height + 'px' }" :class="['align-' + props.titleAlign, props.isBack ? 'has-back' : '']">
             <view @tap="tapBack" class="left" v-if="props.isBack">
                 <span class="i-fa6-solid-chevron-left icon-left"></span>
             </view>
-            <text class="title">{{ title }}</text>
-        </view>
-        <view class="status-bar" v-if="theme === 'color-theme'">
-            <view class="within"></view>
+            <text class="title" :style="titleCustomStyle">{{ title }}</text>
         </view>
     </view>
     <view :style="{ height: navbar_height + 'px' }"></view>
@@ -21,9 +18,14 @@
  * 自适应状态栏高度与胶囊按钮，完美替代微信小程序原生导航栏。支持不同主题配色、返回按钮及自适应高度。
  *
  * @props
- *   title   - 导航栏标题文字
- *   isBack  - 是否显示返回按钮，默认 false；点击自动回退或回到首页
- *   isBar   - 是否占用状态栏高度，默认 true
+ *   title       - 导航栏标题文字
+ *   isBack      - 是否显示返回按钮，默认 false；点击自动回退或回到首页
+ *   isBar       - 是否占用状态栏高度，默认 true
+ *   titleAlign  - 标题对齐方式，'left' | 'center'
+ *   titleSize   - 标题字体大小，支持 CSS 单位或变量
+ *   titleStyle  - 标题字体，如 'sans-serif'
+ *   titleWeight - 标题字重，如 '500' | 'bold'
+ *   border      - 是否显示下边框（下划线），默认 true
  *
  * @example
  * ```vue
@@ -31,9 +33,6 @@
  * ```
  */
 import { computed, ref } from "vue";
-import { useTheme } from "@/core";
-
-const { theme } = useTheme();
 
 const statusBarHeight: number = uni.getSystemInfoSync()?.statusBarHeight || 0;
 const menuButtonInfo = uni.getMenuButtonBoundingClientRect();
@@ -51,6 +50,40 @@ const props = defineProps({
         type: Boolean,
         default: false,
     },
+    titleAlign: {
+        type: String,
+        default: "center", // 'left' | 'center'
+    },
+    titleSize: {
+        type: String,
+        default: "",
+    },
+    titleStyle: {
+        type: String,
+        default: "",
+    },
+    titleWeight: {
+        type: String,
+        default: "500",
+    },
+    border: {
+        type: Boolean,
+        default: true,
+    },
+});
+
+const titleCustomStyle = computed(() => {
+    const style: Record<string, string> = {};
+    if (props.titleSize) {
+        style["font-size"] = props.titleSize;
+    }
+    if (props.titleStyle) {
+        style["font-family"] = props.titleStyle;
+    }
+    if (props.titleWeight) {
+        style["font-weight"] = props.titleWeight;
+    }
+    return style;
 });
 
 const bar_style = computed(() => {
@@ -59,14 +92,9 @@ const bar_style = computed(() => {
     };
     return style;
 });
-let status_bar_height = 0;
-if (props.isBar) {
-    status_bar_height = 15;
-}
 
 const header_height = ref<number>(menuButtonInfo.bottom - statusBarHeight + 6);
 const navbar_height = ref(header_height.value + statusBarHeight);
-const status_bar_height_style = `${status_bar_height}px`;
 
 function tapBack() {
     uni.navigateBack({
@@ -86,65 +114,14 @@ function tapBack() {
     position: fixed;
     width: 750rpx;
     z-index: 999;
-    border-bottom: 1rpx solid rgba(226, 232, 240, 0);
+    background-color: var(--navbar-bg-color, #ffffff);
+    border-bottom: var(--navbar-border-bottom, none);
     transition:
         background-color 0.2s ease,
         border-bottom 0.2s ease;
 
-    /* 白色主题：白色导航栏，下方加一条灰色的细边框 */
-    &.white-theme {
-        background-color: var(--navbar-bg-color, #ffffff);
-        border-bottom: var(--navbar-border-bottom, 1rpx solid #e7e7e7);
-
-        .title {
-            color: var(--text-primary, #303048);
-        }
-
-        .icon-left {
-            color: var(--text-primary, #303048);
-        }
-    }
-
-    /* 简洁主题：背景色与页面全局背景色一致，无明显界限，无边框 */
-    &.light-theme {
-        background-color: var(--bg-page, #f8f8f8);
-        border-bottom: 1rpx solid rgba(226, 232, 240, 0);
-
-        .title {
-            color: var(--text-primary, #303048);
-        }
-
-        .icon-left {
-            color: var(--text-primary, #303048);
-        }
-    }
-
-    /* 单色主题：纯主题色导航栏，无边框，无圆角 */
-    &.mono-theme {
-        background-color: var(--primary-color, #3b82f6);
-        border-bottom: 1rpx solid rgba(226, 232, 240, 0);
-
-        .title {
-            color: #ffffff;
-        }
-
-        .icon-left {
-            color: #ffffff;
-        }
-    }
-
-    /* 颜色主题：导航栏使用立体光影感的主题色渐变背景（反向：左上偏深，右下偏亮），下方带有白色圆角过渡 */
-    &.color-theme {
-        background: linear-gradient(135deg, rgba(0, 0, 0, 0.15) 0%, rgba(255, 255, 255, 0.15) 100%), var(--primary-color, #3b82f6);
-        border-bottom: 1rpx solid rgba(226, 232, 240, 0);
-
-        .title {
-            color: #ffffff;
-        }
-
-        .icon-left {
-            color: #ffffff;
-        }
+    &.no-border {
+        border-bottom: none !important;
     }
 
     .header {
@@ -153,6 +130,20 @@ function tapBack() {
         align-items: center;
         justify-content: center;
         position: relative;
+        width: 100%;
+
+        &.align-left {
+            justify-content: flex-start;
+            padding-left: 32rpx;
+
+            &.has-back {
+                padding-left: 100rpx;
+            }
+        }
+
+        &.align-center {
+            justify-content: center;
+        }
 
         .left {
             position: absolute;
@@ -165,31 +156,16 @@ function tapBack() {
 
             .icon-left {
                 font-size: 30rpx;
+                color: var(--text-primary, #303048);
             }
         }
 
         .title {
-            font-size: var(--font-md, var(--navbar-font-size, 32rpx));
-            letter-spacing: 2rpx;
+            font-size: var(--navbar-font-size, var(--font-md, 32rpx));
+            font-family: var(--navbar-font-family, inherit);
+            letter-spacing: 3rpx;
             font-weight: 500;
-        }
-    }
-
-    .status-bar {
-        background-color: transparent;
-        height: v-bind(status_bar_height_style);
-        width: 750rpx;
-        position: relative;
-
-        .within {
-            position: absolute;
-            left: 0;
-            top: 0;
-            width: 750rpx;
-            height: calc(v-bind(status_bar_height_style) + 2rpx);
-            background-color: var(--bg-color, var(--bg-page, #f8f8f8));
-            border-top-left-radius: var(--status-bar-border, var(--card-radius, 32rpx));
-            border-top-right-radius: var(--status-bar-border, var(--card-radius, 32rpx));
+            color: var(--text-primary, #303048);
         }
     }
 }

package/src/components/hlw-page/index.vue

@@ -1,6 +1,15 @@
 <template>
-    <view :class="[theme, fontSizeClass, fontFamilyClass]">
-        <hlw-nav-bar v-if="props.isNav" :is-back="props.isBack" :title="title" :is-bar="props.isBar"></hlw-nav-bar>
+    <view :class="[fontSizeClass, fontFamilyClass]">
+        <hlw-nav-bar v-if="props.isNav" 
+                     :is-back="props.isBack" 
+                     :title="title" 
+                     :is-bar="props.isBar"
+                     :title-align="props.titleAlign"
+                     :title-size="props.titleSize"
+                     :title-style="props.titleStyle"
+                     :title-weight="props.titleWeight"
+                     :border="props.border">
+        </hlw-nav-bar>
         <slot></slot>
         <view class="h-[60rpx]"></view>
     </view>
@@ -14,10 +23,15 @@
  * 可以快捷集成自定义导航栏（HlwNavBar），保持整个页面结构的一致性。
  *
  * @props
- *   isNav  - 是否显示自定义导航栏，默认 false
- *   isBar  - 是否占用状态栏高度，默认 true
- *   title  - 自定义导航栏标题文字
- *   isBack - 是否显示自定义导航栏的返回键，默认 false
+ *   isNav       - 是否显示自定义导航栏，默认 false
+ *   isBar       - 是否占用状态栏高度，默认 true
+ *   title       - 自定义导航栏标题文字
+ *   isBack      - 是否显示自定义导航栏的返回键，默认 false
+ *   titleAlign  - 标题对齐方式，'left' | 'center'
+ *   titleSize   - 标题字体大小
+ *   titleStyle  - 标题字体样式
+ *   titleWeight - 标题字重
+ *   border      - 是否显示自定义导航栏的下边框（下划线），默认 true
  *
  * @example
  * ```vue
@@ -27,9 +41,8 @@
  * ```
  */
 import { useTheme } from "@/core";
-import { onLoad, onShow } from "@dcloudio/uni-app";
 import { ref } from "vue";
-const { theme, fontSizeClass, fontFamilyClass } = useTheme();
+const { fontSizeClass, fontFamilyClass } = useTheme();
 
 const props = defineProps({
     isNav: {
@@ -48,6 +61,26 @@ const props = defineProps({
         type: Boolean,
         default: false,
     },
+    titleAlign: {
+        type: String,
+        default: "center",
+    },
+    titleSize: {
+        type: String,
+        default: "",
+    },
+    titleStyle: {
+        type: String,
+        default: "",
+    },
+    titleWeight: {
+        type: String,
+        default: "500",
+    },
+    border: {
+        type: Boolean,
+        default: true,
+    }
 });
 
 const title = ref(props.title);

package/src/components/hlw-reward-ad/index.vue

@@ -1,10 +1,13 @@
 <template>
-    <view class="hlw-reward-ad" />
+    <view class="hlw-reward-ad" @tap="open">
+        <slot />
+    </view>
 </template>
 
 <script setup lang="ts">
 import { ref, onUnmounted } from "vue";
 import { setRewardAd, showRewardAd, confirmRewardAd, destroyRewardAd } from "../../utils/ad";
+import type { HlwRewardAdResult } from "./types";
 
 defineOptions({ name: "HlwRewardAd" });
 
@@ -16,7 +19,7 @@ interface Props {
 const props = defineProps<Props>();
 
 const emit = defineEmits<{
-    (e: "onHandle", res: { success: boolean; isEnded: boolean; loadFailed?: boolean; err?: any }): void;
+    (e: "onHandle", res: HlwRewardAdResult): void;
 }>();
 
 // 点击锁定状态，防止连续多次点击重复触发广告
@@ -90,6 +93,20 @@ async function playRewardAdFlow(): Promise<void> {
     }
 }
 
+async function open() {
+    if (isClicked.value) return;
+    if (!props.unitId) {
+        console.warn("[HlwRewardAd] unitId is required but empty.");
+        return;
+    }
+    isClicked.value = true;
+    try {
+        await playRewardAdFlow();
+    } finally {
+        isClicked.value = false;
+    }
+}
+
 /**
  * Expose a method for parent components to open the reward ad programmatically via ref.
  * Usage: const adRef = ref(null);
@@ -97,19 +114,7 @@ async function playRewardAdFlow(): Promise<void> {
  * adRef.value?.open();
  */
 defineExpose({
-    async open() {
-        if (isClicked.value) return;
-        if (!props.unitId) {
-            console.warn("[HlwRewardAd] unitId is required but empty.");
-            return;
-        }
-        isClicked.value = true;
-        try {
-            await playRewardAdFlow();
-        } finally {
-            isClicked.value = false;
-        }
-    }
+    open
 });
 
 onUnmounted(() => {
@@ -119,6 +124,6 @@ onUnmounted(() => {
 
 <style scoped>
 .hlw-reward-ad {
-    display: none;
+    display: block;
 }
 </style>

package/src/components/hlw-reward-ad/types.ts

@@ -0,0 +1,10 @@
+export interface HlwRewardAdResult {
+    /** 是否播放成功 */
+    success: boolean;
+    /** 广告是否完整播放结束 */
+    isEnded: boolean;
+    /** 广告加载是否失败 */
+    loadFailed?: boolean;
+    /** 加载/播放失败时的错误对象 */
+    err?: any;
+}

package/src/components/hlw-status-bar/index.vue

@@ -1,7 +1,7 @@
 <template>
     <view 
         class="hlw-status-bar" 
-        :class="[theme, props.fixed ? 'fixed' : '', props.customClass]" 
+        :class="[props.fixed ? 'fixed' : '', props.customClass]" 
         :style="statusBarStyle"
     >
         <slot></slot>
@@ -30,9 +30,7 @@
  * ```
  */
 import { computed } from "vue";
-import { useTheme } from "@/core";
 
-const { theme } = useTheme();
 
 const props = defineProps({
     /** 是否固定在顶部 */
@@ -82,6 +80,7 @@ const statusBarStyle = computed(() => {
 <style lang="scss" scoped>
 .hlw-status-bar {
     width: 750rpx;
+    background-color: var(--navbar-bg-color, #ffffff);
     transition: background-color 0.2s ease, background 0.2s ease;
 
     &.fixed {
@@ -89,25 +88,5 @@ const statusBarStyle = computed(() => {
         top: 0;
         left: 0;
     }
-
-    /* 白色主题：白色状态栏 */
-    &.white-theme {
-        background-color: var(--navbar-bg-color, #ffffff);
-    }
-
-    /* 简洁主题：背景色与页面全局背景色一致 */
-    &.light-theme {
-        background-color: var(--bg-page, #f8f8f8);
-    }
-
-    /* 单色主题：纯主题色状态栏 */
-    &.mono-theme {
-        background-color: var(--primary-color, #3b82f6);
-    }
-
-    /* 颜色主题：立体光影感的主题色渐变背景 */
-    &.color-theme {
-        background: linear-gradient(135deg, rgba(0, 0, 0, 0.15) 0%, rgba(255, 255, 255, 0.15) 100%), var(--primary-color, #3b82f6);
-    }
 }
 </style>

package/src/components/hlw-tabs/index.vue

@@ -1,6 +1,6 @@
 <template>
     <scroll-view class="hlw-tabs" :scroll-x="scrollable" :enhanced="true" :show-scrollbar="false">
-        <view class="hlw-tabs-wrap">
+        <view class="hlw-tabs-wrap" style="position: relative;">
             <view
                 v-for="(item, index) in items"
                 :key="index"
@@ -13,8 +13,9 @@
                     v-if="typeof item !== 'string' && item.badge"
                     class="hlw-tab-badge"
                 >{{ item.badge }}</view>
-                <view v-if="modelValue === index" class="hlw-tab-line" :style="{ width: lineWidth }" />
             </view>
+            <!-- 唯一的一根滑动线条，放置在父容器下，以便做平移 (translateX) 动画 -->
+            <view class="hlw-tab-line" :style="lineStyle" />
         </view>
     </scroll-view>
 </template>
@@ -42,6 +43,8 @@
  * <HlwTabs v-model="tab" :items="[{ label: '消息', badge: '3' }, { label: '关注' }]" />
  * ```
  */
+import { computed } from "vue";
+
 export interface HlwTabItem {
     label: string;
     badge?: string;
@@ -54,7 +57,7 @@ interface Props {
     lineWidth?: string;
 }
 
-withDefaults(defineProps<Props>(), {
+const props = withDefaults(defineProps<Props>(), {
     modelValue: 0,
     items: () => [],
     scrollable: false,
@@ -63,6 +66,22 @@ withDefaults(defineProps<Props>(), {
 
 const emit = defineEmits<{ "update:modelValue": [index: number]; change: [index: number] }>();
 
+// 计算滑动线条的位置
+const lineStyle = computed(() => {
+    const count = props.items?.length || 0;
+    if (count === 0) return { display: 'none' };
+    
+    // 假设在非滚动模式下，每一项平分宽度，即 100% / count
+    const tabWidthPercent = 100 / count;
+    // 居中偏移百分比 = (选中索引 + 0.5) * 每项宽度百分比
+    const leftOffset = (props.modelValue + 0.5) * tabWidthPercent;
+    
+    return {
+        width: props.lineWidth,
+        left: `${leftOffset}%`
+    };
+});
+
 function onChange(index: number) {
     emit("update:modelValue", index);
     emit("change", index);
@@ -90,15 +109,18 @@ function onChange(index: number) {
     gap: 6rpx;
     transition: color 0.2s;
 
-    &--active .hlw-tab-text {
-        color: var(--primary-color, #3b82f6);
-        font-weight: 600;
+    &--active {
+        .hlw-tab-text {
+            color: var(--primary-color, #3b82f6);
+            font-weight: 600;
+        }
     }
 }
 
 .hlw-tab-text {
     font-size: var(--font-base, 28rpx);
     color: #64748b;
+    transition: color 0.2s;
 }
 
 .hlw-tab-badge {
@@ -115,12 +137,13 @@ function onChange(index: number) {
 
 .hlw-tab-line {
     position: absolute;
-    bottom: 4rpx;
-    left: 50%;
-    transform: translateX(-50%);
+    bottom: 6rpx;
     height: 6rpx;
-    border-radius: 6rpx;
+    border-radius: 999rpx; /* 胶囊圆角 */
     background: var(--primary-color, #3b82f6);
-    transition: width 0.2s;
+    /* 居中定位 */
+    transform: translateX(-50%);
+    /* 在 left 变化时产生平移动画，采用缓动曲线 */
+    transition: left 0.3s cubic-bezier(0.25, 1, 0.5, 1);
 }
 </style>

package/src/core/theme/index.ts

@@ -2,7 +2,6 @@ import { computed } from "vue";
 import type { ComputedRef } from "vue";
 import { 
     useThemeStore, 
-    themePresets, 
     fontSizePresets, 
     fontFamilyPresets 
 } from "../../stores/theme";
@@ -10,8 +9,6 @@ import {
 declare const uni: any;
 
 export { 
-    themePresets, 
-    type ThemePreset, 
     fontSizePresets, 
     type FontSizePreset, 
     fontFamilyPresets, 
@@ -25,9 +22,6 @@ export {
 export function useTheme() {
     const store = useThemeStore();
     
-    // 主题
-    const theme: ComputedRef<string> = computed(() => store.theme);
-    
     // 字体大小
     const fontSize: ComputedRef<string> = computed(() => store.fontSize);
     const fontSizeClass: ComputedRef<string> = computed(() => {
@@ -52,7 +46,6 @@ export function useTheme() {
     }
 
     return {
-        theme,
         fontSize,
         fontSizeClass,
         setFontSize,
@@ -67,13 +60,6 @@ export function useTheme() {
  * 首次打开小程序时，初始化默认的主题配色
  * @param defaultTheme 默认主题 ID，默认为 "mono-theme"
  */
-export function initTheme(defaultTheme = "mono-theme"): void {
-    const hasCachedTheme = uni.getStorageSync("theme");
-    if (!hasCachedTheme) {
-        const store = useThemeStore();
-        const validThemes = themePresets.map((t) => t.id);
-        if (validThemes.includes(defaultTheme)) {
-            store.theme = defaultTheme;
-        }
-    }
+export function initTheme(defaultTheme?: string): void {
+    // No-op after color theme presets removal
 }

package/src/index.ts

@@ -15,6 +15,7 @@ export * from "./utils";
 // 类型
 export type { HlwMenuItem } from "./components/hlw-menu/types";
 export type { HlwPagingRef, HlwPagingInstance } from "./components/hlw-paging/types";
+export type { HlwRewardAdResult } from "./components/hlw-reward-ad/types";
 
 // App 根上下文
 export { useApp } from "./app";

package/src/stores/theme.ts

@@ -4,34 +4,7 @@ import { defineStore } from "pinia";
 // 1. 主题 (Theme) 预设与类型
 // ==========================================
 
-export interface ThemePreset {
-    id: string;
-    name: string;
-    color: string;
-}
 
-export const themePresets: ThemePreset[] = [
-    {
-        id: "white-theme",
-        name: "白色主题",
-        color: "#ffffff",
-    },
-    {
-        id: "light-theme",
-        name: "简洁主题",
-        color: "var(--bg-page, #f8f8f8)",
-    },
-    {
-        id: "mono-theme",
-        name: "单色主题",
-        color: "var(--primary-color, #3b82f6)",
-    },
-    {
-        id: "color-theme",
-        name: "颜色主题",
-        color: "var(--primary-color, #3b82f6)",
-    },
-];
 
 // ==========================================
 // 2. 字体大小 (FontSize) 预设与类型
@@ -105,7 +78,6 @@ export const fontFamilyPresets: FontFamilyPreset[] = [
 
 export const useThemeStore = defineStore("theme", {
     state: () => ({
-        theme: "white-theme",
         fontSize: "standard",
         fontFamily: "system",
     }),