ele-admin-plus 1.1.9 → 1.2.0-beta.2

package/lib/ele-app/plus.d.ts

@@ -1,87 +1,159 @@
-import type { ComponentProps } from './types';
+import type EleAdminLayout from '../ele-admin-layout/index';
+import type { BacktopProps } from '../ele-backtop/props';
 import type EleBasicSelect from '../ele-basic-select/index';
+import type { BreadcrumbProps } from '../ele-breadcrumb/props';
+import type ReceiverView from '../ele-config-provider/components/receiver-view';
 import type { CropperProps } from '../ele-cropper/props';
-import type { DataTableProps } from '../ele-data-table/props';
 import type EleDataTable from '../ele-data-table/index';
-import type { DropdownProps } from '../ele-dropdown/props';
+import type { DataTableProps } from '../ele-data-table/props';
 import type EleDropdown from '../ele-dropdown/index';
+import type { DropdownProps } from '../ele-dropdown/props';
 import type { LoadingProps } from '../ele-loading/props';
+import type EleMenus from '../ele-menus/index';
 import type { MenusProps } from '../ele-menus/props';
 import type { MenuItem } from '../ele-menus/types';
 import type { ModalProps } from '../ele-modal/props';
 import type { PaginationProps } from '../ele-pagination/props';
-import type { PopoverProps } from '../ele-popover/props';
 import type ElePopover from '../ele-popover/index';
-import type { ProTableProps } from '../ele-pro-table/props';
-import type EleProTable from '../ele-pro-table/index';
+import type { PopoverProps } from '../ele-popover/props';
 import type { PrinterProps } from '../ele-printer/props';
-import type EleTabs from '../ele-tabs/index';
+import type EleProTable from '../ele-pro-table/index';
+import type { ProTableProps } from '../ele-pro-table/props';
 import type { TableProps } from '../ele-table/props';
-import type { TextProps } from '../ele-text/props';
+import type EleTabs from '../ele-tabs/index';
 import type EleText from '../ele-text/index';
-import type { ToolbarProps } from '../ele-toolbar/props';
-import type { TooltipProps } from '../ele-tooltip/props';
+import type { TextProps } from '../ele-text/props';
 import type { ToolProps } from '../ele-tool/props';
+import type { ToolbarProps } from '../ele-toolbar/props';
 import type EleTooltip from '../ele-tooltip/index';
+import type { TooltipProps } from '../ele-tooltip/props';
 import type EleVirtualTable from '../ele-virtual-table/index';
-import type ReceiverView from '../ele-config-provider/components/receiver-view';
+import type { ComponentProps } from './types';
+
+/**
+ * EleAdminLayout
+ */
+export type EleAdminLayoutInstance = InstanceType<typeof EleAdminLayout> | null;
 
 /**
- * 组件属性
+ * EleBacktop
+ */
+export type EleBacktopProps = ComponentProps<BacktopProps>;
+
+/**
+ * EleBasicSelect
+ */
+export type EleBasicSelectInstance = InstanceType<typeof EleBasicSelect> | null;
+
+/**
+ * EleBreadcrumb
+ */
+export type EleBreadcrumbProps = ComponentProps<BreadcrumbProps>;
+
+/**
+ * EleConfigProvider
+ */
+export type ReceiverViewInstance = InstanceType<typeof ReceiverView> | null;
+
+/**
+ * EleCropper
  */
 export type EleCropperProps = ComponentProps<CropperProps>;
 
+/**
+ * EleDataTable
+ */
+export type EleDataTableInstance = InstanceType<typeof EleDataTable> | null;
+
 export type EleDataTableProps = ComponentProps<DataTableProps>;
 
+/**
+ * EleDropdown
+ */
+export type EleDropdownInstance = InstanceType<typeof EleDropdown> | null;
+
 export type EleDropdownProps = ComponentProps<DropdownProps>;
 
+/**
+ * EleLoading
+ */
 export type EleLoadingProps = ComponentProps<LoadingProps>;
 
+/**
+ * EleMenus
+ */
+export type EleMenusInstance = InstanceType<typeof EleMenus> | null;
+
 export type EleMenusProps = ComponentProps<MenusProps>;
 
 export type EleMenuItemProps = Partial<MenuItem>;
 
