naive-ui 2.25.0 → 2.25.3

package/es/watermark/src/Watermark.d.ts

@@ -0,0 +1,285 @@
+import { PropType } from 'vue';
+import { ExtractPublicPropTypes } from '../../_utils';
+declare const watermarkProps: {
+    readonly debug: BooleanConstructor;
+    readonly cross: BooleanConstructor;
+    readonly fullscreen: BooleanConstructor;
+    readonly width: {
+        readonly type: NumberConstructor;
+        readonly default: 32;
+    };
+    readonly height: {
+        readonly type: NumberConstructor;
+        readonly default: 32;
+    };
+    readonly zIndex: {
+        readonly type: NumberConstructor;
+        readonly default: 10;
+    };
+    readonly xGap: {
+        readonly type: NumberConstructor;
+        readonly default: 0;
+    };
+    readonly yGap: {
+        readonly type: NumberConstructor;
+        readonly default: 0;
+    };
+    readonly yOffset: {
+        readonly type: NumberConstructor;
+        readonly default: 0;
+    };
+    readonly xOffset: {
+        readonly type: NumberConstructor;
+        readonly default: 0;
+    };
+    readonly rotate: {
+        readonly type: NumberConstructor;
+        readonly default: 0;
+    };
+    readonly image: StringConstructor;
+    readonly imageOpacity: {
+        readonly type: NumberConstructor;
+        readonly default: 1;
+    };
+    readonly imageHeight: NumberConstructor;
+    readonly imageWidth: NumberConstructor;
+    readonly content: StringConstructor;
+    readonly selectable: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    readonly fontSize: {
+        readonly type: NumberConstructor;
+        readonly default: 14;
+    };
+    readonly fontFamily: StringConstructor;
+    readonly fontStyle: {
+        readonly type: PropType<"normal" | "italic" | "oblique" | `oblique ${number}deg`>;
+        readonly default: "normal";
+    };
+    readonly fontVariant: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly fontWeight: {
+        readonly type: NumberConstructor;
+        readonly default: 400;
+    };
+    readonly fontColor: {
+        readonly type: StringConstructor;
+        readonly default: "rgba(128, 128, 128, .3)";
+    };
+    readonly fontStretch: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly lineHeight: {
+        readonly type: NumberConstructor;
+        readonly default: 14;
+    };
+    readonly theme: PropType<import("../../_mixins").Theme<"Watermark", {
+        fontFamily: string;
+    }, unknown>>;
+    readonly themeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Watermark", {
+        fontFamily: string;
+    }, unknown>>>;
+    readonly builtinThemeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Watermark", {
+        fontFamily: string;
+    }, unknown>>>;
+};
+export declare type WatermarkProps = ExtractPublicPropTypes<typeof watermarkProps>;
+declare const _default: import("vue").DefineComponent<{
+    readonly debug: BooleanConstructor;
+    readonly cross: BooleanConstructor;
+    readonly fullscreen: BooleanConstructor;
+    readonly width: {
+        readonly type: NumberConstructor;
+        readonly default: 32;
+    };
+    readonly height: {
+        readonly type: NumberConstructor;
+        readonly default: 32;
+    };
+    readonly zIndex: {
+        readonly type: NumberConstructor;
+        readonly default: 10;
+    };
+    readonly xGap: {
+        readonly type: NumberConstructor;
+        readonly default: 0;
+    };
+    readonly yGap: {
+        readonly type: NumberConstructor;
+        readonly default: 0;
+    };
+    readonly yOffset: {
+        readonly type: NumberConstructor;
+        readonly default: 0;
+    };
+    readonly xOffset: {
+        readonly type: NumberConstructor;
+        readonly default: 0;
+    };
+    readonly rotate: {
+        readonly type: NumberConstructor;
+        readonly default: 0;
+    };
+    readonly image: StringConstructor;
+    readonly imageOpacity: {
+        readonly type: NumberConstructor;
+        readonly default: 1;
+    };
+    readonly imageHeight: NumberConstructor;
+    readonly imageWidth: NumberConstructor;
+    readonly content: StringConstructor;
+    readonly selectable: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    readonly fontSize: {
+        readonly type: NumberConstructor;
+        readonly default: 14;
+    };
+    readonly fontFamily: StringConstructor;
+    readonly fontStyle: {
+        readonly type: PropType<"normal" | "italic" | "oblique" | `oblique ${number}deg`>;
+        readonly default: "normal";
+    };
+    readonly fontVariant: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly fontWeight: {
+        readonly type: NumberConstructor;
+        readonly default: 400;
+    };
+    readonly fontColor: {
+        readonly type: StringConstructor;
+        readonly default: "rgba(128, 128, 128, .3)";
+    };
+    readonly fontStretch: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly lineHeight: {
+        readonly type: NumberConstructor;
+        readonly default: 14;
+    };
+    readonly theme: PropType<import("../../_mixins").Theme<"Watermark", {
+        fontFamily: string;
+    }, unknown>>;
+    readonly themeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Watermark", {
+        fontFamily: string;
+    }, unknown>>>;
+    readonly builtinThemeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Watermark", {
+        fontFamily: string;
+    }, unknown>>>;
+}, () => JSX.Element, 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 debug: BooleanConstructor;
+    readonly cross: BooleanConstructor;
+    readonly fullscreen: BooleanConstructor;
+    readonly width: {
+        readonly type: NumberConstructor;
+        readonly default: 32;
+    };
+    readonly height: {
+        readonly type: NumberConstructor;
+        readonly default: 32;
+    };
+    readonly zIndex: {
+        readonly type: NumberConstructor;
+        readonly default: 10;
+    };
+    readonly xGap: {
+        readonly type: NumberConstructor;
+        readonly default: 0;
+    };
+    readonly yGap: {
+        readonly type: NumberConstructor;
+        readonly default: 0;
+    };
+    readonly yOffset: {
+        readonly type: NumberConstructor;
+        readonly default: 0;
+    };
+    readonly xOffset: {
+        readonly type: NumberConstructor;
+        readonly default: 0;
+    };
+    readonly rotate: {
+        readonly type: NumberConstructor;
+        readonly default: 0;
+    };
+    readonly image: StringConstructor;
+    readonly imageOpacity: {
+        readonly type: NumberConstructor;
+        readonly default: 1;
+    };
+    readonly imageHeight: NumberConstructor;
+    readonly imageWidth: NumberConstructor;
+    readonly content: StringConstructor;
+    readonly selectable: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    readonly fontSize: {
+        readonly type: NumberConstructor;
+        readonly default: 14;
+    };
+    readonly fontFamily: StringConstructor;
+    readonly fontStyle: {
+        readonly type: PropType<"normal" | "italic" | "oblique" | `oblique ${number}deg`>;
+        readonly default: "normal";
+    };
+    readonly fontVariant: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly fontWeight: {
+        readonly type: NumberConstructor;
+        readonly default: 400;
+    };
+    readonly fontColor: {
+        readonly type: StringConstructor;
+        readonly default: "rgba(128, 128, 128, .3)";
+    };
+    readonly fontStretch: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly lineHeight: {
+        readonly type: NumberConstructor;
+        readonly default: 14;
+    };
+    readonly theme: PropType<import("../../_mixins").Theme<"Watermark", {
+        fontFamily: string;
+    }, unknown>>;
+    readonly themeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Watermark", {
+        fontFamily: string;
+    }, unknown>>>;
+    readonly builtinThemeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Watermark", {
+        fontFamily: string;
+    }, unknown>>>;
+}>>, {
+    fontSize: number;
+    fontStretch: string;
+    fontStyle: "normal" | "italic" | "oblique" | `oblique ${number}deg`;
+    fontVariant: string;
+    fontWeight: number;
+    height: number;
+    lineHeight: number;
+    rotate: number;
+    width: number;
+    zIndex: number;
+    cross: boolean;
+    xGap: number;
+    yGap: number;
+    selectable: boolean;
+    fullscreen: boolean;
+    debug: boolean;
+    yOffset: number;
+    xOffset: number;
+    imageOpacity: number;
+    fontColor: string;
+}>;
+export default _default;

