uview-pro 0.3.16 → 0.4.2

package/theme.scss

@@ -2,37 +2,53 @@
 // uni.scss中引入的样式会同时混入到全局样式文件和单独每一个页面的样式中，造成微信程序包太大，
 // 故uni.scss只建议放scss变量名相关样式，其他的样式可以通过main.js或者App.vue引入
 
-$u-main-color: #303133;
-$u-content-color: #606266;
-$u-tips-color: #909399;
-$u-light-color: #c0c4cc;
-$u-border-color: #e4e7ed;
-$u-bg-color: #f3f4f6;
-
-$u-type-primary: #2979ff;
-$u-type-primary-light: #ecf5ff;
-$u-type-primary-disabled: #a0cfff;
-$u-type-primary-dark: #2b85e4;
-
-$u-type-warning: #ff9900;
-$u-type-warning-disabled: #fcbd71;
-$u-type-warning-dark: #f29100;
-$u-type-warning-light: #fdf6ec;
-
-$u-type-success: #19be6b;
-$u-type-success-disabled: #71d5a1;
-$u-type-success-dark: #18b566;
-$u-type-success-light: #dbf1e1;
-
-$u-type-error: #fa3534;
-$u-type-error-disabled: #fab6b6;
-$u-type-error-dark: #dd6161;
-$u-type-error-light: #fef0f0;
-
-$u-type-info: #909399;
-$u-type-info-disabled: #c8c9cc;
-$u-type-info-dark: #82848a;
-$u-type-info-light: #f4f4f5;
-
-$u-form-item-height: 70rpx;
-$u-form-item-border-color: #dcdfe6;
+// 常用色
+$u-main-color: var(--u-main-color, #303133);
+$u-content-color: var(--u-content-color, #606266);
+$u-tips-color: var(--u-tips-color, #909399);
+$u-light-color: var(--u-light-color, #c0c4cc);
+$u-border-color: var(--u-border-color, #e4e7ed);
+$u-divider-color: var(--u-divider-color, #e4e7ed);
+$u-mask-color: var(--u-mask-color, rgba(0, 0, 0, 0.4));
+$u-shadow-color: var(--u-shadow-color, rgba(0, 0, 0, 0.1));
+
+// 纯色
+$u-white-color: var(--u-white-color, #ffffff);
+$u-black-color: var(--u-black-color, #000000);
+
+// 背景色
+$u-bg-color: var(--u-bg-color, #f3f4f6);
+$u-bg-white: var(--u-bg-white, #ffffff);
+$u-bg-gray-light: var(--u-bg-gray-light, #f5f7fa);
+$u-bg-gray-dark: var(--u-bg-gray-dark, #2f343c);
+$u-bg-black: var(--u-bg-black, #000000);
+
+// 主色
+$u-type-primary: var(--u-type-primary, #2979ff);
+$u-type-primary-light: var(--u-type-primary-light, #ecf5ff);
+$u-type-primary-disabled: var(--u-type-primary-disabled, #a0cfff);
+$u-type-primary-dark: var(--u-type-primary-dark, #2b85e4);
+
+// 警告色
+$u-type-warning: var(--u-type-warning, #ff9900);
+$u-type-warning-disabled: var(--u-type-warning-disabled, #fcbd71);
+$u-type-warning-dark: var(--u-type-warning-dark, #f29100);
+$u-type-warning-light: var(--u-type-warning-light, #fdf6ec);
+
+// 成功色
+$u-type-success: var(--u-type-success, #19be6b);
+$u-type-success-disabled: var(--u-type-success-disabled, #71d5a1);
+$u-type-success-dark: var(--u-type-success-dark, #18b566);
+$u-type-success-light: var(--u-type-success-light, #dbf1e1);
+
+// 错误色
+$u-type-error: var(--u-type-error, #fa3534);
+$u-type-error-disabled: var(--u-type-error-disabled, #fab6b6);
+$u-type-error-dark: var(--u-type-error-dark, #dd6161);
+$u-type-error-light: var(--u-type-error-light, #fef0f0);
+
+// 信息色
+$u-type-info: var(--u-type-info, #909399);
+$u-type-info-disabled: var(--u-type-info-disabled, #c8c9cc);
+$u-type-info-dark: var(--u-type-info-dark, #82848a);
+$u-type-info-light: var(--u-type-info-light, #f4f4f5);

package/types/components.d.ts

@@ -97,6 +97,7 @@ declare module 'vue' {
         uTextarea: (typeof import('../components/u-textarea/u-textarea.vue'))['default'];
         uFab: (typeof import('../components/u-fab/u-fab.vue'))['default'];
         uPagination: (typeof import('../components/u-pagination/u-pagination.vue'))['default'];
+        uConfigProvider: (typeof import('../components/u-config-provider/u-config-provider.vue'))['default'];
     }
 }
 

package/types/global.d.ts

@@ -312,6 +312,10 @@ export type ColorType =
     | 'primaryDisabled'
     | 'primaryLight'
     | 'bgColor'
+    | 'bgWhite'
+    | 'bgGrayLight'
+    | 'bgGrayDark'
+    | 'bgBlack'
     | 'info'
     | 'infoDark'
     | 'infoDisabled'
@@ -332,11 +336,40 @@ export type ColorType =
     | 'contentColor'
     | 'tipsColor'
     | 'lightColor'
-    | 'borderColor';
+    | 'borderColor'
+    | 'whiteColor'
+    | 'blackColor'
+    | 'dividerColor'
+    | 'maskColor'
+    | 'shadowColor';
 
 // 自定义主题色
 export type ThemeColor = Partial<Record<ColorType, string>>;
 
+export type DarkMode = 'auto' | 'light' | 'dark';
+
+export type Theme = {
+    name: string;
+    label?: string;
+    description?: string;
+    /**
+     * 亮色模式下的令牌（会同步到 $u.color 和 CSS 变量）
+     */
+    color: Partial<ThemeColor>;
+    /**
+     * 暗黑模式下的令牌，未提供时回退到 color
+     */
+    darkColor?: Partial<ThemeColor>;
+    /**
+     * 需要直接注入的 CSS 变量（亮色）
+     */
+    css?: Record<string, string>;
+    /**
+     * 需要直接注入的 CSS 变量（暗黑）
+     */
+    darkCss?: Record<string, string>;
+};
+
 export type LogConfig = Partial<{
     debug?: boolean;
     prefix?: string;
@@ -344,7 +377,7 @@ export type LogConfig = Partial<{
 }>;
 
 export interface UViewProOptions {
-    theme?: ThemeColor;
+    theme?: ThemeColor | Theme[];
     log?: LogConfig;
     // 可扩展更多配置项
 }
@@ -357,3 +390,15 @@ export type PaginationChangePayload = {
     type: PaginationDirection;
     current: number;
 };
+
+// tabbar 组件 Item
+export type TabbarItem = {
+    text?: string;
+    pagePath?: string;
+    iconPath?: string;
+    selectedIconPath?: string;
+    count?: number;
+    isDot?: boolean;
+    customIcon?: boolean;
+    midButton?: boolean;
+};