naive-ui 2.21.5 → 2.22.0

package/lib/button/src/styles/button.cssr.js

@@ -15,50 +15,51 @@ const cssr_1 = require("../../../_utils/cssr");
 const fade_in_width_expand_cssr_1 = __importDefault(require("../../../_styles/transitions/fade-in-width-expand.cssr"));
 
 const icon_switch_cssr_1 = __importDefault(require("../../../_styles/transitions/icon-switch.cssr")); // vars:
-// --bezier
-// --ripple-duration
-// --opacity-disabled
-// --text-color
-// --text-color-hover
-// --text-color-pressed
-// --text-color-focus
-// --text-color-disabled
-// --color
-// --color-hover
-// --color-pressed
-// --color-focus
-// --color-disabled
-// --border
-// --border-hover
-// --border-pressed
-// --border-focus
-// --border-disabled
-// --ripple-color
-// --border-radius
-// --height
-// --width
-// --font-size
-// --padding
-// --icon-size
-// --icon-margin
-// --wave-opacity
-// --font-weight
+// --n-bezier
+// --n-bezier-ease-out
+// --n-ripple-duration
+// --n-opacity-disabled
+// --n-text-color
+// --n-text-color-hover
+// --n-text-color-pressed
+// --n-text-color-focus
+// --n-text-color-disabled
+// --n-color
+// --n-color-hover
+// --n-color-pressed
+// --n-color-focus
+// --n-color-disabled
+// --n-border
+// --n-border-hover
+// --n-border-pressed
+// --n-border-focus
+// --n-border-disabled
+// --n-ripple-color
+// --n-border-radius
+// --n-height
+// --n-width
+// --n-font-size
+// --n-padding
+// --n-icon-size
+// --n-icon-margin
+// --n-wave-opacity
+// --n-font-weight
 //
 // private-vars:
