naive-ui 2.30.3 → 2.30.4

package/lib/layout/src/Layout.js

@@ -7,10 +7,10 @@ exports.createLayoutComponent = exports.layoutInjectionKey = void 0;
 const vue_1 = require("vue");
 const _internal_1 = require("../../_internal");
 const _mixins_1 = require("../../_mixins");
+const _utils_1 = require("../../_utils");
 const styles_1 = require("../styles");
-const layout_cssr_1 = __importDefault(require("./styles/layout.cssr"));
 const interface_1 = require("./interface");
-const _utils_1 = require("../../_utils");
+const layout_cssr_1 = __importDefault(require("./styles/layout.cssr"));
 const layoutProps = {
     embedded: Boolean,
     position: interface_1.positionProp,
@@ -61,6 +61,24 @@ function createLayoutComponent(isContent) {
                 }
             }
             (0, vue_1.provide)(exports.layoutInjectionKey, props);
+            let scrollX = 0;
+            let scrollY = 0;
+            const handleNativeElScroll = (e) => {
+                var _a;
+                const target = e.target;
+                scrollX = target.scrollLeft;
+                scrollY = target.scrollTop;
+                (_a = props.onScroll) === null || _a === void 0 ? void 0 : _a.call(props, e);
+            };
+            (0, _utils_1.useReactivated)(() => {
+                if (props.nativeScrollbar) {
+                    const el = scrollableElRef.value;
+                    if (el) {
+                        el.scrollTop = scrollY;
+                        el.scrollLeft = scrollX;
+                    }
+                }
+            });
             const hasSiderStyle = {
                 display: 'flex',
                 flexWrap: 'nowrap',
@@ -83,7 +101,7 @@ function createLayoutComponent(isContent) {
                 : undefined;
             return Object.assign({ mergedClsPrefix: mergedClsPrefixRef, scrollableElRef,
                 scrollbarInstRef,
-                hasSiderStyle, mergedTheme: themeRef, cssVars: inlineThemeDisabled ? undefined : cssVarsRef, themeClass: themeClassHandle === null || themeClassHandle === void 0 ? void 0 : themeClassHandle.themeClass, onRender: themeClassHandle === null || themeClassHandle === void 0 ? void 0 : themeClassHandle.onRender }, exposedMethods);
+                hasSiderStyle, mergedTheme: themeRef, handleNativeElScroll, cssVars: inlineThemeDisabled ? undefined : cssVarsRef, themeClass: themeClassHandle === null || themeClassHandle === void 0 ? void 0 : themeClassHandle.themeClass, onRender: themeClassHandle === null || themeClassHandle === void 0 ? void 0 : themeClassHandle.onRender }, exposedMethods);
         },
         render() {
             var _a;
@@ -96,7 +114,7 @@ function createLayoutComponent(isContent) {
                 `${mergedClsPrefix}-layout`,
                 `${mergedClsPrefix}-layout--${this.position}-positioned`
             ];
-            return ((0, vue_1.h)("div", { class: layoutClass, style: this.cssVars }, this.nativeScrollbar ? ((0, vue_1.h)("div", { ref: "scrollableElRef", class: `${mergedClsPrefix}-layout-scroll-container`, style: [this.contentStyle, hasSiderStyle], onScroll: this.onScroll }, this.$slots)) : ((0, vue_1.h)(_internal_1.NScrollbar, Object.assign({}, this.scrollbarProps, { onScroll: this.onScroll, ref: "scrollbarInstRef", theme: this.mergedTheme.peers.Scrollbar, themeOverrides: this.mergedTheme.peerOverrides.Scrollbar, contentStyle: [this.contentStyle, hasSiderStyle] }), this.$slots))));
+            return ((0, vue_1.h)("div", { class: layoutClass, style: this.cssVars }, this.nativeScrollbar ? ((0, vue_1.h)("div", { ref: "scrollableElRef", class: `${mergedClsPrefix}-layout-scroll-container`, style: [this.contentStyle, hasSiderStyle], onScroll: this.handleNativeElScroll }, this.$slots)) : ((0, vue_1.h)(_internal_1.NScrollbar, Object.assign({}, this.scrollbarProps, { onScroll: this.onScroll, ref: "scrollbarInstRef", theme: this.mergedTheme.peers.Scrollbar, themeOverrides: this.mergedTheme.peerOverrides.Scrollbar, contentStyle: [this.contentStyle, hasSiderStyle] }), this.$slots))));
         }
     });
 }

package/lib/layout/src/LayoutContent.d.ts

@@ -271,6 +271,7 @@ declare const _default: import("vue").DefineComponent<{
             } | undefined;
         };
     }>;
