@qsxy/element-plus-react 1.0.0-next.5 → 1.0.0-next.8

package/dist/TreeSelect/Utils.d.ts

@@ -1,3 +1,3 @@
 import { DataNode } from '../Tree';
 /** 单选不可选父级 */
-export declare const parentNotSelectable: (treeData?: DataNode[]) => DataNode<any>[];
+export declare const parentNotSelectable: (treeData?: DataNode[]) => DataNode[];

package/dist/Util/base.d.ts

@@ -38,4 +38,4 @@ export declare const isNumber: (val: any) => val is number;
 export declare const isString: (val: any) => boolean;
 export declare const isStringNumber: (val: string) => boolean;
 export declare function addUnit(value?: string | number, defaultUnit?: string): string;
-export declare function mergeDefaultProps<T extends object>(defaultProps: Partial<T>, props: T): T;
+export declare function mergeDefaultProps<T>(defaultProps: Partial<T>, target: T): T;

package/dist/Util/base.js

@@ -204,8 +204,20 @@ function addUnit(value, defaultUnit = "px") {
     return value;
   }
 }
-function mergeDefaultProps(defaultProps = {}, props) {
-  return { ...defaultProps, ...props ?? {} };
+function mergeDefaultProps(defaultProps = {}, target) {
+  const props = { ...target };
+  if (Object.prototype.toString.call(props) === "[object Object]" && Object.prototype.toString.call(defaultProps) === "[object Object]") {
+    for (const item in defaultProps) {
+      if (isUndefined(props[item])) {
+        Object.assign(props, { [item]: defaultProps[item] });
+      } else {
+        if (Object.prototype.toString.call(props[item]) === "[object Object]" && Object.prototype.toString.call(defaultProps[item]) === "[object Object]") {
+          props[item] = mergeDefaultProps(props[item], defaultProps[item]);
+        }
+      }
+    }
+  }
+  return props;
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {

package/dist/hooks/useClassNames.d.ts

@@ -103,5 +103,6 @@ declare function useClassNames(str: string, classPrefix?: string): {
      * is('block', { block: true }) => 'is-block'
      */
     is: (...classes: ClassValue[]) => string;
+    cssVarBlock: (object: Record<string, string>) => Record<string, string>;
 };
 export default useClassNames;

package/dist/hooks/useClassNames.js

@@ -126,6 +126,15 @@ function useClassNames(str, classPrefix = import_prefix.namespace) {
     const mergeClasses = classes.length ? (0, import_classnames.default)(...classes).split(" ").filter((cls) => cls).map((item) => `is-${item}`) : [];
     return mergeClasses.join(" ");
   }, []);
+  const cssVarBlock = (object) => {
+    const styles = {};
+    for (const key in object) {
+      if (object[key]) {
+        styles[`--${componentName}-${key}`] = object[key];
+      }
+    }
+    return styles;
+  };
   return {
     /**
      * 如果组件前缀是'button':
@@ -204,7 +213,8 @@ function useClassNames(str, classPrefix = import_prefix.namespace) {
      *
      * is('block', { block: true }) => 'is-block'
      */
-    is
+    is,
+    cssVarBlock
   };
 }
 var useClassNames_default = useClassNames;

package/dist/index.css

@@ -5927,11 +5927,12 @@
 }
 
 .el-input {
+  --el-input-inner-height: calc(var(--el-input-height, 32px) - 2px);
   position: relative;
   display: inline-flex;
   width: 100%;
   font-size: 14px;
-  line-height: var(--el-input-height, 32px);
+  line-height: var(--el-input-inner-height, 30px);
   box-sizing: border-box;
   vertical-align: middle;
 }
@@ -6153,6 +6154,7 @@
 .el-input-group__prepend .el-button {
   display: inline-block;
   margin: 0 -20px;
+  line-height: 0;
 }
 .el-input-group__append button.el-button,
 .el-input-group__append button.el-button:hover,
@@ -6274,13 +6276,13 @@
 
 .el-input--large {
   --el-input-height: var(--el-component-size-large);
-  --el-input-inner-height: calc(var(--el-input-height, var(--el-component-size-large)) - 2px);
+  --el-input-inner-height: calc(var(--el-input-height, 40px) - 2px);
   font-size: 14px;
 }
 
 .el-input--small {
   --el-input-height: var(--el-component-size-small);
-  --el-input-inner-height: var(--el-component-size-small);
+  --el-input-inner-height: calc(var(--el-input-height, 24px) - 2px);
   font-size: 12px;
 }
 
