@nutui/nutui-react 4.0.0-beta.3 → 4.0.0-beta.5

package/dist/es/packages/dialog/dialog.js

@@ -36,33 +36,33 @@ var defaultProps = _object_spread_props(_object_spread({}, defaultOverlayProps,
     overlayStyle: {},
     overlayClassName: 'nut-dialog-overlay',
     zIndex: 1200,
-    beforeCancel: function() {
+    beforeCancel: function beforeCancel() {
         return true;
     },
-    beforeClose: function() {
+    beforeClose: function beforeClose() {
         return true;
     },
-    onCancel: function() {},
-    onClose: function() {},
-    onOverlayClick: function() {
+    onCancel: function onCancel() {},
+    onClose: function onClose() {},
+    onOverlayClick: function onOverlayClick() {
         return true;
     }
 });
-var BaseDialog = function(props, ref) {
+var BaseDialog = function BaseDialog(props, ref) {
     var _mergeProps = mergeProps(defaultProps, props), closeOnOverlayClick = _mergeProps.closeOnOverlayClick, confirmText = _mergeProps.confirmText, cancelText = _mergeProps.cancelText, children = _mergeProps.children, className = _mergeProps.className, closeIconPosition = _mergeProps.closeIconPosition, closeIcon = _mergeProps.closeIcon, content = _mergeProps.content, disableConfirmButton = _mergeProps.disableConfirmButton, footer = _mergeProps.footer, footerDirection = _mergeProps.footerDirection, header = _mergeProps.header, cancelBadge = _mergeProps.cancelBadge, confirmBadge = _mergeProps.confirmBadge, hideConfirmButton = _mergeProps.hideConfirmButton, hideCancelButton = _mergeProps.hideCancelButton, lockScroll = _mergeProps.lockScroll, overlay = _mergeProps.overlay, overlayStyle = _mergeProps.overlayStyle, overlayClassName = _mergeProps.overlayClassName, style = _mergeProps.style, title = _mergeProps.title, visible = _mergeProps.visible, zIndex = _mergeProps.zIndex, beforeCancel = _mergeProps.beforeCancel, beforeClose = _mergeProps.beforeClose, onClose = _mergeProps.onClose, onCancel = _mergeProps.onCancel, onConfirm = _mergeProps.onConfirm, onOverlayClick = _mergeProps.onOverlayClick;
     var classPrefix = 'nut-dialog';
     var locale = useConfig().locale;
     var _useState = _sliced_to_array(useState(false), 2), loading = _useState[0], setLoading = _useState[1];
-    var renderFooter = function() {
+    var renderFooter = function renderFooter() {
         if (footer === null) return '';
-        var handleCancel = function(e) {
+        var handleCancel = function handleCancel(e) {
             e.stopPropagation();
             if (!(beforeCancel === null || beforeCancel === void 0 ? void 0 : beforeCancel())) return;
             onCancel();
         };
-        var handleOk = function(e) {
+        var handleOk = function handleOk(e) {
             return _async_to_generator(function() {
-                var e1;
+                var unused;
                 return _ts_generator(this, function(_state) {
                     switch(_state.label){
                         case 0:
@@ -89,7 +89,7 @@ var BaseDialog = function(props, ref) {
                                 4
                             ];
                         case 3:
-                            e1 = _state.sent();
+                            unused = _state.sent();
                             setLoading(false);
                             return [
                                 3,
@@ -104,22 +104,22 @@ var BaseDialog = function(props, ref) {
             })();
         };
         var btnClass = hideCancelButton || hideConfirmButton ? "".concat(classPrefix, "-footer-block") : '';
-        var renderCancelOfVertical = function() {
+        var renderCancelOfVertical = function renderCancelOfVertical() {
             return !hideCancelButton && /*#__PURE__*/ React.createElement("div", {
                 className: "".concat(classPrefix, "-footer-cancel ").concat(btnClass),
-                onClick: function(e) {
+                onClick: function onClick(e) {
                     return handleCancel(e);
                 }
             }, cancelText || locale.cancel);
         };
-        var renderCancel = function() {
+        var renderCancel = function renderCancel() {
             return !hideCancelButton && /*#__PURE__*/ React.createElement(React.Fragment, null, cancelBadge ? /*#__PURE__*/ React.createElement("div", {
                 className: "".concat(classPrefix, "-footer-cancel-container")
             }, /*#__PURE__*/ React.createElement(Button, {
                 type: "default",
                 size: "large",
                 className: "".concat(classPrefix, "-footer-cancel ").concat(btnClass),
-                onClick: function(e) {
+                onClick: function onClick(e) {
                     return handleCancel(e);
                 }
             }, cancelText || locale.cancel), cancelBadge ? /*#__PURE__*/ React.createElement("div", {
@@ -128,12 +128,12 @@ var BaseDialog = function(props, ref) {
                 type: "default",
                 size: "large",
                 className: "".concat(classPrefix, "-footer-cancel ").concat(btnClass),
-                onClick: function(e) {
+                onClick: function onClick(e) {
                     return handleCancel(e);
                 }
             }, cancelText || locale.cancel));
         };
-        var renderConfirm = function() {
+        var renderConfirm = function renderConfirm() {
             return !hideConfirmButton && /*#__PURE__*/ React.createElement(React.Fragment, null, confirmBadge ? /*#__PURE__*/ React.createElement("div", {
                 className: "".concat(classPrefix, "-footer-ok-container")
             }, /*#__PURE__*/ React.createElement(Button, {
@@ -143,7 +143,7 @@ var BaseDialog = function(props, ref) {
                     disabled: disableConfirmButton
                 }),
                 disabled: disableConfirmButton,
-                onClick: function(e) {
+                onClick: function onClick(e) {
                     return handleOk(e);
                 },
                 loading: loading
@@ -156,7 +156,7 @@ var BaseDialog = function(props, ref) {
                     disabled: disableConfirmButton
                 }),
                 disabled: disableConfirmButton,
-                onClick: function(e) {
+                onClick: function onClick(e) {
                     return handleOk(e);
                 },
                 loading: loading
@@ -164,9 +164,9 @@ var BaseDialog = function(props, ref) {
         };
         return footer || /*#__PURE__*/ React.createElement(React.Fragment, null, footerDirection === 'vertical' ? /*#__PURE__*/ React.createElement(React.Fragment, null, renderConfirm(), renderCancelOfVertical()) : /*#__PURE__*/ React.createElement(React.Fragment, null, renderCancel(), renderConfirm()));
     };
-    var renderCloseIcon = function() {
+    var renderCloseIcon = function renderCloseIcon() {
         if (!closeIcon) return null;
-        var handleClose = function() {
+        var handleClose = function handleClose() {
             if (!(beforeClose === null || beforeClose === void 0 ? void 0 : beforeClose())) return;
             onClose();
         };
@@ -181,13 +181,13 @@ var BaseDialog = function(props, ref) {
             tabIndex: 0
         }, /*#__PURE__*/ React.isValidElement(closeIcon) ? closeIcon : systomIcon);
     };
-    var onHandleClickOverlay = function(e) {
+    var onHandleClickOverlay = function onHandleClickOverlay(e) {
         if (closeOnOverlayClick && visible && e.target === e.currentTarget) {
             var closed = onOverlayClick && onOverlayClick(e);
             closed && onCancel();
         }
     };
-    var renderContent = function() {
+    var renderContent = function renderContent() {
         return /*#__PURE__*/ React.createElement(CSSTransition, {
             in: visible,
             timeout: 300,

package/dist/es/packages/divider/divider.js

@@ -11,8 +11,8 @@ var defaultProps = _object_spread_props(_object_spread({}, ComponentDefaults), {
     direction: 'horizontal'
 });
 var classPrefix = "nut-divider";
-export var Divider = function(props) {
-    var _ref = _object_spread({}, defaultProps, props), children = _ref.children, contentPosition = _ref.contentPosition, style = _ref.style, className = _ref.className, direction = _ref.direction, rest = _object_without_properties(_ref, [
+export var Divider = function Divider(props) {
+    var _$_object_spread = _object_spread({}, defaultProps, props), children = _$_object_spread.children, contentPosition = _$_object_spread.contentPosition, style = _$_object_spread.style, className = _$_object_spread.className, direction = _$_object_spread.direction, rest = _object_without_properties(_$_object_spread, [
         "children",
         "contentPosition",
         "style",
@@ -25,7 +25,7 @@ export var Divider = function(props) {
         'left',
         'right'
     ].includes(contentPosition) || children) && rtl), _obj)) : classNames((_obj1 = {}, _define_property(_obj1, "".concat(classPrefix), true), _define_property(_obj1, "".concat(classPrefix, "-vertical"), direction === 'vertical'), _obj1));
-    var getClassNames = function(direction) {
+    var getClassNames = function getClassNames(direction) {
         return "".concat(classes.split(' ').map(function(item) {
             return "".concat(item, "-").concat(direction);
         }).join(' '));

package/dist/es/packages/drag/drag.js

@@ -16,8 +16,8 @@ var defaultProps = _object_spread_props(_object_spread({}, ComponentDefaults), {
         bottom: 0
     }
 });
-export var Drag = function(props) {
-    var _ref = _object_spread({}, defaultProps, props), attract = _ref.attract, direction = _ref.direction, boundary = _ref.boundary, onDrag = _ref.onDrag, onDragStart = _ref.onDragStart, onDragEnd = _ref.onDragEnd, children = _ref.children, className = _ref.className, style = _ref.style, reset = _object_without_properties(_ref, [
+export var Drag = function Drag(props) {
+    var _$_object_spread = _object_spread({}, defaultProps, props), attract = _$_object_spread.attract, direction = _$_object_spread.direction, boundary = _$_object_spread.boundary, onDrag = _$_object_spread.onDrag, onDragStart = _$_object_spread.onDragStart, onDragEnd = _$_object_spread.onDragEnd, children = _$_object_spread.children, className = _$_object_spread.className, style = _$_object_spread.style, reset = _object_without_properties(_$_object_spread, [
         "attract",
         "direction",
         "boundary",
@@ -38,7 +38,7 @@ export var Drag = function(props) {
         };
     }), 2), currstyle = _useSpring[0], api = _useSpring[1];
     var middleLine = useRef(0);
-    var getInfo = function() {
+    var getInfo = function getInfo() {
         var el = myDrag.current;
         if (el) {
             var offsetTop = el.offsetTop, offsetLeft = el.offsetLeft;
@@ -92,7 +92,7 @@ export var Drag = function(props) {
             }
         }
     }, {
-        from: function() {
+        from: function from() {
             return [
                 currstyle.x.get(),
                 currstyle.y.get()

package/dist/es/packages/elevator/elevator.js

@@ -21,8 +21,8 @@ var defaultProps = _object_spread_props(_object_spread({}, ComponentDefaults), {
     defaultValue: undefined,
     value: undefined
 });
-export var Elevator = function(props) {
-    var _ref = _object_spread({}, defaultProps, props), value = _ref.value, defaultValue = _ref.defaultValue, mode = _ref.mode, height = _ref.height, floorKey = _ref.floorKey, list = _ref.list, sticky = _ref.sticky, spaceHeight = _ref.spaceHeight, showKeys = _ref.showKeys, className = _ref.className, style = _ref.style, onItemClick = _ref.onItemClick, onIndexClick = _ref.onIndexClick, children = _ref.children, rest = _object_without_properties(_ref, [
+export var Elevator = function Elevator(props) {
+    var _$_object_spread = _object_spread({}, defaultProps, props), value = _$_object_spread.value, defaultValue = _$_object_spread.defaultValue, mode = _$_object_spread.mode, height = _$_object_spread.height, floorKey = _$_object_spread.floorKey, list = _$_object_spread.list, sticky = _$_object_spread.sticky, spaceHeight = _$_object_spread.spaceHeight, showKeys = _$_object_spread.showKeys, className = _$_object_spread.className, style = _$_object_spread.style, onItemClick = _$_object_spread.onItemClick, onIndexClick = _$_object_spread.onIndexClick, children = _$_object_spread.children, rest = _object_without_properties(_$_object_spread, [
         "value",
         "defaultValue",
         "mode",
@@ -59,10 +59,10 @@ export var Elevator = function(props) {
     var _useState2 = _sliced_to_array(useState(0), 2), codeIndex = _useState2[0], setCodeIndex = _useState2[1];
     var _useState3 = _sliced_to_array(useState(false), 2), scrollStart = _useState3[0], setScrollStart = _useState3[1];
     var state = useRef(initData);
-    var resetScrollState = function() {
+    var resetScrollState = function resetScrollState() {
         setScrollStart(false);
     };
-    var getData = function(el, name) {
+    var getData = function getData(el, name) {
         var prefix = 'data-';
         // 检查点击的元素是否直接包含 data-index 属性
         if (el.hasAttribute('data-index')) {
@@ -70,7 +70,7 @@ export var Elevator = function(props) {
         }
         return '-1';
     };
-    var calculateHeight = function() {
+    var calculateHeight = function calculateHeight() {
         var height = 0;
         state.current.listHeight.push(height);
         for(var i = 0; i < state.current.listGroup.length; i++){
@@ -79,7 +79,7 @@ export var Elevator = function(props) {
             state.current.listHeight.push(height);
         }
     };
-    var scrollTo = function(index) {
+    var scrollTo = function scrollTo(index) {
         if (!index && index !== 0) {
             return;
         }
@@ -99,7 +99,7 @@ export var Elevator = function(props) {
         }
     };
     var bind = useGesture({
-        onDragStart: function(param) {
+        onDragStart: function onDragStart(param) {
             var target = param.target, offset = param.offset;
             setScrollStart(true);
             var index = Number(getData(target, 'index'));
@@ -114,7 +114,7 @@ export var Elevator = function(props) {
             });
             scrollTo(index);
         },
-        onDragEnd: function(param) {
+        onDragEnd: function onDragEnd(param) {
             var offset = param.offset;
             touchState.current.y2 = offset[1];
             var delta = (touchState.current.y2 - touchState.current.y1) / spaceHeight || 0;
@@ -125,14 +125,14 @@ export var Elevator = function(props) {
             resetScrollState();
         }
     });
-    var handleClickItem = function(key, item) {
+    var handleClickItem = function handleClickItem(key, item) {
         onItemClick && onItemClick(key, item);
         setCurrentData(item);
     };
-    var handleClickIndex = function(key) {
+    var handleClickIndex = function handleClickIndex(key) {
         onIndexClick && onIndexClick(key);
     };
-    var setListGroup = function() {
+    var setListGroup = function setListGroup() {
         if (listview.current) {
             var els = listview.current.querySelectorAll('.nut-elevator-list-item');
             els.forEach(function(el) {
@@ -142,7 +142,7 @@ export var Elevator = function(props) {
             });
         }
     };
-    var listViewScroll = function(e) {
+    var listViewScroll = function listViewScroll(e) {
         var listHeight = state.current.listHeight;
         if (!listHeight.length) {
             calculateHeight();
@@ -199,7 +199,7 @@ export var Elevator = function(props) {
             return /*#__PURE__*/ React.createElement("div", {
                 className: classNames((_obj = {}, _define_property(_obj, "".concat(classPrefix, "-list-item-name"), true), _define_property(_obj, "".concat(classPrefix, "-list-item-name-highcolor"), currentData.id === subitem.id), _obj)),
                 key: subitem.id,
-                onClick: function() {
+                onClick: function onClick() {
                     return handleClickItem(item[floorKey], subitem);
                 }
             }, children ? /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement(elevatorContext.Provider, {
@@ -223,7 +223,7 @@ export var Elevator = function(props) {
             className: classNames((_obj = {}, _define_property(_obj, "".concat(classPrefix, "-bars-inner-item"), true), _define_property(_obj, "".concat(classPrefix, "-bars-inner-item-active"), item[floorKey] === ((_list_currentIndex = list[currentIndex]) === null || _list_currentIndex === void 0 ? void 0 : _list_currentIndex[floorKey])), _obj)),
             "data-index": index,
             key: index,
-            onClick: function() {
+            onClick: function onClick() {
                 return handleClickIndex(item[floorKey]);
             }
         }, String(item[floorKey]));

package/dist/es/packages/ellipsis/ellipsis.js

@@ -18,9 +18,9 @@ var defaultProps = _object_spread_props(_object_spread({}, ComponentDefaults), {
     lineHeight: '20'
 });
 var classPrefix = "nut-ellipsis";
-export var Ellipsis = function(props) {
+export var Ellipsis = function Ellipsis(props) {
     var _ellipsis_current, _ellipsis_current1;
-    var _ref = _object_spread({}, defaultProps, props), children = _ref.children, content = _ref.content, className = _ref.className, direction = _ref.direction, rows = _ref.rows, expandText = _ref.expandText, collapseText = _ref.collapseText, symbol = _ref.symbol, lineHeight = _ref.lineHeight, onClick = _ref.onClick, onChange = _ref.onChange, rest = _object_without_properties(_ref, [
+    var _$_object_spread = _object_spread({}, defaultProps, props), children = _$_object_spread.children, content = _$_object_spread.content, className = _$_object_spread.className, direction = _$_object_spread.direction, rows = _$_object_spread.rows, expandText = _$_object_spread.expandText, collapseText = _$_object_spread.collapseText, symbol = _$_object_spread.symbol, lineHeight = _$_object_spread.lineHeight, onClick = _$_object_spread.onClick, onChange = _$_object_spread.onChange, rest = _object_without_properties(_$_object_spread, [
         "children",
         "content",
         "className",
@@ -50,7 +50,7 @@ export var Ellipsis = function(props) {
         content
     ]);
     // 创建虚拟 container，内容为 contant 的内容
-    var createContainer = function() {
+    var createContainer = function createContainer() {
         if (!root.current) return;
         var originStyle = window.getComputedStyle(root.current);
         container = document.createElement('div');
@@ -77,7 +77,7 @@ export var Ellipsis = function(props) {
         document.body.removeChild(container);
     };
     // 计算省略号的位置
-    var calcEllipse = function() {
+    var calcEllipse = function calcEllipse() {
         if (container.offsetHeight <= maxHeight) {
             setExceeded(false);
         } else {
@@ -95,7 +95,7 @@ export var Ellipsis = function(props) {
         }
     };
     // 计算 start/end 省略
-    var tailor = function(left, right) {
+    var tailor = function tailor1(left, right) {
         var actionText = expanded ? collapseText : expandText;
         var end = content.length;
         if (right - left <= 1) {
@@ -126,7 +126,7 @@ export var Ellipsis = function(props) {
         return tailor(middle, right);
     };
     // 计算 middle 省略
-    var tailorMiddle = function(leftPart, rightPart) {
+    var tailorMiddle = function tailorMiddle1(leftPart, rightPart) {
         var actionText = expanded ? collapseText : expandText;
         var end = content.length;
         if (leftPart[1] - leftPart[0] <= 1 && rightPart[1] - rightPart[0] <= 1) {
@@ -155,12 +155,12 @@ export var Ellipsis = function(props) {
             rightPart[1]
         ]);
     };
-    var pxToNumber = function(value) {
+    var pxToNumber = function pxToNumber(value) {
         if (!value) return 0;
         var match = value.match(/^\d*(\.\d*)?/);
         return match ? Number(match[0]) : 0;
     };
-    var clickHandle = function(type) {
+    var clickHandle = function clickHandle(type) {
         if (type === 1) {
             setExpanded(true);
             onChange && onChange('expand');
@@ -169,7 +169,7 @@ export var Ellipsis = function(props) {
             onChange && onChange('collapse');
         }
     };
-    var handleClick = function() {
+    var handleClick = function handleClick() {
         onClick && onClick();
     };
     return /*#__PURE__*/ React.createElement("div", _object_spread({
@@ -178,13 +178,13 @@ export var Ellipsis = function(props) {
         ref: root
     }, rest), !exceeded ? content : null, exceeded && !expanded ? /*#__PURE__*/ React.createElement("span", null, (_ellipsis_current = ellipsis.current) === null || _ellipsis_current === void 0 ? void 0 : _ellipsis_current.leading, expandText ? /*#__PURE__*/ React.createElement("span", {
         className: "nut-ellipsis-text",
-        onClick: function(e) {
+        onClick: function onClick(e) {
             e.stopPropagation();
             clickHandle(1);
         }
     }, expandText) : null, (_ellipsis_current1 = ellipsis.current) === null || _ellipsis_current1 === void 0 ? void 0 : _ellipsis_current1.tailing) : null, exceeded && expanded ? /*#__PURE__*/ React.createElement("span", null, content, expandText ? /*#__PURE__*/ React.createElement("span", {
         className: "nut-ellipsis-text",
-        onClick: function(e) {
+        onClick: function onClick(e) {
             e.stopPropagation();
             clickHandle(2);
         }

package/dist/es/packages/empty/empty.d.ts

@@ -1,21 +1,14 @@
 import React, { FunctionComponent, ReactNode } from 'react';
 import { BasicComponent } from "../../utils/typings";
-import { UIType, UISize, UIFill } from "../../types/base/atoms";
-export interface EmptyAction {
-    text: React.ReactNode;
-    type?: UIType;
-    size?: UISize;
-    fill?: UIFill;
-    disabled?: boolean;
-    onClick?: () => () => void;
-}
+import { type EmptyAction, type EmptySize, type EmptyStatus } from "../../types";
+export type { EmptyAction, EmptySize, EmptyStatus } from "../../types";
 export interface EmptyProps extends BasicComponent {
     image?: ReactNode;
     imageSize: number | string;
     title: ReactNode;
     description: ReactNode;
-    size: 'small' | 'base';
-    status: 'empty' | 'error' | 'network';
+    size: EmptySize;
+    status: EmptyStatus;
     actions: Array<EmptyAction>;
 }
 export declare const Empty: FunctionComponent<Partial<EmptyProps> & Omit<React.HTMLAttributes<HTMLDivElement>, 'title'>>;

package/dist/es/packages/empty/empty.js

@@ -6,22 +6,18 @@ import React, { useEffect, useState } from "react";
 import classNames from "classnames";
 import { ComponentDefaults } from "../../utils/typings";
 import Button from "../button";
-var defaultStatus = {
-    empty: 'https://storage.360buyimg.com/imgtools/30186cfda0-0d3eee40-c0ac-11ee-9382-9125782aa3b8.png',
-    error: 'https://storage.360buyimg.com/imgtools/f3278d0ebb-0ce360c0-c0ac-11ee-8375-193101bb1a46.png',
-    network: 'https://storage.360buyimg.com/imgtools/43c30f7e29-0d483d10-c0ac-11ee-bec4-eb4d2a09a51d.png'
-};
+import { getEmptyStatusImage } from "../../types";
 var defaultProps = _object_spread_props(_object_spread({}, ComponentDefaults), {
     title: '',
     description: '',
     imageSize: '',
-    size: 'base',
-    status: 'empty',
+    size: 'half',
+    status: 'network',
     actions: []
 });
 var classPrefix = "nut-empty";
-export var Empty = function(props) {
-    var _ref = _object_spread({}, defaultProps, props), image = _ref.image, imageSize = _ref.imageSize, title = _ref.title, description = _ref.description, children = _ref.children, className = _ref.className, size = _ref.size, status = _ref.status, actions = _ref.actions, style = _ref.style, rest = _object_without_properties(_ref, [
+export var Empty = function Empty(props) {
+    var _$_object_spread = _object_spread({}, defaultProps, props), image = _$_object_spread.image, imageSize = _$_object_spread.imageSize, title = _$_object_spread.title, description = _$_object_spread.description, children = _$_object_spread.children, className = _$_object_spread.className, size = _$_object_spread.size, status = _$_object_spread.status, actions = _$_object_spread.actions, style = _$_object_spread.style, rest = _object_without_properties(_$_object_spread, [
         "image",
         "imageSize",
         "title",
@@ -34,7 +30,7 @@ export var Empty = function(props) {
         "style"
     ]);
     var _useState = _sliced_to_array(useState({}), 2), imgStyle = _useState[0], setImgStyle = _useState[1];
-    var imageUrl = image || defaultStatus[status];
+    var imageUrl = image || getEmptyStatusImage(status);
     var imageNode = typeof imageUrl === 'string' ? /*#__PURE__*/ React.createElement("img", {
         style: {
             width: '100%',
@@ -62,18 +58,26 @@ export var Empty = function(props) {
     }, [
         imageSize
     ]);
-    var cls = classNames(classPrefix, className);
-    return /*#__PURE__*/ React.createElement("div", _object_spread({
-        className: cls
-    }, rest), /*#__PURE__*/ React.createElement("div", {
-        className: "".concat(classPrefix, "-").concat(size),
+    var cls = classNames(classPrefix, "".concat(classPrefix, "--").concat(size), className);
+    var imageBlock = /*#__PURE__*/ React.createElement("div", {
+        className: "".concat(classPrefix, "-image"),
         style: imgStyle
-    }, imageNode), typeof title === 'string' && title ? /*#__PURE__*/ React.createElement("div", {
+    }, imageNode);
+    var titleBlock = typeof title === 'string' && title ? /*#__PURE__*/ React.createElement("div", {
         className: "".concat(classPrefix, "-title")
-    }, title) : title, typeof description === 'string' ? /*#__PURE__*/ React.createElement("div", {
+    }, title) : title;
+    var descriptionBlock = typeof description === 'string' ? /*#__PURE__*/ React.createElement("div", {
         className: "".concat(classPrefix, "-description")
-    }, description) : description, actions.length ? /*#__PURE__*/ React.createElement("div", {
-        className: "".concat(classPrefix, "-actions-").concat(size)
+    }, description) : description;
+    return /*#__PURE__*/ React.createElement("div", _object_spread({
+        className: cls,
+        style: style
+    }, rest), size === 'partial' ? /*#__PURE__*/ React.createElement("div", {
+        className: "".concat(classPrefix, "-partial-body")
+    }, imageBlock, /*#__PURE__*/ React.createElement("div", {
+        className: "".concat(classPrefix, "-content")
+    }, titleBlock, descriptionBlock)) : /*#__PURE__*/ React.createElement(React.Fragment, null, imageBlock, titleBlock, descriptionBlock), actions.length ? /*#__PURE__*/ React.createElement("div", {
+        className: "".concat(classPrefix, "-actions")
     }, actions.map(function(action, index) {
         var text = action.text, rest = _object_without_properties(action, [
             "text"

package/dist/es/packages/empty/index.d.ts

@@ -1,3 +1,3 @@
 import { Empty } from './empty';
-export type { EmptyProps } from './empty';
+export type { EmptyAction, EmptyProps, EmptySize, EmptyStatus } from './empty';
 export default Empty;

package/dist/es/packages/empty/style/empty.scss

@@ -6,23 +6,8 @@
   flex-direction: column;
   justify-content: center;
   padding: $empty-padding;
-  background-color: $empty-background-color;
-
-  &-base {
-    width: $empty-image-size;
-    height: $empty-image-size;
-
-    img,
-    image {
-      width: 100%;
-      height: 100%;
-    }
-  }
-
-  &-small {
-    width: $empty-image-small-size;
-    height: $empty-image-small-size;
 
+  &-image {
     img,
     image {
       width: 100%;
@@ -31,32 +16,113 @@
   }
 
   &-title {
-    margin-top: $empty-title-margin-top;
+    text-align: center;
+    color: $empty-title-color;
     font-weight: $font-weight-bold;
-    margin-bottom: $empty-title-margin-bottom;
-    color: $color-title;
-    font-size: $font-size-l;
-    line-height: $empty-title-line-height;
   }
 
   &-description {
-    color: $color-text;
-    font-size: $font-size-s;
-    line-height: $empty-description-line-height;
-  }
-  &-actions-base {
-    display: flex;
-    flex-direction: row;
-    margin-top: scale-px(24px);
+    text-align: center;
+    color: $empty-description-color;
+    font-weight: $font-weight;
   }
-  &-actions-small {
+
+  &-actions {
     display: flex;
     flex-direction: row;
-    margin-top: scale-px(16px);
+    justify-content: center;
   }
 
   &-action {
     margin-right: scale-px(6px);
     margin-left: scale-px(6px);
   }
+
+  &-partial-body {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    max-width: 100%;
+  }
+
+  &-content {
+    flex: 1;
+    min-width: 0;
+  }
+
+  // 全屏型：整页无数据
+  &--full {
+    padding-top: $empty-full-padding-top;
+
+    .nut-empty-image {
+      width: $empty-full-image-size;
+      height: $empty-full-image-size;
+    }
+
+    .nut-empty-title {
+      font-size: $empty-full-title-font-size;
+      line-height: $empty-full-title-line-height;
+    }
+
+    .nut-empty-description {
+      font-size: $empty-full-description-font-size;
+      line-height: $empty-full-description-line-height;
+    }
+
+    .nut-empty-actions {
+      margin-top: $empty-full-actions-margin-top;
+    }
+  }
+
+  // 半屏型：模块、弹层等区域
+  &--half {
+    .nut-empty-image {
+      width: $empty-half-image-size;
+      height: $empty-half-image-size;
+    }
+
+    .nut-empty-title {
+      font-size: $empty-half-title-font-size;
+      line-height: $empty-half-title-line-height;
+    }
+
+    .nut-empty-description {
+      font-size: $empty-half-description-font-size;
+      line-height: $empty-half-description-line-height;
+    }
+
+    .nut-empty-actions {
+      margin-top: $empty-half-actions-margin-top;
+    }
+  }
+
+  // 局部型：横向图文
+  &--partial {
+    padding: $empty-partial-padding;
+
+    .nut-empty-partial-body {
+      gap: $empty-partial-content-gap;
+    }
+
+    .nut-empty-image {
+      width: $empty-partial-image-size;
+      height: $empty-partial-image-size;
+    }
+
+    .nut-empty-title {
+      text-align: left;
+      font-size: $empty-partial-description-font-size;
+      line-height: $empty-partial-description-line-height;
+      color: $empty-title-color;
+      font-weight: $font-weight;
+    }
+
+    .nut-empty-description {
+      text-align: left;
+      font-size: $empty-partial-description-font-size;
+      line-height: $empty-partial-description-line-height;
+      color: $empty-description-color;
+      font-weight: $font-weight;
+    }
+  }
 }