+/**
+ * EleModal
+ */
 export type EleModalProps = ComponentProps<ModalProps>;
 
+/**
+ * ElePagination
+ */
 export type ElePaginationProps = ComponentProps<PaginationProps>;
 
-export type ElePopoverProps = Partial<PopoverProps>;
+/**
+ * ElePopover
+ */
+export type ElePopoverInstance = InstanceType<typeof ElePopover> | null;
 
-export type EleProTableProps = ComponentProps<ProTableProps>;
+export type ElePopoverProps = Partial<PopoverProps>;
 
+/**
+ * ElePrinter
+ */
 export type ElePrinterProps = ComponentProps<PrinterProps>;
 
-export type EleTableProps = ComponentProps<TableProps>;
-
-export type EleTextProps = ComponentProps<TextProps>;
-
-export type EleToolbarProps = ComponentProps<ToolbarProps>;
-
-export type EleTooltipProps = Partial<TooltipProps>;
+/**
+ * EleProTable
+ */
+export type EleProTableInstance = InstanceType<typeof EleProTable> | null;
 
-export type EleToolProps = Partial<ToolProps>;
+export type EleProTableProps = ComponentProps<ProTableProps>;
 
 /**
- * 组件实例
+ * EleTable
  */
-export type EleBasicSelectInstance = InstanceType<typeof EleBasicSelect> | null;
-
-export type EleDataTableInstance = InstanceType<typeof EleDataTable> | null;
+export type EleTableProps = ComponentProps<TableProps>;
 
-export type EleDropdownInstance = InstanceType<typeof EleDropdown> | null;
+/**
+ * EleTabs
+ */
+export type EleTabsInstance = InstanceType<typeof EleTabs> | null;
 
-export type ElePopoverInstance = InstanceType<typeof ElePopover> | null;
+/**
+ * EleText
+ */
+export type EleTextInstance = InstanceType<typeof EleText> | null;
 
-export type EleProTableInstance = InstanceType<typeof EleProTable> | null;
+export type EleTextProps = ComponentProps<TextProps>;
 
-export type EleTabsInstance = InstanceType<typeof EleTabs> | null;
+/**
+ * EleTool
+ */
+export type EleToolProps = Partial<ToolProps>;
 
-export type EleTextInstance = InstanceType<typeof EleText> | null;
+/**
+ * EleToolbar
+ */
+export type EleToolbarProps = ComponentProps<ToolbarProps>;
 
+/**
+ * EleTooltip
+ */
 export type EleTooltipInstance = InstanceType<typeof EleTooltip> | null;
 
+export type EleTooltipProps = Partial<TooltipProps>;
+
+/**
+ * EleVirtualTable
+ */
 export type EleVirtualTableInstance = InstanceType<
   typeof EleVirtualTable
 > | null;
-
-export type ReceiverViewInstance = InstanceType<typeof ReceiverView> | null;

package/lib/ele-app/style/common/index.d.ts

@@ -0,0 +1 @@
+

package/lib/ele-app/style/index.d.ts

@@ -0,0 +1 @@
+

package/lib/ele-app/style/message/css-var.scss

@@ -5,8 +5,4 @@
   .ele-message {
     @include set-ele-var('message', $var);
   }
-
-  .ele-message-mask {
-    @include set-ele-var('message-mask', $var);
-  }
 }

package/lib/ele-app/style/message/index.cjs

@@ -1,3 +1,3 @@
 "use strict";
-require("element-plus/lib/components/message/style/index");
+require("element-plus/es/components/message/style/index");
 require("./index.scss");

package/lib/ele-app/style/message/index.d.ts

@@ -0,0 +1 @@
+

package/lib/ele-app/style/message/index.scss

@@ -4,121 +4,243 @@
 
 @include set-message-var($ele);
 