package/es/watermark/src/Watermark.js

@@ -0,0 +1,159 @@
+import { h, defineComponent, ref, watchEffect } from 'vue';
+import { onFontsReady } from 'vooks';
+import { useConfig, useTheme } from '../../_mixins';
+import { warnOnce } from '../../_utils';
+import { watermarkLight } from '../styles';
+import style from './styles/index.cssr';
+function getRatio(context) {
+    if (!context) {
+        return 1;
+    }
+    const backingStore = context.backingStorePixelRatio ||
+        context.webkitBackingStorePixelRatio ||
+        context.mozBackingStorePixelRatio ||
+        context.msBackingStorePixelRatio ||
+        context.oBackingStorePixelRatio ||
+        context.backingStorePixelRatio ||
+        1;
+    return (window.devicePixelRatio || 1) / backingStore;
+}
+const watermarkProps = Object.assign(Object.assign({}, useTheme.props), { debug: Boolean, cross: Boolean, fullscreen: Boolean, width: {
+        type: Number,
+        default: 32
+    }, height: {
+        type: Number,
+        default: 32
+    }, zIndex: {
+        type: Number,
+        default: 10
+    }, xGap: {
+        type: Number,
+        default: 0
+    }, yGap: {
+        type: Number,
+        default: 0
+    }, yOffset: {
+        type: Number,
+        default: 0
+    }, xOffset: {
+        type: Number,
+        default: 0
+    }, rotate: {
+        type: Number,
+        default: 0
+    }, image: String, imageOpacity: { type: Number, default: 1 }, imageHeight: Number, imageWidth: Number, content: String, selectable: {
+        type: Boolean,
+        default: true
+    }, fontSize: {
+        type: Number,
+        default: 14
+    }, fontFamily: String, fontStyle: {
+        type: String,
+        default: 'normal'
+    }, fontVariant: {
+        type: String,
+        default: ''
+    }, fontWeight: {
+        type: Number,
+        default: 400
+    }, fontColor: {
+        type: String,
+        default: 'rgba(128, 128, 128, .3)'
+    }, fontStretch: {
+        type: String,
+        default: ''
+    }, lineHeight: {
+        type: Number,
+        default: 14
+    } });
+export default defineComponent({
+    name: 'Watermark',
+    props: watermarkProps,
+    setup(props, { slots }) {
+        const { mergedClsPrefixRef } = useConfig(props);
+        const themeRef = useTheme('Watermark', '-watermark', style, watermarkLight, props);
+        const base64UrlRef = ref('');
+        const canvas = document.createElement('canvas');
+        const ctx = canvas.getContext('2d');
+        const fontsReadyRef = ref(false);
+        onFontsReady(() => (fontsReadyRef.value = true));
+        watchEffect(() => {
+            void fontsReadyRef.value;
+            const ratio = getRatio(ctx);
+            const { xGap, yGap, width, height, yOffset, xOffset, rotate, image, content, fontColor, fontStyle, fontVariant, fontStretch, fontWeight, fontFamily, fontSize, lineHeight, debug } = props;
+            const canvasWidth = (xGap + width) * ratio;
+            const canvasHeight = (yGap + height) * ratio;
+            const canvasOffsetLeft = xOffset * ratio;
+            const canvasOffsetTop = yOffset * ratio;
+            canvas.width = canvasWidth;
+            canvas.height = canvasHeight;
+            if (ctx) {
+                ctx.translate(0, 0);
+                const markWidth = width * ratio;
+                const markHeight = height * ratio;
+                if (debug) {
+                    ctx.strokeStyle = 'grey';
+                    ctx.strokeRect(0, 0, markWidth, markHeight);
+                }
+                ctx.rotate(rotate * (Math.PI / 180));
+                if (image) {
+                    const img = new Image();
+                    img.crossOrigin = 'anonymous';
+                    img.referrerPolicy = 'no-referrer';
+                    img.src = image;
+                    img.onload = () => {
+                        ctx.globalAlpha = props.imageOpacity;
+                        const { imageWidth, imageHeight } = props;
+                        ctx.drawImage(img, canvasOffsetLeft, canvasOffsetTop, (props.imageWidth ||
+                            (imageHeight
+                                ? (img.width * imageHeight) / img.height
+                                : img.width)) * ratio, (props.imageHeight ||
+                            (imageWidth
+                                ? (img.height * imageWidth) / img.width
+                                : img.height)) * ratio);
+                        base64UrlRef.value = canvas.toDataURL();
+                    };
+                }
+                else if (content) {
+                    if (debug) {
+                        ctx.strokeStyle = 'green';
+                        ctx.strokeRect(0, 0, markWidth, markHeight);
+                    }
+                    ctx.font = `${fontStyle} ${fontVariant} ${fontWeight} ${fontStretch} ${fontSize * ratio}px/${lineHeight * ratio}px ${fontFamily || themeRef.value.self.fontFamily}`;
+                    ctx.fillStyle = fontColor;
+                    ctx.fillText(content, canvasOffsetLeft, canvasOffsetTop + lineHeight * ratio);
+                    base64UrlRef.value = canvas.toDataURL();
+                }
+            }
+            else {
+                warnOnce('watermark', 'Canvas is not supported in the browser.');
+            }
+        });
+        return () => {
+            var _a;
+            const watarmarkNode = (h("div", { class: [
+                    `${mergedClsPrefixRef.value}-watermark`,
+                    props.fullscreen &&
+                        `${mergedClsPrefixRef.value}-watermark--fullscreen`
+                ], style: {
+                    zIndex: props.zIndex,
+                    backgroundSize: `${props.xGap + props.width}px`,
+                    backgroundPosition: props.cross
+                        ? `${props.width / 2}px ${props.height / 2}px, 0 0`
+                        : '',
+                    backgroundImage: props.cross
+                        ? `url(${base64UrlRef.value}), url(${base64UrlRef.value})`
+                        : `url(${base64UrlRef.value})`
+                } }));
+            if (props.fullscreen)
+                return watarmarkNode;
+            return (h("div", { class: [
+                    `${mergedClsPrefixRef.value}-watermark-container`,
+                    props.selectable &&
+                        `${mergedClsPrefixRef.value}-watermark-container--selectable`
+                ] }, (_a = slots.default) === null || _a === void 0 ? void 0 :
+                _a.call(slots),
+                watarmarkNode));
+        };
+    }
+});

