naive-ui 2.18.0 → 2.19.1

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

@@ -24,6 +24,9 @@ const cssr_1 = require("../../../_utils/cssr"); // vars:
 // --tab-gap
 // --tab-padding
 // --pane-padding
+// --color-segment
+// --font-weight-strong
+// --tab-color-segment
 
 
 exports.default = (0, cssr_1.cB)('tabs', `
@@ -31,7 +34,32 @@ exports.default = (0, cssr_1.cB)('tabs', `
  transition:
  background-color .3s var(--bezier),
  border-color .3s var(--bezier);
-`, [(0, cssr_1.cM)('flex', [(0, cssr_1.cB)('tabs-nav', {
+`, [(0, cssr_1.cB)('tabs-rail', `
+ padding: 3px;
+ border-radius: var(--tab-border-radius);
+ width: 100%;
+ background-color: var(--color-segment);
+ transition: background-color .3s var(--bezier);
+ display: flex;
+ align-items: center;
+ `, [(0, cssr_1.cB)('tabs-tab-wrapper', `
+ flex-basis: 0;
+ flex-grow: 1;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ `, [(0, cssr_1.cB)('tabs-tab', `
+ overflow: hidden;
+ border-radius: var(--tab-border-radius);
+ width: 100%;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ `, [(0, cssr_1.cM)('active', `
+ font-weight: var(--font-weight-strong);
+ background-color: var(--tab-color-segment);
+ box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .08);
+ `)])])]), (0, cssr_1.cM)('flex', [(0, cssr_1.cB)('tabs-nav', {
   width: '100%'
 }, [(0, cssr_1.cB)('tabs-wrapper', {
   width: '100%'
@@ -53,24 +81,19 @@ exports.default = (0, cssr_1.cB)('tabs', `
  box-shadow: inset 10px 0 8px -8px rgba(0, 0, 0, .12);
  `)]), (0, cssr_1.cM)('shadow-after', [(0, cssr_1.c)('&::after', `
  box-shadow: inset -10px 0 8px -8px rgba(0, 0, 0, .12);
- `)]), (0, cssr_1.c)('&::before', `
+ `)]), (0, cssr_1.c)('&::before, &::after', `
  transition: box-shadow .3s var(--bezier);
  pointer-events: none;
  content: "";
  position: absolute;
- left: 0;
  top: 0;
  bottom: 0;
  width: 20px;
+ z-index: 1;
+ `), (0, cssr_1.c)('&::before', `
+ left: 0;
  `), (0, cssr_1.c)('&::after', `
- transition: box-shadow .3s var(--bezier);
- pointer-events: none;
- content: "";
- position: absolute;
  right: 0;
- top: 0;
- bottom: 0;
- width: 20px;
  `)]), (0, cssr_1.cB)('tabs-nav-scroll-content', `
  display: flex;
  position: relative;
@@ -94,6 +117,7 @@ exports.default = (0, cssr_1.cB)('tabs', `
  background-clip: padding-box;
  padding: var(--tab-padding);
  transition:
+ box-shadow .3s var(--bezier),
  color .3s var(--bezier),
  background-color .3s var(--bezier),
  border-color .3s var(--bezier);

package/lib/tabs/styles/_common.d.ts

@@ -20,6 +20,12 @@ declare const _default: {
     tabPaddingSmallCard: string;
     tabPaddingMediumCard: string;
     tabPaddingLargeCard: string;
+    tabPaddingSmallSegment: string;
+    tabPaddingMediumSegment: string;
+    tabPaddingLargeSegment: string;
+    tabGapSmallSegment: string;
+    tabGapMediumSegment: string;
+    tabGapLargeSegment: string;
     panePaddingSmall: string;
     panePaddingMedium: string;
     panePaddingLarge: string;

package/lib/tabs/styles/_common.js

@@ -22,6 +22,12 @@ exports.default = {
     tabPaddingSmallCard: '6px 10px',
     tabPaddingMediumCard: '8px 12px',
     tabPaddingLargeCard: '8px 16px',
+    tabPaddingSmallSegment: '4px 0',
+    tabPaddingMediumSegment: '6px 0',
+    tabPaddingLargeSegment: '8px 0',
+    tabGapSmallSegment: '0',
+    tabGapMediumSegment: '0',
+    tabGapLargeSegment: '0',
     panePaddingSmall: '8px 0 0 0',
     panePaddingMedium: '12px 0 0 0',
     panePaddingLarge: '16px 0 0 0'

package/lib/tabs/styles/dark.js

@@ -5,6 +5,12 @@ const light_1 = require("./light");
 const tabsDark = {
     name: 'Tabs',
     common: common_1.commonDark,
-    self: light_1.self
+    self(vars) {
+        const commonSelf = (0, light_1.self)(vars);
+        const { inputColor } = vars;
+        commonSelf.colorSegment = inputColor;
+        commonSelf.tabColorSegment = inputColor;
+        return commonSelf;
+    }
 };
 exports.default = tabsDark;

package/lib/tabs/styles/light.d.ts

@@ -1,11 +1,16 @@
 import type { ThemeCommonVars } from '../../_styles/common';
 import { Theme } from '../../_mixins';
 export declare const self: (vars: ThemeCommonVars) => {
+    colorSegment: string;
     tabFontSizeCard: string;
     tabTextColorLine: string;
     tabTextColorActiveLine: string;
     tabTextColorHoverLine: string;
     tabTextColorDisabledLine: string;
+    tabTextColorSegment: string;
+    tabTextColorActiveSegment: string;
+    tabTextColorHoverSegment: string;
+    tabTextColorDisabledSegment: string;
     tabTextColorBar: string;
     tabTextColorActiveBar: string;
     tabTextColorHoverBar: string;
@@ -19,11 +24,13 @@ export declare const self: (vars: ThemeCommonVars) => {
     closeColorHover: string;
     closeColorPressed: string;
     tabColor: string;
+    tabColorSegment: string;
     tabBorderColor: string;
     tabFontWeightActive: string;
     tabFontWeight: string;
     tabBorderRadius: string;
     paneTextColor: string;
+    fontWeightStrong: string;
     tabFontSizeSmall: string;
     tabFontSizeMedium: string;
     tabFontSizeLarge: string;
@@ -45,6 +52,12 @@ export declare const self: (vars: ThemeCommonVars) => {
     tabPaddingSmallCard: string;
     tabPaddingMediumCard: string;
     tabPaddingLargeCard: string;
+    tabPaddingSmallSegment: string;
+    tabPaddingMediumSegment: string;
+    tabPaddingLargeSegment: string;
+    tabGapSmallSegment: string;
+    tabGapMediumSegment: string;
+    tabGapLargeSegment: string;
     panePaddingSmall: string;
     panePaddingMedium: string;
     panePaddingLarge: string;

package/lib/tabs/styles/light.js

@@ -4,11 +4,11 @@ exports.self = void 0;
 const _common_1 = require("./_common");
 const common_1 = require("../../_styles/common");
 const self = (vars) => {
-    const { textColor2, primaryColor, textColorDisabled, closeColor, closeColorHover, closeColorPressed, tabColor, dividerColor, fontWeight, textColor1, borderRadius, fontSize } = vars;
-    return Object.assign(Object.assign({}, _common_1.default), { tabFontSizeCard: fontSize, tabTextColorLine: textColor1, tabTextColorActiveLine: primaryColor, tabTextColorHoverLine: primaryColor, tabTextColorDisabledLine: textColorDisabled, tabTextColorBar: textColor1, tabTextColorActiveBar: primaryColor, tabTextColorHoverBar: primaryColor, tabTextColorDisabledBar: textColorDisabled, tabTextColorCard: textColor1, tabTextColorHoverCard: textColor1, tabTextColorActiveCard: primaryColor, tabTextColorDisabledCard: textColorDisabled, barColor: primaryColor, closeColor,
+    const { textColor2, primaryColor, textColorDisabled, closeColor, closeColorHover, closeColorPressed, tabColor, baseColor, dividerColor, fontWeight, textColor1, borderRadius, fontSize, fontWeightStrong } = vars;
+    return Object.assign(Object.assign({}, _common_1.default), { colorSegment: tabColor, tabFontSizeCard: fontSize, tabTextColorLine: textColor1, tabTextColorActiveLine: primaryColor, tabTextColorHoverLine: primaryColor, tabTextColorDisabledLine: textColorDisabled, tabTextColorSegment: textColor1, tabTextColorActiveSegment: primaryColor, tabTextColorHoverSegment: primaryColor, tabTextColorDisabledSegment: textColorDisabled, tabTextColorBar: textColor1, tabTextColorActiveBar: primaryColor, tabTextColorHoverBar: primaryColor, tabTextColorDisabledBar: textColorDisabled, tabTextColorCard: textColor1, tabTextColorHoverCard: textColor1, tabTextColorActiveCard: primaryColor, tabTextColorDisabledCard: textColorDisabled, barColor: primaryColor, closeColor,
         closeColorHover,
         closeColorPressed,
-        tabColor, tabBorderColor: dividerColor, tabFontWeightActive: fontWeight, tabFontWeight: fontWeight, tabBorderRadius: borderRadius, paneTextColor: textColor2 });
+        tabColor, tabColorSegment: baseColor, tabBorderColor: dividerColor, tabFontWeightActive: fontWeight, tabFontWeight: fontWeight, tabBorderRadius: borderRadius, paneTextColor: textColor2, fontWeightStrong });
 };
 exports.self = self;
 const tabsLight = {

package/lib/tag/src/styles/index.cssr.js

@@ -49,7 +49,7 @@ exports.default = (0, cssr_1.cB)('tag', `
  color .3s var(--bezier),
  box-shadow .3s var(--bezier),
  opacity .3s var(--bezier);
- line-height: var(--height);
+ line-height: 1.5;
  height: var(--height);
  font-size: var(--font-size);
 `, [(0, cssr_1.cE)('border', `

package/lib/time/src/Time.d.ts

@@ -3,7 +3,7 @@ import { ExtractPublicPropTypes } from '../../_utils';
 declare const timeProps: {
     readonly time: {
         readonly type: PropType<number | Date>;
-        readonly default: () => number;
+        readonly default: undefined;
     };
     readonly type: {
         readonly type: PropType<"relative" | "date" | "datetime">;
@@ -11,23 +11,18 @@ declare const timeProps: {
     };
     readonly to: {
         readonly type: PropType<number | Date>;
-        readonly default: () => number;
-    };
-    readonly unix: {
-        readonly type: BooleanConstructor;
-        readonly default: false;
+        readonly default: undefined;
     };
+    readonly unix: BooleanConstructor;
     readonly format: StringConstructor;
-    readonly text: {
-        readonly type: BooleanConstructor;
-        readonly default: false;
-    };
+    readonly text: BooleanConstructor;
+    readonly timezone: StringConstructor;
 };
 export declare type TimeProps = ExtractPublicPropTypes<typeof timeProps>;
 declare const _default: import("vue").DefineComponent<{
     readonly time: {
         readonly type: PropType<number | Date>;
-        readonly default: () => number;
+        readonly default: undefined;
     };
     readonly type: {
         readonly type: PropType<"relative" | "date" | "datetime">;
@@ -35,17 +30,12 @@ declare const _default: import("vue").DefineComponent<{
     };
     readonly to: {
         readonly type: PropType<number | Date>;
-        readonly default: () => number;
-    };
-    readonly unix: {
-        readonly type: BooleanConstructor;
-        readonly default: false;
+        readonly default: undefined;
     };
+    readonly unix: BooleanConstructor;
     readonly format: StringConstructor;
-    readonly text: {
-        readonly type: BooleanConstructor;
-        readonly default: false;
-    };
+    readonly text: BooleanConstructor;
+    readonly timezone: StringConstructor;
 }, {
     renderedTime: import("vue").ComputedRef<string>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
@@ -55,14 +45,16 @@ declare const _default: import("vue").DefineComponent<{
     readonly unix?: unknown;
     readonly format?: unknown;
     readonly text?: unknown;
+    readonly timezone?: unknown;
 } & {
     type: "relative" | "date" | "datetime";
     text: boolean;
-    time: number | Date;
-    to: number | Date;
     unix: boolean;
 } & {
+    time?: number | Date | undefined;
     format?: string | undefined;
+    to?: number | Date | undefined;
+    timezone?: string | undefined;
 }>, {
     type: "relative" | "date" | "datetime";
     text: boolean;

package/lib/time/src/Time.js

@@ -2,11 +2,12 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const vue_1 = require("vue");
 const date_fns_1 = require("date-fns");
+const date_fns_tz_1 = require("date-fns-tz");
 const _mixins_1 = require("../../_mixins");
 const timeProps = {
     time: {
         type: [Number, Date],
-        default: () => Date.now()
+        default: undefined // For unix or non unix mode, it should be different default value
     },
     type: {
         type: String,
@@ -14,49 +15,62 @@ const timeProps = {
     },
     to: {
         type: [Number, Date],
-        default: () => Date.now()
-    },
-    unix: {
-        type: Boolean,
-        default: false
+        default: undefined // the same as `time` prop
     },
+    unix: Boolean,
     format: String,
-    text: {
-        type: Boolean,
-        default: false
-    }
+    text: Boolean,
+    timezone: String
 };
 exports.default = (0, vue_1.defineComponent)({
     name: 'Time',
     props: timeProps,
     setup(props) {
+        const now = Date.now();
         const { localeRef, dateLocaleRef } = (0, _mixins_1.useLocale)('Time');
+        const mergedFormatRef = (0, vue_1.computed)(() => {
+            const { timezone } = props;
+            if (timezone) {
+                return (time, _format) => {
+                    return (0, date_fns_1.format)((0, date_fns_1.getTime)(time) +
+                        -(0, date_fns_tz_1.getTimezoneOffset)(Intl.DateTimeFormat().resolvedOptions().timeZone, time) +
+                        (0, date_fns_tz_1.getTimezoneOffset)(timezone, time), _format);
+                };
+            }
+            return date_fns_1.format;
+        });
         const dateFnsOptionsRef = (0, vue_1.computed)(() => {
             return {
                 locale: dateLocaleRef.value.locale
             };
         });
         const mergedTimeRef = (0, vue_1.computed)(() => {
+            const { time } = props;
             if (props.unix) {
-                return (0, date_fns_1.fromUnixTime)(props.time);
+                if (time === undefined)
+                    return now;
+                return (0, date_fns_1.fromUnixTime)(typeof time === 'number' ? time : time.valueOf());
             }
-            return props.time;
+            return time !== null && time !== void 0 ? time : now;
         });
         const mergedToRef = (0, vue_1.computed)(() => {
+            const { to } = props;
             if (props.unix) {
-                return (0, date_fns_1.fromUnixTime)(props.to);
+                if (to === undefined)
+                    return now;
+                return (0, date_fns_1.fromUnixTime)(typeof to === 'number' ? to : to.valueOf());
             }
-            return props.to;
+            return to !== null && to !== void 0 ? to : now;
         });
         const renderedTimeRef = (0, vue_1.computed)(() => {
             if (props.format) {
-                return (0, date_fns_1.format)(mergedTimeRef.value, props.format, dateFnsOptionsRef.value);
+                return mergedFormatRef.value(mergedTimeRef.value, props.format, dateFnsOptionsRef.value);
             }
             else if (props.type === 'date') {
-                return (0, date_fns_1.format)(mergedTimeRef.value, localeRef.value.dateFormat, dateFnsOptionsRef.value);
+                return mergedFormatRef.value(mergedTimeRef.value, localeRef.value.dateFormat, dateFnsOptionsRef.value);
             }
             else if (props.type === 'datetime') {
-                return (0, date_fns_1.format)(mergedTimeRef.value, localeRef.value.dateTimeFormat, dateFnsOptionsRef.value);
+                return mergedFormatRef.value(mergedTimeRef.value, localeRef.value.dateTimeFormat, dateFnsOptionsRef.value);
             }
             else {
                 return (0, date_fns_1.formatDistance)(mergedTimeRef.value, mergedToRef.value, {

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

@@ -29,6 +29,7 @@ declare const timePickerProps: {
     size: PropType<Size>;
     isMinuteDisabled: PropType<IsMinuteDisabled>;
     isSecondDisabled: PropType<IsSecondDisabled>;
+    inputReadonly: BooleanConstructor;
     clearable: BooleanConstructor;
     'onUpdate:value': PropType<MaybeArray<OnUpdateValue>>;
     onUpdateValue: PropType<MaybeArray<OnUpdateValue>>;
@@ -921,6 +922,7 @@ declare const _default: import("vue").DefineComponent<{
     size: PropType<Size>;
     isMinuteDisabled: PropType<IsMinuteDisabled>;
     isSecondDisabled: PropType<IsSecondDisabled>;
+    inputReadonly: BooleanConstructor;
     clearable: BooleanConstructor;
     'onUpdate:value': PropType<MaybeArray<OnUpdateValue>>;
     onUpdateValue: PropType<MaybeArray<OnUpdateValue>>;
@@ -2290,6 +2292,7 @@ declare const _default: import("vue").DefineComponent<{
     size?: unknown;
     isMinuteDisabled?: unknown;
     isSecondDisabled?: unknown;
+    inputReadonly?: unknown;
     clearable?: unknown;
     'onUpdate:value'?: unknown;
     onUpdateValue?: unknown;
@@ -2312,6 +2315,7 @@ declare const _default: import("vue").DefineComponent<{
     defaultValue: number | null;
     stateful: boolean;
     showIcon: boolean;
+    inputReadonly: boolean;
 } & {
     value?: number | null | undefined;
     size?: Size | undefined;
@@ -3170,5 +3174,6 @@ declare const _default: import("vue").DefineComponent<{
     defaultValue: number | null;
     stateful: boolean;
     showIcon: boolean;
+    inputReadonly: boolean;
 }>;
 export default _default;

package/lib/time-picker/src/TimePicker.js

@@ -41,7 +41,7 @@ const timePickerProps = Object.assign(Object.assign({}, _mixins_1.useTheme.props
     }, value: Number, format: {
         type: String,
         default: 'HH:mm:ss'
-    }, isHourDisabled: Function, size: String, isMinuteDisabled: Function, isSecondDisabled: Function, clearable: Boolean, 'onUpdate:value': [Function, Array], onUpdateValue: [Function, Array], onBlur: [Function, Array], onFocus: [Function, Array], 
+    }, isHourDisabled: Function, size: String, isMinuteDisabled: Function, isSecondDisabled: Function, inputReadonly: Boolean, clearable: Boolean, 'onUpdate:value': [Function, Array], onUpdateValue: [Function, Array], onBlur: [Function, Array], onFocus: [Function, Array], 
     // private
     stateful: {
         type: Boolean,
@@ -521,7 +521,7 @@ exports.default = (0, vue_1.defineComponent)({
             (0, vue_1.h)(vueuc_1.VBinder, null, {
                 default: () => [
                     (0, vue_1.h)(vueuc_1.VTarget, null, {
-                        default: () => ((0, vue_1.h)(input_1.NInput, { ref: "inputInstRef", value: this.displayTimeString, bordered: this.mergedBordered, passivelyActivated: true, attrSize: this.mergedAttrSize, theme: this.mergedTheme.peers.Input, themeOverrides: this.mergedTheme.peerOverrides.Input, stateful: this.stateful, size: this.mergedSize, placeholder: this.localizedPlaceholder, clearable: this.clearable, disabled: this.mergedDisabled, textDecoration: this.isValueInvalid ? 'line-through' : undefined, onFocus: this.handleTimeInputFocus, onBlur: this.handleTimeInputBlur, onActivate: this.handleTimeInputActivate, onDeactivate: this.handleTimeInputDeactivate, onUpdateValue: this.handleTimeInputUpdateValue, onClear: this.handleTimeInputClear, internalDeactivateOnEnter: true, internalForceFocus: this.active, onClick: this.handleTriggerClick }, this.showIcon
+                        default: () => ((0, vue_1.h)(input_1.NInput, { ref: "inputInstRef", value: this.displayTimeString, bordered: this.mergedBordered, passivelyActivated: true, attrSize: this.mergedAttrSize, theme: this.mergedTheme.peers.Input, themeOverrides: this.mergedTheme.peerOverrides.Input, stateful: this.stateful, size: this.mergedSize, placeholder: this.localizedPlaceholder, clearable: this.clearable, disabled: this.mergedDisabled, textDecoration: this.isValueInvalid ? 'line-through' : undefined, onFocus: this.handleTimeInputFocus, onBlur: this.handleTimeInputBlur, onActivate: this.handleTimeInputActivate, onDeactivate: this.handleTimeInputDeactivate, onUpdateValue: this.handleTimeInputUpdateValue, onClear: this.handleTimeInputClear, internalDeactivateOnEnter: true, internalForceFocus: this.active, readonly: this.inputReadonly || this.mergedDisabled, onClick: this.handleTriggerClick }, this.showIcon
                             ? {
                                 [this.clearable ? 'clear' : 'suffix']: () => ((0, vue_1.h)(_internal_1.NBaseIcon, { clsPrefix: mergedClsPrefix, class: `${mergedClsPrefix}-time-picker-icon` }, {
                                     default: () => (0, vue_1.h)(icons_1.TimeIcon, null)

package/lib/timeline/src/Timeline.d.ts

@@ -12,6 +12,7 @@ declare const timelineProps: {
         readonly type: PropType<"medium" | "large">;
         readonly default: "medium";
     };
+    readonly iconSize: NumberConstructor;
     readonly theme: PropType<import("../../_mixins").Theme<"Timeline", {
         contentFontSize: string;
         titleFontWeight: string;
@@ -20,6 +21,11 @@ declare const timelineProps: {
         circleBorderError: string;
         circleBorderSuccess: string;
         circleBorderWarning: string;
+        iconColor: string;
+        iconColorInfo: string;
+        iconColorError: string;
+        iconColorSuccess: string;
+        iconColorWarning: string;
         titleTextColor: string;
         contentTextColor: string;
         metaTextColor: string;
@@ -28,6 +34,8 @@ declare const timelineProps: {
         titleMarginLarge: string;
         titleFontSizeMedium: string;
         titleFontSizeLarge: string;
+        iconSizeMedium: string;
+        iconSizeLarge: string;
     }, any>>;
     readonly themeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Timeline", {
         contentFontSize: string;
@@ -37,6 +45,11 @@ declare const timelineProps: {
         circleBorderError: string;
         circleBorderSuccess: string;
         circleBorderWarning: string;
+        iconColor: string;
+        iconColorInfo: string;
+        iconColorError: string;
+        iconColorSuccess: string;
+        iconColorWarning: string;
         titleTextColor: string;
         contentTextColor: string;
         metaTextColor: string;
@@ -45,6 +58,8 @@ declare const timelineProps: {
         titleMarginLarge: string;
         titleFontSizeMedium: string;
         titleFontSizeLarge: string;
+        iconSizeMedium: string;
+        iconSizeLarge: string;
     }, any>>>;
     readonly builtinThemeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Timeline", {
         contentFontSize: string;
@@ -54,6 +69,11 @@ declare const timelineProps: {
         circleBorderError: string;
         circleBorderSuccess: string;
         circleBorderWarning: string;
+        iconColor: string;
+        iconColorInfo: string;
+        iconColorError: string;
+        iconColorSuccess: string;
+        iconColorWarning: string;
         titleTextColor: string;
         contentTextColor: string;
         metaTextColor: string;
@@ -62,6 +82,8 @@ declare const timelineProps: {
         titleMarginLarge: string;
         titleFontSizeMedium: string;
         titleFontSizeLarge: string;
+        iconSizeMedium: string;
+        iconSizeLarge: string;
     }, any>>>;
 };
 export interface TimelineInjection {
@@ -81,6 +103,7 @@ declare const _default: import("vue").DefineComponent<{
         readonly type: PropType<"medium" | "large">;
         readonly default: "medium";
     };
+    readonly iconSize: NumberConstructor;
     readonly theme: PropType<import("../../_mixins").Theme<"Timeline", {
         contentFontSize: string;
         titleFontWeight: string;
@@ -89,6 +112,11 @@ declare const _default: import("vue").DefineComponent<{
         circleBorderError: string;
         circleBorderSuccess: string;
         circleBorderWarning: string;
+        iconColor: string;
+        iconColorInfo: string;
+        iconColorError: string;
+        iconColorSuccess: string;
+        iconColorWarning: string;
         titleTextColor: string;
         contentTextColor: string;
         metaTextColor: string;
@@ -97,6 +125,8 @@ declare const _default: import("vue").DefineComponent<{
         titleMarginLarge: string;
         titleFontSizeMedium: string;
         titleFontSizeLarge: string;
+        iconSizeMedium: string;
+        iconSizeLarge: string;
     }, any>>;
     readonly themeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Timeline", {
         contentFontSize: string;
@@ -106,6 +136,11 @@ declare const _default: import("vue").DefineComponent<{
         circleBorderError: string;
         circleBorderSuccess: string;
         circleBorderWarning: string;
+        iconColor: string;
+        iconColorInfo: string;
+        iconColorError: string;
+        iconColorSuccess: string;
+        iconColorWarning: string;
         titleTextColor: string;
         contentTextColor: string;
         metaTextColor: string;
@@ -114,6 +149,8 @@ declare const _default: import("vue").DefineComponent<{
         titleMarginLarge: string;
         titleFontSizeMedium: string;
         titleFontSizeLarge: string;
+        iconSizeMedium: string;
+        iconSizeLarge: string;
     }, any>>>;
     readonly builtinThemeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Timeline", {
         contentFontSize: string;
@@ -123,6 +160,11 @@ declare const _default: import("vue").DefineComponent<{
         circleBorderError: string;
         circleBorderSuccess: string;
         circleBorderWarning: string;
+        iconColor: string;
+        iconColorInfo: string;
+        iconColorError: string;
+        iconColorSuccess: string;
+        iconColorWarning: string;
         titleTextColor: string;
         contentTextColor: string;
         metaTextColor: string;
@@ -131,11 +173,14 @@ declare const _default: import("vue").DefineComponent<{
         titleMarginLarge: string;
         titleFontSizeMedium: string;
         titleFontSizeLarge: string;
+        iconSizeMedium: string;
+        iconSizeLarge: string;
     }, any>>>;
 }, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
     readonly horizontal?: unknown;
     readonly itemPlacement?: unknown;
     readonly size?: unknown;
+    readonly iconSize?: unknown;
     readonly theme?: unknown;
     readonly themeOverrides?: unknown;
     readonly builtinThemeOverrides?: unknown;
@@ -152,6 +197,11 @@ declare const _default: import("vue").DefineComponent<{
         circleBorderError: string;
         circleBorderSuccess: string;
         circleBorderWarning: string;
+        iconColor: string;
+        iconColorInfo: string;
+        iconColorError: string;
+        iconColorSuccess: string;
+        iconColorWarning: string;
         titleTextColor: string;
         contentTextColor: string;
         metaTextColor: string;
@@ -160,6 +210,8 @@ declare const _default: import("vue").DefineComponent<{
         titleMarginLarge: string;
         titleFontSizeMedium: string;
         titleFontSizeLarge: string;
+        iconSizeMedium: string;
+        iconSizeLarge: string;
     }, any> | undefined;
     themeOverrides?: import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Timeline", {
         contentFontSize: string;
@@ -169,6 +221,11 @@ declare const _default: import("vue").DefineComponent<{
         circleBorderError: string;
         circleBorderSuccess: string;
         circleBorderWarning: string;
+        iconColor: string;
+        iconColorInfo: string;
+        iconColorError: string;
+        iconColorSuccess: string;
+        iconColorWarning: string;
         titleTextColor: string;
         contentTextColor: string;
         metaTextColor: string;
@@ -177,6 +234,8 @@ declare const _default: import("vue").DefineComponent<{
         titleMarginLarge: string;
         titleFontSizeMedium: string;
         titleFontSizeLarge: string;
+        iconSizeMedium: string;
+        iconSizeLarge: string;
     }, any>> | undefined;
     builtinThemeOverrides?: import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Timeline", {
         contentFontSize: string;
@@ -186,6 +245,11 @@ declare const _default: import("vue").DefineComponent<{
         circleBorderError: string;
         circleBorderSuccess: string;
         circleBorderWarning: string;
+        iconColor: string;
+        iconColorInfo: string;
+        iconColorError: string;
+        iconColorSuccess: string;
+        iconColorWarning: string;
         titleTextColor: string;
         contentTextColor: string;
         metaTextColor: string;
@@ -194,7 +258,10 @@ declare const _default: import("vue").DefineComponent<{
         titleMarginLarge: string;
         titleFontSizeMedium: string;
         titleFontSizeLarge: string;
+        iconSizeMedium: string;
+        iconSizeLarge: string;
     }, any>> | undefined;
+    iconSize?: number | undefined;
 }>, {
     size: "medium" | "large";
     horizontal: boolean;

package/lib/timeline/src/Timeline.js

@@ -11,7 +11,7 @@ const timelineProps = Object.assign(Object.assign({}, _mixins_1.useTheme.props),
     }, size: {
         type: String,
         default: 'medium'
-    } });
+    }, iconSize: Number });
 exports.timelineInjectionKey = Symbol('timeline');
 exports.default = (0, vue_1.defineComponent)({
     name: 'Timeline',

package/lib/timeline/src/TimelineItem.d.ts

@@ -25,6 +25,7 @@ declare const _default: import("vue").DefineComponent<{
     cssVars: import("vue").ComputedRef<{
         '--bezier': string;
         '--circle-border': string;
+        '--icon-color': string;
         '--content-font-size': string;
         '--content-text-color': string;
         '--line-color': string;
@@ -33,6 +34,7 @@ declare const _default: import("vue").DefineComponent<{
         '--title-font-weight': string;
         '--title-margin': string | number;
         '--title-text-color': string;
+        '--icon-size': string;
     }>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
     time?: unknown;