naive-ui 2.30.4 → 2.30.7

package/lib/locales/common/viVN.js

@@ -0,0 +1,115 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const viVN = {
+    name: 'vi-VN',
+    global: {
+        undo: 'Hoàn tác',
+        redo: 'Làm lại',
+        confirm: 'Xác nhận'
+    },
+    Popconfirm: {
+        positiveText: 'Xác nhận',
+        negativeText: 'Hủy'
+    },
+    Cascader: {
+        placeholder: 'Vui lòng chọn',
+        loading: 'Đang tải',
+        loadingRequiredMessage: (label) => `Vui lòng tải tất cả thông tin con của ${label} trước.`
+    },
+    Time: {
+        dateFormat: '',
+        dateTimeFormat: 'HH:mm:ss dd-MM-yyyy'
+    },
+    DatePicker: {
+        yearFormat: 'yyyy',
+        monthFormat: 'MMM',
+        dayFormat: 'eeeeee',
+        yearTypeFormat: 'yyyy',
+        monthTypeFormat: 'MM-yyyy',
+        dateFormat: 'đ-MM-yyyy',
+        dateTimeFormat: 'HH:mm:ss dd-MM-yyyy',
+        quarterFormat: 'qqq-yyyy',
+        clear: 'Xóa',
+        now: 'Hôm nay',
+        confirm: 'Xác nhận',
+        selectTime: 'Chọn giờ',
+        selectDate: 'Chọn ngày',
+        datePlaceholder: 'Chọn ngày',
+        datetimePlaceholder: 'Chọn ngày giờ',
+        monthPlaceholder: 'Chọn tháng',
+        yearPlaceholder: 'Chọn năm',
+        quarterPlaceholder: 'Chọn quý',
+        startDatePlaceholder: 'Ngày bắt đầu',
+        endDatePlaceholder: 'Ngày kết thúc',
+        startDatetimePlaceholder: 'Thời gian bắt đầu',
+        endDatetimePlaceholder: 'Thời gian kết thúc',
+        startMonthPlaceholder: 'Tháng bắt đầu',
+        endMonthPlaceholder: 'Tháng kết thúc',
+        monthBeforeYear: true,
+        firstDayOfWeek: 0,
+        today: 'Hôm nay'
+    },
+    DataTable: {
+        checkTableAll: 'Chọn tất cả có trong bảng',
+        uncheckTableAll: 'Bỏ chọn tất cả có trong bảng',
+        confirm: 'Xác nhận',
+        clear: 'Xóa'
+    },
+    Transfer: {
+        sourceTitle: 'Nguồn',
+        targetTitle: 'Đích'
+    },
+    Empty: {
+        description: 'Không có dữ liệu'
+    },
+    Select: {
+        placeholder: 'Vui lòng chọn'
+    },
+    TimePicker: {
+        placeholder: 'Chọn thời gian',
+        positiveText: 'OK',
+        negativeText: 'Hủy',
+        now: 'Hiện tại'
+    },
+    Pagination: {
+        goto: 'Đi đến trang',
+        selectionSuffix: 'trang'
+    },
+    DynamicTags: {
+        add: 'Thêm'
+    },
+    Log: {
+        loading: 'Đang tải'
+    },
+    Input: {
+        placeholder: 'Vui lòng nhập'
+    },
+    InputNumber: {
+        placeholder: 'Vui lòng nhập'
+    },
+    DynamicInput: {
+        create: 'Tạo'
+    },
+    ThemeEditor: {
+        title: 'Tùy chỉnh giao diện',
+        clearAllVars: 'Xóa tất cả các biến',
+        clearSearch: 'Xóa tìm kiếm',
+        filterCompName: 'Lọc tên component',
+        filterVarName: 'Lọc tên biến',
+        import: 'Nhập',
+        export: 'Xuất',
+        restore: 'Đặt lại mặc định'
+    },
+    Image: {
+        tipPrevious: 'Hình trước (←)',
+        tipNext: 'Hình tiếp (→)',
+        tipCounterclockwise: 'Counterclockwise',
+        tipClockwise: 'Chiều kim đồng hồ',
+        tipZoomOut: 'Thu nhỏ',
+        tipZoomIn: 'Phóng to',
+        tipClose: 'Đóng (Esc)',
+        // TODO: translation
+        tipOriginalSize: 'Xem kích thớc gốc'
+    }
+};
+exports.default = viVN;

