wui-components-v2 1.0.8 → 1.0.10

package/composables/useLocale.ts

@@ -1,3 +1,4 @@
+import { computed, onBeforeMount } from 'vue'
 import { Locale } from 'wot-design-uni'
 // 引入英文语言包
 import enUS from 'wot-design-uni/locale/lang/en-US'

package/composables/useManualTheme.ts

@@ -1,3 +1,4 @@
+import { computed, onBeforeMount, onUnmounted, ref } from 'vue'
 import { useManualThemeStore } from '../store/manualThemeStore'
 import { useLocale } from './useLocale'
 import type { LocaleOption, ThemeColorOption, ThemeMode } from './types/theme'

package/composables/useTheme.ts

@@ -1,73 +1,74 @@
-import type { ThemeMode } from '@/composables/types/theme'
-
-/**
- * 简化版系统主题管理组合式API
- *
- * 功能特性：
- * - 仅跟随系统主题变化
- * - 自动响应系统主题切换
- * - 导航栏颜色通过 theme.json 自动处理
- * - 轻量级，无额外功能
- *
- * 适用场景：
- * - 只需要系统主题适应的简单应用
- * - 不需要用户手动控制主题的应用
- * - 追求轻量级主题管理的应用
- *
- * 注意事项：
- * - 不支持手动切换主题
- * - 不支持主题色自定义
- * - 导航栏颜色依赖 theme.json 配置
- *
- * @example
- * ```vue
- * <script setup>
- * import { useTheme } from '@/composables/useTheme'
- *
- * const { theme, isDark, themeVars } = useTheme()
- * </script>
- *
- * <template>
- *   <wd-config-provider :theme-vars="themeVars">
- *     <view :class="{ 'dark-mode': isDark }">
- *       <text>当前主题: {{ theme }}</text>
- *     </view>
- *   </wd-config-provider>
- * </template>
- * ```
- */
-export function useTheme() {
-  const store = useThemeStore()
-
-  // 组件挂载前初始化系统主题
-  onBeforeMount(() => {
-    store.initSystemTheme()
-    // 监听系统主题变化
-    if (typeof uni !== 'undefined' && uni.onThemeChange) {
-      uni.onThemeChange((res) => {
-        // 系统主题变化时自动更新，导航栏颜色由 theme.json 自动处理
-        store.setTheme(res.theme as ThemeMode)
-        console.log('系统主题已切换至:', res.theme)
-      })
-    }
-  })
-
-  // 组件卸载时清理监听
-  onUnmounted(() => {
-    if (typeof uni !== 'undefined' && uni.offThemeChange) {
-      uni.offThemeChange((res) => {
-        store.setTheme(res.theme as ThemeMode)
-      })
-    }
-  })
-
-  return {
-    // 状态（只读）
-    theme: computed(() => store.theme),
-    isDark: computed(() => store.isDark),
-    themeVars: computed(() => store.themeVars),
-  }
-}
-
-// 导出类型供外部使用
-export type { ThemeMode }
+import { computed, onBeforeMount, onUnmounted } from 'vue'
+import type { ThemeMode } from '../composables/types/theme'
+
+/**
+ * 简化版系统主题管理组合式API
+ *
+ * 功能特性：
+ * - 仅跟随系统主题变化
+ * - 自动响应系统主题切换
+ * - 导航栏颜色通过 theme.json 自动处理
+ * - 轻量级，无额外功能
+ *
+ * 适用场景：
+ * - 只需要系统主题适应的简单应用
+ * - 不需要用户手动控制主题的应用
+ * - 追求轻量级主题管理的应用
+ *
+ * 注意事项：
+ * - 不支持手动切换主题
+ * - 不支持主题色自定义
+ * - 导航栏颜色依赖 theme.json 配置
+ *
+ * @example
+ * ```vue
+ * <script setup>
+ * import { useTheme } from '@/composables/useTheme'
+ *
+ * const { theme, isDark, themeVars } = useTheme()
+ * </script>
+ *
+ * <template>
+ *   <wd-config-provider :theme-vars="themeVars">
+ *     <view :class="{ 'dark-mode': isDark }">
+ *       <text>当前主题: {{ theme }}</text>
+ *     </view>
+ *   </wd-config-provider>
+ * </template>
+ * ```
+ */
+export function useTheme() {
+  const store = useThemeStore()
+
+  // 组件挂载前初始化系统主题
+  onBeforeMount(() => {
+    store.initSystemTheme()
+    // 监听系统主题变化
+    if (typeof uni !== 'undefined' && uni.onThemeChange) {
+      uni.onThemeChange((res) => {
+        // 系统主题变化时自动更新，导航栏颜色由 theme.json 自动处理
+        store.setTheme(res.theme as ThemeMode)
+        console.log('系统主题已切换至:', res.theme)
+      })
+    }
+  })
+
+  // 组件卸载时清理监听
+  onUnmounted(() => {
+    if (typeof uni !== 'undefined' && uni.offThemeChange) {
+      uni.offThemeChange((res) => {
+        store.setTheme(res.theme as ThemeMode)
+      })
+    }
+  })
+
+  return {
+    // 状态（只读）
+    theme: computed(() => store.theme),
+    isDark: computed(() => store.isDark),
+    themeVars: computed(() => store.themeVars),
+  }
+}
+
+// 导出类型供外部使用
+export type { ThemeMode }

