vxe-pc-ui 1.8.13 → 1.9.0

package/styles/components/tag.scss

@@ -2,32 +2,32 @@ $btnThemeList: (
   (
     name: "primary",
     textColor: var(--vxe-ui-font-primary-color),
-    bgColor: var(--vxe-ui-tag-primary-background-color)
+    bgColor: var(--vxe-ui-font-primary-tinge-color)
   ),
   (
     name: "success",
     textColor: var(--vxe-ui-status-success-color),
-    bgColor: var(--vxe-ui-tag-success-background-color)
+    bgColor: var(--vxe-ui-status-success-tinge-color)
   ),
   (
     name: "info",
     textColor: var(--vxe-ui-status-info-color),
-    bgColor: var(--vxe-ui-tag-info-background-color)
+    bgColor: var(--vxe-ui-status-info-tinge-color)
   ),
   (
     name: "warning",
     textColor: var(--vxe-ui-status-warning-color),
-    bgColor: var(--vxe-ui-tag-warning-background-color)
+    bgColor: var(--vxe-ui-status-warning-tinge-color)
   ),
   (
     name: "danger",
     textColor: var(--vxe-ui-status-danger-color),
-    bgColor: var(--vxe-ui-tag-danger-background-color)
+    bgColor: var(--vxe-ui-status-danger-tinge-color)
   ),
   (
     name: "error",
     textColor: var(--vxe-ui-status-error-color),
-    bgColor: var(--vxe-ui-tag-error-background-color)
+    bgColor: var(--vxe-ui-status-error-tinge-color)
   )
 );
 

package/styles/components/tips.scss

@@ -2,32 +2,32 @@ $btnThemeList: (
   (
     name: "primary",
     borderColor: var(--vxe-ui-font-primary-color),
-    bgColor: var(--vxe-ui-tips-primary-background-color),
+    bgColor: var(--vxe-ui-font-primary-tinge-color)
   ),
   (
     name: "success",
     borderColor: var(--vxe-ui-status-success-color),
-    bgColor: var(--vxe-ui-tips-success-background-color),
+    bgColor: var(--vxe-ui-status-success-tinge-color)
   ),
   (
     name: "info",
     borderColor: var(--vxe-ui-status-info-color),
-    bgColor: var(--vxe-ui-tips-info-background-color),
+    bgColor: var(--vxe-ui-status-info-tinge-color)
   ),
   (
     name: "warning",
     borderColor: var(--vxe-ui-status-warning-color),
-    bgColor: var(--vxe-ui-tips-warning-background-color),
+    bgColor: var(--vxe-ui-status-warning-tinge-color)
   ),
   (
     name: "danger",
     borderColor: var(--vxe-ui-status-danger-color),
-    bgColor: var(--vxe-ui-tips-danger-background-color),
+    bgColor: var(--vxe-ui-status-danger-tinge-color)
   ),
   (
     name: "error",
     borderColor: var(--vxe-ui-status-error-color),
-    bgColor: var(--vxe-ui-tips-error-background-color),
+    bgColor: var(--vxe-ui-status-error-tinge-color)
   )
 );
 
