@qsxy/element-plus-react 1.0.2 → 2.0.0

package/dist/Transfer/typings/list.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { BaseProps, NativeProps } from '../../types/common';
 import { PaginationType } from '../interface';
-import { FieldNames, RenderResult, SelectAllLabel, TransferDirection, TransferLocale } from './index';
+import { RenderResult, TransferDirection, TransferFormat, TransferLocale, TransferPropsAlias } from './index';
 import { TransferListBodyProps } from './listBody';
 export interface RenderedItem<RecordType> {
     renderedText: string;
@@ -16,6 +16,8 @@ export interface TransferListProps<RecordType> extends TransferLocale, BaseProps
     data: RecordType[];
     /**  */
     filterOption?: (filterText: string, item: RecordType) => boolean;
+    /** 搜索框占位符 */
+    filterPlaceholder?: string;
     /**  */
     checkedKeys: (string | number)[];
     /**  */
@@ -27,23 +29,19 @@ export interface TransferListProps<RecordType> extends TransferLocale, BaseProps
     /**  */
     onItemRemove?: (keys: (string | number)[]) => void;
     /**  */
-    handleClear: () => void;
-    /**  */
-    render?: (item: RecordType) => RenderResult;
+    handleClearSearch?: () => void;
+    /** 自定义数据项渲染函数 */
+    renderContent?: (item: RecordType) => RenderResult;
     /**  */
     showSearch?: boolean;
     /**  */
-    searchPlaceholder?: string;
-    /**  */
     itemUnit?: string;
     /**  */
     itemsUnit?: string;
     /**  */
     renderList?: RenderListFunction<RecordType>;
     /**  */
-    footer?: (props: TransferListProps<RecordType>, info?: {
-        direction: TransferDirection;
-    }) => React.ReactElement;
+    footer?: (props: TransferListProps<RecordType>) => React.ReactElement;
     /**  */
     onScroll: (e: any) => void;
     /**  */
@@ -54,11 +52,13 @@ export interface TransferListProps<RecordType> extends TransferLocale, BaseProps
     showSelectAll?: boolean;
     /**  */
     /** 自定义顶部多选框标题 */
-    selectAllLabel?: SelectAllLabel;
+    selectAllLabel?: TransferFormat;
     /**  */
     showRemove?: boolean;
     /** 分页 */
     pagination?: PaginationType;
     /** 数据源的字段别名 */
-    fieldNames: FieldNames;
+    fieldNames: TransferPropsAlias;
+    /** 列表顶部勾选状态文案 */
+    format?: TransferFormat;
 }

package/dist/Transfer/typings/listBody.d.ts

@@ -1,6 +1,6 @@
 import { BaseProps } from '../../types/common';
 import { ElementOf } from '../../types/type';
-import { FieldNames, KeyWiseTransferItem } from './index';
+import { KeyWiseTransferItem, TransferPropsAlias } from './index';
 import { RenderedItem, TransferListProps } from './list';
 export declare const OmitProps: ["handleFilter", "handleClear", "checkedKeys", "instance"];
 export type OmitProp = ElementOf<typeof OmitProps>;
@@ -13,6 +13,6 @@ export interface TransferListBodyProps<RecordType> extends PartialTransferListPr
     filteredRenderItems: RenderedItem<RecordType>[];
     selectedKeys: (string | number)[];
     /** 数据源的字段别名 */
-    fieldNames: FieldNames;
+    fieldNames: TransferPropsAlias;
 }
 export {};

package/dist/Transition/Transition.d.ts