package/es/watermark/src/styles/index.cssr.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("css-render").CNode;
+export default _default;

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

@@ -0,0 +1,14 @@
+import { c, cB, cNotM, cM } from '../../../_utils/cssr';
+export default c([cB('watermark-container', `
+ position: relative;
+ `, [cNotM('selectable', 'user-select: none;')]), cB('watermark', `
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ pointer-events: none;
+ background-repeat: repeat;
+ `, [cM('fullscreen', `
+ position: fixed;
+ `)])]);

package/es/watermark/styles/dark.d.ts

@@ -0,0 +1,3 @@
+import type { WatermarkTheme } from './light';
+declare const watermarkDark: WatermarkTheme;
+export default watermarkDark;

package/es/watermark/styles/dark.js

@@ -0,0 +1,12 @@
+import { commonDark } from '../../_styles/common';
+const watermarkDark = {
+    name: 'Watermark',
+    common: commonDark,
+    self(vars) {
+        const { fontFamily } = vars;
+        return {
+            fontFamily
+        };
+    }
+};
+export default watermarkDark;

package/es/watermark/styles/index.d.ts

@@ -0,0 +1,3 @@
+export { default as watermarkDark } from './dark';
+export { default as watermarkLight } from './light';
+export type { WatermarkTheme } from './light';