package/index.d.ts

@@ -1,17 +1,30 @@
 import type { App } from 'vue'
 import type { ConfigProviderThemeVars } from 'wot-design-uni'
 
+// 类型声明
+export interface ThemeColorOption {
+  name: string
+  value: string
+  primary: string
+}
+
+export interface LocaleOption {
+  name: string
+  value: string
+}
+
+export type ThemeMode = 'light' | 'dark'
+
 // SystemSettings 组件类型
-interface ComponentWithInstall extends Record<string, any> {
+interface Component {
   name: string
-  install?: (app: App) => void
 }
 
 // 声明 SystemSettings 组件
-declare const SystemSettings: ComponentWithInstall
+declare const SystemSettings: import('vue').DefineComponent<Record<string, any>, Record<string, any>, any> & { name: string }
 
 // 组件列表类型
-declare const coms: ComponentWithInstall[]
+declare const coms: Component[]
 
 /**
  * 批量注册组件
@@ -19,26 +32,14 @@ declare const coms: ComponentWithInstall[]
  */
 declare function install(app: App): void
 
-// 主题相关类型
-interface ThemeColorOption {
-  name: string
-  value: string
-  primary: string
-}
-
-interface LocaleOption {
-  name: string
-  value: string
-}
-
-type ThemeMode = 'light' | 'dark'
-
-interface UseLocaleReturn {
+// useLocale 组合式函数返回类型
+export interface UseLocaleReturn {
   locale: Readonly<LocaleOption>
   changeSystemLocale: () => void
 }
 
-interface UseManualThemeReturn {
+// useManualTheme 组合式函数返回类型
+export interface UseManualThemeReturn {
   theme: Readonly<ThemeMode>
   primary: import('vue').ComputedRef<string>
   isDark: import('vue').ComputedRef<boolean>
@@ -62,18 +63,24 @@ interface UseManualThemeReturn {
   selectLanguage: (option: LocaleOption) => void
 }
 
-// 组合式API函数
+// useTheme 组合式函数返回类型
+export interface UseThemeReturn {
+  theme: Readonly<ThemeMode>
+  isDark: import('vue').ComputedRef<boolean>
+  themeVars: import('vue').ComputedRef<ConfigProviderThemeVars>
+}
+
+// 组合式API函数类型声明
 declare function useLocale(): UseLocaleReturn
 declare function useManualTheme(): UseManualThemeReturn
+declare function useTheme(): UseThemeReturn
 
-// 核心功能函数集合类型
-interface CoreFunctions {
-  useLocale: typeof useLocale
-  useManualTheme: typeof useManualTheme
-}
+// 导出声明
+export { SystemSettings, useLocale, useManualTheme, useTheme }
 
-// 导出核心功能函数集合
-export declare const coreFunctions: CoreFunctions
+// 导出常量
+export const themeColorOptions: ThemeColorOption[]
+export const LocaleOptions: LocaleOption[]
 
 // 默认导出 install 函数
 export default install

package/index.ts

@@ -21,7 +21,7 @@ function install(app: App): void {
 /**
  * 核心功能函数集合
  */
-export const coreFunctions = {
+export {
   useLocale,
   useManualTheme,
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "wui-components-v2",
-  "version": "1.0.8",
+  "version": "1.0.10",
   "description": "wui 组件库",
   "author": "wgxshh",
   "license": "MIT",