@@ -7150,7 +7152,7 @@
   color: #ffffff;
 }
 .el-month-table td.start-date .cell, .el-month-table td.end-date .cell {
-  color: #ffffff;
+  color: #ffffff !important;
   background: var(--el-datepicker-active-color);
 }
 .el-month-table td.start-date div {
@@ -8896,6 +8898,55 @@
 }
 
 /* Data 数据展示 */
+.el-avatar {
+  --el-avatar-text-color: var(--el-color-white);
+  --el-avatar-bg-color: var(--el-text-color-disabled);
+  --el-avatar-text-size: 14px;
+  --el-avatar-icon-size: 18px;
+  --el-avatar-border-radius: var(--el-border-radius-base);
+  --el-avatar-size-large: 56px;
+  --el-avatar-size-small: 24px;
+  --el-avatar-size: 40px;
+  display: inline-flex;
+  justify-content: center;
+  align-items: center;
+  box-sizing: border-box;
+  text-align: center;
+  overflow: hidden;
+  outline: none;
+  color: var(--el-avatar-text-color);
+  background: var(--el-avatar-bg-color);
+  width: var(--el-avatar-size);
+  height: var(--el-avatar-size);
+  font-size: var(--el-avatar-text-size);
+}
+
+.el-avatar > img {
+  display: block;
+  width: 100%;
+  height: 100%;
+}
+
+.el-avatar--circle {
+  border-radius: 50%;
+}
+
+.el-avatar--square {
+  border-radius: var(--el-avatar-border-radius);
+}
+
+.el-avatar--icon {
+  font-size: var(--el-avatar-icon-size);
+}
+
+.el-avatar--small {
+  --el-avatar-size: 24px;
+}
+
+.el-avatar--large {
+  --el-avatar-size: 56px;
+}
+
 .el-badge {
   --el-badge-bg-color: var(--el-color-error);
   --el-badge-radius: 10px;
@@ -12314,10 +12365,11 @@
   animation: 0.3s linear rShakeHead;
 }
 
