naive-ui 2.22.0 → 2.24.0

package/lib/color-picker/src/ColorPicker.d.ts

@@ -1,10 +1,10 @@
-import { PropType, VNode, InjectionKey, ComputedRef, Ref } from 'vue';
+import { PropType, VNode, InjectionKey, ComputedRef, Ref, Slots } from 'vue';
 import { RGBA, HSLA } from 'seemly';
 import type { ColorPickerTheme } from '../styles';
 import { MergedTheme } from '../../_mixins';
 import type { ExtractPublicPropTypes, MaybeArray } from '../../_utils';
 import type { ColorPickerMode } from './utils';
-import { OnUpdateValue } from './interface';
+import { OnUpdateValue, RenderLabel } from './interface';
 export declare const colorPickerPanelProps: {
     readonly value: StringConstructor;
     readonly show: {
@@ -18,7 +18,7 @@ export declare const colorPickerPanelProps: {
     readonly defaultValue: PropType<string | null>;
     readonly modes: {
         readonly type: PropType<ColorPickerMode[]>;
-        readonly default: readonly ["rgb", "hex", "hsl"];
+        readonly default: () => string[];
     };
     readonly to: {
         type: PropType<string | boolean | HTMLElement>;
@@ -36,6 +36,7 @@ export declare const colorPickerPanelProps: {
     };
     readonly internalActions: PropType<readonly ("undo" | "redo")[]>;
     readonly size: PropType<"small" | "medium" | "large">;
+    readonly renderLabel: PropType<RenderLabel>;
     readonly onComplete: PropType<OnUpdateValue>;
     readonly 'onUpdate:show': PropType<MaybeArray<(value: boolean) => void>>;
     readonly onUpdateShow: PropType<MaybeArray<(value: boolean) => void>>;
@@ -883,7 +884,11 @@ export declare const colorPickerPanelProps: {
     }>>>;
 };
 export declare type ColorPickerProps = ExtractPublicPropTypes<typeof colorPickerPanelProps>;
-export declare const colorPickerThemeInjectionKey: InjectionKey<ComputedRef<MergedTheme<ColorPickerTheme>>>;
+export declare const colorPickerInjectionKey: InjectionKey<{
+    themeRef: ComputedRef<MergedTheme<ColorPickerTheme>>;
+    colorPickerSlots: Slots;
+    renderLabelRef: Ref<RenderLabel | undefined>;
+}>;
 declare const _default: import("vue").DefineComponent<{
     readonly value: StringConstructor;
     readonly show: {
@@ -897,7 +902,7 @@ declare const _default: import("vue").DefineComponent<{
     readonly defaultValue: PropType<string | null>;
     readonly modes: {
         readonly type: PropType<ColorPickerMode[]>;
-        readonly default: readonly ["rgb", "hex", "hsl"];
+        readonly default: () => string[];
     };
     readonly to: {
         type: PropType<string | boolean | HTMLElement>;
@@ -915,6 +920,7 @@ declare const _default: import("vue").DefineComponent<{
     };
     readonly internalActions: PropType<readonly ("undo" | "redo")[]>;
     readonly size: PropType<"small" | "medium" | "large">;
+    readonly renderLabel: PropType<RenderLabel>;
     readonly onComplete: PropType<OnUpdateValue>;
     readonly 'onUpdate:show': PropType<MaybeArray<(value: boolean) => void>>;
     readonly onUpdateShow: PropType<MaybeArray<(value: boolean) => void>>;
@@ -1774,16 +1780,16 @@ declare const _default: import("vue").DefineComponent<{
     handleClickOutside(e: MouseEvent): void;
     renderPanel: () => VNode;
     cssVars: ComputedRef<{
-        '--bezier': string;
-        '--text-color': string;
-        '--color': string;
-        '--panel-font-size': string;
-        '--font-size': string;
-        '--box-shadow': string;
-        '--border': string;
-        '--border-radius': string;
-        '--height': string;
-        '--divider-color': string;
+        '--n-bezier': string;
+        '--n-text-color': string;
+        '--n-color': string;
+        '--n-panel-font-size': string;
+        '--n-font-size': string;
+        '--n-box-shadow': string;
+        '--n-border': string;
+        '--n-border-radius': string;
+        '--n-height': string;
+        '--n-divider-color': string;
     }>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
     readonly value?: unknown;
@@ -1798,6 +1804,7 @@ declare const _default: import("vue").DefineComponent<{
     readonly actions?: unknown;
     readonly internalActions?: unknown;
     readonly size?: unknown;
+    readonly renderLabel?: unknown;
     readonly onComplete?: unknown;
     readonly 'onUpdate:show'?: unknown;
     readonly onUpdateShow?: unknown;
@@ -2657,6 +2664,7 @@ declare const _default: import("vue").DefineComponent<{
             rippleDuration: string;
         }, any>;
     }>> | undefined;
+    renderLabel?: RenderLabel | undefined;
     "onUpdate:show"?: MaybeArray<(value: boolean) => void> | undefined;
     onUpdateShow?: MaybeArray<(value: boolean) => void> | undefined;
     defaultValue?: string | null | undefined;

package/lib/color-picker/src/ColorPicker.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.colorPickerThemeInjectionKey = exports.colorPickerPanelProps = void 0;
+exports.colorPickerInjectionKey = exports.colorPickerPanelProps = void 0;
 const vue_1 = require("vue");
 const seemly_1 = require("seemly");
 const vooks_1 = require("vooks");
@@ -12,16 +12,16 @@ const vdirs_1 = require("vdirs");
 const styles_1 = require("../styles");
 const _mixins_1 = require("../../_mixins");
 const _utils_1 = require("../../_utils");
+const button_1 = require("../../button");
 const HueSlider_1 = __importDefault(require("./HueSlider"));
 const AlphaSlider_1 = __importDefault(require("./AlphaSlider"));
 const Pallete_1 = __importDefault(require("./Pallete"));
 const ColorInput_1 = __importDefault(require("./ColorInput"));
 const ColorPickerTrigger_1 = __importDefault(require("./ColorPickerTrigger"));
 const utils_1 = require("./utils");
-const index_cssr_1 = __importDefault(require("./styles/index.cssr"));
-const button_1 = require("../../button");
 const ColorPickerSwatches_1 = __importDefault(require("./ColorPickerSwatches"));
 const ColorPreview_1 = __importDefault(require("./ColorPreview"));
+const index_cssr_1 = __importDefault(require("./styles/index.cssr"));
 exports.colorPickerPanelProps = Object.assign(Object.assign({}, _mixins_1.useTheme.props), { value: String, show: {
         type: Boolean,
         default: undefined
@@ -31,15 +31,15 @@ exports.colorPickerPanelProps = Object.assign(Object.assign({}, _mixins_1.useThe
     }, defaultValue: String, modes: {
         type: Array,
         // no hsva by default since browser doesn't support it
-        default: ['rgb', 'hex', 'hsl']
+        default: () => ['rgb', 'hex', 'hsl']
     }, to: _utils_1.useAdjustedTo.propTo, showAlpha: {
         type: Boolean,
         default: true
     }, showPreview: Boolean, swatches: Array, actions: {
         type: Array,
         default: null
-    }, internalActions: Array, size: String, onComplete: Function, 'onUpdate:show': [Function, Array], onUpdateShow: [Function, Array], 'onUpdate:value': [Function, Array], onUpdateValue: [Function, Array] });
-exports.colorPickerThemeInjectionKey = Symbol('colorPickerThemeInjection');
+    }, internalActions: Array, size: String, renderLabel: Function, onComplete: Function, 'onUpdate:show': [Function, Array], onUpdateShow: [Function, Array], 'onUpdate:value': [Function, Array], onUpdateValue: [Function, Array] });
+exports.colorPickerInjectionKey = Symbol('colorPickerThemeInjection');
 exports.default = (0, vue_1.defineComponent)({
     name: 'ColorPicker',
     props: exports.colorPickerPanelProps,
@@ -51,7 +51,11 @@ exports.default = (0, vue_1.defineComponent)({
         const { localeRef } = (0, _mixins_1.useLocale)('global');
         const { mergedClsPrefixRef, namespaceRef } = (0, _mixins_1.useConfig)(props);
         const themeRef = (0, _mixins_1.useTheme)('ColorPicker', 'ColorPicker', index_cssr_1.default, styles_1.colorPickerLight, props, mergedClsPrefixRef);
-        (0, vue_1.provide)(exports.colorPickerThemeInjectionKey, themeRef);
+        (0, vue_1.provide)(exports.colorPickerInjectionKey, {
+            themeRef,
+            renderLabelRef: (0, vue_1.toRef)(props, 'renderLabel'),
+            colorPickerSlots: slots
+        });
         const uncontrolledShowRef = (0, vue_1.ref)(props.defaultShow);
         const mergedShowRef = (0, vooks_1.useMergedState)((0, vue_1.toRef)(props, 'show'), uncontrolledShowRef);
         function doUpdateShow(value) {
@@ -70,7 +74,8 @@ exports.default = (0, vue_1.defineComponent)({
         const undoStackRef = (0, vue_1.ref)([mergedValueRef.value]);
         const valueIndexRef = (0, vue_1.ref)(0);
         const valueModeRef = (0, vue_1.computed)(() => (0, utils_1.getModeFromValue)(mergedValueRef.value));
-        const displayedModeRef = (0, vue_1.ref)((0, utils_1.getModeFromValue)(mergedValueRef.value) || 'rgb');
+        const { modes } = props;
+        const displayedModeRef = (0, vue_1.ref)((0, utils_1.getModeFromValue)(mergedValueRef.value) || modes[0] || 'rgb');
         function handleUpdateDisplayedMode() {
             const { modes } = props;
             const { value: displayedMode } = displayedModeRef;
@@ -335,16 +340,16 @@ exports.default = (0, vue_1.defineComponent)({
             const { value: mergedSize } = mergedSizeRef;
             const { common: { cubicBezierEaseInOut }, self: { textColor, color, panelFontSize, boxShadow, border, borderRadius, dividerColor, [(0, _utils_1.createKey)('height', mergedSize)]: height, [(0, _utils_1.createKey)('fontSize', mergedSize)]: fontSize } } = themeRef.value;
             return {
-                '--bezier': cubicBezierEaseInOut,
-                '--text-color': textColor,
-                '--color': color,
-                '--panel-font-size': panelFontSize,
-                '--font-size': fontSize,
-                '--box-shadow': boxShadow,
-                '--border': border,
-                '--border-radius': borderRadius,
-                '--height': height,
-                '--divider-color': dividerColor
+                '--n-bezier': cubicBezierEaseInOut,
+                '--n-text-color': textColor,
+                '--n-color': color,
+                '--n-panel-font-size': panelFontSize,
+                '--n-font-size': fontSize,
+                '--n-box-shadow': boxShadow,
+                '--n-border': border,
+                '--n-border-radius': borderRadius,
+                '--n-height': height,
+                '--n-divider-color': dividerColor
             };
         });
         function renderPanel() {
@@ -395,12 +400,16 @@ exports.default = (0, vue_1.defineComponent)({
         };
     },
     render() {
-        const { mergedClsPrefix } = this;
+        const { $slots, mergedClsPrefix } = this;
         return ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-color-picker`, ref: "selfRef", style: this.cssVars },
             (0, vue_1.h)(vueuc_1.VBinder, null, {
                 default: () => [
                     (0, vue_1.h)(vueuc_1.VTarget, null, {
-                        default: () => ((0, vue_1.h)(ColorPickerTrigger_1.default, { clsPrefix: mergedClsPrefix, value: this.mergedValue, hsla: this.hsla, onClick: this.handleTriggerClick }))
+                        default: () => ((0, vue_1.h)(ColorPickerTrigger_1.default, { clsPrefix: mergedClsPrefix, value: this.mergedValue, hsla: this.hsla, onClick: this.handleTriggerClick }, {
+                            label: $slots.label
+                                ? () => (0, vue_1.renderSlot)($slots, 'label')
+                                : undefined
+                        }))
                     }),
                     (0, vue_1.h)(vueuc_1.VFollower, { placement: "bottom-start", show: this.mergedShow, containerClass: this.namespace, teleportDisabled: this.adjustedTo === _utils_1.useAdjustedTo.tdkey, to: this.adjustedTo }, {
                         default: () => ((0, vue_1.h)(vue_1.Transition, { name: "fade-in-scale-up-transition", appear: this.isMounted }, {

package/lib/color-picker/src/ColorPickerTrigger.d.ts

@@ -14,7 +14,7 @@ declare const _default: import("vue").DefineComponent<{
         default: null;
     };
     onClick: PropType<() => void>;
-}, unknown, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
+}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
     clsPrefix?: unknown;
     value?: unknown;
     hsla?: unknown;

package/lib/color-picker/src/ColorPickerTrigger.js

@@ -2,6 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const seemly_1 = require("seemly");
 const vue_1 = require("vue");
+const ColorPicker_1 = require("./ColorPicker");
 exports.default = (0, vue_1.defineComponent)({
     name: 'ColorPickerTrigger',
     props: {
@@ -19,21 +20,26 @@ exports.default = (0, vue_1.defineComponent)({
         },
         onClick: Function
     },
-    render() {
-        const { hsla, value, clsPrefix } = this;
-        return ((0, vue_1.h)("div", { class: `${clsPrefix}-color-picker-trigger`, onClick: this.onClick },
-            (0, vue_1.h)("div", { class: `${clsPrefix}-color-picker-trigger__fill` },
-                (0, vue_1.h)("div", { class: `${clsPrefix}-color-picker-checkboard` }),
-                (0, vue_1.h)("div", { style: {
-                        position: 'absolute',
-                        left: 0,
-                        right: 0,
-                        top: 0,
-                        bottom: 0,
-                        backgroundColor: hsla ? (0, seemly_1.toHslaString)(hsla) : ''
-                    } }),
-                value && hsla ? ((0, vue_1.h)("div", { class: `${clsPrefix}-color-picker-trigger__value`, style: {
-                        color: hsla[2] > 50 || hsla[3] < 0.5 ? 'black' : 'white'
-                    } }, value)) : null)));
+    setup(props) {
+        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+        const { colorPickerSlots, renderLabelRef } = (0, vue_1.inject)(ColorPicker_1.colorPickerInjectionKey, null);
+        return () => {
+            const { hsla, value, clsPrefix, onClick } = props;
+            const renderLabel = colorPickerSlots.label || renderLabelRef.value;
+            return ((0, vue_1.h)("div", { class: `${clsPrefix}-color-picker-trigger`, onClick: onClick },
+                (0, vue_1.h)("div", { class: `${clsPrefix}-color-picker-trigger__fill` },
+                    (0, vue_1.h)("div", { class: `${clsPrefix}-color-picker-checkboard` }),
+                    (0, vue_1.h)("div", { style: {
+                            position: 'absolute',
+                            left: 0,
+                            right: 0,
+                            top: 0,
+                            bottom: 0,
+                            backgroundColor: hsla ? (0, seemly_1.toHslaString)(hsla) : ''
+                        } }),
+                    value && hsla ? ((0, vue_1.h)("div", { class: `${clsPrefix}-color-picker-trigger__value`, style: {
+                            color: hsla[2] > 50 || hsla[3] < 0.5 ? 'black' : 'white'
+                        } }, renderLabel ? renderLabel(value) : value)) : null)));
+        };
     }
 });

package/lib/color-picker/src/interface.d.ts

@@ -1,2 +1,4 @@
+import { VNodeChild } from 'vue';
 export declare type OnUpdateValue = (value: string & null) => void;
 export declare type OnUpdateValueImpl = (value: string | null) => void;
+export declare type RenderLabel = (value: string | null) => VNodeChild;

package/lib/color-picker/src/styles/index.cssr.js

@@ -13,36 +13,36 @@ Object.defineProperty(exports, "__esModule", {
 const cssr_1 = require("../../../_utils/cssr");
 
 const fade_in_scale_up_cssr_1 = __importDefault(require("../../../_styles/transitions/fade-in-scale-up.cssr")); // vars:
-// --color
-// --text-color
-// --border-radius
-// --panel-font-size
-// --font-size
-// --bezier
-// --height
-// --box-shadow
-// --divider-color
+// --n-color
+// --n-text-color
+// --n-border-radius
+// --n-panel-font-size
+// --n-font-size
+// --n-bezier
+// --n-height
+// --n-box-shadow
+// --n-divider-color
 
 
 exports.default = (0, cssr_1.c)([(0, cssr_1.cB)('color-picker', `
  display: inline-block;
  box-sizing: border-box;
- height: var(--height);
- font-size: var(--font-size);
+ height: var(--n-height);
+ font-size: var(--n-font-size);
  width: 100%;
  position: relative;
  `), (0, cssr_1.cB)('color-picker-panel', `
  margin: 4px 0;
  width: 240px;
- font-size: var(--panel-font-size);
- color: var(--text-color);
- background-color: var(--color);
+ font-size: var(--n-panel-font-size);
+ color: var(--n-text-color);
+ background-color: var(--n-color);
  transition:
- box-shadow .3s var(--bezier),
- color .3s var(--bezier),
- background-color .3s var(--bezier);
- border-radius: var(--border-radius);
- box-shadow: var(--box-shadow);
+ box-shadow .3s var(--n-bezier),
+ color .3s var(--n-bezier),
+ background-color .3s var(--n-bezier);
+ border-radius: var(--n-border-radius);
+ box-shadow: var(--n-box-shadow);
  `, [(0, fade_in_scale_up_cssr_1.default)(), (0, cssr_1.cB)('input', `
  text-align: center;
  `)]), (0, cssr_1.cB)('color-picker-checkboard', `
@@ -95,6 +95,7 @@ exports.default = (0, cssr_1.c)([(0, cssr_1.cB)('color-picker', `
  height: 180px;
  position: relative;
  margin-bottom: 8px;
+ cursor: crosshair;
  `, [(0, cssr_1.cE)('layer', `
  position: absolute;
  left: 0;
@@ -141,21 +142,21 @@ exports.default = (0, cssr_1.c)([(0, cssr_1.cB)('color-picker', `
  `), (0, cssr_1.cB)('color-picker-action', `
  display: flex;
  margin-top: -4px;
- border-top: 1px solid var(--divider-color);
+ border-top: 1px solid var(--n-divider-color);
  padding: 8px 12px;
  justify-content: flex-end;
  `, [(0, cssr_1.cB)('button', 'margin-left: 8px;')]), (0, cssr_1.cB)('color-picker-trigger', `
- border: var(--border);
+ border: var(--n-border);
  height: 100%;
  box-sizing: border-box;
- border-radius: var(--border-radius);
- transition: border-color .3s var(--bezier);
+ border-radius: var(--n-border-radius);
+ transition: border-color .3s var(--n-bezier);
  cursor: pointer;
  `, [(0, cssr_1.cE)('value', `
  white-space: nowrap;
  position: relative;
  `), (0, cssr_1.cE)('fill', `
- border-radius: var(--border-radius);
+ border-radius: var(--n-border-radius);
  position: absolute;
  display: flex;
  align-items: center;
@@ -165,11 +166,11 @@ exports.default = (0, cssr_1.c)([(0, cssr_1.cB)('color-picker', `
  top: 4px;
  bottom: 4px;
  `), (0, cssr_1.cB)('color-picker-checkboard', `
- border-radius: var(--border-radius);
+ border-radius: var(--n-border-radius);
  `, [(0, cssr_1.c)('&::after', `
- --block-size: calc((var(--height) - 8px) / 3);
- background-size: calc(var(--block-size) * 2) calc(var(--block-size) * 2);
- background-position: 0 0, 0 var(--block-size), var(--block-size) calc(-1 * var(--block-size)), calc(-1 * var(--block-size)) 0px; 
+ --n-block-size: calc((var(--n-height) - 8px) / 3);
+ background-size: calc(var(--n-block-size) * 2) calc(var(--n-block-size) * 2);
+ background-position: 0 0, 0 var(--n-block-size), var(--n-block-size) calc(-1 * var(--n-block-size)), calc(-1 * var(--n-block-size)) 0px; 
  `)])]), (0, cssr_1.cB)('color-picker-swatches', `
  display: grid;
  grid-gap: 8px;

package/lib/components.d.ts

@@ -17,6 +17,8 @@ export * from './code';
 export * from './collapse';
 export * from './collapse-transition';
 export * from './config-provider';
+export * from './countdown';
+export * from './number-animation';
 export * from './data-table';
 export * from './date-picker';
 export * from './descriptions';

package/lib/components.js

@@ -29,6 +29,8 @@ __exportStar(require("./code"), exports);
 __exportStar(require("./collapse"), exports);
 __exportStar(require("./collapse-transition"), exports);
 __exportStar(require("./config-provider"), exports);
+__exportStar(require("./countdown"), exports);
+__exportStar(require("./number-animation"), exports);
 __exportStar(require("./data-table"), exports);
 __exportStar(require("./date-picker"), exports);
 __exportStar(require("./descriptions"), exports);

package/lib/config-provider/src/ConfigProvider.d.ts

@@ -110,6 +110,15 @@ export declare const configProviderProps: {
             export: string;
             restore: string;
         };
+        Image: {
+            tipPrevious: string;
+            tipNext: string;
+            tipCounterclockwise: string;
+            tipClockwise: string;
+            tipZoomOut: string;
+            tipZoomIn: string;
+            tipClose: string;
+        };
     } | null>;
     readonly dateLocale: PropType<NDateLocale | null>;
     readonly namespace: StringConstructor;
@@ -236,6 +245,15 @@ declare const _default: import("vue").DefineComponent<{
             export: string;
             restore: string;
         };
+        Image: {
+            tipPrevious: string;
+            tipNext: string;
+            tipCounterclockwise: string;
+            tipClockwise: string;
+            tipZoomOut: string;
+            tipZoomIn: string;
+            tipClose: string;
+        };
     } | null>;
     readonly dateLocale: PropType<NDateLocale | null>;
     readonly namespace: StringConstructor;
@@ -386,6 +404,15 @@ declare const _default: import("vue").DefineComponent<{
             export: string;
             restore: string;
         };
+        Image: {
+            tipPrevious: string;
+            tipNext: string;
+            tipCounterclockwise: string;
+            tipClockwise: string;
+            tipZoomOut: string;
+            tipZoomIn: string;
+            tipClose: string;
+        };
     } | null | undefined;
     dateLocale?: NDateLocale | null | undefined;
     hljs?: Hljs | undefined;

package/lib/countdown/index.d.ts

@@ -0,0 +1,2 @@
+export { default as NCountdown } from './src/Countdown';
+export type { CountdownProps } from './src/Countdown';

package/lib/countdown/index.js

@@ -0,0 +1,8 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NCountdown = void 0;
+var Countdown_1 = require("./src/Countdown");
+Object.defineProperty(exports, "NCountdown", { enumerable: true, get: function () { return __importDefault(Countdown_1).default; } });

package/lib/countdown/src/Countdown.d.ts

@@ -0,0 +1,72 @@
+import { PropType, VNodeChild } from 'vue';
+import type { ExtractPublicPropTypes } from '../../_utils';
+declare const countdownProps: {
+    label: StringConstructor;
+    duration: {
+        type: NumberConstructor;
+        default: number;
+    };
+    active: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    precision: {
+        type: PropType<0 | 2 | 1 | 3>;
+        default: number;
+    };
+    render: PropType<(props: {
+        hours: number;
+        minutes: number;
+        seconds: number;
+        milliseconds: number;
+    }) => VNodeChild>;
+    onFinish: PropType<() => void>;
+};
+export declare type CountdownProps = ExtractPublicPropTypes<typeof countdownProps>;
+declare const _default: import("vue").DefineComponent<{
+    label: StringConstructor;
+    duration: {
+        type: NumberConstructor;
+        default: number;
+    };
+    active: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    precision: {
+        type: PropType<0 | 2 | 1 | 3>;
+        default: number;
+    };
+    render: PropType<(props: {
+        hours: number;
+        minutes: number;
+        seconds: number;
+        milliseconds: number;
+    }) => VNodeChild>;
+    onFinish: PropType<() => void>;
+}, () => VNodeChild, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
+    label?: unknown;
+    duration?: unknown;
+    active?: unknown;
+    precision?: unknown;
+    render?: unknown;
+    onFinish?: unknown;
+} & {
+    active: boolean;
+    duration: number;
+    precision: 0 | 2 | 1 | 3;
+} & {
+    label?: string | undefined;
+    render?: ((props: {
+        hours: number;
+        minutes: number;
+        seconds: number;
+        milliseconds: number;
+    }) => VNodeChild) | undefined;
+    onFinish?: (() => void) | undefined;
+}>, {
+    active: boolean;
+    duration: number;
+    precision: 0 | 2 | 1 | 3;
+}>;
+export default _default;