naive-ui 2.25.2 → 2.25.5

package/es/tabs/src/styles/index.cssr.js

@@ -1,39 +1,39 @@
 import { c, cM, cB, cE, cNotM } from '../../../_utils/cssr'; // vars:
-// --bezier
-// --close-color
-// --close-color-hover
-// --close-color-pressed
-// --bar-color
-// --tab-font-size
-// --tab-text-color
-// --tab-text-color-active
-// --tab-text-color-disabled
-// --tab-text-color-hover
-// --pane-text-color
-// --tab-border-color
-// --tab-border-radius
-// --tab-color
-// --tab-font-weight
-// --tab-font-weight-active
-// --tab-gap
-// --tab-padding
-// --pane-padding
-// --color-segment
-// --font-weight-strong
-// --tab-color-segment
+// --n-bezier
+// --n-close-color
+// --n-close-color-hover
+// --n-close-color-pressed
+// --n-bar-color
+// --n-tab-font-size
+// --n-tab-text-color
+// --n-tab-text-color-active
+// --n-tab-text-color-disabled
+// --n-tab-text-color-hover
+// --n-pane-text-color
+// --n-tab-border-color
+// --n-tab-border-radius
+// --n-tab-color
+// --n-tab-font-weight
+// --n-tab-font-weight-active
+// --n-tab-gap
+// --n-tab-padding
+// --n-pane-padding
+// --n-color-segment
+// --n-font-weight-strong
+// --n-tab-color-segment
 
 export default cB('tabs', `
  box-sizing: border-box;
  width: 100%;
  transition:
- background-color .3s var(--bezier),
- border-color .3s var(--bezier);
+ background-color .3s var(--n-bezier),
+ border-color .3s var(--n-bezier);
 `, [cB('tabs-rail', `
  padding: 3px;
- border-radius: var(--tab-border-radius);
+ border-radius: var(--n-tab-border-radius);
  width: 100%;
- background-color: var(--color-segment);
- transition: background-color .3s var(--bezier);
+ background-color: var(--n-color-segment);
+ transition: background-color .3s var(--n-bezier);
  display: flex;
  align-items: center;
  `, [cB('tabs-tab-wrapper', `
@@ -44,18 +44,18 @@ export default cB('tabs', `
  justify-content: center;
  `, [cB('tabs-tab', `
  overflow: hidden;
- border-radius: var(--tab-border-radius);
+ border-radius: var(--n-tab-border-radius);
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  `, [cM('active', `
- font-weight: var(--font-weight-strong);
- color: var(--tab-text-color-active);
- background-color: var(--tab-color-segment);
+ font-weight: var(--n-font-weight-strong);
+ color: var(--n-tab-text-color-active);
+ background-color: var(--n-tab-color-segment);
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .08);
  `), c('&:hover', `
- color: var(--tab-text-color-hover);
+ color: var(--n-tab-text-color-hover);
  `)])])]), cM('flex', [cB('tabs-nav', {
   width: '100%'
 }, [cB('tabs-wrapper', {
@@ -66,7 +66,7 @@ export default cB('tabs', `
  box-sizing: border-box;
  line-height: 1.5;
  display: flex;
- transition: border-color .3s var(--bezier);
+ transition: border-color .3s var(--n-bezier);
  `, [cE('prefix, suffix', `
  display: flex;
  align-items: center;
@@ -79,7 +79,7 @@ export default cB('tabs', `
  `)]), cM('shadow-after', [c('&::after', `
  box-shadow: inset -10px 0 8px -8px rgba(0, 0, 0, .12);
  `)]), c('&::before, &::after', `
- transition: box-shadow .3s var(--bezier);
+ transition: box-shadow .3s var(--n-bezier);
  pointer-events: none;
  content: "";
  position: absolute;
@@ -94,6 +94,8 @@ export default cB('tabs', `
  `)]), cB('tabs-nav-scroll-content', `
  display: flex;
  position: relative;
+ min-width: 100%;
+ width: fit-content;
  `), cB('tabs-wrapper', `
  display: inline-flex;
  flex-wrap: nowrap;
@@ -109,21 +111,21 @@ export default cB('tabs', `
  flex-wrap: nowrap;
  display: inline-flex;
  align-items: center;
- color: var(--tab-text-color);
- font-size: var(--tab-font-size);
+ color: var(--n-tab-text-color);
+ font-size: var(--n-tab-font-size);
  background-clip: padding-box;
- padding: var(--tab-padding);
+ padding: var(--n-tab-padding);
  transition:
- box-shadow .3s var(--bezier),
- color .3s var(--bezier),
- background-color .3s var(--bezier),
- border-color .3s var(--bezier);
+ box-shadow .3s var(--n-bezier),
+ color .3s var(--n-bezier),
+ background-color .3s var(--n-bezier),
+ border-color .3s var(--n-bezier);
  `, [cM('disabled', {
   cursor: 'not-allowed'
 }), cE('close', `
  margin-left: 8px;
  font-size: 14px;
- transition: color .3s var(--bezier);
+ transition: color .3s var(--n-bezier);
  `), cE('label', `
  display: flex;
  align-items: center;
@@ -132,77 +134,77 @@ export default cB('tabs', `
  bottom: 0;
  height: 2px;
  border-radius: 1px;
- background-color: var(--bar-color);
+ background-color: var(--n-bar-color);
  transition:
- left .2s var(--bezier),
- max-width .2s var(--bezier),
- background-color .3s var(--bezier);
+ left .2s var(--n-bezier),
+ max-width .2s var(--n-bezier),
+ background-color .3s var(--n-bezier);
  `, [cM('transition-disabled', `
  transition: none;
  `), cM('disabled', `
- background-color: var(--tab-text-color-disabled)
+ background-color: var(--n-tab-text-color-disabled)
  `)]), cB('tab-pane', `
- color: var(--pane-text-color);
+ color: var(--n-pane-text-color);
  width: 100%;
- padding: var(--pane-padding);
+ padding: var(--n-pane-padding);
  transition:
- color .3s var(--bezier),
- background-color .3s var(--bezier);
+ color .3s var(--n-bezier),
+ background-color .3s var(--n-bezier);
  `), cB('tabs-tab-pad', `
- width: var(--tab-gap);
+ width: var(--n-tab-gap);
  flex-grow: 0;
  flex-shrink: 0;
  `), cM('line-type, bar-type', [cB('tabs-tab', `
- font-weight: var(--tab-font-weight-active);
+ font-weight: var(--n-tab-font-weight-active);
  box-sizing: border-box;
  vertical-align: bottom;
  `, [c('&:hover', {
-  color: 'var(--tab-text-color-hover)'
+  color: 'var(--n-tab-text-color-hover)'
 }), cM('active', {
-  color: 'var(--tab-text-color-active)'
+  color: 'var(--n-tab-text-color-active)'
 }), cM('disabled', {
-  color: 'var(--tab-text-color-disabled)'
+  color: 'var(--n-tab-text-color-disabled)'
 })])]), cB('tabs-nav', [cM('line-type', [cE('prefix, suffix', `
- transition: border-color .3s var(--bezier);
- border-bottom: 1px solid var(--tab-border-color);
+ transition: border-color .3s var(--n-bezier);
+ border-bottom: 1px solid var(--n-tab-border-color);
  `), cB('tabs-nav-scroll-content', `
- transition: border-color .3s var(--bezier);
- border-bottom: 1px solid var(--tab-border-color);
+ transition: border-color .3s var(--n-bezier);
+ border-bottom: 1px solid var(--n-tab-border-color);
  `), cB('tabs-bar', `
  border-radius: 0;
  bottom: -1px;
  `)]), cM('card-type', [cE('prefix, suffix', `
- transition: border-color .3s var(--bezier);
- border-bottom: 1px solid var(--tab-border-color);
+ transition: border-color .3s var(--n-bezier);
+ border-bottom: 1px solid var(--n-tab-border-color);
  `), cB('tabs-pad', `
  flex-grow: 1;
- transition: border-color .3s var(--bezier);
- border-bottom: 1px solid var(--tab-border-color);
+ transition: border-color .3s var(--n-bezier);
+ border-bottom: 1px solid var(--n-tab-border-color);
  `), cB('tabs-tab-pad', `
- transition: border-color .3s var(--bezier);
- border-bottom: 1px solid var(--tab-border-color);
+ transition: border-color .3s var(--n-bezier);
+ border-bottom: 1px solid var(--n-tab-border-color);
  `), cB('tabs-tab', `
- font-weight: var(--tab-font-weight);
- border: 1px solid var(--tab-border-color);
- border-top-left-radius: var(--tab-border-radius);
- border-top-right-radius: var(--tab-border-radius);
- background-color: var(--tab-color);
+ font-weight: var(--n-tab-font-weight);
+ border: 1px solid var(--n-tab-border-color);
+ border-top-left-radius: var(--n-tab-border-radius);
+ border-top-right-radius: var(--n-tab-border-radius);
+ background-color: var(--n-tab-color);
  box-sizing: border-box;
  position: relative;
  vertical-align: bottom;
  display: flex;
  justify-content: space-between;
- font-size: var(--tab-font-size);
- color: var(--tab-text-color);
+ font-size: var(--n-tab-font-size);
+ color: var(--n-tab-text-color);
  `, [cM('addable', `
  padding-left: 8px;
  padding-right: 8px;
  font-size: 16px;
  `, [cNotM('disabled', [c('&:hover', `
- color: var(--tab-text-color-hover);
+ color: var(--n-tab-text-color-hover);
  `)])]), cM('closable', 'padding-right: 6px;'), cM('active', `
  border-bottom: 1px solid #0000;
  background-color: #0000;
- font-weight: var(--tab-font-weight-active);
- color: var(--tab-text-color-active);
- `), cM('disabled', 'color: var(--tab-text-color-disabled);')]), cB('tabs-scroll-padding', 'border-bottom: 1px solid var(--tab-border-color);')])])]);
+ font-weight: var(--n-tab-font-weight-active);
+ color: var(--n-tab-text-color-active);
+ `), cM('disabled', 'color: var(--n-tab-text-color-disabled);')]), cB('tabs-scroll-padding', 'border-bottom: 1px solid var(--n-tab-border-color);')])])]);

