naive-ui 2.21.3 → 2.23.0

package/es/badge/src/Badge.js

@@ -52,12 +52,12 @@ export default defineComponent({
                 const { type, color: propColor } = props;
                 const { common: { cubicBezierEaseInOut, cubicBezierEaseOut }, self: { [createKey('color', type)]: color, fontFamily, fontSize } } = themeRef.value;
                 return {
-                    '--font-size': fontSize,
-                    '--font-family': fontFamily,
-                    '--color': propColor || color,
-                    '--ripple-color': propColor || color,
-                    '--bezier': cubicBezierEaseInOut,
-                    '--ripple-bezier': cubicBezierEaseOut
+                    '--n-font-size': fontSize,
+                    '--n-font-family': fontFamily,
+                    '--n-color': propColor || color,
+                    '--n-ripple-color': propColor || color,
+                    '--n-bezier': cubicBezierEaseInOut,
+                    '--n-ripple-bezier': cubicBezierEaseOut
                 };
             })
         };

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

@@ -1,28 +1,28 @@
 import { c, cB, cM } from '../../../_utils/cssr';
 import fadeInScaleUpTransition from '../../../_styles/transitions/fade-in-scale-up.cssr'; // vars:
-// --color
-// --ripple-color
-// --bezier
-// --ripple-bezier
-// --font-size
-// --font-family
+// --n-color
+// --n-ripple-color
+// --n-bezier
+// --n-ripple-bezier
+// --n-font-size
+// --n-font-family
 
 export default c([c('@keyframes badge-wave-spread', {
   from: {
-    boxShadow: '0 0 0.5px 0px var(--ripple-color)',
+    boxShadow: '0 0 0.5px 0px var(--n-ripple-color)',
     opacity: 0.6
   },
   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)',
     opacity: 0
   }
 }), cB('badge', `
  display: inline-flex;
  position: relative;
  vertical-align: middle;
- color: var(--color);
- font-family: var(--font-family);
+ color: var(--n-color);
+ font-family: var(--n-font-family);
  `, [cM('as-is', [cB('badge-sup', {
   position: 'static',
   transform: 'translateX(0)'
@@ -39,10 +39,10 @@ export default c([c('@keyframes badge-wave-spread', {
 }, [c('::before', {
   borderRadius: '4px'
 })])]), cB('badge-sup', `
- background: var(--color);
+ background: var(--n-color);
  transition:
- background-color .3s var(--bezier),
- color .3s var(--bezier);
+ background-color .3s var(--n-bezier),
+ color .3s var(--n-bezier);
  color: #FFF;
  position: absolute;
  height: 18px;
@@ -50,7 +50,7 @@ export default c([c('@keyframes badge-wave-spread', {
  border-radius: 9px;
  padding: 0 6px;
  text-align: center;
- font-size: var(--font-size);
+ font-size: var(--n-font-size);
  transform: translateX(-50%);
  left: 100%;
  bottom: calc(100% - 9px);
@@ -64,7 +64,7 @@ export default c([c('@keyframes badge-wave-spread', {
   animationDuration: '2s',
   animationIterationCount: 'infinite',
   animationDelay: '1s',
-  animationTimingFunction: 'var(--ripple-bezier)',
+  animationTimingFunction: 'var(--n-ripple-bezier)',
   animationName: 'badge-wave-spread'
 }), c('&::before', `
  opacity: 0;

package/es/button/src/Button.d.ts

@@ -41,11 +41,12 @@ declare const buttonProps: {
         readonly type: PropType<"button" | "reset" | "submit">;
         readonly default: "button";
     };
-    readonly onClick: PropType<MaybeArray<(e: MouseEvent) => void>>;
     readonly bordered: {
         readonly type: BooleanConstructor;
         readonly default: true;
     };
+    readonly onClick: PropType<MaybeArray<(e: MouseEvent) => void>>;
+    readonly internalAutoFocus: BooleanConstructor;
     readonly theme: PropType<import("../../_mixins").Theme<"Button", {
         heightTiny: string;
         heightSmall: string;
@@ -700,11 +701,12 @@ declare const Button: import("vue").DefineComponent<{
         readonly type: PropType<"button" | "reset" | "submit">;
         readonly default: "button";
     };
-    readonly onClick: PropType<MaybeArray<(e: MouseEvent) => void>>;
     readonly bordered: {
         readonly type: BooleanConstructor;
         readonly default: true;
     };
+    readonly onClick: PropType<MaybeArray<(e: MouseEvent) => void>>;
+    readonly internalAutoFocus: BooleanConstructor;
     readonly theme: PropType<import("../../_mixins").Theme<"Button", {
         heightTiny: string;
         heightSmall: string;
@@ -1318,8 +1320,8 @@ declare const Button: import("vue").DefineComponent<{
         rippleDuration: string;
     }, any>>>;
 }, {
-    selfRef: import("vue").Ref<HTMLElement | null>;
-    waveRef: import("vue").Ref<{
+    selfElRef: import("vue").Ref<HTMLElement | null>;
+    waveElRef: import("vue").Ref<{
         play: () => void;
     } | null>;
     mergedClsPrefix: import("vue").ComputedRef<string>;
@@ -1334,42 +1336,42 @@ declare const Button: import("vue").DefineComponent<{
     handleKeyup: (e: KeyboardEvent) => void;
     handleClick: (e: MouseEvent) => void;
     customColorCssVars: import("vue").ComputedRef<{
-        '--border-color': string;
-        '--border-color-hover': string;
-        '--border-color-pressed': string;
-        '--border-color-focus': string;
-        '--border-color-disabled': string;
+        '--n-border-color': string;
+        '--n-border-color-hover': string;
+        '--n-border-color-pressed': string;
+        '--n-border-color-focus': string;
+        '--n-border-color-disabled': string;
     } | null>;
     cssVars: import("vue").ComputedRef<{
-        '--width': string;
-        '--height': string;
-        '--font-size': string;
-        '--padding': string;
-        '--icon-size': string;
-        '--icon-margin': string;
-        '--border-radius': string;
-        '--border': string;
-        '--border-hover': string;
-        '--border-pressed': string;
-        '--border-focus': string;
-        '--border-disabled': string;
-        '--color': string;
-        '--color-hover': string;
-        '--color-pressed': string;
-        '--color-focus': string;
-        '--color-disabled': string;
-        '--ripple-color': string;
-        '--text-color': string;
-        '--text-color-hover': string;
-        '--text-color-pressed': string;
-        '--text-color-focus': string;
-        '--text-color-disabled': string;
+        '--n-width': string;
+        '--n-height': string;
+        '--n-font-size': string;
+        '--n-padding': string;
+        '--n-icon-size': string;
+        '--n-icon-margin': string;
+        '--n-border-radius': string;
+        '--n-border': string;
+        '--n-border-hover': string;
+        '--n-border-pressed': string;
+        '--n-border-focus': string;
+        '--n-border-disabled': string;
+        '--n-color': string;
+        '--n-color-hover': string;
+        '--n-color-pressed': string;
+        '--n-color-focus': string;
+        '--n-color-disabled': string;
+        '--n-ripple-color': string;
+        '--n-text-color': string;
+        '--n-text-color-hover': string;
+        '--n-text-color-pressed': string;
+        '--n-text-color-focus': string;
+        '--n-text-color-disabled': string;
         fontWeight: string;
-        '--bezier': string;
-        '--bezier-ease-out': string;
-        '--ripple-duration': string;
-        '--opacity-disabled': string;
-        '--wave-opacity': string;
+        '--n-bezier': string;
+        '--n-bezier-ease-out': string;
+        '--n-ripple-duration': string;
+        '--n-opacity-disabled': string;
+        '--n-wave-opacity': string;
     }>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
     readonly color?: unknown;
@@ -1393,8 +1395,9 @@ declare const Button: import("vue").DefineComponent<{
     readonly dashed?: unknown;
     readonly iconPlacement?: unknown;
     readonly attrType?: unknown;
-    readonly onClick?: unknown;
     readonly bordered?: unknown;
+    readonly onClick?: unknown;
+    readonly internalAutoFocus?: unknown;
     readonly theme?: unknown;
     readonly themeOverrides?: unknown;
     readonly builtinThemeOverrides?: unknown;
@@ -1418,6 +1421,7 @@ declare const Button: import("vue").DefineComponent<{
     quaternary: boolean;
     iconPlacement: "left" | "right";
     attrType: "button" | "reset" | "submit";
+    internalAutoFocus: boolean;
 } & {
     color?: string | undefined;
     size?: Size | undefined;
@@ -2055,6 +2059,7 @@ declare const Button: import("vue").DefineComponent<{
     quaternary: boolean;
     iconPlacement: "left" | "right";
     attrType: "button" | "reset" | "submit";
+    internalAutoFocus: boolean;
 }>;
 declare type NativeButtonProps = Omit<ButtonHTMLAttributes, keyof ButtonProps>;
 declare type MergedProps = Partial<ButtonProps & NativeButtonProps>;