package/lib/locales/date/viVN.d.ts

@@ -0,0 +1,3 @@
+import { NDateLocale } from './enUS';
+declare const dateVi: NDateLocale;
+export default dateVi;

package/lib/locales/date/viVN.js

@@ -0,0 +1,11 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const vi_1 = __importDefault(require("date-fns/locale/vi")); //
+const dateVi = {
+    name: 'vi-VN',
+    locale: vi_1.default
+};
+exports.default = dateVi;

package/lib/locales/index.d.ts

@@ -18,6 +18,7 @@ export { default as plPL } from './common/plPL';
 export { default as ptBR } from './common/ptBR';
 export { default as thTH } from './common/thTH';
 export { default as eo } from './common/eo';
+export { default as viVN } from './common/viVN';
 export { default as dateZhCN } from './date/zhCN';
 export { default as dateZhTW } from './date/zhTW';
 export { default as dateEnUS } from './date/enUS';
@@ -38,6 +39,7 @@ export { default as datePlPL } from './date/plPL';
 export { default as datePtBR } from './date/ptBR';
 export { default as dateThTH } from './date/thTH';
 export { default as dateEo } from './date/eo';
+export { default as dateViVN } from './date/viVN';
 export type { NLocale } from './common/enUS';
 export type { NDateLocale } from './date/enUS';
 export type { NPartialLocale } from './utils/index';

package/lib/locales/index.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.createLocale = exports.dateEo = exports.dateThTH = exports.datePtBR = exports.datePlPL = exports.dateEnGB = exports.dateSkSK = exports.dateItIT = exports.dateEsAR = exports.dateFrFR = exports.dateNlNL = exports.dateNbNO = exports.dateDeDE = exports.dateIdID = exports.dateKoKR = exports.dateJaJP = exports.dateUkUA = exports.dateRuRU = exports.dateEnUS = exports.dateZhTW = exports.dateZhCN = exports.eo = exports.thTH = exports.ptBR = exports.plPL = exports.enGB = exports.skSK = exports.itIT = exports.esAR = exports.frFR = exports.nlNL = exports.nbNO = exports.deDE = exports.idID = exports.koKR = exports.jaJP = exports.ukUA = exports.ruRU = exports.enUS = exports.zhTW = exports.zhCN = void 0;
+exports.createLocale = exports.dateViVN = exports.dateEo = exports.dateThTH = exports.datePtBR = exports.datePlPL = exports.dateEnGB = exports.dateSkSK = exports.dateItIT = exports.dateEsAR = exports.dateFrFR = exports.dateNlNL = exports.dateNbNO = exports.dateDeDE = exports.dateIdID = exports.dateKoKR = exports.dateJaJP = exports.dateUkUA = exports.dateRuRU = exports.dateEnUS = exports.dateZhTW = exports.dateZhCN = exports.viVN = exports.eo = exports.thTH = exports.ptBR = exports.plPL = exports.enGB = exports.skSK = exports.itIT = exports.esAR = exports.frFR = exports.nlNL = exports.nbNO = exports.deDE = exports.idID = exports.koKR = exports.jaJP = exports.ukUA = exports.ruRU = exports.enUS = exports.zhTW = exports.zhCN = void 0;
 var zhCN_1 = require("./common/zhCN");
 Object.defineProperty(exports, "zhCN", { enumerable: true, get: function () { return __importDefault(zhCN_1).default; } });
 var zhTW_1 = require("./common/zhTW");
@@ -44,6 +44,8 @@ var thTH_1 = require("./common/thTH");
 Object.defineProperty(exports, "thTH", { enumerable: true, get: function () { return __importDefault(thTH_1).default; } });
 var eo_1 = require("./common/eo");
 Object.defineProperty(exports, "eo", { enumerable: true, get: function () { return __importDefault(eo_1).default; } });
+var viVN_1 = require("./common/viVN");
+Object.defineProperty(exports, "viVN", { enumerable: true, get: function () { return __importDefault(viVN_1).default; } });
 var zhCN_2 = require("./date/zhCN");
 Object.defineProperty(exports, "dateZhCN", { enumerable: true, get: function () { return __importDefault(zhCN_2).default; } });
 var zhTW_2 = require("./date/zhTW");