-.el-loading-parent .el-loading-parent--relative {
+.el-loading-parent--relative {
   position: relative !important;
 }
-.el-loading-parent .el-loading-parent--hidden {
+
+.el-loading-parent--hidden {
   overflow: hidden !important;
 }
 

package/dist/index.d.ts

@@ -16,7 +16,7 @@ export type { PopperOptionRef, PopperOptions, PopperProps } from './Popper';
 export { Transition as ElTransition } from './Transition';
 export type { TransitionProps } from './Transition';
 export { Cascader as ElCascader } from './Cascader';
-export type { CascaderMenuProps, CascaderProps, TreeMenuProps } from './Cascader';
+export type { CascaderMenuProps, CascaderProps } from './Cascader';
 export { Checkbox as ElCheckbox, CheckboxButton as ElCheckboxButton } from './Checkbox';
 export type { CheckboxProps, ValueType as CheckboxValueType } from './Checkbox';
 export { CheckboxGroup as ElCheckboxGroup } from './CheckboxGroup';
@@ -49,6 +49,8 @@ export { Form as ElForm, useForm } from './Form';
 export type { FormInstance, FormItemProps, FormProps, FormRules, InternalFormInstance, InternalNamePath, NamePath, Rule, RuleType, ValidateErrorEntity, ValidateMessages, ValidateOptions, } from './Form';
 export { Upload as ElUpload } from './Upload';
 export type { UploadFile, UploadFiles, UploadProps, UploadRawFile, UploadRef, UploadStatus, UploadUserFile } from './Upload';
+export { Avatar as ElAvatar } from './Avatar';
+export type { AvatarProps } from './Avatar';
 export { Badge as ElBadge } from './Badge';
 export type { BadgeProps } from './Badge';
 export { Card as ElCard } from './Card';
@@ -69,12 +71,10 @@ export { Tag as ElTag } from './Tag';
 export type { TagProps } from './Tag';
 export { TimeLine as ElTimeLine, TimeLineItem as ElTimeLineItem } from './TimeLine';
 export type { TimeLineItemProps, TimeLineProps } from './TimeLine';
-export { DirectoryTree as ElDirectoryTree, Tree as ElTree, TreeNode } from './Tree';
-export type { AntTreeNode, AntTreeNodeCheckedEvent, AntTreeNodeExpandedEvent, AntTreeNodeMouseEvent, AntTreeNodeProps, AntTreeNodeSelectedEvent, AntdTreeNodeAttribute, BasicDataNode, DataNode, DirectoryTreeExpandAction, DirectoryTreeProps, EventDataNode, Key, TreeNodeProps, TreeProps, } from './Tree';
+export { DirectoryTree as ElDirectoryTree, Tree as ElTree } from './Tree';
+export type { BasicDataNode, DataNode, DirectoryTreeExpandAction, DirectoryTreeProps, EventDataNode, Key, TreeProps, } from './Tree';
 export { TreeSelect as ElTreeSelect } from './TreeSelect';
 export type { SelectInfo, TreeSelectProps, TreeSelectRef } from './TreeSelect';
-export { VirtualList } from './VirtualList';
-export type { ListProps, ListRef, ScrollTo } from './VirtualList';
 export { Breadcrumb as ElBreadcrumb, BreadcrumbItem as ElBreadcrumbItem } from './Breadcrumb';
 export type { BreadcrumbItemProps, BreadcrumbProps } from './Breadcrumb';
 export { Dropdown as ElDropdown, DropdownItem as ElDropdownItem, DropdownMenu as ElDropdownMenu } from './Dropdown';

package/dist/index.js

@@ -23,6 +23,7 @@ __export(src_exports, {
   Calendar: () => import_Calendar.Calendar,
   CalendarContext: () => import_Calendar.CalendarContext,
   ConfigProvider: () => import_ConfigProvider.ConfigProvider,
+  ElAvatar: () => import_Avatar.Avatar,
   ElBadge: () => import_Badge.Badge,
   ElBreadcrumb: () => import_Breadcrumb.Breadcrumb,
   ElBreadcrumbItem: () => import_Breadcrumb.BreadcrumbItem,
@@ -87,8 +88,6 @@ __export(src_exports, {
   ElUpload: () => import_Upload.Upload,
   PopupManager: () => import_Util.PopupManager,
   RowContext: () => import_Row.RowContext,
-  TreeNode: () => import_Tree.TreeNode,
-  VirtualList: () => import_VirtualList.VirtualList,
   download: () => import_Util.download,
   genFileId: () => import_Util.genFileId,
   generateTree: () => import_Util.generateTree,
@@ -125,6 +124,7 @@ var import_Switch = require("./Switch");
 var import_Transfer = require("./Transfer");
 var import_Form = require("./Form");
 var import_Upload = require("./Upload");
+var import_Avatar = require("./Avatar");
 var import_Badge = require("./Badge");
 var import_Card = require("./Card");
 var import_Carousel = require("./Carousel");
@@ -137,7 +137,6 @@ var import_Tag = require("./Tag");
 var import_TimeLine = require("./TimeLine");
 var import_Tree = require("./Tree");
 var import_TreeSelect = require("./TreeSelect");
-var import_VirtualList = require("./VirtualList");
 var import_Breadcrumb = require("./Breadcrumb");
 var import_Dropdown = require("./Dropdown");
 var import_Tabs = require("./Tabs");
@@ -161,6 +160,7 @@ var import_ConfigProvider = require("./ConfigProvider");
   Calendar,
   CalendarContext,
   ConfigProvider,
+  ElAvatar,
   ElBadge,
   ElBreadcrumb,
   ElBreadcrumbItem,
@@ -225,8 +225,6 @@ var import_ConfigProvider = require("./ConfigProvider");
   ElUpload,
   PopupManager,
   RowContext,
-  TreeNode,
-  VirtualList,
   download,
   genFileId,
   generateTree,

package/dist/theme-chalk/avatar/index.scss

@@ -0,0 +1,50 @@
+@use '../common/var';
+
+.#{$namespace}-avatar {
+    --#{$namespace}-avatar-text-color: var(--#{$namespace}-color-white);
+    --#{$namespace}-avatar-bg-color: var(--#{$namespace}-text-color-disabled);
+    --#{$namespace}-avatar-text-size: 14px;
+    --#{$namespace}-avatar-icon-size: 18px;
+    --#{$namespace}-avatar-border-radius: var(--#{$namespace}-border-radius-base);
+    --#{$namespace}-avatar-size-large: 56px;
+    --#{$namespace}-avatar-size-small: 24px;
+    --#{$namespace}-avatar-size: 40px;
+    display: inline-flex;
+    justify-content: center;
+    align-items: center;
+    box-sizing: border-box;
+    text-align: center;
+    overflow: hidden;
+    outline: none;
+    color: var(--#{$namespace}-avatar-text-color);
+    background: var(--#{$namespace}-avatar-bg-color);
+    width: var(--#{$namespace}-avatar-size);
+    height: var(--#{$namespace}-avatar-size);
+    font-size: var(--#{$namespace}-avatar-text-size);
+}
+
+.#{$namespace}-avatar > img {
+    display: block;
+    width: 100%;
+    height: 100%;
+}
+
+.#{$namespace}-avatar--circle {
+    border-radius: 50%;
+}
+
+.#{$namespace}-avatar--square {
+    border-radius: var(--#{$namespace}-avatar-border-radius);
+}
+
+.#{$namespace}-avatar--icon {
+    font-size: var(--#{$namespace}-avatar-icon-size);
+}
+
+.#{$namespace}-avatar--small {
+    --#{$namespace}-avatar-size: 24px;
+}
+
+.#{$namespace}-avatar--large {
+    --#{$namespace}-avatar-size: 56px;
+}

package/dist/theme-chalk/calendar/month-table.scss

@@ -69,7 +69,7 @@
 
         &.start-date .cell,
         &.end-date .cell {
-            color: #ffffff;
+            color: #ffffff !important;
             background: var(--#{$namespace}-datepicker-active-color);
         }
 

package/dist/theme-chalk/index.scss

@@ -31,6 +31,7 @@
 @import './upload';
 
 /* Data 数据展示 */
+@import './avatar/';
 @import './badge';
 @import './card';
 @import './collapse';

package/dist/theme-chalk/input/input.scss

@@ -160,11 +160,12 @@
 }
 
 .#{$namespace}-input {
+    --#{$namespace}-input-inner-height: calc(var(--#{$namespace}-input-height, 32px) - 2px);
     position: relative;
     display: inline-flex;
     width: 100%;
     font-size: 14px;
-    line-height: var(--#{$namespace}-input-height, 32px);
+    line-height: var(--#{$namespace}-input-inner-height, 30px);
     box-sizing: border-box;
     vertical-align: middle;
 
@@ -411,6 +412,7 @@
     .#{$namespace}-button {
         display: inline-block;
         margin: 0 -20px;
+        line-height: 0;
     }
 
     button.#{$namespace}-button,
@@ -564,12 +566,12 @@
 
 .#{$namespace}-input--large {
     --#{$namespace}-input-height: var(--#{$namespace}-component-size-large);
-    --#{$namespace}-input-inner-height: calc(var(--#{$namespace}-input-height, var(--#{$namespace}-component-size-large)) - 2px);
+    --#{$namespace}-input-inner-height: calc(var(--#{$namespace}-input-height, 40px) - 2px);
     font-size: 14px;
 }
 
 .#{$namespace}-input--small {
     --#{$namespace}-input-height: var(--#{$namespace}-component-size-small);
-    --#{$namespace}-input-inner-height: var(--#{$namespace}-component-size-small);
+    --#{$namespace}-input-inner-height: calc(var(--#{$namespace}-input-height, 24px) - 2px);
     font-size: 12px;
 }

package/dist/theme-chalk/loading/index.scss

@@ -1,13 +1,11 @@
 @use '../common/var';
 
-.#{$namespace}-loading-parent {
-    .#{$namespace}-loading-parent--relative {
-        position: relative !important;
-    }
+.#{$namespace}-loading-parent--relative {
+    position: relative !important;
+}
 
-    .#{$namespace}-loading-parent--hidden {
-        overflow: hidden !important;
-    }
+.#{$namespace}-loading-parent--hidden {
+    overflow: hidden !important;
 }
 
 .#{$namespace}-loading-mask {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@qsxy/element-plus-react",
-  "version": "1.0.0-next.5",
+  "version": "1.0.0-next.8",
   "description": "element-plus-react",
   "module": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -48,6 +48,7 @@
     "lodash": "^4.17.21",
     "rc-resize-observer": "^1.4.0",
     "rc-util": "^5.38.1",
+    "rc-virtual-list": "3.18.5",
     "react-is": "^19.0.0",
     "react-popper": "^2.3.0",
     "react-router-dom": "^6.22.1",