@@ -30,6 +30,7 @@ export interface TransitionProps extends AnimationEventProps {
     transitionAppear?: boolean;
     /** A Timeout for the animation */
     duration?: number;
+    showDuration?: number;
     /** CSS class or classes applied when the component is exited */
     exitedClassName?: string;
     /** CSS class or classes applied while the component is exiting */

package/dist/Transition/Transition.js

@@ -117,10 +117,11 @@ var Transition = /*#__PURE__*/function (_Component) {
       if (node) {
         var _this$props = this.props,
           duration = _this$props.duration,
+          showDuration = _this$props.showDuration,
           animation = _this$props.animation;
         this.animationEventListener = on(node, animation ? getAnimationEnd() : getTransitionEnd(), this.nextCallback);
         if (duration !== null) {
-          setTimeout(this.nextCallback, duration);
+          setTimeout(this.nextCallback, this.state.status < STATUS.ENTER ? showDuration !== null && showDuration !== void 0 ? showDuration : duration : duration);
         }
       } else {
         setTimeout(this.nextCallback, 0);
@@ -177,11 +178,11 @@ var Transition = /*#__PURE__*/function (_Component) {
 
       // const callback = () => {
       // };
-      this.safeSetState({
-        status: STATUS.ENTER
-      }, function () {
-        onEnter === null || onEnter === void 0 || onEnter(node);
-        _this3.onTransitionEnd(node, function () {
+      this.onTransitionEnd(node, function () {
+        _this3.safeSetState({
+          status: STATUS.ENTER
+        }, function () {
+          onEnter === null || onEnter === void 0 || onEnter(node);
           _this3.safeSetState({
             status: STATUS.BEFORE_LEAVE
           }, function () {
@@ -253,7 +254,7 @@ var Transition = /*#__PURE__*/function (_Component) {
       if (disabled) {
         return children;
       }
-      var childProps = omit(rest, ['animation', 'className', 'visible', 'unmountOnExit', 'transitionAppear', 'duration', 'beforeEnter', 'onEnter', 'afterEnter', 'beforeLeave', 'onLeave', 'afterLeave', 'nodeRef']);
+      var childProps = omit(rest, ['animation', 'className', 'visible', 'unmountOnExit', 'transitionAppear', 'duration', 'showDuration', 'beforeEnter', 'onEnter', 'afterEnter', 'beforeLeave', 'onLeave', 'afterLeave', 'nodeRef']);
       var transitionClassName;
       if (name) {
         if (status === STATUS.BEFORE_ENTER) {

package/dist/Tree/CollapseTransition.d.ts

@@ -0,0 +1,7 @@
+import { RefObject } from 'react';
+export declare const beforeEnter: (node: RefObject<HTMLElement>) => void;
+export declare const onEnter: (node: RefObject<HTMLElement>) => void;
+export declare const afterEnter: (node: RefObject<HTMLElement>) => void;
+export declare const beforeLeave: (node: RefObject<any>) => void;
+export declare const onLeave: (node: RefObject<any>) => void;
+export declare const afterLeave: (node: RefObject<HTMLElement>) => void;

package/dist/Tree/CollapseTransition.js

@@ -0,0 +1,60 @@
+export var beforeEnter = function beforeEnter(node) {
+  if (node.current) {
+    var el = node.current;
+    el.style.opacity = '0';
+    el.style.height = '0';
+  }
+};
+export var onEnter = function onEnter(node) {
+  if (node.current) {
+    var el = node.current;
+    el.style.display = 'block';
+    el.dataset.oldOverflow = el.style.overflow;
+    if (el.scrollHeight !== 0) {
+      el.style.height = "".concat(el.scrollHeight, "px");
+    } else {
+      el.style.height = '';
+    }
+    el.style.overflow = 'hidden';
+    el.style.opacity = '1';
+  }
+};
+export var afterEnter = function afterEnter(node) {
+  if (node.current) {
+    var el = node.current;
+    setTimeout(function () {
+      el.style.height = '';
+      el.style.overflow = el.dataset.oldOverflow;
+    }, 300);
+  }
+};
+export var beforeLeave = function beforeLeave(node) {
+  if (node.current) {
+    var el = node.current;
+    if (!el.dataset) {
+      el.dataset = {};
+    }
+    el.dataset.oldOverflow = el.style.overflow;
+    el.style.height = "".concat(el.scrollHeight, "px");
+    el.style.overflow = 'hidden';
+    el.style.margin = 0;
+  }
+};
+export var onLeave = function onLeave(node) {
+  if (node.current) {
+    var el = node.current;
+    // el.style.transitionProperty = 'height';
+    el.style.height = 0;
+  }
+};
+export var afterLeave = function afterLeave(node) {
+  if (node.current) {
+    var el = node.current;
+    el.style.display = 'block';
+    setTimeout(function () {
+      el.style.height = '';
+      el.style.overflow = el.dataset.oldOverflow;
+      el.style.display = 'none';
+    }, 300);
+  }
+};

package/dist/Tree/Tree.d.ts

@@ -1,141 +1,4 @@
-import React, { Component, Ref } from 'react';
-import DirectoryTree from './DirectoryTree';
-import RcTree, { TreeProps as RcTreeProps } from './RCTree';
-import TreeNode from './TreeNode';
-import { BasicDataNode, DataNode, Key } from './typings';
-export interface AntdTreeNodeAttribute {
-    eventKey: string;
-    prefixCls: string;
-    className: string;
-    expanded: boolean;
-    selected: boolean;
-    checked: boolean;
-    halfChecked: boolean;
-    children: React.ReactElement;
-    title: React.ReactElement;
-    pos: string;
-    dragOver: boolean;
-    dragOverGapTop: boolean;
-    dragOverGapBottom: boolean;
-    isLeaf: boolean;
-    selectable: boolean;
-    disabled: boolean;
-    disableCheckbox: boolean;
-}
-export interface AntTreeNodeProps {
-    className?: string;
-    checkable?: boolean;
-    disabled?: boolean;
-    disableCheckbox?: boolean;
-    title?: string | React.ReactElement;
-    key?: Key;
-    eventKey?: string;
-    isLeaf?: boolean;
-    checked?: boolean;
-    expanded?: boolean;
-    loading?: boolean;
-    selected?: boolean;
-    selectable?: boolean;
-    icon?: ((treeNode: AntdTreeNodeAttribute) => React.ReactElement) | React.ReactElement;
-    children?: React.ReactElement;
-    [customProp: string]: any;
-}
-export type AntTreeNode = Component<AntTreeNodeProps, {}>;
-export interface AntTreeNodeBaseEvent {
-    node: AntTreeNode;
-    nativeEvent: MouseEvent;
-}
-export interface AntTreeNodeCheckedEvent extends AntTreeNodeBaseEvent {
-    event: 'check';
-    checked?: boolean;
-    checkedNodes?: AntTreeNode[];
-}
-export interface AntTreeNodeSelectedEvent extends AntTreeNodeBaseEvent {
-    event: 'select';
-    selected?: boolean;
-    selectedNodes?: DataNode[];
-}
-export interface AntTreeNodeExpandedEvent extends AntTreeNodeBaseEvent {
-    expanded?: boolean;
-}
-export interface AntTreeNodeMouseEvent {
-    node: AntTreeNode;
-    event: any;
-}
-export interface AntTreeNodeDragEnterEvent extends AntTreeNodeMouseEvent {
-    expandedKeys: Key[];
-}
-export interface AntTreeNodeDropEvent {
-    node: AntTreeNode;
-    dragNode: AntTreeNode;
-    dragNodesKeys: Key[];
-    dropPosition: number;
-    dropToGap?: boolean;
-    event: React.MouseEventHandler<HTMLElement>;
-}
-export type TreeNodeNormal = DataNode;
-type DraggableFn = (node: AntTreeNode) => boolean;
-interface DraggableConfig {
-    icon?: React.ReactElement | false;
-    nodeDraggable?: DraggableFn;
-}
-export interface TreeProps<T extends BasicDataNode = DataNode> extends Omit<RcTreeProps<T>, 'prefixCls' | 'showLine' | 'direction' | 'draggable'> {
-    showLine?: boolean | {
-        showLeafIcon: boolean;
-    };
-    className?: string;
-    /** 是否支持多选 */
-    multiple?: boolean;
-    /** 是否自动展开父节点 */
-    autoExpandParent?: boolean;
-    /** Checkable状态下节点选择完全受控（父子节点选中状态不再关联） */
-    checkStrictly?: boolean;
-    /** 是否支持选中 */
-    checkable?: boolean;
-    /** 是否禁用树 */
-    disabled?: boolean;
-    /** 默认展开所有树节点 */
-    defaultExpandAll?: boolean;
-    /** 默认展开对应树节点 */
-    defaultExpandParent?: boolean;
-    /** 默认展开指定的树节点 */
-    defaultExpandedKeys?: Key[];
-    /** （受控）展开指定的树节点 */
-    expandedKeys?: Key[];
-    /** （受控）选中复选框的树节点 */
-    checkedKeys?: Key[] | {
-        checked: Key[];
-        halfChecked: Key[];
-    };
-    /** 默认选中复选框的树节点 */
-    defaultCheckedKeys?: Key[];
-    /** （受控）设置选中的树节点 */
-    selectedKeys?: Key[];
-    /** 默认选中的树节点 */
-    defaultSelectedKeys?: Key[];
-    selectable?: boolean;
-    /** 点击树节点触发 */
-    filterAntTreeNode?: (node: AntTreeNode) => boolean;
-    loadedKeys?: Key[];
-    /** 设置节点可拖拽（IE>8） */
-    draggable?: DraggableFn | boolean | DraggableConfig;
-    style?: React.CSSProperties;
-    showIcon?: boolean;
-    icon?: React.ReactNode | ((props: AntdTreeNodeAttribute) => React.ReactNode);
-    switcherIcon?: React.ReactElement<any>;
-    prefixCls?: string;
-    children?: React.ReactElement;
-    blockNode?: boolean;
-}
-declare const ForwardTree: <RecordType extends object = any>(props: TreeProps<RecordType> & {
-    ref?: Ref<RcTree>;
-}) => React.ReactElement;
-type InternalTreeType = typeof ForwardTree;
-interface TreeInterface extends InternalTreeType {
-    displayName?: string;
-    defaultProps?: Partial<TreeProps<any>>;
-    TreeNode: typeof TreeNode;
-    DirectoryTree: typeof DirectoryTree;
-}
-declare const Tree: TreeInterface;
+import React from 'react';
+import { TreeProps, TreeRef } from './typings';
+declare const Tree: React.ForwardRefExoticComponent<TreeProps & React.RefAttributes<TreeRef>>;
 export default Tree;