package/es/tag/src/Tag.d.ts

@@ -451,8 +451,6 @@ declare const _default: import("vue").DefineComponent<{
         closeMarginRtl: string;
     }, any>>>;
 }, {
-    themeClass?: Ref<string> | undefined;
-    onRender?: (() => void) | undefined;
     rtlEnabled: Ref<import("../../config-provider/src/internal-interface").RtlItem | undefined> | undefined;
     mergedClsPrefix: import("vue").ComputedRef<string>;
     contentRef: Ref<HTMLElement | null>;
@@ -488,6 +486,8 @@ declare const _default: import("vue").DefineComponent<{
         '--n-text-color-hover-checkable': string;
         '--n-text-color-pressed-checkable': string;
     }> | undefined;
+    themeClass: Ref<string> | undefined;
+    onRender: (() => void) | undefined;
     setTextContent: (textContent: string) => 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: {

package/es/tag/src/Tag.js

@@ -1,5 +1,5 @@
 import { h, defineComponent, computed, ref, provide, toRef } from 'vue';
-import { useConfig, useThemeClass, useTheme, emptyThemeClassHandle } from '../../_mixins';
+import { useConfig, useThemeClass, useTheme } from '../../_mixins';
 import { NBaseClose } from '../../_internal';
 import { warn, createKey, call, createInjectionKey, color2Class, resolveWrappedSlot } from '../../_utils';
 import { tagLight } from '../styles';
@@ -29,7 +29,7 @@ export default defineComponent({
     props: tagProps,
     setup(props) {
         const contentRef = ref(null);
-        const { mergedBorderedRef, mergedClsPrefixRef, NConfigProvider } = useConfig(props);
+        const { mergedBorderedRef, mergedClsPrefixRef, inlineThemeDisabled, mergedRtlRef } = useConfig(props);
         const themeRef = useTheme('Tag', '-tag', style, tagLight, props, mergedClsPrefixRef);
         provide(tagInjectionKey, {
             roundRef: toRef(props, 'round')
@@ -65,8 +65,7 @@ export default defineComponent({
                     value.textContent = textContent;
             }
         };
-        const rtlEnabledRef = useRtl('Tag', NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.mergedRtlRef, mergedClsPrefixRef);
-        const disableInlineTheme = NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.disableInlineTheme;
+        const rtlEnabledRef = useRtl('Tag', mergedRtlRef, mergedClsPrefixRef);
         const cssVarsRef = computed(() => {
             const { type, size, color: { color, textColor } = {} } = props;
             const { common: { cubicBezierEaseInOut }, self: { padding, closeMargin, closeMarginRtl, borderRadius, opacityDisabled, textColorCheckable, textColorHoverCheckable, textColorPressedCheckable, textColorChecked, colorCheckable, colorHoverCheckable, colorPressedCheckable, colorChecked, colorCheckedHover, colorCheckedPressed, [createKey('closeSize', size)]: closeSize, [createKey('fontSize', size)]: fontSize, [createKey('height', size)]: height, [createKey('color', type)]: typedColor, [createKey('textColor', type)]: typeTextColor, [createKey('border', type)]: border, [createKey('closeColor', type)]: closeColor, [createKey('closeColorHover', type)]: closeColorHover, [createKey('closeColorPressed', type)]: closeColorPressed } } = themeRef.value;
@@ -100,7 +99,7 @@ export default defineComponent({
                 '--n-text-color-pressed-checkable': textColorPressedCheckable
             };
         });
-        const themeClassHandle = disableInlineTheme
+        const themeClassHandle = inlineThemeDisabled
             ? useThemeClass('tag', computed(() => {
                 let hash = '';
                 const { type, size, color: { color, textColor } = {} } = props;
@@ -114,9 +113,9 @@ export default defineComponent({
                 }
                 return hash;
             }), cssVarsRef, props)
-            : emptyThemeClassHandle;
-        return Object.assign(Object.assign(Object.assign({}, tagPublicMethods), { rtlEnabled: rtlEnabledRef, mergedClsPrefix: mergedClsPrefixRef, contentRef, mergedBordered: mergedBorderedRef, handleClick,
-            handleCloseClick, cssVars: disableInlineTheme ? undefined : cssVarsRef }), themeClassHandle);
+            : undefined;
+        return Object.assign(Object.assign({}, tagPublicMethods), { rtlEnabled: rtlEnabledRef, mergedClsPrefix: mergedClsPrefixRef, contentRef, mergedBordered: mergedBorderedRef, handleClick,
+            handleCloseClick, cssVars: inlineThemeDisabled ? undefined : cssVarsRef, themeClass: themeClassHandle === null || themeClassHandle === void 0 ? void 0 : themeClassHandle.themeClass, onRender: themeClassHandle === null || themeClassHandle === void 0 ? void 0 : themeClassHandle.onRender });
     },
     render() {
         var _a, _b;
@@ -133,9 +132,7 @@ export default defineComponent({
                     [`${mergedClsPrefix}-tag--round`]: this.round
                 }
             ], style: this.cssVars, onClick: this.handleClick, onMouseenter: this.onMouseenter, onMouseleave: this.onMouseleave },
-            resolveWrappedSlot($slots.avatar, (children) => [
-                h("div", { class: `${mergedClsPrefix}-tag__avatar` }, children)
-            ]),
+            resolveWrappedSlot($slots.avatar, (children) => children && (h("div", { class: `${mergedClsPrefix}-tag__avatar` }, children))),
             h("span", { class: `${mergedClsPrefix}-tag__content`, ref: "contentRef" }, (_b = (_a = this.$slots).default) === null || _b === void 0 ? void 0 : _b.call(_a)),
             !this.checkable && this.closable ? (h(NBaseClose, { clsPrefix: mergedClsPrefix, class: `${mergedClsPrefix}-tag__close`, disabled: this.disabled, onClick: this.handleCloseClick })) : null,
             !this.checkable && this.mergedBordered ? (h("div", { class: `${mergedClsPrefix}-tag__border`, style: { borderColor } })) : null));

package/es/theme-editor/src/ThemeEditor.js

@@ -1,13 +1,14 @@
-import { h, computed, defineComponent, ref, Fragment, toRaw, watch } from 'vue';
+import { h, computed, defineComponent, ref, Fragment, toRaw, watch, inject } from 'vue';
 import { cloneDeep, merge } from 'lodash-es';
 import { lightTheme } from '../../themes/light';
 import { NConfigProvider } from '../../config-provider';
+import { configProviderInjectionKey } from '../../config-provider/src/context';
 import { NPopover } from '../../popover';
 import { NScrollbar } from '../../_internal';
 import { NCollapse, NCollapseItem } from '../../collapse';
 import { NInput } from '../../input';
 import { NSpace } from '../../space';
-import { useConfig, useLocale } from '../../_mixins';
+import { useLocale } from '../../_mixins';
 import { NElement } from '../../element';
 import { NDivider } from '../../divider';
 import { NButton } from '../../button';
@@ -31,7 +32,7 @@ export default defineComponent({
     inheritAttrs: false,
     setup() {
         const fileInputRef = ref(null);
-        const { NConfigProvider } = useConfig();
+        const NConfigProvider = inject(configProviderInjectionKey, null);
         const theme = computed(() => {
             var _a, _b, _c, _d;
             const mergedTheme = (NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.mergedThemeRef.value) || lightTheme;

package/es/themes/dark.js

@@ -74,6 +74,7 @@ import { treeSelectDark } from '../tree-select/styles';
 import { typographyDark } from '../typography/styles';
 import { treeDark } from '../tree/styles';
 import { uploadDark } from '../upload/styles';
+import { watermarkDark } from '../watermark/styles';
 export const darkTheme = {
     name: 'dark',
     common: commonDark,
@@ -151,5 +152,6 @@ export const darkTheme = {
     Tree: treeDark,
     TreeSelect: treeSelectDark,
     Typography: typographyDark,
-    Upload: uploadDark
+    Upload: uploadDark,
+    Watermark: watermarkDark
 };

package/es/themes/light.js

@@ -76,6 +76,7 @@ import { typographyLight } from '../typography/styles';
 import { treeLight } from '../tree/styles';
 import { treeSelectLight } from '../tree-select/styles';
 import { uploadLight } from '../upload/styles';
+import { watermarkLight } from '../watermark/styles';
 export const lightTheme = {
     name: 'light',
     common: commonLight,
@@ -153,5 +154,6 @@ export const lightTheme = {
     Tree: treeLight,
     TreeSelect: treeSelectLight,
     Typography: typographyLight,
-    Upload: uploadLight
+    Upload: uploadLight,
+    Watermark: watermarkLight
 };

package/es/thing/src/Thing.js

@@ -1,5 +1,5 @@
 import { h, defineComponent, computed, Fragment } from 'vue';
-import { useConfig, useTheme } from '../../_mixins';
+import { useConfig, useTheme, useThemeClass } from '../../_mixins';
 import { thingLight } from '../styles';
 import style from './styles/index.cssr';
 const thingProps = Object.assign(Object.assign({}, useTheme.props), { title: String, titleExtra: String, description: String, content: String, contentIndented: {
@@ -10,7 +10,7 @@ export default defineComponent({
     name: 'Thing',
     props: thingProps,
     setup(props, { slots }) {
-        const { mergedClsPrefixRef } = useConfig(props);
+        const { mergedClsPrefixRef, inlineThemeDisabled } = useConfig(props);
         const themeRef = useTheme('Thing', '-thing', style, thingLight, props, mergedClsPrefixRef);
         const cssVarsRef = computed(() => {
             const { self: { titleTextColor, textColor, titleFontWeight, fontSize }, common: { cubicBezierEaseInOut } } = themeRef.value;
@@ -22,9 +22,16 @@ export default defineComponent({
                 '--n-title-text-color': titleTextColor
             };
         });
+        const themeClassHandle = inlineThemeDisabled
+            ? useThemeClass('thing', undefined, cssVarsRef, props)
+            : undefined;
         return () => {
+            var _a;
             const { value: mergedClsPrefix } = mergedClsPrefixRef;
-            return (h("div", { class: `${mergedClsPrefix}-thing`, style: cssVarsRef.value },
+            (_a = themeClassHandle === null || themeClassHandle === void 0 ? void 0 : themeClassHandle.onRender) === null || _a === void 0 ? void 0 : _a.call(themeClassHandle);
+            return (h("div", { class: [`${mergedClsPrefix}-thing`, themeClassHandle === null || themeClassHandle === void 0 ? void 0 : themeClassHandle.themeClass], style: inlineThemeDisabled
+                    ? undefined
+                    : cssVarsRef.value },
                 slots.avatar && props.contentIndented ? (h("div", { class: `${mergedClsPrefix}-thing-avatar` }, slots.avatar())) : null,
                 h("div", { class: `${mergedClsPrefix}-thing-main` },
                     !props.contentIndented &&

package/es/time-picker/src/TimePicker.d.ts

@@ -1885,6 +1885,7 @@ declare const _default: import("vue").DefineComponent<{
             containerScrollTop: number;
             syncUnifiedContainer: () => void;
             scrollTo: import("../../_internal/scrollbar/src/ScrollBar").ScrollTo;
+            scrollBy: import("../../_internal/scrollbar/src/ScrollBar").ScrollBy;
             sync: () => void;
             handleMouseEnterWrapper: () => void;
             handleMouseLeaveWrapper: () => void;
@@ -1895,6 +1896,7 @@ declare const _default: import("vue").DefineComponent<{
             containerScrollTop: number;
             syncUnifiedContainer: () => void;
             scrollTo: import("../../_internal/scrollbar/src/ScrollBar").ScrollTo;
+            scrollBy: import("../../_internal/scrollbar/src/ScrollBar").ScrollBy;
             sync: () => void;
             handleMouseEnterWrapper: () => void;
             handleMouseLeaveWrapper: () => void;
@@ -1905,6 +1907,7 @@ declare const _default: import("vue").DefineComponent<{
             containerScrollTop: number;
             syncUnifiedContainer: () => void;
             scrollTo: import("../../_internal/scrollbar/src/ScrollBar").ScrollTo;
+            scrollBy: import("../../_internal/scrollbar/src/ScrollBar").ScrollBy;
             sync: () => void;
             handleMouseEnterWrapper: () => void;
             handleMouseLeaveWrapper: () => void;
@@ -1915,6 +1918,7 @@ declare const _default: import("vue").DefineComponent<{
             containerScrollTop: number;
             syncUnifiedContainer: () => void;
             scrollTo: import("../../_internal/scrollbar/src/ScrollBar").ScrollTo;
+            scrollBy: import("../../_internal/scrollbar/src/ScrollBar").ScrollBy;
             sync: () => void;
             handleMouseEnterWrapper: () => void;
             handleMouseLeaveWrapper: () => void;

package/es/transfer/src/TransferList.d.ts

@@ -504,6 +504,7 @@ declare const _default: import("vue").DefineComponent<{
         containerScrollTop: number;
         syncUnifiedContainer: () => void;
         scrollTo: import("../../_internal/scrollbar/src/ScrollBar").ScrollTo;
+        scrollBy: import("../../_internal/scrollbar/src/ScrollBar").ScrollBy;
         sync: () => void;
         handleMouseEnterWrapper: () => void;
         handleMouseLeaveWrapper: () => void;

package/es/tree/src/Tree.d.ts

@@ -957,6 +957,7 @@ declare const _default: import("vue").DefineComponent<{
         containerScrollTop: number;
         syncUnifiedContainer: () => void;
         scrollTo: import("../../_internal/scrollbar/src/ScrollBar").ScrollTo;
+        scrollBy: import("../../_internal/scrollbar/src/ScrollBar").ScrollBy;
         sync: () => void;
         handleMouseEnterWrapper: () => void;
         handleMouseLeaveWrapper: () => void;

package/es/tree/src/Tree.js

@@ -178,16 +178,20 @@ export default defineComponent({
         const controlledSelectedKeysRef = toRef(props, 'selectedKeys');
         const mergedSelectedKeysRef = useMergedState(controlledSelectedKeysRef, uncontrolledSelectedKeysRef);
         const uncontrolledExpandedKeysRef = ref([]);
-        const initUncontrolledExpandedKeys = () => {
+        const initUncontrolledExpandedKeys = (keys) => {
             uncontrolledExpandedKeysRef.value = props.defaultExpandAll
                 ? dataTreeMateRef.value.getNonLeafKeys()
-                : props.defaultExpandedKeys;
+                : keys === undefined
+                    ? props.defaultExpandedKeys
+                    : keys;
         };
         if (watchProps === null || watchProps === void 0 ? void 0 : watchProps.includes('defaultExpandedKeys')) {
-            watchEffect(initUncontrolledExpandedKeys);
+            // if watching defaultExpandedKeys, we use access props.defaultExpandedKeys inside initiator
+            watchEffect(() => initUncontrolledExpandedKeys(undefined));
         }
         else {
-            initUncontrolledExpandedKeys();
+            // We by default watchEffect since if defaultExpandAll is true, we should remain tree expand if data changes
+            watchEffect(() => initUncontrolledExpandedKeys(props.defaultExpandedKeys));
         }
         const controlledExpandedKeysRef = toRef(props, 'expandedKeys');
         const mergedExpandedKeysRef = useMergedState(controlledExpandedKeysRef, uncontrolledExpandedKeysRef);

package/es/tree-select/src/TreeSelect.d.ts

@@ -50,6 +50,10 @@ declare const props: {
     readonly cascade: BooleanConstructor;
     readonly checkable: BooleanConstructor;
     readonly clearable: BooleanConstructor;
+    readonly clearFilterAfterSelect: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
     readonly consistentMenuWidth: {
         readonly type: BooleanConstructor;
         readonly default: true;
@@ -560,6 +564,10 @@ declare const _default: import("vue").DefineComponent<{
     readonly cascade: BooleanConstructor;
     readonly checkable: BooleanConstructor;
     readonly clearable: BooleanConstructor;
+    readonly clearFilterAfterSelect: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
     readonly consistentMenuWidth: {
         readonly type: BooleanConstructor;
         readonly default: true;
@@ -1443,6 +1451,10 @@ declare const _default: import("vue").DefineComponent<{
     readonly cascade: BooleanConstructor;
     readonly checkable: BooleanConstructor;
     readonly clearable: BooleanConstructor;
+    readonly clearFilterAfterSelect: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
     readonly consistentMenuWidth: {
         readonly type: BooleanConstructor;
         readonly default: true;
@@ -1921,6 +1933,7 @@ declare const _default: import("vue").DefineComponent<{
     defaultShow: boolean;
     filterable: boolean;
     clearable: boolean;
+    clearFilterAfterSelect: boolean;
     defaultValue: string | number | (string | number)[] | null;
     consistentMenuWidth: boolean;
     cascade: boolean;

package/es/tree-select/src/TreeSelect.js

@@ -17,7 +17,10 @@ import style from './styles/index.cssr';
 const props = Object.assign(Object.assign(Object.assign(Object.assign({}, useTheme.props), { bordered: {
         type: Boolean,
         default: true
-    }, cascade: Boolean, checkable: Boolean, clearable: Boolean, consistentMenuWidth: {
+    }, cascade: Boolean, checkable: Boolean, clearable: Boolean, clearFilterAfterSelect: {
+        type: Boolean,
+        default: true
+    }, consistentMenuWidth: {
         type: Boolean,
         default: true
     }, defaultShow: Boolean, defaultValue: {
@@ -317,7 +320,8 @@ export default defineComponent({
             }
             if (props.filterable) {
                 focusSelectionInput();
-                patternRef.value = '';
+                if (props.clearFilterAfterSelect)
+                    patternRef.value = '';
             }
         }
         function handleUpdateIndeterminateKeys(keys) {

package/es/typography/src/a.d.ts

@@ -404,7 +404,9 @@ declare const _default: import("vue").DefineComponent<{
     cssVars: import("vue").ComputedRef<{
         '--n-text-color': string;
         '--n-bezier': string;
-    }>;
+    }> | undefined;
+    themeClass: import("vue").Ref<string> | undefined;
+    onRender: (() => void) | undefined;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     readonly theme: import("vue").PropType<import("../../_mixins").Theme<"Typography", {
         aTextColor: string;

package/es/typography/src/a.js

@@ -1,5 +1,5 @@
 import { h, defineComponent, computed } from 'vue';
-import { useConfig, useTheme } from '../../_mixins';
+import { useConfig, useTheme, useThemeClass } from '../../_mixins';
 import { typographyLight } from '../styles';
 import style from './styles/a.cssr';
 const aProps = Object.assign({}, useTheme.props);
@@ -7,20 +7,28 @@ export default defineComponent({
     name: 'A',
     props: aProps,
     setup(props) {
-        const { mergedClsPrefixRef } = useConfig(props);
+        const { mergedClsPrefixRef, inlineThemeDisabled } = useConfig(props);
         const themeRef = useTheme('Typography', '-a', style, typographyLight, props, mergedClsPrefixRef);
+        const cssVarsRef = computed(() => {
+            const { common: { cubicBezierEaseInOut }, self: { aTextColor } } = themeRef.value;
+            return {
+                '--n-text-color': aTextColor,
+                '--n-bezier': cubicBezierEaseInOut
+            };
+        });
+        const themeClassHandle = inlineThemeDisabled
+            ? useThemeClass('a', undefined, cssVarsRef, props)
+            : undefined;
         return {
             mergedClsPrefix: mergedClsPrefixRef,
-            cssVars: computed(() => {
-                const { common: { cubicBezierEaseInOut }, self: { aTextColor } } = themeRef.value;
-                return {
-                    '--n-text-color': aTextColor,
-                    '--n-bezier': cubicBezierEaseInOut
-                };
-            })
+            cssVars: inlineThemeDisabled ? undefined : cssVarsRef,
+            themeClass: themeClassHandle === null || themeClassHandle === void 0 ? void 0 : themeClassHandle.themeClass,
+            onRender: themeClassHandle === null || themeClassHandle === void 0 ? void 0 : themeClassHandle.onRender
         };
     },
     render() {
-        return (h("a", { class: `${this.mergedClsPrefix}-a`, style: this.cssVars }, this.$slots));
+        var _a;
+        (_a = this.onRender) === null || _a === void 0 ? void 0 : _a.call(this);
+        return (h("a", { class: [`${this.mergedClsPrefix}-a`, this.themeClass], style: this.cssVars }, this.$slots));
     }
 });

package/es/typography/src/blockquote.d.ts

@@ -409,7 +409,9 @@ declare const _default: import("vue").DefineComponent<{
         '--n-line-height': string;
         '--n-prefix-color': string;
         '--n-text-color': string;
-    }>;
+    }> | undefined;
+    themeClass: import("vue").Ref<string> | undefined;
+    onRender: (() => void) | undefined;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     readonly alignText: BooleanConstructor;
     readonly theme: import("vue").PropType<import("../../_mixins").Theme<"Typography", {