@@ -84,5 +86,7 @@ var thTH_2 = require("./date/thTH");
 Object.defineProperty(exports, "dateThTH", { enumerable: true, get: function () { return __importDefault(thTH_2).default; } });
 var eo_2 = require("./date/eo");
 Object.defineProperty(exports, "dateEo", { enumerable: true, get: function () { return __importDefault(eo_2).default; } });
+var viVN_2 = require("./date/viVN");
+Object.defineProperty(exports, "dateViVN", { enumerable: true, get: function () { return __importDefault(viVN_2).default; } });
 var index_1 = require("./utils/index");
 Object.defineProperty(exports, "createLocale", { enumerable: true, get: function () { return index_1.createLocale; } });

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

@@ -1,9 +1,7 @@
-import { PropType, VNode, ComponentPublicInstance } from 'vue';
+import { PropType, VNode, ComponentPublicInstance, VNodeChild } from 'vue';
 declare const _default: import("vue").DefineComponent<{
-    onClickoutside: {
-        type: FunctionConstructor;
-        required: true;
-    };
+    renderMask: PropType<() => VNodeChild>;
+    onClickoutside: PropType<(e: MouseEvent) => void>;
     onBeforeLeave: {
         type: FunctionConstructor;
         required: true;
@@ -26,12 +24,12 @@ declare const _default: import("vue").DefineComponent<{
     };
     onAfterEnter: PropType<() => void>;
     onEsc: PropType<(e: KeyboardEvent) => void>;
-    icon: PropType<() => import("vue").VNodeChild>;
+    icon: PropType<() => VNodeChild>;
     type: {
         readonly type: PropType<"default" | "error" | "info" | "success" | "warning">;
         readonly default: "default";
     };
-    title: PropType<string | (() => import("vue").VNodeChild)>;
+    title: PropType<string | (() => VNodeChild)>;
     closable: {
         readonly type: BooleanConstructor;
         readonly default: true;
@@ -40,8 +38,8 @@ declare const _default: import("vue").DefineComponent<{
     positiveText: StringConstructor;
     positiveButtonProps: PropType<import("../..").ButtonProps>;
     negativeButtonProps: PropType<import("../..").ButtonProps>;
-    content: PropType<string | (() => import("vue").VNodeChild)>;
-    action: PropType<() => import("vue").VNodeChild>;
+    content: PropType<string | (() => VNodeChild)>;
+    action: PropType<() => VNodeChild>;
     showIcon: {
         readonly type: BooleanConstructor;
         readonly default: true;
@@ -713,7 +711,6 @@ declare const _default: import("vue").DefineComponent<{
     childNodeRef: import("vue").Ref<VNode<import("vue").RendererNode, import("vue").RendererElement, {
         [key: string]: any;
     }> | null>;
-    handleClickOutside: (e: MouseEvent) => void;
     handlePositiveClick: () => void;
     handleNegativeClick: () => void;
     handleCloseClick: () => void;
@@ -721,10 +718,8 @@ declare const _default: import("vue").DefineComponent<{
     handleBeforeLeave: (el: HTMLElement) => void;
     handleEnter: (el: HTMLElement) => 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<{
-    onClickoutside: {
-        type: FunctionConstructor;
-        required: true;
-    };
+    renderMask: PropType<() => VNodeChild>;
+    onClickoutside: PropType<(e: MouseEvent) => void>;
     onBeforeLeave: {
         type: FunctionConstructor;
         required: true;
@@ -747,12 +742,12 @@ declare const _default: import("vue").DefineComponent<{
     };
     onAfterEnter: PropType<() => void>;
     onEsc: PropType<(e: KeyboardEvent) => void>;
-    icon: PropType<() => import("vue").VNodeChild>;
+    icon: PropType<() => VNodeChild>;
     type: {
         readonly type: PropType<"default" | "error" | "info" | "success" | "warning">;
         readonly default: "default";
     };
-    title: PropType<string | (() => import("vue").VNodeChild)>;
+    title: PropType<string | (() => VNodeChild)>;
     closable: {
         readonly type: BooleanConstructor;
         readonly default: true;
@@ -761,8 +756,8 @@ declare const _default: import("vue").DefineComponent<{
     positiveText: StringConstructor;
     positiveButtonProps: PropType<import("../..").ButtonProps>;
     negativeButtonProps: PropType<import("../..").ButtonProps>;
-    content: PropType<string | (() => import("vue").VNodeChild)>;
-    action: PropType<() => import("vue").VNodeChild>;
+    content: PropType<string | (() => VNodeChild)>;
+    action: PropType<() => VNodeChild>;
     showIcon: {
         readonly type: BooleanConstructor;
         readonly default: true;

package/lib/modal/src/BodyWrapper.js

@@ -28,12 +28,9 @@ exports.default = (0, vue_1.defineComponent)({
         }, autoFocus: {
             type: Boolean,
             default: true
-        }, blockScroll: Boolean }, presetProps_1.presetProps), { 
+        }, blockScroll: Boolean }, presetProps_1.presetProps), { renderMask: Function, 
         // events
-        onClickoutside: {
-            type: Function,
-            required: true
-        }, onBeforeLeave: {
+        onClickoutside: Function, onBeforeLeave: {
             type: Function,
             required: true
         }, onAfterLeave: {
@@ -124,9 +121,6 @@ exports.default = (0, vue_1.defineComponent)({
         function handlePositiveClick() {
             props.onPositiveClick();
         }
-        function handleClickOutside(e) {
-            props.onClickoutside(e);
-        }
         const childNodeRef = (0, vue_1.ref)(null);
         (0, vue_1.watch)(childNodeRef, (node) => {
             if (node) {
@@ -150,7 +144,6 @@ exports.default = (0, vue_1.defineComponent)({
             scrollbarRef,
             displayed: displayedRef,
             childNodeRef,
-            handleClickOutside,
             handlePositiveClick,
             handleNegativeClick,
             handleCloseClick,
@@ -160,7 +153,7 @@ exports.default = (0, vue_1.defineComponent)({
         };
     },
     render() {
-        const { $slots, $attrs, handleEnter, handleAfterLeave, handleBeforeLeave, handleClickOutside, preset, mergedClsPrefix } = this;
+        const { $slots, $attrs, handleEnter, handleAfterLeave, handleBeforeLeave, preset, mergedClsPrefix } = this;
         let childNode = null;
         if (!preset) {
             childNode = (0, _utils_1.getFirstSlotVNode)($slots);
@@ -176,29 +169,41 @@ exports.default = (0, vue_1.defineComponent)({
         return this.displayDirective === 'show' || this.displayed || this.show
             ? (0, vue_1.withDirectives)((0, vue_1.h)("div", { role: "none", class: `${mergedClsPrefix}-modal-body-wrapper` },
                 (0, vue_1.h)(_internal_1.NScrollbar, { ref: "scrollbarRef", theme: this.mergedTheme.peers.Scrollbar, themeOverrides: this.mergedTheme.peerOverrides.Scrollbar, contentClass: `${mergedClsPrefix}-modal-scroll-content` }, {
-                    default: () => ((0, vue_1.h)(vueuc_1.VFocusTrap, { disabled: !this.trapFocus, active: this.show, onEsc: this.onEsc, autoFocus: this.autoFocus }, {
-                        default: () => {
-                            var _a;
-                            return ((0, vue_1.h)(vue_1.Transition, { name: "fade-in-scale-up-transition", appear: (_a = this.appear) !== null && _a !== void 0 ? _a : this.isMounted, onEnter: handleEnter, onAfterEnter: this.onAfterEnter, onAfterLeave: handleAfterLeave, onBeforeLeave: handleBeforeLeave }, {
-                                default: () => (0, vue_1.withDirectives)((this.preset === 'confirm' ||
-                                    this.preset === 'dialog' ? ((0, vue_1.h)(Dialog_1.NDialog, Object.assign({}, this.$attrs, { class: [
-                                        `${mergedClsPrefix}-modal`,
-                                        this.$attrs.class
-                                    ], ref: "bodyRef", theme: this.mergedTheme.peers.Dialog, themeOverrides: this.mergedTheme.peerOverrides.Dialog }, (0, _utils_1.keep)(this.$props, dialogProps_1.dialogPropKeys), { "aria-modal": "true" }), $slots)) : this.preset === 'card' ? ((0, vue_1.h)(card_1.NCard, Object.assign({}, this.$attrs, { ref: "bodyRef", class: [
-                                        `${mergedClsPrefix}-modal`,
-                                        this.$attrs.class
-                                    ], theme: this.mergedTheme.peers.Card, themeOverrides: this.mergedTheme.peerOverrides.Card }, (0, _utils_1.keep)(this.$props, Card_1.cardBasePropKeys), { "aria-modal": "true", role: "dialog" }), $slots)) : ((this.childNodeRef = childNode))), [
-                                    [vue_1.vShow, this.show],
-                                    [
-                                        vdirs_1.clickoutside,
-                                        handleClickOutside,
-                                        undefined,
-                                        { capture: true }
-                                    ]
-                                ])
-                            }));
-                        }
-                    }))
+                    default: () => {
+                        var _a;
+                        return [
+                            (_a = this.renderMask) === null || _a === void 0 ? void 0 : _a.call(this),
+                            (0, vue_1.h)(vueuc_1.VFocusTrap, { disabled: !this.trapFocus, active: this.show, onEsc: this.onEsc, autoFocus: this.autoFocus }, {
+                                default: () => {
+                                    var _a;
+                                    return ((0, vue_1.h)(vue_1.Transition, { name: "fade-in-scale-up-transition", appear: (_a = this.appear) !== null && _a !== void 0 ? _a : this.isMounted, onEnter: handleEnter, onAfterEnter: this.onAfterEnter, onAfterLeave: handleAfterLeave, onBeforeLeave: handleBeforeLeave }, {
+                                        default: () => {
+                                            const dirs = [
+                                                [vue_1.vShow, this.show]
+                                            ];
+                                            const { onClickoutside } = this;
+                                            if (onClickoutside) {
+                                                dirs.push([
+                                                    vdirs_1.clickoutside,
+                                                    this.onClickoutside,
+                                                    undefined,
+                                                    { capture: true }
+                                                ]);
+                                            }
+                                            return (0, vue_1.withDirectives)((this.preset === 'confirm' ||
+                                                this.preset === 'dialog' ? ((0, vue_1.h)(Dialog_1.NDialog, Object.assign({}, this.$attrs, { class: [
+                                                    `${mergedClsPrefix}-modal`,
+                                                    this.$attrs.class
+                                                ], ref: "bodyRef", theme: this.mergedTheme.peers.Dialog, themeOverrides: this.mergedTheme.peerOverrides.Dialog }, (0, _utils_1.keep)(this.$props, dialogProps_1.dialogPropKeys), { "aria-modal": "true" }), $slots)) : this.preset === 'card' ? ((0, vue_1.h)(card_1.NCard, Object.assign({}, this.$attrs, { ref: "bodyRef", class: [
+                                                    `${mergedClsPrefix}-modal`,
+                                                    this.$attrs.class
+                                                ], theme: this.mergedTheme.peers.Card, themeOverrides: this.mergedTheme.peerOverrides.Card }, (0, _utils_1.keep)(this.$props, Card_1.cardBasePropKeys), { "aria-modal": "true", role: "dialog" }), $slots)) : ((this.childNodeRef = childNode))), dirs);
+                                        }
+                                    }));
+                                }
+                            })
+                        ];
+                    }
                 })), [
                 [
                     vue_1.vShow,

package/lib/modal/src/Modal.js

@@ -217,19 +217,24 @@ exports.default = (0, vue_1.defineComponent)({
         const { mergedClsPrefix } = this;
         return ((0, vue_1.h)(vueuc_1.VLazyTeleport, { to: this.to, show: this.show }, {
             default: () => {
-                var _a, _b;
+                var _a;
                 (_a = this.onRender) === null || _a === void 0 ? void 0 : _a.call(this);
+                const { unstableShowMask } = this;
                 return (0, vue_1.withDirectives)((0, vue_1.h)("div", { role: "none", ref: "containerRef", class: [
                         `${mergedClsPrefix}-modal-container`,
                         this.themeClass,
                         this.namespace
                     ], style: this.cssVars },
-                    this.unstableShowMask ? ((0, vue_1.h)(vue_1.Transition, { name: "fade-in-transition", key: "mask", appear: (_b = this.internalAppear) !== null && _b !== void 0 ? _b : this.isMounted }, {
-                        default: () => {
-                            return this.show ? ((0, vue_1.h)("div", { "aria-hidden": true, ref: "containerRef", class: `${mergedClsPrefix}-modal-mask` })) : null;
-                        }
-                    })) : null,
-                    (0, vue_1.h)(BodyWrapper_1.default, Object.assign({ style: this.overlayStyle }, this.$attrs, { ref: "bodyWrapper", displayDirective: this.displayDirective, show: this.show, preset: this.preset, autoFocus: this.autoFocus, trapFocus: this.trapFocus, blockScroll: this.blockScroll }, this.presetProps, { onEsc: this.handleEsc, onClose: this.handleCloseClick, onNegativeClick: this.handleNegativeClick, onPositiveClick: this.handlePositiveClick, onBeforeLeave: this.handleBeforeLeave, onAfterEnter: this.onAfterEnter, onAfterLeave: this.handleAfterLeave, onClickoutside: this.handleClickoutside }), this.$slots)), [
+                    (0, vue_1.h)(BodyWrapper_1.default, Object.assign({ style: this.overlayStyle }, this.$attrs, { ref: "bodyWrapper", displayDirective: this.displayDirective, show: this.show, preset: this.preset, autoFocus: this.autoFocus, trapFocus: this.trapFocus, blockScroll: this.blockScroll }, this.presetProps, { onEsc: this.handleEsc, onClose: this.handleCloseClick, onNegativeClick: this.handleNegativeClick, onPositiveClick: this.handlePositiveClick, onBeforeLeave: this.handleBeforeLeave, onAfterEnter: this.onAfterEnter, onAfterLeave: this.handleAfterLeave, onClickoutside: unstableShowMask ? undefined : this.handleClickoutside, renderMask: unstableShowMask
+                            ? () => {
+                                var _a;
+                                return ((0, vue_1.h)(vue_1.Transition, { name: "fade-in-transition", key: "mask", appear: (_a = this.internalAppear) !== null && _a !== void 0 ? _a : this.isMounted }, {
+                                    default: () => {
+                                        return this.show ? ((0, vue_1.h)("div", { "aria-hidden": true, ref: "containerRef", class: `${mergedClsPrefix}-modal-mask`, onClick: this.handleClickoutside })) : null;
+                                    }
+                                }));
+                            }
+                            : undefined }), this.$slots)), [
                     [
                         vdirs_1.zindexable,
                         {

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

@@ -46,6 +46,7 @@ exports.default = (0, cssr_1.c)([(0, cssr_1.cB)('modal-container', `
  display: flex;
  position: relative;
  `)]), (0, cssr_1.cB)('modal', `
+ position: relative;
  align-self: center;
  color: var(--n-text-color);
  margin: auto;

package/lib/notification/src/Notification.d.ts

@@ -72,6 +72,9 @@ export declare const Notification: import("vue").DefineComponent<{
         '--n-padding-right': string;
         '--n-padding-top': string;
         '--n-padding-bottom': string;
+        '--n-title-font-size': string;
+        '--n-meta-font-size': string;
+        '--n-description-font-size': string;
     }> | undefined;
     themeClass: import("vue").Ref<string> | undefined;
     onRender: (() => void) | undefined;

package/lib/notification/src/Notification.js

@@ -46,7 +46,7 @@ exports.Notification = (0, vue_1.defineComponent)({
         const { inlineThemeDisabled } = (0, _mixins_1.useConfig)();
         const cssVarsRef = (0, vue_1.computed)(() => {
             const { type } = props;
-            const { self: { color, textColor, closeIconColor, closeIconColorHover, closeIconColorPressed, headerTextColor, descriptionTextColor, actionTextColor, borderRadius, headerFontWeight, boxShadow, lineHeight, fontSize, closeMargin, closeSize, width, padding, closeIconSize, closeBorderRadius, closeColorHover, closeColorPressed, [(0, _utils_1.createKey)('iconColor', type)]: iconColor }, common: { cubicBezierEaseOut, cubicBezierEaseIn, cubicBezierEaseInOut } } = mergedThemeRef.value;
+            const { self: { color, textColor, closeIconColor, closeIconColorHover, closeIconColorPressed, headerTextColor, descriptionTextColor, actionTextColor, borderRadius, headerFontWeight, boxShadow, lineHeight, fontSize, closeMargin, closeSize, width, padding, closeIconSize, closeBorderRadius, closeColorHover, closeColorPressed, titleFontSize, metaFontSize, descriptionFontSize, [(0, _utils_1.createKey)('iconColor', type)]: iconColor }, common: { cubicBezierEaseOut, cubicBezierEaseIn, cubicBezierEaseInOut } } = mergedThemeRef.value;
             const { left, right, top, bottom } = (0, seemly_1.getPadding)(padding);
             return {
                 '--n-color': color,
@@ -76,7 +76,10 @@ exports.Notification = (0, vue_1.defineComponent)({
                 '--n-padding-left': left,
                 '--n-padding-right': right,
                 '--n-padding-top': top,
-                '--n-padding-bottom': bottom
+                '--n-padding-bottom': bottom,
+                '--n-title-font-size': titleFontSize,
+                '--n-meta-font-size': metaFontSize,
+                '--n-description-font-size': descriptionFontSize
             };
         });
         const themeClassHandle = inlineThemeDisabled

package/lib/notification/src/NotificationContainer.d.ts

@@ -144,6 +144,9 @@ export declare const NotificationContainer: import("vue").DefineComponent<{
             closeIconSize: string;
             width: string;
             padding: string;
+            titleFontSize: string;
+            metaFontSize: string;
+            descriptionFontSize: string;
         };
         peers: {
             Scrollbar: import("../../_mixins").Theme<"Scrollbar", {

package/lib/notification/src/NotificationProvider.d.ts

@@ -75,6 +75,9 @@ declare const notificationProviderProps: {
         closeIconSize: string;
         width: string;
         padding: string;
+        titleFontSize: string;
+        metaFontSize: string;
+        descriptionFontSize: string;
     }, {
         Scrollbar: import("../../_mixins").Theme<"Scrollbar", {
             color: string;
@@ -108,6 +111,9 @@ declare const notificationProviderProps: {
         closeIconSize: string;
         width: string;
         padding: string;
+        titleFontSize: string;
+        metaFontSize: string;
+        descriptionFontSize: string;
     }, {
         Scrollbar: import("../../_mixins").Theme<"Scrollbar", {
             color: string;
@@ -141,6 +147,9 @@ declare const notificationProviderProps: {
         closeIconSize: string;
         width: string;
         padding: string;
+        titleFontSize: string;
+        metaFontSize: string;
+        descriptionFontSize: string;
     }, {
         Scrollbar: import("../../_mixins").Theme<"Scrollbar", {
             color: string;
@@ -188,6 +197,9 @@ declare const _default: import("vue").DefineComponent<{
         closeIconSize: string;
         width: string;
         padding: string;
+        titleFontSize: string;
+        metaFontSize: string;
+        descriptionFontSize: string;
     }, {
         Scrollbar: import("../../_mixins").Theme<"Scrollbar", {
             color: string;
@@ -221,6 +233,9 @@ declare const _default: import("vue").DefineComponent<{
         closeIconSize: string;
         width: string;
         padding: string;
+        titleFontSize: string;
+        metaFontSize: string;
+        descriptionFontSize: string;
     }, {
         Scrollbar: import("../../_mixins").Theme<"Scrollbar", {
             color: string;
@@ -254,6 +269,9 @@ declare const _default: import("vue").DefineComponent<{
         closeIconSize: string;
         width: string;
         padding: string;
+        titleFontSize: string;
+        metaFontSize: string;
+        descriptionFontSize: string;
     }, {
         Scrollbar: import("../../_mixins").Theme<"Scrollbar", {
             color: string;
@@ -333,6 +351,9 @@ declare const _default: import("vue").DefineComponent<{
         closeIconSize: string;
         width: string;
         padding: string;
+        titleFontSize: string;
+        metaFontSize: string;
+        descriptionFontSize: string;
     }, {
         Scrollbar: import("../../_mixins").Theme<"Scrollbar", {
             color: string;
@@ -366,6 +387,9 @@ declare const _default: import("vue").DefineComponent<{
         closeIconSize: string;
         width: string;
         padding: string;
+        titleFontSize: string;
+        metaFontSize: string;
+        descriptionFontSize: string;
     }, {
         Scrollbar: import("../../_mixins").Theme<"Scrollbar", {
             color: string;
@@ -399,6 +423,9 @@ declare const _default: import("vue").DefineComponent<{
         closeIconSize: string;
         width: string;
         padding: string;
+        titleFontSize: string;
+        metaFontSize: string;
+        descriptionFontSize: string;
     }, {
         Scrollbar: import("../../_mixins").Theme<"Scrollbar", {
             color: string;

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

@@ -11,6 +11,9 @@ const cssr_1 = require("../../../_utils/cssr"); // vars:
 // --n-action-text-color
 // --n-title-text-color
 // --n-title-font-weight
+// --n-title-font-size
+// --n-meta-font-size
+// --n-description-font-size
 // --n-bezier
 // --n-bezier-ease-out
 // --n-bezier-ease-in
@@ -192,7 +195,7 @@ exports.default = (0, cssr_1.c)([(0, cssr_1.cB)('notification-container', `
  justify-content: space-between;
  margin-top: 12px;
  `, [(0, cssr_1.cE)('meta', `
- font-size: 12px;
+ font-size: var(--n-meta-font-size);
  transition: color .3s var(--n-bezier-ease-out);
  color: var(--n-description-text-color);
  `), (0, cssr_1.cE)('action', `
@@ -201,12 +204,12 @@ exports.default = (0, cssr_1.c)([(0, cssr_1.cB)('notification-container', `
  color: var(--n-action-text-color);
  `)]), (0, cssr_1.cE)('header', `
  font-weight: var(--n-title-font-weight);
- font-size: 16px;
+ font-size: var(--n-title-font-size);
  transition: color .3s var(--n-bezier-ease-out);
  color: var(--n-title-text-color);
  `), (0, cssr_1.cE)('description', `
  margin-top: 8px;
- font-size: 12px;
+ font-size: var(--n-description-font-size);
  transition: color .3s var(--n-bezier-ease-out);
  color: var(--n-description-text-color);
  `), (0, cssr_1.cE)('content', `

package/lib/notification/styles/_common.d.ts

@@ -4,5 +4,8 @@ declare const _default: {
     closeIconSize: string;
     width: string;
     padding: string;
+    titleFontSize: string;
+    metaFontSize: string;
+    descriptionFontSize: string;
 };
 export default _default;

package/lib/notification/styles/_common.js

@@ -5,5 +5,8 @@ exports.default = {
     closeSize: '20px',
     closeIconSize: '16px',
     width: '365px',
-    padding: '16px'
+    padding: '16px',
+    titleFontSize: '16px',
+    metaFontSize: '12px',
+    descriptionFontSize: '12px'
 };

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

@@ -26,6 +26,9 @@ export declare const self: (vars: ThemeCommonVars) => {
     closeIconSize: string;
     width: string;
     padding: string;
+    titleFontSize: string;
+    metaFontSize: string;
+    descriptionFontSize: string;
 };
 export declare type NotificationThemeVars = ReturnType<typeof self>;
 declare const notificationLight: import("../../_mixins").Theme<"Notification", {
@@ -55,6 +58,9 @@ declare const notificationLight: import("../../_mixins").Theme<"Notification", {
     closeIconSize: string;
     width: string;
     padding: string;
+    titleFontSize: string;
+    metaFontSize: string;
+    descriptionFontSize: string;
 }, {
     Scrollbar: import("../../_mixins").Theme<"Scrollbar", {
         color: string;

package/lib/select/index.d.ts

@@ -1,5 +1,5 @@
 export { default as NSelect } from './src/Select';
 export type { SelectProps } from './src/Select';
-export type { SelectGroupOption, SelectOption, SelectInst } from './src/interface';
+export type { SelectGroupOption, SelectOption, SelectInst, SelectFilter } from './src/interface';
 export type { RenderLabelImpl as SelectRenderLabel, RenderOptionImpl as SelectRenderOption } from '../_internal/select-menu/src/interface';
 export type { RenderTag as SelectRenderTag } from '../_internal/selection/src/interface';