@@ -36,8 +36,8 @@ $btnThemeList: (
   display: flex;
   flex-direction: row;
   color: var(--vxe-ui-font-color);
-  margin-bottom: var(--vxe-ui-layout-padding-double);
-  padding: var(--vxe-ui-layout-padding-default) var(--vxe-ui-layout-padding-threefold) var(--vxe-ui-layout-padding-double) var(--vxe-ui-layout-padding-threefold);
+  margin-bottom: var(--vxe-ui-layout-padding-default);
+  padding: var(--vxe-ui-layout-padding-default) var(--vxe-ui-layout-padding-double) var(--vxe-ui-layout-padding-double) var(--vxe-ui-layout-padding-double);
   font-size: var(--vxe-ui-font-size-default);
   &::after {
     content: "";
@@ -74,6 +74,7 @@ $btnThemeList: (
 .vxe-tips--icon {
   flex-shrink: 0;
   font-size: 1.2em;
+  line-height: 2em;
   padding-right: var(--vxe-ui-layout-padding-half);
 }
 .vxe-tips--body {
@@ -81,6 +82,6 @@ $btnThemeList: (
 }
 .vxe-tips--title {
   font-size: 1.1em;
-  margin-bottom: 0.7em;
+  line-height: 2em;
   font-weight: 700;
 }

package/styles/theme/base.scss

@@ -1,11 +1,3 @@
-$vxe-ui-font-primary-color: #409eff;
-
-$vxe-ui-status-success-color: #67c23a;
-$vxe-ui-status-info-color: #909399;
-$vxe-ui-status-warning-color: #e6a23c;
-$vxe-ui-status-danger-color: #f56c6c;
-$vxe-ui-status-error-color: #f56c6c;
-
 :root {
   /*font*/
   --vxe-ui-font-family: -apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Hiragino Sans GB,Microsoft YaHei,Helvetica Neue,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;
@@ -17,11 +9,6 @@ $vxe-ui-status-error-color: #f56c6c;
   --vxe-ui-font-size-mini: 12px;
 
   /*font color*/
-  --vxe-ui-font-primary-color: #{$vxe-ui-font-primary-color}; // 主要字体颜色
-  --vxe-ui-font-primary-tinge-color: #{lighten($vxe-ui-font-primary-color, 33%)};
-  --vxe-ui-font-primary-lighten-color: #{lighten($vxe-ui-font-primary-color, 10%)};
-  --vxe-ui-font-primary-darken-color: #{darken($vxe-ui-font-primary-color, 10%)};
-  --vxe-ui-font-primary-disabled-color: #{lighten($vxe-ui-font-primary-color, 20%)};
   --vxe-ui-font-secondary-color: #909399; // 次要字体颜色
   --vxe-ui-font-placeholder-color: #a8abb2; // 占位符字体颜色
   --vxe-ui-font-disabled-color: #BFBFBF;
@@ -29,37 +16,6 @@ $vxe-ui-status-error-color: #f56c6c;
   /*base*/
   --vxe-ui-base-border-radius: 4px;
 
-  /*base status*/
-  --vxe-ui-status-success-color: #{$vxe-ui-status-success-color};
-  --vxe-ui-status-info-color: #{$vxe-ui-status-info-color};
-  --vxe-ui-status-warning-color: #{$vxe-ui-status-warning-color};
-  --vxe-ui-status-danger-color: #{$vxe-ui-status-danger-color};
-  --vxe-ui-status-error-color: #{$vxe-ui-status-error-color};
-
-  --vxe-ui-status-success-tinge-color: #{lighten($vxe-ui-status-success-color, 45%)};
-  --vxe-ui-status-info-tinge-color: #{lighten($vxe-ui-status-info-color, 38%)};
-  --vxe-ui-status-warning-tinge-color: #{lighten($vxe-ui-status-warning-color, 38%)};
-  --vxe-ui-status-danger-tinge-color: var(--vxe-ui-status-error-tinge-color);
-  --vxe-ui-status-error-tinge-color: #{lighten($vxe-ui-status-error-color, 28%)};
-
-  --vxe-ui-status-success-lighten-color: #{lighten($vxe-ui-status-success-color, 10%)};
-  --vxe-ui-status-info-lighten-color: #{lighten($vxe-ui-status-info-color, 10%)};
-  --vxe-ui-status-warning-lighten-color: #{lighten($vxe-ui-status-warning-color, 10%)};
-  --vxe-ui-status-danger-lighten-color: var(--vxe-ui-status-error-lighten-color);
-  --vxe-ui-status-error-lighten-color: #{lighten($vxe-ui-status-error-color, 10%)};
-  
-  --vxe-ui-status-success-darken-color: #{darken($vxe-ui-status-success-color, 10%)};
-  --vxe-ui-status-info-darken-color: #{darken($vxe-ui-status-info-color, 10%)};
-  --vxe-ui-status-warning-darken-color: #{darken($vxe-ui-status-warning-color, 10%)};
-  --vxe-ui-status-danger-darken-color: var(--vxe-ui-status-error-lighten-color);
-  --vxe-ui-status-error-darken-color: #{lighten($vxe-ui-status-error-color, 10%)};
-  
-  --vxe-ui-status-success-disabled-color: #{lighten($vxe-ui-status-success-color, 20%)};
-  --vxe-ui-status-info-disabled-color: #{lighten($vxe-ui-status-info-color, 20%)};
-  --vxe-ui-status-warning-disabled-color: #{lighten($vxe-ui-status-warning-color, 20%)};
-  --vxe-ui-status-danger-disabled-color: var(--vxe-ui-status-danger-disabled-color);
-  --vxe-ui-status-error-disabled-color: #{lighten($vxe-ui-status-error-color, 10%)};
-
   /*layout*/
   --vxe-ui-layout-padding-half: 4px;
   --vxe-ui-layout-padding-default: 8px;
@@ -144,7 +100,6 @@ $vxe-ui-status-error-color: #f56c6c;
 
   /*form-design*/
   --vxe-ui-form-design-widget-item-font-size: 0.9em;
-  --vxe-ui-form-design-widget-item-hover-background-color: #{lighten($vxe-ui-font-primary-color, 10%)};
 
   /*checkbox*/
   --vxe-ui-checkbox-font-size-default: 15px;
@@ -185,14 +140,6 @@ $vxe-ui-status-error-color: #f56c6c;
   --vxe-ui-switch-open-background-color: var(--vxe-ui-font-primary-color);
   --vxe-ui-switch-disabled-background-color: rgba(0,0,0,0.15) ;
 
-  /*tips*/
-  --vxe-ui-tips-primary-background-color: var(--vxe-ui-tag-primary-background-color);
-  --vxe-ui-tips-success-background-color: var(--vxe-ui-tag-success-background-color);
-  --vxe-ui-tips-info-background-color: var(--vxe-ui-tag-info-background-color);
-  --vxe-ui-tips-warning-background-color: var(--vxe-ui-tag-warning-background-color);
-  --vxe-ui-tips-danger-background-color: var(--vxe-ui-tag-danger-background-color);
-  --vxe-ui-tips-error-background-color: var(-vxe-ui-tag-error-background-color);
-
   /*upload*/
   --vxe-ui-upload-image-wh-default: 120px;
   --vxe-ui-upload-image-wh-medium: 110px;

package/styles/theme/dark.scss

@@ -1,16 +1,61 @@
 @import './base.scss';
 
 [data-vxe-ui-theme="dark"] {
+  $vxe-ui-font-primary-color: #409eff;
+
+  $vxe-ui-status-success-color: #67c23a;
+  $vxe-ui-status-info-color: #909399;
+  $vxe-ui-status-warning-color: #e6a23c;
+  $vxe-ui-status-danger-color: #f56c6c;
+  $vxe-ui-status-error-color: #f56c6c;
+
   color-scheme: dark;
 
   $vxe-ui-font-color: #a0a3a7;
 
-  /*font*/
+  /*font color*/
   --vxe-ui-font-color: #{$vxe-ui-font-color};
   --vxe-ui-font-tinge-color: #33353b; // 浅色字体颜色
   --vxe-ui-font-lighten-color: #{lighten($vxe-ui-font-color, 10%)};
   --vxe-ui-font-darken-color: #{darken($vxe-ui-font-color, 10%)};
   
+  /*font status color*/
+  --vxe-ui-font-primary-color: #409eff;
+  --vxe-ui-font-primary-tinge-color: #3a4653;
+  --vxe-ui-font-primary-lighten-color: #73b8ff;
+  --vxe-ui-font-primary-darken-color: #0d84ff;
+  --vxe-ui-font-primary-disabled-color: #a6d2ff;
+
+  --vxe-ui-status-success-color: #67c23a;
+  --vxe-ui-status-info-color: #909399;
+  --vxe-ui-status-warning-color: #e6a23c;
+  --vxe-ui-status-danger-color: #f56c6c;
+  --vxe-ui-status-error-color: #f56c6c;
+
+  --vxe-ui-status-success-tinge-color: #33412f;
+  --vxe-ui-status-info-tinge-color: #38383b;
+  --vxe-ui-status-warning-tinge-color: #332c22;
+  --vxe-ui-status-danger-tinge-color: var(--vxe-ui-status-error-tinge-color);
+  --vxe-ui-status-error-tinge-color: #372525;
+
+  --vxe-ui-status-success-lighten-color: #85cf60;
+  --vxe-ui-status-info-lighten-color: #abadb1;
+  --vxe-ui-status-warning-lighten-color: #ecb869;
+  --vxe-ui-status-danger-lighten-color: var(--vxe-ui-status-error-lighten-color);
+  --vxe-ui-status-error-lighten-color: #f89c9c;
+  
+  --vxe-ui-status-success-darken-color: #529b2e;
+  --vxe-ui-status-info-darken-color: #767980;
+  --vxe-ui-status-warning-darken-color: #d48a1b;
+  --vxe-ui-status-danger-darken-color: var(--vxe-ui-status-error-lighten-color);
+  --vxe-ui-status-error-darken-color: #f89c9c;
+  
+  --vxe-ui-status-success-disabled-color: #a3db87;
+  --vxe-ui-status-info-disabled-color: #c5c7ca;
+  --vxe-ui-status-warning-disabled-color: #f2cd96;
+  --vxe-ui-status-danger-disabled-color: var(--vxe-ui-status-danger-disabled-color);
+  --vxe-ui-status-error-disabled-color: #f89c9c;
+  
   /*base*/
   --vxe-ui-base-popup-border-color: var(--vxe-ui-layout-background-color);
   --vxe-ui-base-popup-box-shadow: 0px 12px 30px 8px rgba(0, 0, 0, 0.5);
@@ -29,9 +74,6 @@
   /*modal*/
   --vxe-ui-modal-header-background-color: var(--vxe-ui-layout-background-color);
 
-  /*drawer*/
-  --vxe-ui-drawer-header-background-color: var(--vxe-ui-layout-background-color);
-
   /*tabs*/
   --vxe-ui-tabs-card-header-background-color: #1d1e1f;
 
@@ -47,12 +89,4 @@
   
   /*switch*/
   --vxe-ui-switch-close-background-color: #4C4D4F;
-
-  /*tag*/
-  --vxe-ui-tag-primary-background-color: #3a4653;
-  --vxe-ui-tag-success-background-color: #33412f;
-  --vxe-ui-tag-info-background-color: #38383b;
-  --vxe-ui-tag-warning-background-color: #332c22;
-  --vxe-ui-tag-danger-background-color: var(--vxe-ui-tag-error-background-color);
-  --vxe-ui-tag-error-background-color: #372525;
 }

package/styles/theme/light.scss

@@ -1,14 +1,59 @@
 @import './base.scss';
 
 [data-vxe-ui-theme="light"] {
+  $vxe-ui-font-primary-color: #409eff;
+
+  $vxe-ui-status-success-color: #67c23a;
+  $vxe-ui-status-info-color: #909399;
+  $vxe-ui-status-warning-color: #e6a23c;
+  $vxe-ui-status-danger-color: #f56c6c;
+  $vxe-ui-status-error-color: #f56c6c;
+
   $vxe-ui-font-color: #606266;
 
-  /*font*/
+  /*font color*/
   --vxe-ui-font-color: #{$vxe-ui-font-color};
   --vxe-ui-font-tinge-color: #d4d5d7; // 浅色字体颜色
   --vxe-ui-font-lighten-color: #{lighten($vxe-ui-font-color, 10%)};
   --vxe-ui-font-darken-color: #{darken($vxe-ui-font-color, 10%)};
 
+  /*font status color*/
+  --vxe-ui-font-primary-color: #409eff;
+  --vxe-ui-font-primary-tinge-color: #e8f3ff;
+  --vxe-ui-font-primary-lighten-color: #73b8ff;
+  --vxe-ui-font-primary-darken-color: #0d84ff;
+  --vxe-ui-font-primary-disabled-color: #a6d2ff;
+
+  --vxe-ui-status-success-color: #67c23a;
+  --vxe-ui-status-info-color: #909399;
+  --vxe-ui-status-warning-color: #e6a23c;
+  --vxe-ui-status-danger-color: #f56c6c;
+  --vxe-ui-status-error-color: #f56c6c;
+
+  --vxe-ui-status-success-tinge-color: #eef8e9;
+  --vxe-ui-status-info-tinge-color: #f5f5f6;
+  --vxe-ui-status-warning-tinge-color: #fcf4e8;
+  --vxe-ui-status-danger-tinge-color: var(--vxe-ui-status-error-tinge-color);
+  --vxe-ui-status-error-tinge-color: #fef2f2;
+
+  --vxe-ui-status-success-lighten-color: #85cf60;
+  --vxe-ui-status-info-lighten-color: #abadb1;
+  --vxe-ui-status-warning-lighten-color: #ecb869;
+  --vxe-ui-status-danger-lighten-color: var(--vxe-ui-status-error-lighten-color);
+  --vxe-ui-status-error-lighten-color: #f89c9c;
+  
+  --vxe-ui-status-success-darken-color: #529b2e;
+  --vxe-ui-status-info-darken-color: #767980;
+  --vxe-ui-status-warning-darken-color: #d48a1b;
+  --vxe-ui-status-danger-darken-color: var(--vxe-ui-status-error-lighten-color);
+  --vxe-ui-status-error-darken-color: #f89c9c;
+  
+  --vxe-ui-status-success-disabled-color: #a3db87;
+  --vxe-ui-status-info-disabled-color: #c5c7ca;
+  --vxe-ui-status-warning-disabled-color: #f2cd96;
+  --vxe-ui-status-danger-disabled-color: var(--vxe-ui-status-danger-disabled-color);
+  --vxe-ui-status-error-disabled-color: #f89c9c;
+
   /*base*/
   --vxe-ui-base-popup-border-color: #DADCE0;
   --vxe-ui-base-popup-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.16);
@@ -27,9 +72,6 @@
   /*modal*/
   --vxe-ui-modal-header-background-color: #F8F8F8;
 
-  /*drawer*/
-  --vxe-ui-drawer-header-background-color: #F8F8F8;
-
   /*tabs*/
   --vxe-ui-tabs-card-header-background-color: #f5f7fa;
 
@@ -45,12 +87,4 @@
 
   /*switch*/
   --vxe-ui-switch-close-background-color: rgba(0,0,0,0.35);
-
-  /*tag*/
-  --vxe-ui-tag-primary-background-color: var(--vxe-ui-font-primary-tinge-color);
-  --vxe-ui-tag-success-background-color: var(--vxe-ui-status-success-tinge-color);
-  --vxe-ui-tag-info-background-color: var(--vxe-ui-status-info-tinge-color);
-  --vxe-ui-tag-warning-background-color: var(--vxe-ui-status-warning-tinge-color);
-  --vxe-ui-tag-danger-background-color: var(--vxe-ui-tag-error-background-color);
-  --vxe-ui-tag-error-background-color: var(--vxe-ui-status-error-tinge-color);
 }

package/types/all.d.ts

@@ -1,6 +1,7 @@
 import { App } from 'vue'
 import { VxeGlobalConfig } from './ui'
 
+import VxeAlert from './components/alert'
 import VxeAnchor from './components/anchor'
 import VxeAnchorLink from './components/anchor-link'
 import VxeBreadcrumb from './components/breadcrumb'
@@ -74,6 +75,7 @@ export function install (app: App, options?: VxeGlobalConfig): void
 
 declare module '@vue/runtime-core' {
   export interface GlobalComponents {
+    VxeAlert: typeof VxeAlert
     VxeAnchor: typeof VxeAnchor
     VxeAnchorLink: typeof VxeAnchorLink
     VxeBreadcrumb: typeof VxeBreadcrumb
@@ -148,6 +150,7 @@ declare module '@vue/runtime-core' {
 export * from './ui'
 
 // Components
+export * from './components/alert'
 export * from './components/anchor'
 export * from './components/anchor-link'
 export * from './components/breadcrumb'

package/types/components/alert.d.ts

@@ -0,0 +1,85 @@
+import { RenderFunction, SetupContext, Ref, ComponentPublicInstance, DefineComponent } from 'vue'
+import { defineVxeComponent, VxeComponentBaseOptions, VxeComponentEventParams, VxeComponentStatusType, ValueOf } from '@vxe-ui/core'
+
+/* eslint-disable no-use-before-define,@typescript-eslint/ban-types */
+
+export declare const VxeAlert: defineVxeComponent<VxeAlertProps, VxeAlertEventProps>
+export type VxeAlertComponent = DefineComponent<VxeAlertProps, VxeAlertEmits>
+
+export type VxeAlertInstance = ComponentPublicInstance<VxeAlertProps, VxeAlertConstructor>
+
+export interface VxeAlertConstructor extends VxeComponentBaseOptions, VxeAlertMethods {
+  props: VxeAlertProps
+  context: SetupContext<VxeAlertEmits>
+  reactData: AlertReactData
+  getRefMaps(): AlertPrivateRef
+  getComputeMaps(): AlertPrivateComputed
+  renderVN: RenderFunction
+}
+
+export interface AlertPrivateRef {
+  refElem: Ref<HTMLDivElement | undefined>
+}
+export interface VxeAlertPrivateRef extends AlertPrivateRef { }
+
+export namespace VxeAlertPropTypes {
+  export type Title = string | number
+  export type Content = string | number
+  export type Status = VxeComponentStatusType
+  export type ShowIcon = boolean
+  export type ShowClose = boolean
+  export type Icon = string
+}
+
+export type VxeAlertProps = {
+  title?: VxeAlertPropTypes.Title
+  content?: VxeAlertPropTypes.Content
+  status?: VxeAlertPropTypes.Status
+  showIcon?: VxeAlertPropTypes.ShowIcon
+  showClose?: VxeAlertPropTypes.ShowClose
+  icon?: VxeAlertPropTypes.Icon
+}
+
+export interface AlertPrivateComputed {
+}
+export interface VxeAlertPrivateComputed extends AlertPrivateComputed { }
+
+export interface AlertReactData {
+}
+
+export interface AlertMethods {
+  dispatchEvent(type: ValueOf<VxeAlertEmits>, params: Record<string, any>, evnt: Event | null): void
+}
+export interface VxeAlertMethods extends AlertMethods { }
+
+export interface AlertPrivateMethods { }
+export interface VxeAlertPrivateMethods extends AlertPrivateMethods { }
+
+export type VxeAlertEmits = [
+  'close'
+]
+
+export namespace VxeAlertDefines {
+  export interface AlertEventParams extends VxeComponentEventParams {
+    $alert: VxeAlertConstructor
+  }
+}
+
+export type VxeAlertEventProps = {}
+
+export interface VxeAlertListeners { }
+
+export namespace VxeAlertEvents { }
+
+export namespace VxeAlertSlotTypes {
+  export interface DefaultSlotParams {}
+}
+
+export interface VxeAlertSlots {
+  default: (params: VxeAlertSlotTypes.DefaultSlotParams) => any
+  title: (params: VxeAlertSlotTypes.DefaultSlotParams) => any
+  icon: (params: VxeAlertSlotTypes.DefaultSlotParams) => any
+}
+
+export const Alert: typeof VxeAlert
+export default VxeAlert

package/types/components/drawer.d.ts

@@ -59,6 +59,7 @@ export namespace VxeDrawerPropTypes {
   export type DestroyOnClose = boolean
   export type ShowTitleOverflow = boolean
   export type Transfer = boolean
+  export type Padding = boolean
   export type BeforeHideMethod = (params: VxeDrawerDefines.DrawerVisibleParams) => Promise<any>
   export type Slots = VxeDrawerSlots
 }
@@ -90,6 +91,7 @@ export type VxeDrawerProps = {
   destroyOnClose?: VxeDrawerPropTypes.DestroyOnClose
   showTitleOverflow?: VxeDrawerPropTypes.ShowTitleOverflow
   transfer?: VxeDrawerPropTypes.Transfer
+  padding?: VxeDrawerPropTypes.Padding
   beforeHideMethod?: VxeDrawerPropTypes.BeforeHideMethod
   slots?: VxeDrawerPropTypes.Slots
 }

package/types/components/image-preview.d.ts

@@ -26,12 +26,15 @@ export namespace VxeImagePreviewPropTypes {
   export type ModelValue = null | number
   export type Url = string
   export type UrlList = string[]
+  export type UrlField = string
+  export type MarginSize = string | number
 }
 
 export type VxeImagePreviewProps = {
   modelValue?: VxeImagePreviewPropTypes.ModelValue
-  url?: VxeImagePreviewPropTypes.Url
   urlList?: VxeImagePreviewPropTypes.UrlList
+  urlField?: VxeImagePreviewPropTypes.UrlField
+  marginSize?: VxeImagePreviewPropTypes.MarginSize
 }
 
 export interface ImagePreviewPrivateComputed {
@@ -41,6 +44,8 @@ export interface VxeImagePreviewPrivateComputed extends ImagePreviewPrivateCompu
 
 export interface ImagePreviewReactData {
   activeIndex: undefined | VxeImagePreviewPropTypes.ModelValue
+  targetHeight: number
+  targetWidth: number
   offsetPct11: boolean
   offsetScale: number
   offsetRotate: number

package/types/components/image.d.ts

@@ -65,7 +65,6 @@ export namespace VxeImageDefines {
   }
 
   export type PreviewImageFunction = (options: {
-    url?: string
     urlList?: string[]
     activeIndex?: number
   }) => Promise<any>

package/types/components/modal.d.ts

@@ -90,6 +90,7 @@ export namespace VxeModalPropTypes {
   export type Storage = boolean
   export type StorageKey = string
   export type Animat = boolean
+  export type Padding = boolean
   export type BeforeHideMethod = (params: ModalVisibleParams) => Promise<any>
   export type Slots = VxeModalSlots
 }
@@ -138,6 +139,7 @@ export type VxeModalProps = {
   storage?: VxeModalPropTypes.Storage
   storageKey?: VxeModalPropTypes.StorageKey
   animat?: VxeModalPropTypes.Animat
+  padding?: VxeModalPropTypes.Padding
   beforeHideMethod?: VxeModalPropTypes.BeforeHideMethod
   slots?: VxeModalPropTypes.Slots
   /**

package/types/ui/global-config.d.ts

@@ -1,4 +1,5 @@
 // Vxe UI
+import { VxeAlertProps } from '../components/alert'
 import { VxeAnchorProps } from '../components/anchor'
 import { VxeAnchorLinkProps } from '../components/anchor-link'
 import { VxeBreadcrumbProps } from '../components/breadcrumb'
@@ -21,6 +22,7 @@ import { VxeFormItemProps } from '../components/form-item'
 import { VxeFormViewProps } from '../components/form-view'
 import { VxeIconProps } from '../components/icon'
 import { VxeImageProps } from '../components/image'
+import { VxeImagePreviewProps } from '../components/image-preview'
 import { VxeInputProps } from '../components/input'
 import { VxeLayoutAsideProps } from '../components/layout-aside'
 import { VxeLayoutBodyProps } from '../components/layout-body'
@@ -66,6 +68,7 @@ import { VxeToolbarProps } from '../components/toolbar'
 
 declare module '@vxe-ui/core' {
   export interface VxeGlobalConfig {
+    alert?: VxeAlertProps
     anchor?: VxeAnchorProps
     anchorLink?: VxeAnchorLinkProps
     breadcrumb?: VxeBreadcrumbProps
@@ -87,9 +90,10 @@ declare module '@vxe-ui/core' {
     formDesign?: VxeFormDesignProps
     formGather?: VxeFormGatherProps
     formItem?: VxeFormItemProps
-    icon?: VxeIconProps
     formView?: VxeFormViewProps
+    icon?: VxeIconProps
     image?: VxeImageProps
+    imagePreview?: VxeImagePreviewProps
     input?: VxeInputProps
     layoutAside?: VxeLayoutAsideProps
     layoutBody?: VxeLayoutBodyProps

package/types/ui/global-icon.d.ts

@@ -145,5 +145,12 @@ declare module '@vxe-ui/core' {
     IMAGE_PREVIEW_ROTATE_LEFT?: string
     IMAGE_PREVIEW_ROTATE_RIGHT?: string
     IMAGE_PREVIEW_PRINT?: string
+
+    // alert
+    ALERT_CLOSE?: string
+    ALERT_INFO?: string
+    ALERT_SUCCESS?: string
+    ALERT_WARNING?: string
+    ALERT_ERROR?: string
   }
 }