uview-pro 0.5.2 → 0.5.4

package/libs/function/styleUtils.ts

@@ -25,7 +25,7 @@ function cssStrToObj(str: string): object {
         const value = values.join(':');
         if (prop && value) {
             const camelProp = prop.replace(/-([a-z])/g, (match, letter) => letter.toUpperCase());
-            result[camelProp] = value;
+            (result as Record<string, string>)[camelProp] = value;
         }
     });
     return result;
@@ -53,16 +53,16 @@ function cssObjToStr(obj: object): string {
  * 合并多个 CSS 输入（对象或字符串），返回一个 CSS 对象
  */
 export function mergeStyles(...args: (object | string)[]): CSSProperties {
-    const result = {};
+    const result = {} as Record<string, any>;
     for (let i = 0; i < args.length; i++) {
         const arg = args[i];
-        if (!isValidValue(arg)) return;
+        if (!isValidValue(arg)) return result as CSSProperties;
         if (typeof arg === 'string') {
             Object.assign(result, cssStrToObj(arg));
         } else if (test.object(arg)) {
-            const cleanedObj = {};
+            const cleanedObj: Record<string, any> = {};
             Object.keys(arg).forEach(key => {
-                const value = arg[key];
+                const value = (arg as Record<string, any>)[key];
                 if (isValidValue(value)) {
                     // 有效
                     cleanedObj[key] = value;

package/libs/function/test.ts

@@ -210,7 +210,7 @@ function code(value: string, len: number = 6): boolean {
  * 是否函数方法
  * @param {Object} value
  */
-function func(value) {
+function func(value: any) {
     return typeof value === 'function';
 }
 
@@ -218,14 +218,14 @@ function func(value) {
  * 是否promise对象
  * @param {Object} value
  */
-function promise(value) {
+function promise(value: any) {
     return object(value) && func(value.then) && func(value.catch);
 }
 
 /** 是否图片格式
  * @param {Object} value
  */
-function image(value) {
+function image(value: any) {
     const newValue = value.split('?')[0];
     const IMAGE_REGEXP = /\.(jpeg|jpg|gif|png|svg|webp|jfif|bmp|dpg)/i;
     return IMAGE_REGEXP.test(newValue);
@@ -235,7 +235,7 @@ function image(value) {
  * 是否视频格式
  * @param {Object} value
  */
-function video(value) {
+function video(value: any) {
     const VIDEO_REGEXP = /\.(mp4|mpg|mpeg|dat|asf|avi|rm|rmvb|mov|wmv|flv|mkv|m3u8)/i;
     return VIDEO_REGEXP.test(value);
 }
@@ -245,14 +245,14 @@ function video(value) {
  * @param {Object}
  * @return {Boolean}
  */
-function regExp(o) {
+function regExp(o: any) {
     return o && Object.prototype.toString.call(o) === '[object RegExp]';
 }
 
 /**
  * 验证字符串
  */
-function string(value) {
+function string(value: any) {
     return typeof value === 'string';
 }
 

package/libs/function/type2icon.ts

@@ -1,13 +1,12 @@
+import type { ThemeType } from '../../types/global';
+
 /**
  * 根据主题type值,获取对应的图标
  * @param type 主题名称, primary|info|error|warning|success，默认success
  * @param fill 是否使用fill填充实体的图标，默认false
  * @returns 图标名称字符串
  */
-function type2icon(
-    type: 'primary' | 'info' | 'error' | 'warning' | 'success' = 'success',
-    fill: boolean = false
-): string {
+function type2icon(type: ThemeType = 'success', fill: boolean = false): string {
     // 如果非预置值,默认为success
     if (!['primary', 'info', 'error', 'warning', 'success'].includes(type)) type = 'success';
     let iconName = '';

package/libs/hooks/index.ts

@@ -6,3 +6,4 @@ export * from './useColor';
 export * from './useLocale';
 export * from './useDebounce';
 export * from './useThrottle';
+export * from './useToast';

package/libs/hooks/useCompRelation.ts

@@ -199,13 +199,13 @@ export function useParent(componentName?: string) {
     };
 
     if (instance.proxy) {
-        instance.proxy[PARENT_CONTEXT_SYMBOL] = parentContext;
+        (instance.proxy as any)[PARENT_CONTEXT_SYMBOL] = parentContext;
     }
 
     onUnmounted(() => {
         childrenMap.forEach((_, childId) => parentContext.removeChild(childId));
         if (instance.proxy) {
-            delete instance.proxy[PARENT_CONTEXT_SYMBOL];
+            delete (instance.proxy as any)[PARENT_CONTEXT_SYMBOL];
         }
         logger.log(`Parent ${name} unmounted and cleaned up`);
     });
@@ -279,7 +279,7 @@ export function useChildren(componentName?: string, parentName?: string) {
 
         let current = instance.parent;
         while (current) {
-            const context = current.proxy?.[PARENT_CONTEXT_SYMBOL];
+            const context = (current.proxy as any)?.[PARENT_CONTEXT_SYMBOL];
             if (context) {
                 if (!context.getInstance) {
                     context.getInstance = () => current;
@@ -384,7 +384,7 @@ export function hasParent(parentName?: string): boolean {
 
     let current = instance.parent;
     while (current) {
-        if (current.proxy?.[PARENT_CONTEXT_SYMBOL]) return true;
+        if ((current.proxy as any)?.[PARENT_CONTEXT_SYMBOL]) return true;
         current = current.parent;
     }
     return false;

package/libs/hooks/useRect.ts

@@ -6,11 +6,11 @@ import { getCurrentInstance, nextTick, ref } from 'vue';
  * @param all 是否获取所有匹配元素
  * @returns rect 响应式的节点信息，refresh 主动刷新方法
  */
-export function useRect(selector: string = null, all = false) {
+export function useRect(selector: string | null = null, all = false) {
     const rect = ref<any>(all ? [] : null);
     const instance = getCurrentInstance();
 
-    async function getRect(realSelector: string = null, delay = 0): Promise<any> {
+    async function getRect(realSelector: string | null = null, delay = 0): Promise<any> {
         realSelector = realSelector || selector;
         if (!realSelector) return rect.value;
         await nextTick();
@@ -18,7 +18,7 @@ export function useRect(selector: string = null, all = false) {
             setTimeout(() => {
                 uni.createSelectorQuery()
                     .in(instance?.proxy)
-                    [all ? 'selectAll' : 'select'](realSelector)
+                    [all ? 'selectAll' : 'select'](realSelector as string)
                     .boundingClientRect((res: any) => {
                         rect.value = res;
                         resolve(res);
@@ -28,8 +28,13 @@ export function useRect(selector: string = null, all = false) {
         });
     }
 
+    function refresh(selector?: string | null, delay?: number): Promise<any> {
+        return getRect(selector, delay);
+    }
+
     return {
         rect,
-        getRect
+        getRect,
+        refresh
     };
 }

package/libs/hooks/useToast.ts

@@ -0,0 +1,90 @@
+import {
+    U_TOAST_EVENT_HIDE,
+    U_TOAST_EVENT_SHOW,
+    U_TOAST_GLOBAL_EVENT_HIDE,
+    U_TOAST_GLOBAL_EVENT_SHOW,
+    type ToastPayload
+} from '../../components/u-toast/service';
+import type { ThemeType } from '../../types/global';
+
+export type UseToastShowOptions = ToastPayload;
+
+export type UseToast = {
+    /**
+     * 显示 toast
+     * - show('文本')
+     * - show({ title, type, duration, ... })
+     */
+    show: (titleOrOptions: string | UseToastShowOptions) => void;
+    /** 关闭 toast */
+    close: () => void;
+    /** 成功 */
+    success: (titleOrOptions: string | UseToastShowOptions) => void;
+    /** 错误 */
+    error: (titleOrOptions: string | UseToastShowOptions) => void;
+    /** 警告 */
+    warning: (titleOrOptions: string | UseToastShowOptions) => void;
+    /** 信息 */
+    info: (titleOrOptions: string | UseToastShowOptions) => void;
+    /** 加载中（默认常驻，需 close 关闭） */
+    loading: (titleOrOptions: string | UseToastShowOptions) => void;
+};
+
+export type UseToastOptions = {
+    /** 是否使用全局根部 <u-toast global />，默认 true；为 false 时走页面级 <u-toast /> */
+    global?: boolean;
+};
+
+function normalize(titleOrOptions: string | UseToastShowOptions): UseToastShowOptions {
+    if (typeof titleOrOptions === 'string') return { title: titleOrOptions };
+    return titleOrOptions || {};
+}
+
+/**
+ * Toast 函数式调用
+ * @description 需要页面/应用中至少存在一个 <u-toast /> 实例用于承接事件；不影响原 ref 调用方式。
+ * 支持两种调用方式：useToast() / useToast({ global: false }) / useToast(false)
+ */
+export function useToast(): UseToast;
+export function useToast(options: UseToastOptions): UseToast;
+export function useToast(global: boolean): UseToast;
+export function useToast(optionsOrGlobal: UseToastOptions | boolean = {}): UseToast {
+    const isGlobal =
+        typeof optionsOrGlobal === 'boolean' ? optionsOrGlobal !== false : optionsOrGlobal.global !== false;
+    const showEvent = isGlobal ? U_TOAST_GLOBAL_EVENT_SHOW : U_TOAST_EVENT_SHOW;
+    const hideEvent = isGlobal ? U_TOAST_GLOBAL_EVENT_HIDE : U_TOAST_EVENT_HIDE;
+
+    function emitShow(payload: UseToastShowOptions) {
+        uni?.$emit && uni.$emit(showEvent, payload);
+    }
+
+    function emitHide() {
+        uni?.$emit && uni.$emit(hideEvent);
+    }
+    function show(titleOrOptions: string | UseToastShowOptions) {
+        emitShow(normalize(titleOrOptions));
+    }
+
+    function close() {
+        emitHide();
+    }
+
+    function withType(type: ThemeType, titleOrOptions: string | UseToastShowOptions) {
+        const options = normalize(titleOrOptions);
+        emitShow({ ...options, type });
+    }
+
+    return {
+        show,
+        close,
+        success: (v: any) => withType('success', v),
+        error: (v: any) => withType('error', v),
+        warning: (v: any) => withType('warning', v),
+        info: (v: any) => withType('info', v),
+        loading: (v: any) => {
+            const options = normalize(v);
+            // loading 通常需要常驻，除非用户显式传 duration
+            emitShow({ ...options, loading: true, duration: options.duration ?? 1e9 });
+        }
+    };
+}

package/libs/index.ts

@@ -248,7 +248,7 @@ export function kebabCase(word: string): string {
  * @param {number} value 堵塞时间 单位ms 毫秒
  * @returns {Promise} 返回promise
  */
-export function sleep(value: number = 30) {
+export function sleep(value: number = 30): Promise<boolean> {
     return new Promise(resolve => {
         setTimeout(() => {
             resolve(true);

package/libs/request/index.ts

@@ -223,7 +223,7 @@ export class Request {
             method: 'GET',
             url,
             data,
-            header: options.header,
+            header: options.header || {},
             meta: options.meta
         });
     }
@@ -237,7 +237,7 @@ export class Request {
             url,
             method: 'POST',
             data,
-            header: options.header,
+            header: options.header || {},
             meta: options.meta
         });
     }
@@ -251,7 +251,7 @@ export class Request {
             url,
             method: 'PUT',
             data,
-            header: options.header,
+            header: options.header || {},
             meta: options.meta
         });
     }
@@ -265,7 +265,7 @@ export class Request {
             url,
             method: 'DELETE',
             data,
-            header: options.header,
+            header: options.header || {},
             meta: options.meta
         });
     }

package/libs/util/config-provider.ts

@@ -67,7 +67,7 @@ export class ConfigProvider {
     private debug: boolean = false;
     private systemDarkModeMediaQuery: MediaQueryList | null = null;
     private lastAppliedCssKeys: string[] = [];
-    private interval = 0;
+    private interval: ReturnType<typeof setInterval> | number = 0;
 
     constructor() {
         // 默认不自动初始化，调用 init 以传入主题列表
@@ -334,6 +334,15 @@ export class ConfigProvider {
      * replacements 支持数组或对象替换占位符 {0} 或 {name}
      */
     t(key: string, replacements?: any, localeName?: string): string {
+        // 如果 locales 尚未初始化，尝试懒初始化，使用内置语言包作为回退
+        try {
+            if (!Array.isArray(this.localesRef.value) || this.localesRef.value.length === 0) {
+                this.initLocales();
+            }
+        } catch (e) {
+            if (this.debug) console.warn('[ConfigProvider] lazy initLocales failed', e);
+        }
+
         const localeObj =
             (localeName && this.localesRef.value.find(l => l.name === localeName)) || this.currentLocaleRef.value;
         if (!localeObj) return key;

package/package.json

@@ -2,7 +2,7 @@
     "id": "uview-pro",
     "name": "uview-pro",
     "displayName": "【支持鸿蒙】uView Pro｜基于Vue3+TS的高质量UI组件库，支持多主题、暗黑模式、多语言",
-    "version": "0.5.2",
+    "version": "0.5.4",
     "description": "uView Pro是基于Vue3+TS的多平台UI框架，提供80+高质量组件、便捷工具和常用模板，支持多主题、暗黑模式、多语言，支持H5/APP/鸿蒙/小程序多端开发。已在鸿蒙应用商店上架，欢迎体验！",
     "main": "index.ts",
     "module": "index.ts",

package/types/global.d.ts

@@ -1,4 +1,4 @@
-export type ThemeType = 'primary' | 'info' | 'error' | 'warning' | 'success';
+export type ThemeType = 'primary' | 'info' | 'error' | 'warning' | 'success' | 'default';
 
 export type ImgMode = 'aspectFit' | 'aspectFill' | 'widthFix' | 'top' | 'bottom' | 'center' | 'scaleToFill';