timered-counter
Version:
Make the value change more vivid and natural
43 lines (42 loc) • 1.6 kB
TypeScript
import { LitElement, PropertyValues } from 'lit';
import { PartData } from '../../types/group.js';
import { PartPreprocessedData } from '../../utils/preprocess-part-data.js';
import './roller-digit.js';
export declare class TimeredCounterRoller extends LitElement {
static styles: import("lit").CSSResult[];
color: string;
direction: 'up' | 'down';
parts: PartData[];
partPreprocessDataList: PartPreprocessedData[][];
animationOptions: KeyframeAnimationOptions[][];
keyframes: PropertyIndexedKeyframes[][];
cellStyles: Partial<CSSStyleDeclaration>[][][];
digitStyles: Partial<CSSStyleDeclaration>[][];
partStyles: Partial<CSSStyleDeclaration>[];
parentContainerRect: DOMRect;
prefixContainer: HTMLElement | undefined;
suffixContainer: HTMLElement | undefined;
private __partDigitsColorStyles;
protected render(): import("lit-html").TemplateResult<1>;
protected willUpdate(_changedProperties: PropertyValues): void;
/**
* 记录一次更新中, 启动动画并结束的 <timered-counter-roller-digit> 元素个数.
*
* 在每次更新前重置为 0.
*
* @see {@link __handleDigitAnimationEnd}
* @private
*/
private digitAnimateEndCount;
/**
* 记录一次更新中, 需要启动动画的 <timered-counter-roller-digit> 元素总数.
*
* 在每次更新前重新计算.
* @private
*/
private digitAnimatedCount;
private __handleDigitAnimationEnd;
private __emitAnimationStart;
private __emitAnimationEnd;
private __generatePartDigitsColorStyles;
}