@uzum-tech/ui 1.5.2 → 1.5.4

package/lib/collapse/src/Collapse.d.ts

@@ -9,7 +9,7 @@ export declare const collapseProps: {
     readonly expandedNames: PropType<string | number | Array<string | number> | null>;
     readonly arrowPlacement: {
         readonly type: PropType<ArrowPlacement>;
-        readonly default: "left";
+        readonly default: "right-edge";
     };
     readonly accordion: {
         readonly type: BooleanConstructor;
@@ -40,8 +40,11 @@ export declare const collapseProps: {
         arrowSize: string;
         arrowColor: string;
         arrowColorDisabled: string;
-        itemMargin: string;
         titlePadding: string;
+        backgroundColor: string;
+        borderRadius: string;
+        padding: string;
+        boxSizing: string;
     }, any>>;
     readonly themeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Collapse", {
         titleFontSize: string;
@@ -56,8 +59,11 @@ export declare const collapseProps: {
         arrowSize: string;
         arrowColor: string;
         arrowColorDisabled: string;
-        itemMargin: string;
         titlePadding: string;
+        backgroundColor: string;
+        borderRadius: string;
+        padding: string;
+        boxSizing: string;
     }, any>>>;
     readonly builtinThemeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Collapse", {
         titleFontSize: string;
@@ -72,8 +78,11 @@ export declare const collapseProps: {
         arrowSize: string;
         arrowColor: string;
         arrowColorDisabled: string;
-        itemMargin: string;
         titlePadding: string;
+        backgroundColor: string;
+        borderRadius: string;
+        padding: string;
+        boxSizing: string;
     }, any>>>;
 };
 export type CollapseProps = ExtractPublicPropTypes<typeof collapseProps>;
@@ -93,7 +102,7 @@ declare const _default: import("vue").DefineComponent<{
     readonly expandedNames: PropType<string | number | Array<string | number> | null>;
     readonly arrowPlacement: {
         readonly type: PropType<ArrowPlacement>;
-        readonly default: "left";
+        readonly default: "right-edge";
     };
     readonly accordion: {
         readonly type: BooleanConstructor;
@@ -124,8 +133,11 @@ declare const _default: import("vue").DefineComponent<{
         arrowSize: string;
         arrowColor: string;
         arrowColorDisabled: string;
-        itemMargin: string;
         titlePadding: string;
+        backgroundColor: string;
+        borderRadius: string;
+        padding: string;
+        boxSizing: string;
     }, any>>;
     readonly themeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Collapse", {
         titleFontSize: string;
@@ -140,8 +152,11 @@ declare const _default: import("vue").DefineComponent<{
         arrowSize: string;
         arrowColor: string;
         arrowColorDisabled: string;
-        itemMargin: string;
         titlePadding: string;
+        backgroundColor: string;
+        borderRadius: string;
+        padding: string;
+        boxSizing: string;
     }, any>>>;
     readonly builtinThemeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Collapse", {
         titleFontSize: string;
@@ -156,8 +171,11 @@ declare const _default: import("vue").DefineComponent<{
         arrowSize: string;
         arrowColor: string;
         arrowColorDisabled: string;
-        itemMargin: string;
         titlePadding: string;
+        backgroundColor: string;
+        borderRadius: string;
+        padding: string;
+        boxSizing: string;
     }, any>>>;
 }, {
     rtlEnabled: Ref<import("../../config-provider/src/internal-interface").RtlItem | undefined> | undefined;
@@ -176,8 +194,11 @@ declare const _default: import("vue").DefineComponent<{
             arrowSize: string;
             arrowColor: string;
             arrowColorDisabled: string;
-            itemMargin: string;
             titlePadding: string;
+            backgroundColor: string;
+            borderRadius: string;
+            padding: string;
+            boxSizing: string;
         };
         peers: any;
         peerOverrides: {
@@ -200,7 +221,10 @@ declare const _default: import("vue").DefineComponent<{
         '--u-arrow-size': string;
         '--u-arrow-color': string;
         '--u-arrow-color-disabled': string;
-        '--u-item-margin': string;
+        '--u-background-color': string;
+        '--u-border-radius': string;
+        '--u-padding': string;
+        '--u-box-sizing': string;
     }> | undefined;
     themeClass: Ref<string> | undefined;
     onRender: (() => void) | undefined;
@@ -212,7 +236,7 @@ declare const _default: import("vue").DefineComponent<{
     readonly expandedNames: PropType<string | number | Array<string | number> | null>;
     readonly arrowPlacement: {
         readonly type: PropType<ArrowPlacement>;
-        readonly default: "left";
+        readonly default: "right-edge";
     };
     readonly accordion: {
         readonly type: BooleanConstructor;
@@ -243,8 +267,11 @@ declare const _default: import("vue").DefineComponent<{
         arrowSize: string;
         arrowColor: string;
         arrowColorDisabled: string;
-        itemMargin: string;
         titlePadding: string;
+        backgroundColor: string;
+        borderRadius: string;
+        padding: string;
+        boxSizing: string;
     }, any>>;
     readonly themeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Collapse", {
         titleFontSize: string;
@@ -259,8 +286,11 @@ declare const _default: import("vue").DefineComponent<{
         arrowSize: string;
         arrowColor: string;
         arrowColorDisabled: string;
-        itemMargin: string;
         titlePadding: string;
+        backgroundColor: string;
+        borderRadius: string;
+        padding: string;
+        boxSizing: string;
     }, any>>>;
     readonly builtinThemeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Collapse", {
         titleFontSize: string;
@@ -275,8 +305,11 @@ declare const _default: import("vue").DefineComponent<{
         arrowSize: string;
         arrowColor: string;
         arrowColorDisabled: string;
-        itemMargin: string;
         titlePadding: string;
+        backgroundColor: string;
+        borderRadius: string;
+        padding: string;
+        boxSizing: string;
     }, any>>>;
 }>>, {
     readonly displayDirective: "show" | "if";

package/lib/collapse/src/Collapse.js

@@ -16,7 +16,7 @@ exports.collapseProps = Object.assign(Object.assign({}, _mixins_1.useTheme.props
         default: null
     }, expandedNames: [Array, String], arrowPlacement: {
         type: String,
-        default: 'left'
+        default: 'right-edge'
     }, accordion: {
         type: Boolean,
         default: false
@@ -107,7 +107,7 @@ exports.default = (0, vue_1.defineComponent)({
         });
         const rtlEnabledRef = (0, use_rtl_1.useRtl)('Collapse', mergedRtlRef, mergedClsPrefixRef);
         const cssVarsRef = (0, vue_1.computed)(() => {
-            const { common: { cubicBezierEaseInOut }, self: { titleFontWeight, dividerColor, titlePadding, titleTextColor, titleTextColorDisabled, textColor, arrowColor, fontSize, titleFontSize, arrowColorDisabled, itemMargin, lineHeight, titleLineHeight, arrowSize } } = themeRef.value;
+            const { common: { cubicBezierEaseInOut }, self: { titleFontWeight, dividerColor, titlePadding, titleTextColor, titleTextColorDisabled, textColor, arrowColor, fontSize, titleFontSize, arrowColorDisabled, lineHeight, titleLineHeight, arrowSize, backgroundColor, borderRadius, padding, boxSizing } } = themeRef.value;
             return {
                 '--u-font-size': fontSize,
                 '--u-bezier': cubicBezierEaseInOut,
@@ -123,7 +123,10 @@ exports.default = (0, vue_1.defineComponent)({
                 '--u-arrow-size': arrowSize,
                 '--u-arrow-color': arrowColor,
                 '--u-arrow-color-disabled': arrowColorDisabled,
-                '--u-item-margin': itemMargin
+                '--u-background-color': backgroundColor,
+                '--u-border-radius': borderRadius,
+                '--u-padding': padding,
+                '--u-box-sizing': boxSizing
             };
         });
         const themeClassHandle = inlineThemeDisabled

package/lib/collapse/src/CollapseItem.js

@@ -67,6 +67,7 @@ exports.default = (0, vue_1.defineComponent)({
                 return collapseProps.arrowPlacement;
             }),
             handleClick(e) {
+                e.stopPropagation();
                 if (UCollapse && !props.disabled) {
                     UCollapse.toggleItem(collapsedRef.value, mergedNameRef.value, e);
                 }
@@ -91,12 +92,12 @@ exports.default = (0, vue_1.defineComponent)({
                 `${mergedClsPrefix}-collapse-item--${arrowPlacement}-arrow-placement`,
                 disabled && `${mergedClsPrefix}-collapse-item--disabled`,
                 !collapsed && `${mergedClsPrefix}-collapse-item--active`
-            ] },
+            ], onClick: this.handleClick },
             (0, vue_1.h)("div", { class: [
                     `${mergedClsPrefix}-collapse-item__header`,
                     !collapsed && `${mergedClsPrefix}-collapse-item__header--active`
                 ] },
-                (0, vue_1.h)("div", { class: `${mergedClsPrefix}-collapse-item__header-main`, onClick: this.handleClick },
+                (0, vue_1.h)("div", { class: `${mergedClsPrefix}-collapse-item__header-main` },
                     arrowPlacement !== 'right-edge' && arrowNode,
                     headerNode),
                 (0, _utils_1.resolveWrappedSlotWithProps)(headerExtraSlot, { collapsed }, (children) => ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-collapse-item__header-extra`, onClick: this.handleClick }, children))),

package/lib/collapse/src/styles/index.cssr.js

@@ -17,15 +17,24 @@ const fade_in_height_expand_cssr_1 = require("../../../_styles/transitions/fade-
 // --u-arrow-color
 // --u-arrow-color-disabled
 // --u-title-text-color-disabled
-// --u-item-margin
-exports.default = (0, cssr_1.cB)('collapse', 'width: 100%;', [(0, cssr_1.cB)('collapse-item', `
+// --u-background-color
+// --u-border-radius
+// --u-padding
+// --u-box-sizing
+exports.default = (0, cssr_1.cB)('collapse', `
+ width: 100%;
+ background-color: var(--u-background-color);
+ border-radius: var(--u-border-radius);
+ box-sizing: var(--u-box-sizing);
+ `, [(0, cssr_1.cB)('collapse-item', `
  font-size: var(--u-font-size);
  line-height: var(--u-line-height);
  color: var(--u-text-color);
  transition:
  color .3s var(--u-bezier),
  border-color .3s var(--u-bezier);
- margin: var(--u-item-margin);
+ padding: var(--u-padding);
+ cursor: pointer;
  `, [(0, cssr_1.cM)('disabled', [(0, cssr_1.cE)('header', 'cursor: not-allowed;', [(0, cssr_1.cE)('header-main', `
  color: var(--u-title-text-color-disabled);
  `), (0, cssr_1.cB)('collapse-item-arrow', `
@@ -33,9 +42,22 @@ exports.default = (0, cssr_1.cB)('collapse', 'width: 100%;', [(0, cssr_1.cB)('co
  `)])]), (0, cssr_1.cB)('collapse-item', 'margin-left: 32px;'), (0, cssr_1.c)('&:first-child', 'margin-top: 0;'), (0, cssr_1.c)('&:first-child >', [(0, cssr_1.cE)('header', 'padding-top: 0;')]), (0, cssr_1.cM)('left-arrow-placement', [(0, cssr_1.cE)('header', [(0, cssr_1.cB)('collapse-item-arrow', 'margin-right: 4px;')])]), (0, cssr_1.cM)('right-arrow-placement', [(0, cssr_1.cE)('header', [(0, cssr_1.cB)('collapse-item-arrow', `
  margin-left: 4px;
  order: 1;
- `)])]), (0, cssr_1.cM)('right-edge-arrow-placement', [(0, cssr_1.cE)('header', [(0, cssr_1.cB)('collapse-item-arrow', 'margin-left: auto;')])]), (0, cssr_1.cE)('content-wrapper', [(0, cssr_1.cE)('content-inner', 'padding-top: 16px;'), (0, fade_in_height_expand_cssr_1.fadeInHeightExpandTransition)({
+ `)])]), (0, cssr_1.cM)('right-edge-arrow-placement', [(0, cssr_1.cE)('header', [(0, cssr_1.cB)('collapse-item-arrow', `
+ margin-left: auto;
+ display: flex;
+ width: 28px;
+ height: 28px;
+ justify-content: center;
+ align-items: center;
+ border-radius: 100px;
+ background: #F3F4F6;
+ `, [(0, cssr_1.cB)('base-icon', `
+ transform: scaleY(1) rotate(90deg);
+ transition:
+ transform .15s var(--u-bezier)
+ `)])])]), (0, cssr_1.cE)('content-wrapper', [(0, cssr_1.cE)('content-inner', 'padding-top: 16px;'), (0, fade_in_height_expand_cssr_1.fadeInHeightExpandTransition)({
   duration: '0.15s'
-})]), (0, cssr_1.cM)('active', [(0, cssr_1.cE)('header', [(0, cssr_1.cM)('active', [(0, cssr_1.cB)('collapse-item-arrow', 'transform: rotate(90deg);')])])]), (0, cssr_1.c)('&:not(:first-child)', 'border-top: 1px solid var(--u-divider-color);'), (0, cssr_1.cE)('header', `
+})]), (0, cssr_1.cM)('active', [(0, cssr_1.cE)('header', [(0, cssr_1.cM)('active', [(0, cssr_1.cB)('collapse-item-arrow', [(0, cssr_1.cB)('base-icon', 'transform: scaleY(-1) rotate(90deg)')])])])]), (0, cssr_1.cE)('header', `
  font-size: var(--u-title-font-size);
  line-height: var(--u-title-line-height);
  display: flex;
@@ -43,9 +65,7 @@ exports.default = (0, cssr_1.cB)('collapse', 'width: 100%;', [(0, cssr_1.cB)('co
  align-items: center;
  transition: color .3s var(--u-bezier);
  position: relative;
- padding: var(--u-title-padding);
  color: var(--u-title-text-color);
- cursor: pointer;
  `, [(0, cssr_1.cE)('header-main', `
  display: flex;
  flex-wrap: nowrap;

package/lib/collapse/styles/light.d.ts

@@ -13,8 +13,11 @@ export declare const self: (vars: ThemeCommonVars) => {
     arrowSize: string;
     arrowColor: string;
     arrowColorDisabled: string;
-    itemMargin: string;
     titlePadding: string;
+    backgroundColor: string;
+    borderRadius: string;
+    padding: string;
+    boxSizing: string;
 };
 export type CollapseThemeVars = ReturnType<typeof self>;
 declare const collapseLight: Theme<'Collapse', CollapseThemeVars>;

package/lib/collapse/styles/light.js

@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.self = void 0;
 const common_1 = require("../../_styles/common");
 const self = (vars) => {
-    const { fontWeight, fontBodyLarge, lineHeightBodyLarge, elementsQuaternary, textPrimary, textSecondary, fontBodyMedium, lineHeightBodyMedium, iconSmall } = vars;
+    const { fontWeight, fontBodyLarge, lineHeightBodyLarge, elementsQuaternary, textPrimary, textSecondary, fontBodyMedium, lineHeightBodyMedium, iconSmall, containerPrimary } = vars;
     return {
         titleFontSize: fontBodyLarge,
         titleLineHeight: lineHeightBodyLarge,
@@ -17,8 +17,11 @@ const self = (vars) => {
         arrowSize: iconSmall,
         arrowColor: textPrimary,
         arrowColorDisabled: textSecondary,
-        itemMargin: '16px 0 0 0',
-        titlePadding: '16px 0 0 0'
+        titlePadding: '16px 0 0 0',
+        backgroundColor: containerPrimary,
+        borderRadius: '20px',
+        padding: '24px',
+        boxSizing: 'border-box'
     };
 };
 exports.self = self;

package/lib/color-picker/src/ColorPicker.js

@@ -261,14 +261,14 @@ exports.default = (0, vue_1.defineComponent)({
             else {
                 upcomingValue = null;
             }
-            const { nTriggerFormChange, nTriggerFormInput } = formItem;
+            const { triggerFormChange, triggerFormInput } = formItem;
             const { onUpdateValue, 'onUpdate:value': _onUpdateValue } = props;
             if (onUpdateValue)
                 (0, _utils_1.call)(onUpdateValue, value);
             if (_onUpdateValue)
                 (0, _utils_1.call)(_onUpdateValue, value);
-            nTriggerFormChange();
-            nTriggerFormInput();
+            triggerFormChange();
+            triggerFormInput();
             uncontrolledValueRef.value = value;
         }
         function handleInputUpdateValue(value) {
@@ -279,7 +279,7 @@ exports.default = (0, vue_1.defineComponent)({
             const { value } = mergedValueRef;
             // no value & only hue changes will complete with no value
             if (value) {
-                const { nTriggerFormChange, nTriggerFormInput } = formItem;
+                const { triggerFormChange, triggerFormInput } = formItem;
                 const { onComplete } = props;
                 if (onComplete) {
                     ;
@@ -291,8 +291,8 @@ exports.default = (0, vue_1.defineComponent)({
                     undoStack.splice(valueIndex + 1, undoStack.length, value);
                     valueIndexRef.value = valueIndex + 1;
                 }
-                nTriggerFormChange();
-                nTriggerFormInput();
+                triggerFormChange();
+                triggerFormInput();
             }
         }
         function undo() {

package/lib/components.d.ts

@@ -44,6 +44,7 @@ export * from './icon-wrapper';
 export * from './image';
 export * from './input';
 export * from './input-number';
+export * from './input-otp';
 export * from './layout';
 export * from './legacy-grid';
 export * from './legacy-transfer';

package/lib/components.js

@@ -60,6 +60,7 @@ __exportStar(require("./icon-wrapper"), exports);
 __exportStar(require("./image"), exports);
 __exportStar(require("./input"), exports);
 __exportStar(require("./input-number"), exports);
+__exportStar(require("./input-otp"), exports);
 __exportStar(require("./layout"), exports);
 __exportStar(require("./legacy-grid"), exports);
 __exportStar(require("./legacy-transfer"), exports);

package/lib/config-provider/src/internal-interface.d.ts

@@ -37,6 +37,7 @@ import type { IconWrapperTheme } from '../../icon-wrapper/styles';
 import type { ImageTheme } from '../../image/styles';
 import type { InputTheme } from '../../input/styles';
 import type { InputNumberTheme } from '../../input-number/styles';
+import type { InputOtpTheme } from '../../input-otp/styles';
 import type { LayoutTheme } from '../../layout/styles';
 import type { LegacyTransferTheme } from '../../legacy-transfer/styles';
 import type { ListTheme } from '../../list/styles';
@@ -190,6 +191,7 @@ export interface GlobalThemeWithoutCommon {
     InternalSelectMenu?: InternalSelectMenuTheme;
     InternalSelection?: InternalSelectionTheme;
     AccountOption?: AccountOptionTheme;
+    InputOtp?: InputOtpTheme;
 }
 export interface GlobalComponentConfig {
     Pagination?: {

package/lib/data-table/src/DataTable.d.ts

@@ -91,6 +91,7 @@ declare const _default: import("vue").DefineComponent<{
         readonly type: import("vue").PropType<import("../../_internal").BaseLoadingExposedProps>;
         readonly default: {};
     };
+    readonly emptyProps: import("vue").PropType<Partial<import("../..").EmptyProps>>;
     readonly onLoad: import("vue").PropType<import("./interface").DataTableOnLoad>;
     readonly 'onUpdate:page': import("vue").PropType<import("../../pagination").PaginationProps["onUpdate:page"]>;
     readonly onUpdatePage: import("vue").PropType<import("../../pagination").PaginationProps["onUpdate:page"]>;
@@ -2872,6 +2873,11 @@ declare const _default: import("vue").DefineComponent<{
     page: (page: number) => void;
     sort: (columnKey: import("./interface").ColumnKey, order: import("./interface").SortOrder) => void;
     scrollTo: import("../../scrollbar/src/Scrollbar").ScrollTo;
+    getData: () => {
+        data: import("./interface").InternalRowData[];
+        totalRows: import("./interface").InternalRowData | null;
+    };
+    getTotalRowData: () => import("./interface").InternalRowData | null;
     clearFilter: () => void;
     mainTableInstRef: import("vue").Ref<{
         getHeaderElement: () => HTMLElement | null;
@@ -4363,6 +4369,7 @@ declare const _default: import("vue").DefineComponent<{
         readonly type: import("vue").PropType<import("../../_internal").BaseLoadingExposedProps>;
         readonly default: {};
     };
+    readonly emptyProps: import("vue").PropType<Partial<import("../..").EmptyProps>>;
     readonly onLoad: import("vue").PropType<import("./interface").DataTableOnLoad>;
     readonly 'onUpdate:page': import("vue").PropType<import("../../pagination").PaginationProps["onUpdate:page"]>;
     readonly onUpdatePage: import("vue").PropType<import("../../pagination").PaginationProps["onUpdate:page"]>;

package/lib/data-table/src/DataTable.js

@@ -18,7 +18,6 @@ const use_resizable_1 = require("./use-resizable");
 const interface_1 = require("./interface");
 const use_group_header_1 = require("./use-group-header");
 const use_expand_1 = require("./use-expand");
-const use_mask_1 = require("./use-mask");
 const index_cssr_1 = __importDefault(require("./styles/index.cssr"));
 exports.default = (0, vue_1.defineComponent)({
     name: 'DataTable',
@@ -98,7 +97,7 @@ exports.default = (0, vue_1.defineComponent)({
                         return;
                     if (!('totalRow' in col) || !col.totalRow)
                         return;
-                    const { key, totalRow, render, mask } = col;
+                    const { key, totalRow, render } = col;
                     if (!totalRow)
                         return;
                     if (totalRow.type === 'default') {
@@ -111,18 +110,12 @@ exports.default = (0, vue_1.defineComponent)({
                                 return Number(renderedValue) || 0;
                             });
                             const sum = values.reduce((sum, val) => sum + val, 0);
-                            const finalValue = mask
-                                ? (0, use_mask_1.processMaskedValue)(String(sum), mask)
-                                : sum;
-                            summaryRow[key] = { value: finalValue };
+                            summaryRow[key] = { value: sum };
                         }
                         else {
                             const values = pageData.map((row) => Number(row[key]) || 0);
                             const sum = values.reduce((sum, val) => sum + val, 0);
-                            const finalValue = mask
-                                ? (0, use_mask_1.processMaskedValue)(String(sum), mask)
-                                : sum;
-                            summaryRow[key] = { value: finalValue };
+                            summaryRow[key] = { value: sum };
                         }
                     }
                     else {
@@ -312,6 +305,7 @@ exports.default = (0, vue_1.defineComponent)({
             handleTableBodyScroll,
             setHeaderScrollLeft,
             renderCell: (0, vue_1.toRef)(props, 'renderCell'),
+            emptyPropsRef: (0, vue_1.toRef)(props, 'emptyProps'),
             handleEdit
         });
         const exposedMethods = {
@@ -325,6 +319,23 @@ exports.default = (0, vue_1.defineComponent)({
             scrollTo: (arg0, arg1) => {
                 var _a;
                 (_a = mainTableInstRef.value) === null || _a === void 0 ? void 0 : _a.scrollTo(arg0, arg1);
+            },
+            getData: () => {
+                const originalData = props.data || [];
+                const totalRowData = autoSummaryRef.value && rawPaginatedDataRef.value
+                    ? autoSummaryRef.value(rawPaginatedDataRef.value)
+                    : null;
+                return {
+                    data: originalData,
+                    totalRows: totalRowData
+                };
+            },
+            getTotalRowData: () => {
+                if (autoSummaryRef.value && rawPaginatedDataRef.value) {
+                    const summaryResult = autoSummaryRef.value(rawPaginatedDataRef.value);
+                    return summaryResult;
+                }
+                return null;
             }
         };
         const cssVarsRef = (0, vue_1.computed)(() => {

package/lib/data-table/src/TableParts/Body.d.ts

@@ -1430,6 +1430,7 @@ declare const _default: import("vue").DefineComponent<{
     }) => void;
     handleUpdateExpanded: (key: RowKey, tmNode: TmNode | null) => void;
     renderCell: import("vue").Ref<((value: any, rowData: object, column: import("../interface").TableBaseColumn) => import("vue").VNodeChild) | undefined>;
+    emptyPropsRef: import("vue").Ref<Partial<import("../../../empty").EmptyProps> | undefined>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "edit"[], "edit", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     onEdit: PropType<(value: string, row: string, key: string) => void>;
     onResize: PropType<(e: ResizeObserverEntry) => void>;

package/lib/data-table/src/TableParts/Body.js

@@ -99,7 +99,7 @@ exports.default = (0, vue_1.defineComponent)({
         bodyStyle: Object
     },
     setup(props) {
-        const { slots: dataTableSlots, bodyWidthRef, mergedExpandedRowKeysRef, mergedClsPrefixRef, mergedThemeRef, scrollXRef, colsRef, paginatedDataRef, rawPaginatedDataRef, fixedColumnLeftMapRef, fixedColumnRightMapRef, mergedCurrentPageRef, rowClassNameRef, leftActiveFixedColKeyRef, leftActiveFixedChildrenColKeysRef, rightActiveFixedColKeyRef, rightActiveFixedChildrenColKeysRef, renderExpandRef, hoverKeyRef, summaryRef, mergedSortStateRef, virtualScrollRef, componentId, mergedTableLayoutRef, childTriggerColIndexRef, indentRef, rowPropsRef, maxHeightRef, stripedRef, loadingRef, loadingSkeletonRef, onLoadRef, loadingKeySetRef, expandableRef, stickyExpandedRowsRef, renderExpandIconRef, summaryPlacementRef, treeMateRef, scrollbarPropsRef, setHeaderScrollLeft, doUpdateExpandedRowKeys, handleTableBodyScroll, doCheck, doUncheck, renderCell
+        const { slots: dataTableSlots, bodyWidthRef, mergedExpandedRowKeysRef, mergedClsPrefixRef, mergedThemeRef, scrollXRef, colsRef, paginatedDataRef, rawPaginatedDataRef, fixedColumnLeftMapRef, fixedColumnRightMapRef, mergedCurrentPageRef, rowClassNameRef, leftActiveFixedColKeyRef, leftActiveFixedChildrenColKeysRef, rightActiveFixedColKeyRef, rightActiveFixedChildrenColKeysRef, renderExpandRef, hoverKeyRef, summaryRef, mergedSortStateRef, virtualScrollRef, componentId, mergedTableLayoutRef, childTriggerColIndexRef, indentRef, rowPropsRef, maxHeightRef, stripedRef, loadingRef, loadingSkeletonRef, onLoadRef, loadingKeySetRef, expandableRef, stickyExpandedRowsRef, renderExpandIconRef, summaryPlacementRef, treeMateRef, scrollbarPropsRef, setHeaderScrollLeft, doUpdateExpandedRowKeys, handleTableBodyScroll, doCheck, doUncheck, renderCell, emptyPropsRef
         // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
          } = (0, vue_1.inject)(interface_1.dataTableInjectionKey);
         const scrollbarInstRef = (0, vue_1.ref)(null);
@@ -347,10 +347,11 @@ exports.default = (0, vue_1.defineComponent)({
             handleCheckboxUpdateChecked,
             handleRadioUpdateChecked,
             handleUpdateExpanded,
-            renderCell }, exposedMethods);
+            renderCell,
+            emptyPropsRef }, exposedMethods);
     },
     render() {
-        const { mergedTheme, scrollX, mergedClsPrefix, virtualScroll, maxHeight, mergedTableLayout, flexHeight, loadingKeySet, onResize, setHeaderScrollLeft } = this;
+        const { mergedTheme, scrollX, mergedClsPrefix, virtualScroll, maxHeight, mergedTableLayout, flexHeight, loadingKeySet, onResize, setHeaderScrollLeft, emptyPropsRef } = this;
         const scrollable = scrollX !== undefined || maxHeight !== undefined || flexHeight;
         // For a basic table with auto layout whose content may overflow we will
         // make it scrollable, which differs from browser's native behavior.
@@ -565,6 +566,7 @@ exports.default = (0, vue_1.defineComponent)({
                                     `${mergedClsPrefix}-data-table-td--last-row`,
                                 'editable' in column &&
                                     column.editable &&
+                                    !isSummary &&
                                     `${mergedClsPrefix}-data-table-td--editable`
                             ] }),
                             column.fixed && ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-data-table-td__shadow-holder` })),
@@ -601,7 +603,7 @@ exports.default = (0, vue_1.defineComponent)({
                         }))) : null));
                 }
                 else {
-                    if (this.loading) {
+                    if (this.loading || this.loadingSkeleton) {
                         return ((0, vue_1.h)("table", { class: `${mergedClsPrefix}-data-table-table`, onMouseleave: handleMouseleaveTable, style: {
                                 tableLayout: this.mergedTableLayout
                             } },
@@ -620,12 +622,12 @@ exports.default = (0, vue_1.defineComponent)({
                 }
             }
         }));
-        if (this.empty) {
+        if (this.empty && !this.loadingSkeleton) {
             const createEmptyNode = () => ((0, vue_1.h)("div", { class: [
                     `${mergedClsPrefix}-data-table-empty`,
                     this.loading && `${mergedClsPrefix}-data-table-empty--hide`
                 ], style: this.bodyStyle, ref: "emptyElRef" }, (0, _utils_1.resolveSlot)(this.dataTableSlots.empty, () => [
-                (0, vue_1.h)(empty_1.UEmpty, { size: "large", theme: this.mergedTheme.peers.Empty, themeOverrides: this.mergedTheme.peerOverrides.Empty })
+                (0, vue_1.h)(empty_1.UEmpty, Object.assign({ size: "large", theme: this.mergedTheme.peers.Empty, themeOverrides: this.mergedTheme.peerOverrides.Empty }, emptyPropsRef))
             ])));
             if (this.shouldDisplaySomeTablePart) {
                 return ((0, vue_1.h)(vue_1.Fragment, null,