+    handleNativeElScroll: (e: Event) => void;
     cssVars: import("vue").ComputedRef<{
         '--n-bezier': string;
         '--n-color': string;

package/lib/layout/src/LayoutSider.d.ts

@@ -362,6 +362,7 @@ declare const _default: import("vue").DefineComponent<{
     mergedCollapsed: import("vue").ComputedRef<boolean>;
     scrollContainerStyle: import("vue").ComputedRef<CSSProperties>;
     siderPlacement: import("vue").ComputedRef<"left" | "right">;
+    handleNativeElScroll: (e: Event) => void;
     handleTransitionend: (e: TransitionEvent) => void;
     handleTriggerClick: () => void;
     inlineThemeDisabled: boolean | undefined;

package/lib/layout/src/LayoutSider.js

@@ -135,6 +135,24 @@ exports.default = (0, vue_1.defineComponent)({
                     (0, _utils_1.call)(onCollapse);
             }
         }
+        let scrollX = 0;
+        let scrollY = 0;
+        const handleNativeElScroll = (e) => {
+            var _a;
+            const target = e.target;
+            scrollX = target.scrollLeft;
+            scrollY = target.scrollTop;
+            (_a = props.onScroll) === null || _a === void 0 ? void 0 : _a.call(props, e);
+        };
+        (0, _utils_1.useReactivated)(() => {
+            if (props.nativeScrollbar) {
+                const el = scrollableElRef.value;
+                if (el) {
+                    el.scrollTop = scrollY;
+                    el.scrollLeft = scrollX;
+                }
+            }
+        });
         (0, vue_1.provide)(interface_1.layoutSiderInjectionKey, {
             collapsedRef: mergedCollapsedRef,
             collapseModeRef: (0, vue_1.toRef)(props, 'collapseMode')
@@ -185,7 +203,8 @@ exports.default = (0, vue_1.defineComponent)({
             ? (0, _mixins_1.useThemeClass)('layout-sider', (0, vue_1.computed)(() => (props.inverted ? 'a' : 'b')), cssVarsRef, props)
             : undefined;
         return Object.assign({ scrollableElRef,
-            scrollbarInstRef, mergedClsPrefix: mergedClsPrefixRef, mergedTheme: themeRef, styleMaxWidth: styleMaxWidthRef, mergedCollapsed: mergedCollapsedRef, scrollContainerStyle: scrollContainerStyleRef, siderPlacement: siderPlacementRef, handleTransitionend,
+            scrollbarInstRef, mergedClsPrefix: mergedClsPrefixRef, mergedTheme: themeRef, styleMaxWidth: styleMaxWidthRef, mergedCollapsed: mergedCollapsedRef, scrollContainerStyle: scrollContainerStyleRef, siderPlacement: siderPlacementRef, handleNativeElScroll,
+            handleTransitionend,
             handleTriggerClick,
             inlineThemeDisabled, cssVars: cssVarsRef, themeClass: themeClassHandle === null || themeClassHandle === void 0 ? void 0 : themeClassHandle.themeClass, onRender: themeClassHandle === null || themeClassHandle === void 0 ? void 0 : themeClassHandle.onRender }, exposedMethods);
     },
@@ -217,7 +236,7 @@ exports.default = (0, vue_1.defineComponent)({
                         colorHover: 'rgba(255, 255, 255, .4)',
                         color: 'rgba(255, 255, 255, .3)'
                     }
-                    : undefined }), this.$slots)) : ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-layout-sider-scroll-container`, onScroll: this.onScroll, style: [
+                    : undefined }), this.$slots)) : ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-layout-sider-scroll-container`, onScroll: this.handleNativeElScroll, style: [
                     this.scrollContainerStyle,
                     {
                         overflow: 'auto'

package/lib/menu/src/Menu.d.ts

@@ -2147,13 +2147,13 @@ declare const _default: import("vue").DefineComponent<{
     readonly labelField: string;
     readonly defaultValue: Key | null;
     readonly childrenField: string;
+    readonly defaultExpandAll: boolean;
     readonly indent: number;
     readonly inverted: boolean;
     readonly accordion: boolean;
     readonly collapsed: boolean | undefined;
     readonly collapsedWidth: number;
     readonly collapsedIconSize: number;
-    readonly defaultExpandAll: boolean;
     readonly watchProps: ("defaultValue" | "defaultExpandedKeys")[];
     readonly dropdownPlacement: FollowerPlacement;
 }>;

package/lib/modal/src/BodyWrapper.d.ts

@@ -25,7 +25,7 @@ declare const _default: import("vue").DefineComponent<{
         required: true;
     };
     onAfterEnter: PropType<() => void>;
-    onEsc: PropType<() => void>;
+    onEsc: PropType<(e: KeyboardEvent) => void>;
     icon: PropType<() => import("vue").VNodeChild>;
     type: {
         readonly type: PropType<"default" | "error" | "info" | "success" | "warning">;
@@ -746,7 +746,7 @@ declare const _default: import("vue").DefineComponent<{
         required: true;
     };
     onAfterEnter: PropType<() => void>;
-    onEsc: PropType<() => void>;
+    onEsc: PropType<(e: KeyboardEvent) => void>;
     icon: PropType<() => import("vue").VNodeChild>;
     type: {
         readonly type: PropType<"default" | "error" | "info" | "success" | "warning">;

package/lib/modal/src/Modal.js

@@ -155,7 +155,7 @@ exports.default = (0, vue_1.defineComponent)({
         function handleEsc(e) {
             var _a;
             (_a = props.onEsc) === null || _a === void 0 ? void 0 : _a.call(props);
-            if (props.closeOnEsc) {
+            if (props.show && props.closeOnEsc && (0, _utils_1.eventEffectNotPerformed)(e)) {
                 !isComposingRef.value && doUpdateShow(false);
             }
         }