package/es/watermark/styles/index.js

@@ -0,0 +1,2 @@
+export { default as watermarkDark } from './dark';
+export { default as watermarkLight } from './light';

package/es/watermark/styles/light.d.ts

@@ -0,0 +1,5 @@
+declare const watermarkLight: import("../../_mixins").Theme<"Watermark", {
+    fontFamily: string;
+}, unknown>;
+export default watermarkLight;
+export declare type WatermarkTheme = typeof watermarkLight;

package/es/watermark/styles/light.js

@@ -0,0 +1,13 @@
+import { commonLight } from '../../_styles/common';
+import { createTheme } from '../../_mixins';
+const watermarkLight = createTheme({
+    name: 'Watermark',
+    common: commonLight,
+    self(vars) {
+        const { fontFamily } = vars;
+        return {
+            fontFamily
+        };
+    }
+});
+export default watermarkLight;

package/lib/_internal/clear/src/Clear.d.ts

@@ -7,7 +7,6 @@ declare const _default: import("vue").DefineComponent<{
     show: BooleanConstructor;
     onClear: PropType<(e: MouseEvent) => void>;
 }, {
-    NConfigProvider: import("../../../config-provider/src/internal-interface").ConfigProviderInjection | null;
     handleMouseDown(e: MouseEvent): 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<{
     clsPrefix: {

package/lib/_internal/clear/src/Clear.js

@@ -21,9 +21,7 @@ exports.default = (0, vue_1.defineComponent)({
     },
     setup(props) {
         (0, _mixins_1.useStyle)('-base-clear', index_cssr_1.default, (0, vue_1.toRef)(props, 'clsPrefix'));
-        const { NConfigProvider } = (0, _mixins_1.useConfig)();
         return {
-            NConfigProvider,
             handleMouseDown(e) {
                 e.preventDefault();
             }

package/lib/_internal/icons/replaceable.d.ts

@@ -1,2 +1,2 @@
-import { GlobalIconConfig } from '../../config-provider';
+import type { GlobalIconConfig } from '../../config-provider/src/internal-interface';
 export declare function replaceable(name: keyof GlobalIconConfig, icon: JSX.Element): import("vue").DefineComponent<{}, () => import("vue").VNodeChild, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;

package/lib/_internal/icons/replaceable.js

@@ -3,16 +3,17 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.replaceable = void 0;
 const lodash_1 = require("lodash");
 const vue_1 = require("vue");
-const _mixins_1 = require("../../_mixins");
+const context_1 = require("../../config-provider/src/context");
 // eslint-disable-next-line @typescript-eslint/explicit-function-return-type
 function replaceable(name, icon) {
     return (0, vue_1.defineComponent)({
         name: (0, lodash_1.upperFirst)(name),
         setup() {
-            const { NConfigProvider } = (0, _mixins_1.useConfig)();
+            var _a;
+            const mergedIconsRef = (_a = (0, vue_1.inject)(context_1.configProviderInjectionKey, null)) === null || _a === void 0 ? void 0 : _a.mergedIconsRef;
             return () => {
                 var _a;
-                const iconOverride = (_a = NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.mergedIconsRef.value) === null || _a === void 0 ? void 0 : _a[name];
+                const iconOverride = (_a = mergedIconsRef === null || mergedIconsRef === void 0 ? void 0 : mergedIconsRef.value) === null || _a === void 0 ? void 0 : _a[name];
                 return iconOverride ? iconOverride() : icon;
             };
         }

package/lib/_internal/scrollbar/src/ScrollBar.d.ts

@@ -25,9 +25,18 @@ export interface ScrollTo {
         debounce?: boolean;
     }): void;
 }
+export interface ScrollBy {
+    (x: number, y: number): void;
+    (options: {
+        left?: number;
+        top?: number;
+        behavior?: ScrollBehavior;
+    }): void;
+}
 export interface ScrollbarInstMethods {
     syncUnifiedContainer: () => void;
     scrollTo: ScrollTo;
+    scrollBy: ScrollBy;
     sync: () => void;
     handleMouseEnterWrapper: () => void;
     handleMouseLeaveWrapper: () => void;
@@ -149,9 +158,12 @@ declare const Scrollbar: import("vue").DefineComponent<{
         '--n-scrollbar-border-radius': string;
         '--n-scrollbar-width': string;
         '--n-scrollbar-height': string;
-    }>;
+    }> | undefined;
+    themeClass: import("vue").Ref<string> | undefined;
+    onRender: (() => void) | undefined;
     syncUnifiedContainer: () => void;
     scrollTo: ScrollTo;
+    scrollBy: ScrollBy;
     sync: () => void;
     handleMouseEnterWrapper: () => void;
     handleMouseLeaveWrapper: () => void;