-/* 消息提示 */
 .ele-message.el-message {
-  width: max-content;
-  padding: eleVar('message', 'padding');
-  border-radius: eleVar('message', 'radius');
-  box-shadow: eleVar('message', 'shadow');
+  gap: 0;
+  padding: 0;
   border: none;
+  border-radius: 0;
+  background: none;
+  width: max-content;
+  pointer-events: auto;
+  align-items: flex-start;
+  margin: 0 auto eleVar('message', 'space') auto;
+  transition: margin-bottom 0.2s;
+  position: relative !important;
+  left: auto !important;
+  top: auto !important;
+  transform: none;
+  opacity: 1;
+
+  & > .el-message__content {
+    display: none;
+  }
+
+  & > .el-message__icon,
+  & > .el-message__badge {
+    z-index: calc(#{elVar('index', 'popper')} + 2);
+    transition: (
+      margin-top 0.4s,
+      transform elVar('transition-duration'),
+      opacity elVar('transition-duration')
+    );
+  }
 
-  .el-message__content {
+  & > .el-message__icon {
+    width: auto;
+    height: auto;
+    max-width: 100%;
+    line-height: normal;
+    font-style: normal;
+    display: flex;
+    flex-shrink: 0;
     color: eleVar('message', 'color');
     font-size: eleVar('message', 'size');
+    padding: eleVar('message', 'padding');
+    box-shadow: eleVar('message', 'shadow');
+    border-radius: eleVar('message', 'radius');
+    background: elVar('color-primary', 'light-9');
+    border: 0 solid elVar('color-primary', 'light-8');
+    z-index: calc(#{elVar('index', 'popper')} + 1);
     box-sizing: border-box;
+    position: relative;
   }
+}
 
-  .el-message__icon {
-    font-size: eleVar('message', 'icon-size');
-    margin: eleVar('message', 'icon-margin');
-  }
+.ele-message + .ele-message {
+  margin-top: 0 !important;
+}
 
-  .el-message__closeBtn {
-    width: eleVar('message', 'close-size');
-    height: eleVar('message', 'close-size');
-    line-height: eleVar('message', 'close-size');
-    color: eleVar('message', 'close-color');
-    font-size: eleVar('message', 'close-font-size');
-    margin: eleVar('message', 'close-margin');
-    border-radius: eleVar('message', 'close-radius');
-    transition: (color $ele-transition, background-color $ele-transition);
-    position: static;
-    top: auto;
-    right: auto;
-    transform: none;
-
-    &:hover {
-      color: eleVar('message', 'close-hover-color');
-      background: eleVar('message', 'close-hover-bg');
-    }
-  }
+.ele-message-icon {
+  flex-shrink: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: elVar('color-primary');
+  font-size: eleVar('message', 'icon-size');
+  margin: eleVar('message', 'icon-margin');
+}
 
-  &.is-closable .el-message__content {
-    padding-right: 0;
+.ele-message-close {
+  flex-shrink: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: eleVar('message', 'close-size');
+  height: eleVar('message', 'close-size');
+  line-height: eleVar('message', 'close-size');
+  color: eleVar('message', 'close-color');
+  font-size: eleVar('message', 'close-font-size');
+  margin: eleVar('message', 'close-margin');
+  border-radius: eleVar('message', 'close-radius');
+  transition: (color $transition-base, background-color $transition-base);
+  cursor: pointer;
+
+  &:hover {
+    color: eleVar('message', 'close-hover-color');
+    background: eleVar('message', 'close-hover-bg');
   }
+}
 
-  &.el-message--info {
-    #{elVarName('message', 'text-color')}: elVar('color-primary');
-    #{elVarName('message', 'bg-color')}: elVar('color-primary', 'light-9');
-    #{elVarName('message', 'border-color')}: elVar('color-primary', 'light-8');
-  }
+/* 情景色类型 */
+.ele-message.el-message--success > .el-message__icon {
+  background: elVar('color-success', 'light-9');
+  border-color: elVar('color-success', 'light-7');
 
-  /* 简约风格 */
-  &.is-plain {
-    #{elVarName('message', 'bg-color')}: eleVar('message', 'plain-bg');
+  & > .ele-message-icon {
+    color: elVar('color-success');
   }
+}
 
-  /* 加载框 */
-  &.ele-message-loading {
-    #{elVarName('message', 'text-color')}: elVar('color-primary');
-    #{elVarName('message', 'bg-color')}: elVar('color-primary', 'light-9');
-    #{elVarName('message', 'border-color')}: elVar('color-primary', 'light-8');
+.ele-message.el-message--warning > .el-message__icon {
+  background: elVar('color-warning', 'light-9');
+  border-color: elVar('color-warning', 'light-7');
 
-    &.is-plain {
-      #{elVarName('message', 'bg-color')}: eleVar('message', 'plain-bg');
-    }
+  & > .ele-message-icon {
+    color: elVar('color-warning');
   }
 }
 
-/* 加载框 */
-.ele-message-loading.el-message {
-  left: 0;
-  right: 0;
-  margin: 0 auto;
-  transform: none;
-  transition: (opacity elVar('transition-duration'), margin 0.4s, top 0.4s);
+.ele-message.el-message--error > .el-message__icon {
+  background: elVar('color-error', 'light-9');
+  border-color: elVar('color-error', 'light-7');
 
-  &.el-message-fade-enter-from,
-  &.el-message-fade-leave-to {
-    margin-top: -62px;
+  & > .ele-message-icon {
+    color: elVar('color-error');
   }
+}
+
+.ele-message.el-message--info > .el-message__badge > .el-badge__content {
+  background: elVar('color-primary');
+}
+
+/* 简约风格 */
+.ele-message.is-plain.el-message {
+  background: none;
+  box-shadow: none;
+}
+
+.ele-message.is-plain > .el-message__icon,
+.ele-message.is-plain-alert > .el-message__icon {
+  background: eleVar('message', 'plain-bg');
+}
+
+/* 彩色风格 */
+.ele-message.is-alert > .el-message__icon {
+  color: elVar('color-primary');
+  padding: eleVar('message', 'alert-padding');
+  border-width: 1px;
+  box-shadow: none;
+}
+
+.ele-message.is-plain-alert > .el-message__icon {
+  color: elVar('color-primary');
+}
+
+.el-message--success.is-alert > .el-message__icon,
+.el-message--success.is-plain-alert > .el-message__icon {
+  color: elVar('color-success');
+}
+
+.el-message--warning.is-alert > .el-message__icon,
+.el-message--warning.is-plain-alert > .el-message__icon {
+  color: elVar('color-warning');
+}
+
+.el-message--error.is-alert > .el-message__icon,
+.el-message--error.is-plain-alert > .el-message__icon {
+  color: elVar('color-error');
+}
+
+/* 加载框 */
+.ele-message.is-loading {
+  position: static !important;
 
   &::before {
     content: '';
-    position: fixed;
+    position: absolute;
     top: 0;
     left: 0;
     right: 0;
     bottom: 0;
+    transition: opacity elVar('transition-duration');
+    z-index: elVar('index', 'popper');
   }
 
-  & > .el-message__content {
-    position: relative;
+  & > .el-message__badge {
+    display: none;
+  }
+}
+
+/* 遮罩 */
+.ele-message.is-show-mask::before {
+  background: eleVar('message', 'mask-color');
+}
+
+/* 居中 */
+.ele-message.is-centered {
+  margin: 0 !important;
+  position: absolute !important;
+  top: 0 !important;
+  left: 0 !important;
+  right: 0;
+  bottom: 0;
+  width: 100%;
+  height: 100%;
+  max-width: none;
+  align-items: center;
+  justify-content: center;
+
+  &.el-message-fade-enter-from > .el-message__icon,
+  &.el-message-fade-leave-to > .el-message__icon {
+    transform: scale(0.6);
+    margin-top: 0;
   }
+}
+
+/* 进入和关闭动画 */
+.ele-message.el-message-fade-enter-from,
+.ele-message.el-message-fade-leave-to {
+  margin-bottom: 0;
 
   & > .el-message__icon,
-  & > .el-message__content,
-  & > .el-message__closeBtn {
-    z-index: 1;
+  & > .el-message__badge {
+    opacity: 0;
+    margin-top: -88px;
   }
 
-  & > .el-message__icon > .el-icon {
-    font-size: 16px;
-    animation: rotating 1s linear infinite;
+  &::before {
+    opacity: 0;
   }
+}
 
-  /* 遮罩 */
-  &.ele-message-mask {
-    box-shadow:
-      eleVar('message', 'shadow'),
-      0 0 0 eleVar('message-mask', 'size') eleVar('message-mask', 'color');
+/* 容器 */
+.ele-message-wrapper {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  width: 100%;
+  height: 100%;
+  box-sizing: border-box;
+  pointer-events: none;
+  overflow: hidden;
+
+  & > .ele-message:first-child {
+    margin-top: eleVar('message', 'space');
   }
 
-  /* 居中 */
-  &.is-centered {
-    top: 0 !important;
-    bottom: 0;
-    height: max-content;
-    margin: auto;
+  &.is-hide {
+    display: none;
   }
 }

package/lib/ele-app/style/overwrite/autocomplete/index.d.ts

@@ -0,0 +1 @@
+

package/lib/ele-app/style/overwrite/autocomplete/index.scss

@@ -24,7 +24,7 @@
     line-height: eleVar('autocomplete', 'item-height');
     padding: eleVar('autocomplete', 'item-padding');
     border-radius: eleVar('autocomplete', 'item-radius');
-    transition: (color $ele-transition, background-color $ele-transition);
+    transition: (color $transition-base, background-color $transition-base);
 
     & + li {
       margin-top: eleVar('autocomplete', 'item-margin');

package/lib/ele-app/style/overwrite/backtop/index.d.ts

@@ -0,0 +1 @@
+

package/lib/ele-app/style/overwrite/backtop/index.scss

@@ -4,5 +4,5 @@
 /* Backtop */
 body .el-backtop {
   box-shadow: elVar('box-shadow', 'light');
-  transition: (color $ele-transition, background-color $ele-transition);
+  transition: (color $transition-base, background-color $transition-base);
 }

package/lib/ele-app/style/overwrite/cascader/index.d.ts

@@ -0,0 +1 @@
+

package/lib/ele-app/style/overwrite/cascader/index.scss

@@ -21,7 +21,7 @@
     line-height: eleVar('cascader', 'item-height');
     padding: eleVar('cascader', 'item-padding');
     border-radius: eleVar('cascader', 'item-radius');
-    transition: (color $ele-transition, background-color $ele-transition);
+    transition: (color $transition-base, background-color $transition-base);
 
     & > .el-checkbox,
     & > .el-radio {

package/lib/ele-app/style/overwrite/checkbox/index.d.ts

@@ -0,0 +1 @@
+

package/lib/ele-app/style/overwrite/checkbox/index.scss

@@ -10,17 +10,19 @@ body .el-checkbox {
     color: eleVar('checkbox', 'color');
     font-size: eleVar('checkbox', 'font-size');
     line-height: eleVar('checkbox', 'size');
-    transition: (color $ele-transition, font-weight $ele-transition);
+    transition: (color $transition-base, font-weight $transition-base);
   }
 
   .el-checkbox__inner {
-    $transit: (border-color $ele-transition, background-color $ele-transition);
     width: eleVar('checkbox', 'size');
     height: eleVar('checkbox', 'size');
     background: eleVar('checkbox', 'bg');
     border: eleVar('checkbox', 'border');
     border-radius: eleVar('checkbox', 'radius');
-    transition: $transit;
+    transition: (
+      border-color $transition-base,
+      background-color $transition-base
+    );
 
     &::after {
       top: 50%;

package/lib/ele-app/style/overwrite/color-picker/index.d.ts

@@ -0,0 +1 @@
+

package/lib/ele-app/style/overwrite/css-var.scss

@@ -11,7 +11,6 @@
 @use './popper/css-var.scss' as *;
 @use './radio/css-var.scss' as *;
 @use './select/css-var.scss' as *;
-@use './table-filter/css-var.scss' as *;
 @use './tag/css-var.scss' as *;
 @use './tree/css-var.scss' as *;
 @use './tree-select/css-var.scss' as *;
@@ -30,7 +29,6 @@
   @include set-el-popper-var($var);
   @include set-el-radio-var($var);
   @include set-el-select-var($var);
-  @include set-el-table-filter-var($var);
   @include set-el-tag-var($var);
   @include set-el-tree-var($var);
   @include set-el-tree-select-var($var);

package/lib/ele-app/style/overwrite/date-picker/index.d.ts

@@ -0,0 +1 @@
+