-// --border-color-xxx, used for custom color
+// --n-border-color-xxx, used for custom color
 
 
 exports.default = (0, cssr_1.c)([(0, cssr_1.cB)('button', `
- font-weight: var(--font-weight);
+ font-weight: var(--n-font-weight);
  line-height: 1;
  font-family: inherit;
- padding: var(--padding);
- height: var(--height);
- font-size: var(--font-size);
- border-radius: var(--border-radius);
- color: var(--text-color);
- background-color: var(--color);
- width: var(--width);
+ padding: var(--n-padding);
+ height: var(--n-height);
+ font-size: var(--n-font-size);
+ border-radius: var(--n-border-radius);
+ color: var(--n-text-color);
+ background-color: var(--n-color);
+ width: var(--n-width);
  white-space: nowrap;
  outline: none;
  position: relative;
@@ -74,56 +75,58 @@ exports.default = (0, cssr_1.c)([(0, cssr_1.cB)('button', `
  cursor: pointer;
  text-decoration: none;
  transition:
- color .3s var(--bezier),
- background-color .3s var(--bezier),
- opacity .3s var(--bezier),
- border-color .3s var(--bezier);
+ color .3s var(--n-bezier),
+ background-color .3s var(--n-bezier),
+ opacity .3s var(--n-bezier),
+ border-color .3s var(--n-bezier);
  `, [(0, cssr_1.cM)('color', [(0, cssr_1.cE)('border', {
-  borderColor: 'var(--border-color)'
+  borderColor: 'var(--n-border-color)'
 }), (0, cssr_1.cM)('disabled', [(0, cssr_1.cE)('border', {
-  borderColor: 'var(--border-color-disabled)'
+  borderColor: 'var(--n-border-color-disabled)'
 })]), (0, cssr_1.cNotM)('disabled', [(0, cssr_1.c)('&:focus', [(0, cssr_1.cE)('state-border', {
-  borderColor: 'var(--border-color-focus)'
+  borderColor: 'var(--n-border-color-focus)'
 })]), (0, cssr_1.c)('&:hover', [(0, cssr_1.cE)('state-border', {
-  borderColor: 'var(--border-color-hover)'
+  borderColor: 'var(--n-border-color-hover)'
 })]), (0, cssr_1.c)('&:active', [(0, cssr_1.cE)('state-border', {
-  borderColor: 'var(--border-color-pressed)'
+  borderColor: 'var(--n-border-color-pressed)'
 })]), (0, cssr_1.cM)('pressed', [(0, cssr_1.cE)('state-border', {
-  borderColor: 'var(--border-color-pressed)'
+  borderColor: 'var(--n-border-color-pressed)'
 })])])]), (0, cssr_1.cM)('disabled', {
-  backgroundColor: 'var(--color-disabled)',
-  color: 'var(--text-color-disabled)'
+  backgroundColor: 'var(--n-color-disabled)',
+  color: 'var(--n-text-color-disabled)'
 }, [(0, cssr_1.cE)('border', {
-  border: 'var(--border-disabled)'
+  border: 'var(--n-border-disabled)'
 })]), (0, cssr_1.cNotM)('disabled', [(0, cssr_1.c)('&:focus', {
-  backgroundColor: 'var(--color-focus)',
-  color: 'var(--text-color-focus)'
+  backgroundColor: 'var(--n-color-focus)',
+  color: 'var(--n-text-color-focus)'
 }, [(0, cssr_1.cE)('state-border', {
-  border: 'var(--border-focus)'
+  border: 'var(--n-border-focus)'
 })]), (0, cssr_1.c)('&:hover', {
-  backgroundColor: 'var(--color-hover)',
-  color: 'var(--text-color-hover)'
+  backgroundColor: 'var(--n-color-hover)',
+  color: 'var(--n-text-color-hover)'
 }, [(0, cssr_1.cE)('state-border', {
-  border: 'var(--border-hover)'
+  border: 'var(--n-border-hover)'
 })]), (0, cssr_1.c)('&:active', {
-  backgroundColor: 'var(--color-pressed)',
-  color: 'var(--text-color-pressed)'
+  backgroundColor: 'var(--n-color-pressed)',
+  color: 'var(--n-text-color-pressed)'
 }, [(0, cssr_1.cE)('state-border', {
-  border: 'var(--border-pressed)'
+  border: 'var(--n-border-pressed)'
 })]), (0, cssr_1.cM)('pressed', {
-  backgroundColor: 'var(--color-pressed)',
-  color: 'var(--text-color-pressed)'
+  backgroundColor: 'var(--n-color-pressed)',
+  color: 'var(--n-text-color-pressed)'
 }, [(0, cssr_1.cE)('state-border', {
-  border: 'var(--border-pressed)'
-})])]), (0, cssr_1.cB)('base-wave', `
+  border: 'var(--n-border-pressed)'
+})])]), (0, cssr_1.cM)('loading', {
+  'pointer-events': 'none'
+}), (0, cssr_1.cB)('base-wave', `
  pointer-events: none;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  animation-iteration-count: 1;
- animation-duration: var(--ripple-duration);
- animation-timing-function: var(--bezier-ease-out), var(--bezier-ease-out);
+ animation-duration: var(--n-ripple-duration);
+ animation-timing-function: var(--n-bezier-ease-out), var(--n-bezier-ease-out);
  `, [(0, cssr_1.cM)('active', {
   zIndex: 1,
   animationName: 'button-wave-spread, button-wave-opacity'
@@ -136,26 +139,26 @@ exports.default = (0, cssr_1.c)([(0, cssr_1.cB)('button', `
  right: 0;
  bottom: 0;
  border-radius: inherit;
- transition: border-color .3s var(--bezier);
+ transition: border-color .3s var(--n-bezier);
  pointer-events: none;
  `), (0, cssr_1.cE)('border', {
-  border: 'var(--border)'
+  border: 'var(--n-border)'
 }), (0, cssr_1.cE)('state-border', {
-  border: 'var(--border)',
+  border: 'var(--n-border)',
   borderColor: '#0000',
   zIndex: 1
 }), (0, cssr_1.cE)('icon', `
- margin: var(--icon-margin);
+ margin: var(--n-icon-margin);
  margin-left: 0;
- height: var(--icon-size);
- width: var(--icon-size);
- max-width: var(--icon-size);
- font-size: var(--icon-size);
+ height: var(--n-icon-size);
+ width: var(--n-icon-size);
+ max-width: var(--n-icon-size);
+ font-size: var(--n-icon-size);
  position: relative;
  flex-shrink: 0;
  `, [(0, cssr_1.cB)('icon-slot', `
- height: var(--icon-size);
- width: var(--icon-size);
+ height: var(--n-icon-size);
+ width: var(--n-icon-size);
  position: absolute;
  left: 0;
  top: 50%;
@@ -169,7 +172,7 @@ exports.default = (0, cssr_1.c)([(0, cssr_1.cB)('button', `
  align-items: center;
  flex-wrap: nowrap;
  `, [(0, cssr_1.c)('~', [(0, cssr_1.cE)('icon', {
-  margin: 'var(--icon-margin)',
+  margin: 'var(--n-icon-margin)',
   marginRight: 0
 })])]), (0, cssr_1.cM)('block', `
  display: flex;
@@ -178,18 +181,18 @@ exports.default = (0, cssr_1.c)([(0, cssr_1.cB)('button', `
   borderStyle: 'dashed !important'
 })]), (0, cssr_1.cM)('disabled', {
   cursor: 'not-allowed',
-  opacity: 'var(--opacity-disabled)'
+  opacity: 'var(--n-opacity-disabled)'
 })]), (0, cssr_1.c)('@keyframes button-wave-spread', {
   from: {
-    boxShadow: '0 0 0.5px 0 var(--ripple-color)'
+    boxShadow: '0 0 0.5px 0 var(--n-ripple-color)'
   },
   to: {
     // don't use exact 5px since chrome will display the animation with glitches
-    boxShadow: '0 0 0.5px 4.5px var(--ripple-color)'
+    boxShadow: '0 0 0.5px 4.5px var(--n-ripple-color)'
   }
 }), (0, cssr_1.c)('@keyframes button-wave-opacity', {
   from: {
-    opacity: 'var(--wave-opacity)'
+    opacity: 'var(--n-wave-opacity)'
   },
   to: {
     opacity: 0

package/lib/button/styles/light.js

@@ -13,7 +13,7 @@ const self = (vars) => {
         heightMedium,
         heightLarge, borderRadiusTiny: borderRadius, borderRadiusSmall: borderRadius, borderRadiusMedium: borderRadius, borderRadiusLarge: borderRadius, fontSizeTiny: fontSizeTiny, fontSizeSmall: fontSizeSmall, fontSizeMedium: fontSizeMedium, fontSizeLarge: fontSizeLarge, opacityDisabled: opacityDisabled, 
         // secondary
-        colorOpacitySecondary: '0.16', colorOpacitySecondaryHover: '0.2', colorOpacitySecondaryPressed: '0.24', colorSecondary: buttonColor2, colorSecondaryHover: buttonColor2Hover, colorSecondaryPressed: buttonColor2Pressed, 
+        colorOpacitySecondary: '0.16', colorOpacitySecondaryHover: '0.22', colorOpacitySecondaryPressed: '0.28', colorSecondary: buttonColor2, colorSecondaryHover: buttonColor2Hover, colorSecondaryPressed: buttonColor2Pressed, 
         // tertiary
         colorTertiary: buttonColor2, colorTertiaryHover: buttonColor2Hover, colorTertiaryPressed: buttonColor2Pressed, 
         // quaternary

package/lib/calendar/src/Calendar.d.ts

@@ -1393,6 +1393,7 @@ declare const _default: import("vue").DefineComponent<{
         monthTypeFormat: string;
         dateFormat: string;
         dateTimeFormat: string;
+        quarterFormat: string;
         clear: string;
         now: string;
         confirm: string;
@@ -1402,6 +1403,7 @@ declare const _default: import("vue").DefineComponent<{
         datetimePlaceholder: string;
         monthPlaceholder: string;
         yearPlaceholder: string;
+        quarterPlaceholder: string;
         startDatePlaceholder: string;
         endDatePlaceholder: string;
         startDatetimePlaceholder: string;

package/lib/cascader/src/Cascader.d.ts

@@ -254,6 +254,19 @@ declare const cascaderProps: {
             sizeLarge: string;
             labelPadding: string;
         }, any>;
+        Empty: import("../../_mixins").Theme<"Empty", {
+            fontSizeSmall: string;
+            fontSizeMedium: string;
+            fontSizeLarge: string;
+            fontSizeHuge: string;
+            textColor: string;
+            iconColor: string;
+            extraTextColor: string;
+            iconSizeSmall: string;
+            iconSizeMedium: string;
+            iconSizeLarge: string;
+            iconSizeHuge: string;
+        }, any>;
     }>>;
     readonly themeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Cascader", {
         menuBorderRadius: string;
@@ -424,6 +437,19 @@ declare const cascaderProps: {
             sizeLarge: string;
             labelPadding: string;
         }, any>;
+        Empty: import("../../_mixins").Theme<"Empty", {
+            fontSizeSmall: string;
+            fontSizeMedium: string;
+            fontSizeLarge: string;
+            fontSizeHuge: string;
+            textColor: string;
+            iconColor: string;
+            extraTextColor: string;
+            iconSizeSmall: string;
+            iconSizeMedium: string;
+            iconSizeLarge: string;
+            iconSizeHuge: string;
+        }, any>;
     }>>>;
     readonly builtinThemeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Cascader", {
         menuBorderRadius: string;
@@ -594,6 +620,19 @@ declare const cascaderProps: {
             sizeLarge: string;
             labelPadding: string;
         }, any>;
+        Empty: import("../../_mixins").Theme<"Empty", {
+            fontSizeSmall: string;
+            fontSizeMedium: string;
+            fontSizeLarge: string;
+            fontSizeHuge: string;
+            textColor: string;
+            iconColor: string;
+            extraTextColor: string;
+            iconSizeSmall: string;
+            iconSizeMedium: string;
+            iconSizeLarge: string;
+            iconSizeHuge: string;
+        }, any>;
     }>>>;
 };
 export declare type CascaderProps = ExtractPublicPropTypes<typeof cascaderProps>;
@@ -847,6 +886,19 @@ declare const _default: import("vue").DefineComponent<{
             sizeLarge: string;
             labelPadding: string;
         }, any>;
+        Empty: import("../../_mixins").Theme<"Empty", {
+            fontSizeSmall: string;
+            fontSizeMedium: string;
+            fontSizeLarge: string;
+            fontSizeHuge: string;
+            textColor: string;
+            iconColor: string;
+            extraTextColor: string;
+            iconSizeSmall: string;
+            iconSizeMedium: string;
+            iconSizeLarge: string;
+            iconSizeHuge: string;
+        }, any>;
     }>>;
     readonly themeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Cascader", {
         menuBorderRadius: string;
@@ -1017,6 +1069,19 @@ declare const _default: import("vue").DefineComponent<{
             sizeLarge: string;
             labelPadding: string;
         }, any>;
+        Empty: import("../../_mixins").Theme<"Empty", {
+            fontSizeSmall: string;
+            fontSizeMedium: string;
+            fontSizeLarge: string;
+            fontSizeHuge: string;
+            textColor: string;
+            iconColor: string;
+            extraTextColor: string;
+            iconSizeSmall: string;
+            iconSizeMedium: string;
+            iconSizeLarge: string;
+            iconSizeHuge: string;
+        }, any>;
     }>>>;
     readonly builtinThemeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Cascader", {
         menuBorderRadius: string;
@@ -1187,6 +1252,19 @@ declare const _default: import("vue").DefineComponent<{
             sizeLarge: string;
             labelPadding: string;
         }, any>;
+        Empty: import("../../_mixins").Theme<"Empty", {
+            fontSizeSmall: string;
+            fontSizeMedium: string;
+            fontSizeLarge: string;
+            fontSizeHuge: string;
+            textColor: string;
+            iconColor: string;
+            extraTextColor: string;
+            iconSizeSmall: string;
+            iconSizeMedium: string;
+            iconSizeLarge: string;
+            iconSizeHuge: string;
+        }, any>;
     }>>>;
 }, {
     selectMenuFollowerRef: import("vue").Ref<{
@@ -1520,6 +1598,19 @@ declare const _default: import("vue").DefineComponent<{
                 sizeLarge: string;
                 labelPadding: string;
             }, any>;
+            Empty: import("../../_mixins").Theme<"Empty", {
+                fontSizeSmall: string;
+                fontSizeMedium: string;
+                fontSizeLarge: string;
+                fontSizeHuge: string;
+                textColor: string;
+                iconColor: string;
+                extraTextColor: string;
+                iconSizeSmall: string;
+                iconSizeMedium: string;
+                iconSizeLarge: string;
+                iconSizeHuge: string;
+            }, any>;
         };
         peerOverrides: {
             InternalSelectMenu?: {
@@ -1571,6 +1662,11 @@ declare const _default: import("vue").DefineComponent<{
                     [x: string]: any;
                 } | undefined;
             } | undefined;
+            Empty?: {
+                peers?: {
+                    [x: string]: any;
+                } | undefined;
+            } | undefined;
         };
     }>;
     cssVars: import("vue").ComputedRef<{
@@ -1827,6 +1923,19 @@ declare const _default: import("vue").DefineComponent<{
             sizeLarge: string;
             labelPadding: string;
         }, any>;
+        Empty: import("../../_mixins").Theme<"Empty", {
+            fontSizeSmall: string;
+            fontSizeMedium: string;
+            fontSizeLarge: string;
+            fontSizeHuge: string;
+            textColor: string;
+            iconColor: string;
+            extraTextColor: string;
+            iconSizeSmall: string;
+            iconSizeMedium: string;
+            iconSizeLarge: string;
+            iconSizeHuge: string;
+        }, any>;
     }> | undefined;
     themeOverrides?: import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Cascader", {
         menuBorderRadius: string;
@@ -1997,6 +2106,19 @@ declare const _default: import("vue").DefineComponent<{
             sizeLarge: string;
             labelPadding: string;
         }, any>;
+        Empty: import("../../_mixins").Theme<"Empty", {
+            fontSizeSmall: string;
+            fontSizeMedium: string;
+            fontSizeLarge: string;
+            fontSizeHuge: string;
+            textColor: string;
+            iconColor: string;
+            extraTextColor: string;
+            iconSizeSmall: string;
+            iconSizeMedium: string;
+            iconSizeLarge: string;
+            iconSizeHuge: string;
+        }, any>;
     }>> | undefined;
     builtinThemeOverrides?: import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Cascader", {
         menuBorderRadius: string;
@@ -2167,6 +2289,19 @@ declare const _default: import("vue").DefineComponent<{
             sizeLarge: string;
             labelPadding: string;
         }, any>;
+        Empty: import("../../_mixins").Theme<"Empty", {
+            fontSizeSmall: string;
+            fontSizeMedium: string;
+            fontSizeLarge: string;
+            fontSizeHuge: string;
+            textColor: string;
+            iconColor: string;
+            extraTextColor: string;
+            iconSizeSmall: string;
+            iconSizeMedium: string;
+            iconSizeLarge: string;
+            iconSizeHuge: string;
+        }, any>;
     }>> | undefined;
     bordered?: boolean | undefined;
     maxTagCount?: number | "responsive" | undefined;

package/lib/cascader/src/Cascader.js

@@ -722,7 +722,7 @@ exports.default = (0, vue_1.defineComponent)({
         };
     },
     render() {
-        const { mergedClsPrefix } = this;
+        const { mergedClsPrefix, $slots } = this;
         return ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-cascader` },
             (0, vue_1.h)(vueuc_1.VBinder, null, {
                 default: () => [
@@ -730,9 +730,7 @@ exports.default = (0, vue_1.defineComponent)({
                         default: () => ((0, vue_1.h)(_internal_1.NInternalSelection, { ref: "triggerInstRef", clsPrefix: mergedClsPrefix, maxTagCount: this.maxTagCount, bordered: this.mergedBordered, size: this.mergedSize, theme: this.mergedTheme.peers.InternalSelection, themeOverrides: this.mergedTheme.peerOverrides.InternalSelection, active: this.mergedShow, pattern: this.pattern, placeholder: this.localizedPlaceholder, selectedOption: this.selectedOption, selectedOptions: this.selectedOptions, multiple: this.multiple, filterable: this.filterable, clearable: this.clearable, disabled: this.mergedDisabled, focused: this.focused, onFocus: this.handleTriggerFocus, onBlur: this.handleTriggerBlur, onClick: this.handleTriggerClick, onClear: this.handleClear, onDeleteOption: this.handleDeleteOption, onPatternInput: this.handlePatternInput, onKeydown: this.handleKeyDown, onKeyup: this.handleKeyUp }))
                     }),
                     (0, vue_1.h)(vueuc_1.VFollower, { key: "cascaderMenu", ref: "cascaderMenuFollowerRef", show: this.mergedShow && !this.showSelectMenu, containerClass: this.namespace, placement: "bottom-start", width: !this.options.length ? 'target' : undefined, teleportDisabled: this.adjustedTo === _utils_1.useAdjustedTo.tdkey, to: this.adjustedTo }, {
-                        default: () => ((0, vue_1.h)(CascaderMenu_1.default, { ref: "cascaderMenuInstRef", value: this.mergedValue, show: this.mergedShow && !this.showSelectMenu, menuModel: this.menuModel, style: this.cssVars, onFocus: this.handleMenuFocus, onBlur: this.handleMenuBlur, onKeyup: this.handleMenuKeyUp, onMousedown: this.handleMenuMousedown, onTabout: this.handleMenuTabout }, this.$slots.action && {
-                            action: this.$slots.action
-                        }))
+                        default: () => ((0, vue_1.h)(CascaderMenu_1.default, { ref: "cascaderMenuInstRef", value: this.mergedValue, show: this.mergedShow && !this.showSelectMenu, menuModel: this.menuModel, style: this.cssVars, onFocus: this.handleMenuFocus, onBlur: this.handleMenuBlur, onKeyup: this.handleMenuKeyUp, onMousedown: this.handleMenuMousedown, onTabout: this.handleMenuTabout }, $slots))
                     }),
                     (0, vue_1.h)(vueuc_1.VFollower, { key: "selectMenu", ref: "selectMenuFollowerRef", show: this.mergedShow && this.showSelectMenu, containerClass: this.namespace, width: "target", placement: "bottom-start", to: this.adjustedTo, teleportDisabled: this.adjustedTo === _utils_1.useAdjustedTo.tdkey }, {
                         default: () => ((0, vue_1.h)(CascaderSelectMenu_1.default, { ref: "selectMenuInstRef", value: this.mergedValue, show: this.mergedShow && this.showSelectMenu, pattern: this.pattern, multiple: this.multiple, tmNodes: this.treeMate.treeNodes, filter: this.filter, labelField: this.labelField, separator: this.separator, style: this.cssVars }))