naive-ui 2.30.7 → 2.32.0

package/lib/form/src/Form.js

@@ -12,13 +12,14 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.formProps = void 0;
 const vue_1 = require("vue");
 const _mixins_1 = require("../../_mixins");
 const styles_1 = require("../styles");
 const form_cssr_1 = __importDefault(require("./styles/form.cssr"));
 const _utils_1 = require("../../_utils");
 const context_1 = require("./context");
-const formProps = Object.assign(Object.assign({}, _mixins_1.useTheme.props), { inline: Boolean, labelWidth: [Number, String], labelAlign: String, labelPlacement: {
+exports.formProps = Object.assign(Object.assign({}, _mixins_1.useTheme.props), { inline: Boolean, labelWidth: [Number, String], labelAlign: String, labelPlacement: {
         type: String,
         default: 'top'
     }, model: {
@@ -39,7 +40,7 @@ const formProps = Object.assign(Object.assign({}, _mixins_1.useTheme.props), { i
     }, validateMessages: Object });
 exports.default = (0, vue_1.defineComponent)({
     name: 'Form',
-    props: formProps,
+    props: exports.formProps,
     setup(props) {
         const { mergedClsPrefixRef } = (0, _mixins_1.useConfig)(props);
         (0, _mixins_1.useTheme)('Form', '-form', form_cssr_1.default, styles_1.formLight, props, mergedClsPrefixRef);

package/lib/form/src/FormItemRow.d.ts

@@ -1,5 +1,5 @@
 import type { ExtractPublicPropTypes } from '../../_utils';
-declare const formItemRowProps: {
+export declare const formItemRowProps: {
     label: StringConstructor;
     labelWidth: import("vue").PropType<string | number>;
     labelStyle: import("vue").PropType<string | import("vue").CSSProperties>;

package/lib/form/src/FormItemRow.js

@@ -23,14 +23,15 @@ var __importStar = (this && this.__importStar) || function (mod) {
     return result;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.formItemRowProps = void 0;
 const vue_1 = require("vue");
 const Row_1 = __importStar(require("../../legacy-grid/src/Row"));
 const _utils_1 = require("../../_utils");
 const FormItemCol_1 = __importStar(require("./FormItemCol"));
-const formItemRowProps = Object.assign(Object.assign({}, Row_1.rowProps), FormItemCol_1.formItemColProps);
+exports.formItemRowProps = Object.assign(Object.assign({}, Row_1.rowProps), FormItemCol_1.formItemColProps);
 exports.default = (0, vue_1.defineComponent)({
     name: 'FormItemRow',
-    props: formItemRowProps,
+    props: exports.formItemRowProps,
     setup() {
         const formItemColInstRef = (0, vue_1.ref)(null);
         const validate = ((...args) => {

package/lib/form/src/styles/form-item.cssr.js

@@ -41,10 +41,12 @@ exports.default = (0, cssr_1.cB)('form-item', {
  box-sizing: border-box;
  `, [(0, cssr_1.cE)('asterisk', `
  user-select: none;
+ -webkit-user-select: none;
  color: var(--n-asterisk-color);
  transition: color .3s var(--n-bezier);
  `), (0, cssr_1.cE)('asterisk-placeholder', `
  user-select: none;
+ -webkit-user-select: none;
  visibility: hidden; 
  `)]), (0, cssr_1.cB)('form-item-blank', {
   gridArea: 'blank',

package/lib/gradient-text/index.d.ts

@@ -1,2 +1,2 @@
-export { default as NGradientText } from './src/GradientText';
+export { default as NGradientText, gradientTextProps } from './src/GradientText';
 export type { GradientTextProps } from './src/GradientText';

package/lib/gradient-text/index.js

@@ -3,6 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.NGradientText = void 0;
+exports.gradientTextProps = exports.NGradientText = void 0;
 var GradientText_1 = require("./src/GradientText");
 Object.defineProperty(exports, "NGradientText", { enumerable: true, get: function () { return __importDefault(GradientText_1).default; } });
+Object.defineProperty(exports, "gradientTextProps", { enumerable: true, get: function () { return GradientText_1.gradientTextProps; } });

package/lib/gradient-text/src/GradientText.d.ts

@@ -5,7 +5,7 @@ declare type Gradient = string | {
     from: string;
     to: string;
 };
-declare const gradientTextProps: {
+export declare const gradientTextProps: {
     readonly size: PropType<string | number>;
     readonly fontSize: PropType<string | number>;
     readonly type: {

package/lib/gradient-text/src/GradientText.js

@@ -3,18 +3,19 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.gradientTextProps = void 0;
 const vue_1 = require("vue");
 const _mixins_1 = require("../../_mixins");
 const _utils_1 = require("../../_utils");
 const styles_1 = require("../styles");
 const index_cssr_1 = __importDefault(require("./styles/index.cssr"));
-const gradientTextProps = Object.assign(Object.assign({}, _mixins_1.useTheme.props), { size: [String, Number], fontSize: [String, Number], type: {
+exports.gradientTextProps = Object.assign(Object.assign({}, _mixins_1.useTheme.props), { size: [String, Number], fontSize: [String, Number], type: {
         type: String,
         default: 'primary'
     }, color: [Object, String], gradient: [Object, String] });
 exports.default = (0, vue_1.defineComponent)({
     name: 'GradientText',
-    props: gradientTextProps,
+    props: exports.gradientTextProps,
     setup(props) {
         (0, _utils_1.useHoudini)();
         const { mergedClsPrefixRef, inlineThemeDisabled } = (0, _mixins_1.useConfig)(props);

package/lib/grid/index.d.ts

@@ -1,5 +1,5 @@
-export { default as NGrid } from './src/Grid';
+export { default as NGrid, gridProps } from './src/Grid';
 export type { GridProps } from './src/Grid';
-export { default as NGridItem } from './src/GridItem';
-export { default as NGi } from './src/GridItem';
+export { default as NGridItem, gridItemProps } from './src/GridItem';
+export { default as NGi, gridItemProps as giProps } from './src/GridItem';
 export type { GridItemProps } from './src/GridItem';

package/lib/grid/index.js

@@ -3,10 +3,13 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.NGi = exports.NGridItem = exports.NGrid = void 0;
+exports.giProps = exports.NGi = exports.gridItemProps = exports.NGridItem = exports.gridProps = exports.NGrid = void 0;
 var Grid_1 = require("./src/Grid");
 Object.defineProperty(exports, "NGrid", { enumerable: true, get: function () { return __importDefault(Grid_1).default; } });
+Object.defineProperty(exports, "gridProps", { enumerable: true, get: function () { return Grid_1.gridProps; } });
 var GridItem_1 = require("./src/GridItem");
 Object.defineProperty(exports, "NGridItem", { enumerable: true, get: function () { return __importDefault(GridItem_1).default; } });
+Object.defineProperty(exports, "gridItemProps", { enumerable: true, get: function () { return GridItem_1.gridItemProps; } });
 var GridItem_2 = require("./src/GridItem");
 Object.defineProperty(exports, "NGi", { enumerable: true, get: function () { return __importDefault(GridItem_2).default; } });
+Object.defineProperty(exports, "giProps", { enumerable: true, get: function () { return GridItem_2.gridItemProps; } });

package/lib/grid/src/Grid.d.ts

@@ -1,7 +1,7 @@
 import { CSSProperties, PropType, Ref } from 'vue';
 import { VResizeObserverOnResize } from 'vueuc';
 import { ExtractPublicPropTypes } from '../../_utils';
-declare const gridProps: {
+export declare const gridProps: {
     readonly responsive: {
         readonly type: PropType<"screen" | "self">;
         readonly default: "self";

package/lib/grid/src/Grid.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.gridProps = void 0;
 const vue_1 = require("vue");
 const vooks_1 = require("vooks");
 const vueuc_1 = require("vueuc");
@@ -10,7 +11,7 @@ const _utils_1 = require("../../_utils");
 const config_2 = require("./config");
 const defaultCols = 24;
 const SSR_ATTR_NAME = '__ssr__';
-const gridProps = {
+exports.gridProps = {
     responsive: {
         type: [String, Boolean],
         default: 'self'
@@ -39,7 +40,7 @@ const gridProps = {
 exports.default = (0, vue_1.defineComponent)({
     name: 'Grid',
     inheritAttrs: false,
-    props: gridProps,
+    props: exports.gridProps,
     setup(props) {
         const { mergedClsPrefixRef, mergedBreakpointsRef } = (0, _mixins_1.useConfig)(props);
         const numRegex = /^\d+$/;

package/lib/icon/index.d.ts

@@ -1,2 +1,2 @@
-export { NIcon } from './src/Icon';
+export { NIcon, iconProps } from './src/Icon';
 export type { IconProps } from './src/Icon';

package/lib/icon/index.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.NIcon = void 0;
+exports.iconProps = exports.NIcon = void 0;
 var Icon_1 = require("./src/Icon");
 Object.defineProperty(exports, "NIcon", { enumerable: true, get: function () { return Icon_1.NIcon; } });
+Object.defineProperty(exports, "iconProps", { enumerable: true, get: function () { return Icon_1.iconProps; } });

package/lib/icon/src/Icon.d.ts

@@ -1,7 +1,7 @@
 import { Component, PropType } from 'vue';
 import type { ExtractPublicPropTypes } from '../../_utils';
 export declare type Depth = 1 | 2 | 3 | 4 | 5 | '1' | '2' | '3' | '4' | '5' | undefined;
-declare const iconProps: {
+export declare const iconProps: {
     readonly depth: PropType<Depth>;
     readonly size: PropType<string | number>;
     readonly color: StringConstructor;
@@ -104,4 +104,3 @@ export declare const NIcon: import("vue").DefineComponent<{
         opacity5Depth: string;
     }, any>>>;
 }>>, {}>;
-export {};

package/lib/icon/src/Icon.js

@@ -3,18 +3,18 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.NIcon = void 0;
+exports.NIcon = exports.iconProps = void 0;
 const vue_1 = require("vue");
 const _mixins_1 = require("../../_mixins");
 const _utils_1 = require("../../_utils");
 const styles_1 = require("../styles");
 const index_cssr_1 = __importDefault(require("./styles/index.cssr"));
-const iconProps = Object.assign(Object.assign({}, _mixins_1.useTheme.props), { depth: [String, Number], size: [Number, String], color: String, component: Object });
+exports.iconProps = Object.assign(Object.assign({}, _mixins_1.useTheme.props), { depth: [String, Number], size: [Number, String], color: String, component: Object });
 exports.NIcon = (0, vue_1.defineComponent)({
     _n_icon__: true,
     name: 'Icon',
     inheritAttrs: false,
-    props: iconProps,
+    props: exports.iconProps,
     setup(props) {
         const { mergedClsPrefixRef, inlineThemeDisabled } = (0, _mixins_1.useConfig)(props);
         const themeRef = (0, _mixins_1.useTheme)('Icon', '-icon', index_cssr_1.default, styles_1.iconLight, props, mergedClsPrefixRef);

package/lib/icon-wrapper/index.d.ts

@@ -1,2 +1,2 @@
-export { NIconWrapper } from './src/IconWrapper';
+export { NIconWrapper, iconWrapperProps } from './src/IconWrapper';
 export type { IconWrapperProps } from './src/IconWrapper';

package/lib/icon-wrapper/index.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.NIconWrapper = void 0;
+exports.iconWrapperProps = exports.NIconWrapper = void 0;
 var IconWrapper_1 = require("./src/IconWrapper");
 Object.defineProperty(exports, "NIconWrapper", { enumerable: true, get: function () { return IconWrapper_1.NIconWrapper; } });
+Object.defineProperty(exports, "iconWrapperProps", { enumerable: true, get: function () { return IconWrapper_1.iconWrapperProps; } });

package/lib/icon-wrapper/src/IconWrapper.d.ts

@@ -1,5 +1,5 @@
 import { ExtractPublicPropTypes } from '../../_utils';
-declare const iconWrapperProps: {
+export declare const iconWrapperProps: {
     readonly size: {
         readonly type: NumberConstructor;
         readonly default: 24;
@@ -74,4 +74,3 @@ export declare const NIconWrapper: import("vue").DefineComponent<{
     readonly size: number;
     readonly borderRadius: number;
 }>;
-export {};

package/lib/icon-wrapper/src/IconWrapper.js

@@ -3,13 +3,13 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.NIconWrapper = void 0;
+exports.NIconWrapper = exports.iconWrapperProps = void 0;
 const vue_1 = require("vue");
 const _mixins_1 = require("../../_mixins");
 const _utils_1 = require("../../_utils");
 const styles_1 = require("../styles");
 const index_cssr_1 = __importDefault(require("./styles/index.cssr"));
-const iconWrapperProps = Object.assign(Object.assign({}, _mixins_1.useTheme.props), { size: {
+exports.iconWrapperProps = Object.assign(Object.assign({}, _mixins_1.useTheme.props), { size: {
         type: Number,
         default: 24
     }, borderRadius: {
@@ -18,7 +18,7 @@ const iconWrapperProps = Object.assign(Object.assign({}, _mixins_1.useTheme.prop
     }, color: String, iconColor: String });
 exports.NIconWrapper = (0, vue_1.defineComponent)({
     name: 'IconWrapper',
-    props: iconWrapperProps,
+    props: exports.iconWrapperProps,
     setup(props, { slots }) {
         const themeRef = (0, _mixins_1.useTheme)('IconWrapper', '-icon-wrapper', index_cssr_1.default, styles_1.iconWrapperLight, props);
         const { mergedClsPrefixRef, inlineThemeDisabled } = (0, _mixins_1.useConfig)(props);

package/lib/image/index.d.ts

@@ -1,4 +1,4 @@
-export { default as NImage } from './src/Image';
+export { default as NImage, imageProps } from './src/Image';
 export type { ImageProps } from './src/Image';
-export { default as NImageGroup } from './src/ImageGroup';
+export { default as NImageGroup, imageGroupProps } from './src/ImageGroup';
 export type { ImageGroupProps } from './src/ImageGroup';

package/lib/image/index.js

@@ -3,8 +3,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.NImageGroup = exports.NImage = void 0;
+exports.imageGroupProps = exports.NImageGroup = exports.imageProps = exports.NImage = void 0;
 var Image_1 = require("./src/Image");
 Object.defineProperty(exports, "NImage", { enumerable: true, get: function () { return __importDefault(Image_1).default; } });
+Object.defineProperty(exports, "imageProps", { enumerable: true, get: function () { return Image_1.imageProps; } });
 var ImageGroup_1 = require("./src/ImageGroup");
 Object.defineProperty(exports, "NImageGroup", { enumerable: true, get: function () { return __importDefault(ImageGroup_1).default; } });
+Object.defineProperty(exports, "imageGroupProps", { enumerable: true, get: function () { return ImageGroup_1.imageGroupProps; } });

package/lib/image/src/Image.d.ts

@@ -4,7 +4,7 @@ import type { IntersectionObserverOptions } from './utils';
 export interface ImageInst {
     click: () => void;
 }
-declare const imageProps: {
+export declare const imageProps: {
     showToolbar: {
         type: BooleanConstructor;
         default: boolean;

package/lib/image/src/Image.js

@@ -3,19 +3,21 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.imageProps = void 0;
 const vue_1 = require("vue");
-const ImagePreview_1 = __importDefault(require("./ImagePreview"));
-const ImageGroup_1 = require("./ImageGroup");
+const is_native_lazy_load_1 = require("../../_utils/env/is-native-lazy-load");
 const _mixins_1 = require("../../_mixins");
 const interface_1 = require("./interface");
 const utils_1 = require("./utils");
-const imageProps = Object.assign({ alt: String, height: [String, Number], imgProps: Object, lazy: Boolean, intersectionObserverOptions: Object, objectFit: {
+const ImageGroup_1 = require("./ImageGroup");
+const ImagePreview_1 = __importDefault(require("./ImagePreview"));
+exports.imageProps = Object.assign({ alt: String, height: [String, Number], imgProps: Object, lazy: Boolean, intersectionObserverOptions: Object, objectFit: {
         type: String,
         default: 'fill'
     }, previewSrc: String, fallbackSrc: String, width: [String, Number], src: String, previewDisabled: Boolean, loadDescription: String, onError: Function, onLoad: Function }, interface_1.imagePreviewSharedProps);
 exports.default = (0, vue_1.defineComponent)({
     name: 'Image',
-    props: imageProps,
+    props: exports.imageProps,
     inheritAttrs: false,
     setup(props) {
         const imageRef = (0, vue_1.ref)(null);
@@ -49,6 +51,9 @@ exports.default = (0, vue_1.defineComponent)({
             (_a = imageRef.value) === null || _a === void 0 ? void 0 : _a.setAttribute('data-group-id', (imageGroupHandle === null || imageGroupHandle === void 0 ? void 0 : imageGroupHandle.groupId) || '');
         });
         (0, vue_1.onMounted)(() => {
+            if (is_native_lazy_load_1.isImageSupportNativeLazy) {
+                return;
+            }
             let unobserve;
             const stopWatchHandle = (0, vue_1.watchEffect)(() => {
                 unobserve === null || unobserve === void 0 ? void 0 : unobserve();
@@ -86,19 +91,22 @@ exports.default = (0, vue_1.defineComponent)({
     },
     render() {
         var _a, _b;
-        const { mergedClsPrefix, imgProps = {}, loaded, $attrs } = this;
+        const { mergedClsPrefix, imgProps = {}, loaded, $attrs, lazy } = this;
         const placeholderNode = (_b = (_a = this.$slots).placeholder) === null || _b === void 0 ? void 0 : _b.call(_a);
-        const imgNode = ((0, vue_1.h)("img", Object.assign({}, imgProps, { class: imgProps.class, ref: "imageRef", width: this.width || imgProps.width, height: this.height || imgProps.height, src: this.showError
-                ? this.fallbackSrc
-                : this.shouldStartLoading
-                    ? this.src || imgProps.src
-                    : undefined, alt: this.alt || imgProps.alt, "aria-label": this.alt || imgProps.alt, onClick: this.click, onError: this.mergedOnError, onLoad: this.mergedOnLoad, style: [
+        const loadSrc = this.src || imgProps.src || '';
+        const imgNode = (0, vue_1.h)('img', Object.assign(Object.assign({}, imgProps), { class: imgProps.class, ref: 'imageRef', width: this.width || imgProps.width, height: this.height || imgProps.height, src: is_native_lazy_load_1.isImageSupportNativeLazy
+                ? loadSrc
+                : this.showError
+                    ? this.fallbackSrc
+                    : this.shouldStartLoading
+                        ? loadSrc
+                        : undefined, alt: this.alt || imgProps.alt, 'aria-label': this.alt || imgProps.alt, onClick: this.click, onError: this.mergedOnError, onLoad: this.mergedOnLoad, loading: lazy ? 'lazy' : 'eager', style: [
                 imgProps.style || '',
                 placeholderNode && !loaded
                     ? { height: '0', width: '0', visibility: 'hidden' }
                     : '',
                 { objectFit: this.objectFit }
-            ], "data-error": this.showError, "data-preview-src": this.previewSrc || this.src })));
+            ], 'data-error': this.showError, 'data-preview-src': this.previewSrc || this.src }));
         return ((0, vue_1.h)("div", Object.assign({}, $attrs, { role: "none", class: [
                 $attrs.class,
                 `${mergedClsPrefix}-image`,

package/lib/image/src/ImageGroup.d.ts

@@ -5,7 +5,7 @@ export declare const imageGroupInjectionKey: import("vue").InjectionKey<ImagePre
     groupId: string;
     mergedClsPrefixRef: Ref<string>;
 }>;
-declare const imageGroupProps: {
+export declare const imageGroupProps: {
     showToolbar: {
         type: BooleanConstructor;
         default: boolean;

package/lib/image/src/ImageGroup.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.imageGroupInjectionKey = void 0;
+exports.imageGroupProps = exports.imageGroupInjectionKey = void 0;
 const vue_1 = require("vue");
 const seemly_1 = require("seemly");
 const _utils_1 = require("../../_utils");
@@ -11,10 +11,10 @@ const _mixins_1 = require("../../_mixins");
 const ImagePreview_1 = __importDefault(require("./ImagePreview"));
 const interface_1 = require("./interface");
 exports.imageGroupInjectionKey = (0, _utils_1.createInjectionKey)('n-image-group');
-const imageGroupProps = interface_1.imagePreviewSharedProps;
+exports.imageGroupProps = interface_1.imagePreviewSharedProps;
 exports.default = (0, vue_1.defineComponent)({
     name: 'ImageGroup',
-    props: imageGroupProps,
+    props: exports.imageGroupProps,
     setup(props) {
         let currentSrc;
         const { mergedClsPrefixRef } = (0, _mixins_1.useConfig)(props);

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

@@ -60,6 +60,7 @@ exports.default = (0, cssr_1.c)([(0, cssr_1.c)('body >', [(0, cssr_1.cB)('image-
  pointer-events: none;
  `, [(0, fade_in_scale_up_cssr_1.fadeInScaleUpTransition)()]), (0, cssr_1.cB)('image-preview', `
  user-select: none;
+ -webkit-user-select: none;
  pointer-events: all;
  margin: auto;
  max-height: calc(100vh - 32px);

package/lib/image/src/utils.d.ts

@@ -8,4 +8,4 @@ export declare const resolveOptionsAndHash: (options?: IntersectionObserverOptio
         root: Element | Document;
     };
 };
-export declare const observeIntersection: (el: HTMLImageElement | null, options: IntersectionObserverOptions | undefined, shouldStartLoadingRef: Ref<boolean>) => () => void;
+export declare const observeIntersection: (el: HTMLElement | null, options: IntersectionObserverOptions | undefined, shouldStartLoadingRef: Ref<boolean>) => () => void;

package/lib/input/index.d.ts

@@ -1,7 +1,7 @@
-export { default as NInput } from './src/Input';
+export { default as NInput, inputProps } from './src/Input';
 export type { InputInst } from './src/interface';
 export type { InputProps } from './src/Input';
-export { default as NInputGroup } from './src/InputGroup';
-export { default as NInputGroupLabel } from './src/InputGroupLabel';
+export { default as NInputGroup, inputGroupProps } from './src/InputGroup';
+export { default as NInputGroupLabel, inputGroupLabelProps } from './src/InputGroupLabel';
 export type { InputGroupProps } from './src/InputGroup';
 export type { InputGroupLabelProps } from './src/InputGroupLabel';

package/lib/input/index.js

@@ -3,10 +3,13 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.NInputGroupLabel = exports.NInputGroup = exports.NInput = void 0;
+exports.inputGroupLabelProps = exports.NInputGroupLabel = exports.inputGroupProps = exports.NInputGroup = exports.inputProps = exports.NInput = void 0;
 var Input_1 = require("./src/Input");
 Object.defineProperty(exports, "NInput", { enumerable: true, get: function () { return __importDefault(Input_1).default; } });
+Object.defineProperty(exports, "inputProps", { enumerable: true, get: function () { return Input_1.inputProps; } });
 var InputGroup_1 = require("./src/InputGroup");
 Object.defineProperty(exports, "NInputGroup", { enumerable: true, get: function () { return __importDefault(InputGroup_1).default; } });
+Object.defineProperty(exports, "inputGroupProps", { enumerable: true, get: function () { return InputGroup_1.inputGroupProps; } });
 var InputGroupLabel_1 = require("./src/InputGroupLabel");
 Object.defineProperty(exports, "NInputGroupLabel", { enumerable: true, get: function () { return __importDefault(InputGroupLabel_1).default; } });
+Object.defineProperty(exports, "inputGroupLabelProps", { enumerable: true, get: function () { return InputGroupLabel_1.inputGroupLabelProps; } });

package/lib/input/src/Input.d.ts

@@ -3,7 +3,7 @@ import type { FormValidationStatus } from '../../form/src/interface';
 import { ExtractPublicPropTypes } from '../../_utils';
 import type { MaybeArray } from '../../_utils';
 import type { OnUpdateValue, Size } from './interface';
-declare const inputProps: {
+export declare const inputProps: {
     bordered: {
         type: PropType<boolean | undefined>;
         default: undefined;
@@ -831,6 +831,7 @@ declare const _default: import("vue").DefineComponent<{
     select: () => void;
     activate: () => void;
     deactivate: () => void;
+    scrollTo: (options: ScrollToOptions) => void;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     bordered: {
         type: PropType<boolean | undefined>;

package/lib/input/src/Input.js

@@ -3,13 +3,14 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.inputProps = void 0;
 const vue_1 = require("vue");
 const vooks_1 = require("vooks");
 const seemly_1 = require("seemly");
 const vueuc_1 = require("vueuc");
 const evtd_1 = require("evtd");
 const icons_1 = require("../../_internal/icons");
-const use_rtl_1 = __importDefault(require("../../_mixins/use-rtl"));
+const use_rtl_1 = require("../../_mixins/use-rtl");
 const _internal_1 = require("../../_internal");
 const _mixins_1 = require("../../_mixins");
 const _utils_1 = require("../../_utils");
@@ -18,7 +19,7 @@ const interface_1 = require("./interface");
 const utils_1 = require("./utils");
 const WordCount_1 = __importDefault(require("./WordCount"));
 const input_cssr_1 = __importDefault(require("./styles/input.cssr"));
-const inputProps = Object.assign(Object.assign({}, _mixins_1.useTheme.props), { bordered: {
+exports.inputProps = Object.assign(Object.assign({}, _mixins_1.useTheme.props), { bordered: {
         type: Boolean,
         default: undefined
     }, type: {
@@ -58,7 +59,7 @@ const inputProps = Object.assign(Object.assign({}, _mixins_1.useTheme.props), {
     showPasswordToggle: Boolean });
 exports.default = (0, vue_1.defineComponent)({
     name: 'Input',
-    props: inputProps,
+    props: exports.inputProps,
     setup(props) {
         if (process.env.NODE_ENV !== 'production') {
             (0, vue_1.watchEffect)(() => {
@@ -586,6 +587,16 @@ exports.default = (0, vue_1.defineComponent)({
                 handleWrapperKeydownEsc();
             }
         }
+        function scrollTo(options) {
+            if (props.type === 'textarea') {
+                const { value: textareaEl } = textareaElRef;
+                textareaEl === null || textareaEl === void 0 ? void 0 : textareaEl.scrollTo(options);
+            }
+            else {
+                const { value: inputEl } = inputElRef;
+                inputEl === null || inputEl === void 0 ? void 0 : inputEl.scrollTo(options);
+            }
+        }
         function syncMirror(value) {
             const { type, pair, autosize } = props;
             if (!pair && autosize) {
@@ -662,9 +673,10 @@ exports.default = (0, vue_1.defineComponent)({
             blur,
             select,
             deactivate,
-            activate
+            activate,
+            scrollTo
         };
-        const rtlEnabledRef = (0, use_rtl_1.default)('Input', mergedRtlRef, mergedClsPrefixRef);
+        const rtlEnabledRef = (0, use_rtl_1.useRtl)('Input', mergedRtlRef, mergedClsPrefixRef);
         const cssVarsRef = (0, vue_1.computed)(() => {
             const { value: size } = mergedSizeRef;
             const { common: { cubicBezierEaseInOut }, self: { color, borderRadius, textColor, caretColor, caretColorError, caretColorWarning, textDecorationColor, border, borderDisabled, borderHover, borderFocus, placeholderColor, placeholderColorDisabled, lineHeightTextarea, colorDisabled, colorFocus, textColorDisabled, boxShadowFocus, iconSize, colorFocusWarning, boxShadowFocusWarning, borderWarning, borderFocusWarning, borderHoverWarning, colorFocusError, boxShadowFocusError, borderError, borderFocusError, borderHoverError, clearSize, clearColor, clearColorHover, clearColorPressed, iconColor, iconColorDisabled, suffixTextColor, countTextColor, iconColorHover, iconColorPressed, loadingColor, loadingColorError, loadingColorWarning, [(0, _utils_1.createKey)('padding', size)]: padding, [(0, _utils_1.createKey)('fontSize', size)]: fontSize, [(0, _utils_1.createKey)('height', size)]: height } } = themeRef.value;
@@ -763,7 +775,7 @@ exports.default = (0, vue_1.defineComponent)({
     },
     render() {
         var _a, _b;
-        const { mergedClsPrefix, mergedStatus, themeClass, onRender } = this;
+        const { mergedClsPrefix, mergedStatus, themeClass, type, onRender } = this;
         const $slots = this.$slots;
         onRender === null || onRender === void 0 ? void 0 : onRender();
         return ((0, vue_1.h)("div", { ref: "wrapperElRef", class: [
@@ -773,10 +785,10 @@ exports.default = (0, vue_1.defineComponent)({
                 {
                     [`${mergedClsPrefix}-input--rtl`]: this.rtlEnabled,
                     [`${mergedClsPrefix}-input--disabled`]: this.mergedDisabled,
-                    [`${mergedClsPrefix}-input--textarea`]: this.type === 'textarea',
+                    [`${mergedClsPrefix}-input--textarea`]: type === 'textarea',
                     [`${mergedClsPrefix}-input--resizable`]: this.resizable && !this.autosize,
                     [`${mergedClsPrefix}-input--autosize`]: this.autosize,
-                    [`${mergedClsPrefix}-input--round`]: this.round && !(this.type === 'textarea'),
+                    [`${mergedClsPrefix}-input--round`]: this.round && !(type === 'textarea'),
                     [`${mergedClsPrefix}-input--pair`]: this.pair,
                     [`${mergedClsPrefix}-input--focus`]: this.mergedFocus,
                     [`${mergedClsPrefix}-input--stateful`]: this.stateful
@@ -786,7 +798,7 @@ exports.default = (0, vue_1.defineComponent)({
                 : undefined, onFocus: this.handleWrapperFocus, onBlur: this.handleWrapperBlur, onClick: this.handleClick, onMousedown: this.handleMouseDown, onMouseenter: this.handleMouseEnter, onMouseleave: this.handleMouseLeave, onCompositionstart: this.handleCompositionStart, onCompositionend: this.handleCompositionEnd, onKeyup: this.onKeyup, onKeydown: this.handleWrapperKeydown },
             (0, vue_1.h)("div", { class: `${mergedClsPrefix}-input-wrapper` },
                 (0, _utils_1.resolveWrappedSlot)($slots.prefix, (children) => children && ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-input__prefix` }, children))),
-                this.type === 'textarea' ? ((0, vue_1.h)(_internal_1.NScrollbar, { ref: "textareaScrollbarInstRef", class: `${mergedClsPrefix}-input__textarea`, container: this.getTextareaScrollContainer, triggerDisplayManually: true, useUnifiedContainer: true }, {
+                type === 'textarea' ? ((0, vue_1.h)(_internal_1.NScrollbar, { ref: "textareaScrollbarInstRef", class: `${mergedClsPrefix}-input__textarea`, container: this.getTextareaScrollContainer, triggerDisplayManually: true, useUnifiedContainer: true, internalHoistYRail: true }, {
                     default: () => {
                         var _a, _b;
                         const { textAreaScrollContainerWidth } = this;
@@ -815,11 +827,11 @@ exports.default = (0, vue_1.defineComponent)({
                             })) : null));
                     }
                 })) : ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-input__input` },
-                    (0, vue_1.h)("input", Object.assign({ type: this.type === 'password' &&
+                    (0, vue_1.h)("input", Object.assign({ type: type === 'password' &&
                             this.mergedShowPasswordOn &&
                             this.passwordVisible
                             ? 'text'
-                            : this.type }, this.inputProps, { ref: "inputElRef", class: [
+                            : type }, this.inputProps, { ref: "inputElRef", class: [
                             `${mergedClsPrefix}-input__input-el`,
                             (_a = this.inputProps) === null || _a === void 0 ? void 0 : _a.class
                         ], style: [
@@ -878,6 +890,6 @@ exports.default = (0, vue_1.defineComponent)({
                 }))) : null,
             this.mergedBordered ? ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-input__border` })) : null,
             this.mergedBordered ? ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-input__state-border` })) : null,
-            this.showCount && this.type === 'textarea' ? ((0, vue_1.h)(WordCount_1.default, null, { default: (props) => { var _a; return (_a = $slots.count) === null || _a === void 0 ? void 0 : _a.call($slots, props); } })) : null));
+            this.showCount && type === 'textarea' ? ((0, vue_1.h)(WordCount_1.default, null, { default: (props) => { var _a; return (_a = $slots.count) === null || _a === void 0 ? void 0 : _a.call($slots, props); } })) : null));
     }
 });

package/lib/input/src/InputGroup.d.ts

@@ -1,5 +1,5 @@
 import type { ExtractPublicPropTypes } from '../../_utils';
-declare const inputGroupProps: {
+export declare const inputGroupProps: {
     [key in any]: never;
 };
 export declare type InputGroupProps = ExtractPublicPropTypes<typeof inputGroupProps>;

package/lib/input/src/InputGroup.js

@@ -3,13 +3,14 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.inputGroupProps = void 0;
 const vue_1 = require("vue");
 const _mixins_1 = require("../../_mixins");
 const input_group_cssr_1 = __importDefault(require("./styles/input-group.cssr"));
-const inputGroupProps = {};
+exports.inputGroupProps = {};
 exports.default = (0, vue_1.defineComponent)({
     name: 'InputGroup',
-    props: inputGroupProps,
+    props: exports.inputGroupProps,
     setup(props) {
         const { mergedClsPrefixRef } = (0, _mixins_1.useConfig)(props);
         (0, _mixins_1.useStyle)('-input-group', input_group_cssr_1.default, mergedClsPrefixRef);