timered-counter 0.0.3 → 0.0.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/custom-elements.json +1492 -1445
- package/dist/src/easing/index.d.ts +1 -0
- package/dist/src/easing/index.js +1 -0
- package/dist/src/easing/index.js.map +1 -1
- package/dist/src/index.d.ts +2 -0
- package/dist/src/index.js +2 -0
- package/dist/src/index.js.map +1 -1
- package/dist/src/mixins/counter-animation.d.ts +3 -3
- package/dist/src/mixins/counter-animation.js.map +1 -1
- package/dist/src/mixins/counter-base.js +2 -2
- package/dist/src/mixins/counter-base.js.map +1 -1
- package/dist/src/mixins/counter-parts.js +9 -1
- package/dist/src/mixins/counter-parts.js.map +1 -1
- package/dist/src/mixins/counter-styles.d.ts +4 -4
- package/dist/src/mixins/counter-styles.js.map +1 -1
- package/dist/src/styles/timered-counter-styles.js +16 -9
- package/dist/src/styles/timered-counter-styles.js.map +1 -1
- package/dist/src/timered-counter-datetime-duration.js +2 -1
- package/dist/src/timered-counter-datetime-duration.js.map +1 -1
- package/dist/src/timered-counter-number.js +2 -1
- package/dist/src/timered-counter-number.js.map +1 -1
- package/dist/src/timered-counter-string.d.ts +0 -2
- package/dist/src/timered-counter-string.js +2 -7
- package/dist/src/timered-counter-string.js.map +1 -1
- package/dist/src/timered-counter.js +2 -1
- package/dist/src/timered-counter.js.map +1 -1
- package/dist/src/transitions/roller/roller-digit.js +49 -58
- package/dist/src/transitions/roller/roller-digit.js.map +1 -1
- package/dist/src/transitions/roller/roller.d.ts +1 -1
- package/dist/src/transitions/roller/roller.js +17 -13
- package/dist/src/transitions/roller/roller.js.map +1 -1
- package/dist/src/transitions/roller/styles.js +15 -0
- package/dist/src/transitions/roller/styles.js.map +1 -1
- package/dist/src/types/index.d.ts +2 -0
- package/dist/src/types/index.js +3 -0
- package/dist/src/types/index.js.map +1 -0
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/package.json +1 -1
package/dist/src/easing/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/easing/index.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAC;AACtC,cAAc,8BAA8B,CAAC","sourcesContent":["export * from './easing-functions.js';\nexport * from './penner-easing-functions.js';\n"]}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/easing/index.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAC;AACtC,cAAc,mBAAmB,CAAC;AAClC,cAAc,8BAA8B,CAAC","sourcesContent":["export * from './easing-functions.js';\nexport * from './cubic-bezier.js';\nexport * from './penner-easing-functions.js';\n"]}
|
package/dist/src/index.d.ts
CHANGED
|
@@ -8,6 +8,8 @@ import { StringAdapter } from './string-adapter/index.js';
|
|
|
8
8
|
export declare function setNumberAdapter(adapterOrType: NumberAdapter | 'number' | 'decimal.js', config?: Decimal.Config): void;
|
|
9
9
|
export declare function setStringAdapter(adapterOrType: StringAdapter | 'string' | 'intl-segmenter' | 'grapheme-splitter'): void;
|
|
10
10
|
export { TimeredCounter, TimeredCounterDatetimeDuration, TimeredCounterNumber, TimeredCounterString, };
|
|
11
|
+
export * from './easing/index.js';
|
|
12
|
+
export * from './types/index.js';
|
|
11
13
|
declare global {
|
|
12
14
|
interface HTMLElementTagNameMap {
|
|
13
15
|
'timered-counter': TimeredCounter;
|
package/dist/src/index.js
CHANGED
|
@@ -10,4 +10,6 @@ export function setStringAdapter(adapterOrType) {
|
|
|
10
10
|
CounterAdapter.setStringAdapter(adapterOrType);
|
|
11
11
|
}
|
|
12
12
|
export { TimeredCounter, TimeredCounterDatetimeDuration, TimeredCounterNumber, TimeredCounterString, };
|
|
13
|
+
export * from './easing/index.js';
|
|
14
|
+
export * from './types/index.js';
|
|
13
15
|
//# sourceMappingURL=index.js.map
|
package/dist/src/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AACtD,OAAO,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;AACnE,OAAO,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;AACnE,OAAO,EAAE,8BAA8B,EAAE,MAAM,wCAAwC,CAAC;AAExF,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAEtD,MAAM,UAAU,gBAAgB,CAC9B,aAAsD,EACtD,MAAuB;IAEvB,cAAc,CAAC,gBAAgB,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC;AACzD,CAAC;AAED,MAAM,UAAU,gBAAgB,CAC9B,aAIuB;IAEvB,cAAc,CAAC,gBAAgB,CAAC,aAAa,CAAC,CAAC;AACjD,CAAC;AAED,OAAO,EACL,cAAc,EACd,8BAA8B,EAC9B,oBAAoB,EACpB,oBAAoB,GACrB,CAAC","sourcesContent":["import { Decimal } from 'decimal.js';\nimport { NumberAdapter } from './number-adapter/index.js';\nimport { TimeredCounter } from './timered-counter.js';\nimport { TimeredCounterNumber } from './timered-counter-number.js';\nimport { TimeredCounterString } from './timered-counter-string.js';\nimport { TimeredCounterDatetimeDuration } from './timered-counter-datetime-duration.js';\nimport { StringAdapter } from './string-adapter/index.js';\nimport { CounterAdapter } from './counter-adapter.js';\n\nexport function setNumberAdapter(\n adapterOrType: NumberAdapter | 'number' | 'decimal.js',\n config?: Decimal.Config,\n) {\n CounterAdapter.setNumberAdapter(adapterOrType, config);\n}\n\nexport function setStringAdapter(\n adapterOrType:\n | StringAdapter\n | 'string'\n | 'intl-segmenter'\n | 'grapheme-splitter',\n) {\n CounterAdapter.setStringAdapter(adapterOrType);\n}\n\nexport {\n TimeredCounter,\n TimeredCounterDatetimeDuration,\n TimeredCounterNumber,\n TimeredCounterString,\n};\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'timered-counter': TimeredCounter;\n 'timered-counter-datetime-duration': TimeredCounterDatetimeDuration;\n 'timered-counter-number': TimeredCounterNumber;\n 'timered-counter-string': TimeredCounterString;\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AACtD,OAAO,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;AACnE,OAAO,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;AACnE,OAAO,EAAE,8BAA8B,EAAE,MAAM,wCAAwC,CAAC;AAExF,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAEtD,MAAM,UAAU,gBAAgB,CAC9B,aAAsD,EACtD,MAAuB;IAEvB,cAAc,CAAC,gBAAgB,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC;AACzD,CAAC;AAED,MAAM,UAAU,gBAAgB,CAC9B,aAIuB;IAEvB,cAAc,CAAC,gBAAgB,CAAC,aAAa,CAAC,CAAC;AACjD,CAAC;AAED,OAAO,EACL,cAAc,EACd,8BAA8B,EAC9B,oBAAoB,EACpB,oBAAoB,GACrB,CAAC;AAEF,cAAc,mBAAmB,CAAC;AAClC,cAAc,kBAAkB,CAAC","sourcesContent":["import { Decimal } from 'decimal.js';\nimport { NumberAdapter } from './number-adapter/index.js';\nimport { TimeredCounter } from './timered-counter.js';\nimport { TimeredCounterNumber } from './timered-counter-number.js';\nimport { TimeredCounterString } from './timered-counter-string.js';\nimport { TimeredCounterDatetimeDuration } from './timered-counter-datetime-duration.js';\nimport { StringAdapter } from './string-adapter/index.js';\nimport { CounterAdapter } from './counter-adapter.js';\n\nexport function setNumberAdapter(\n adapterOrType: NumberAdapter | 'number' | 'decimal.js',\n config?: Decimal.Config,\n) {\n CounterAdapter.setNumberAdapter(adapterOrType, config);\n}\n\nexport function setStringAdapter(\n adapterOrType:\n | StringAdapter\n | 'string'\n | 'intl-segmenter'\n | 'grapheme-splitter',\n) {\n CounterAdapter.setStringAdapter(adapterOrType);\n}\n\nexport {\n TimeredCounter,\n TimeredCounterDatetimeDuration,\n TimeredCounterNumber,\n TimeredCounterString,\n};\n\nexport * from './easing/index.js';\nexport * from './types/index.js';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'timered-counter': TimeredCounter;\n 'timered-counter-datetime-duration': TimeredCounterDatetimeDuration;\n 'timered-counter-number': TimeredCounterNumber;\n 'timered-counter-string': TimeredCounterString;\n }\n}\n"]}
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import { Constructor } from 'type-fest';
|
|
2
|
-
import { PartDigitGetter,
|
|
2
|
+
import { PartDigitGetter, PartDigitValueOrGetter } from '../types/group.js';
|
|
3
3
|
import { CounterPartsMixin } from './counter-parts.js';
|
|
4
4
|
import { AvailableNumberAdapterValueType } from '../number-adapter/index.js';
|
|
5
5
|
export declare class CounterAnimationMixinInterface {
|
|
6
|
-
animationOptions:
|
|
6
|
+
animationOptions: PartDigitValueOrGetter<KeyframeAnimationOptions>;
|
|
7
7
|
animationOptionsDynamic?: PartDigitGetter<KeyframeAnimationOptions>;
|
|
8
8
|
extractAnimationOptions(): KeyframeAnimationOptions[][];
|
|
9
|
-
keyframes:
|
|
9
|
+
keyframes: PartDigitValueOrGetter<PropertyIndexedKeyframes>;
|
|
10
10
|
keyframesDynamic?: PartDigitGetter<PropertyIndexedKeyframes>;
|
|
11
11
|
extractKeyframes(): PropertyIndexedKeyframes[][];
|
|
12
12
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"counter-animation.js","sourceRoot":"","sources":["../../../src/mixins/counter-animation.ts"],"names":[],"mappings":";AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,QAAQ,CAAC;AAMrC,OAAO,EACL,sBAAsB,EACtB,oBAAoB,GACrB,MAAM,kCAAkC,CAAC;AAkB1C,MAAM,CAAC,MAAM,qBAAqB,GAAG,CAMnC,UAAa,EACb,EAAE;IACF,MAAM,0BAA2B,SAAQ,UAAU;QAAnD;;YACE;;eAEG;YAEH,qBAAgB,
|
|
1
|
+
{"version":3,"file":"counter-animation.js","sourceRoot":"","sources":["../../../src/mixins/counter-animation.ts"],"names":[],"mappings":";AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,QAAQ,CAAC;AAMrC,OAAO,EACL,sBAAsB,EACtB,oBAAoB,GACrB,MAAM,kCAAkC,CAAC;AAkB1C,MAAM,CAAC,MAAM,qBAAqB,GAAG,CAMnC,UAAa,EACb,EAAE;IACF,MAAM,0BAA2B,SAAQ,UAAU;QAAnD;;YACE;;eAEG;YAEH,qBAAgB,GAAqD,EAAE,CAAC;YAIhE,2BAAsB,GAC5B,EAAE,CAAC;YAwBL;;eAEG;YAEH,cAAS,GAAqD,EAAE,CAAC;YAIzD,oBAAe,GAA+C,EAAE,CAAC;QAuB3E,CAAC;QArDC,uBAAuB;YACrB,MAAM,aAAa,GAAuB;gBACxC,cAAc,EAAE,IAAI,CAAC,sBAAsB;gBAC3C,IAAI,EAAE,IAAI,CAAC,KAAK;gBAChB,SAAS,EAAE,IAAI,CAAC,SAAS;gBACzB,KAAK,EAAE,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,QAAQ,CAAC;aACnC,CAAC;YACF,MAAM,MAAM,GAAG,oBAAoB,CACjC,sBAAsB,CAAC,IAAI,CAAC,gBAAgB,IAAI,EAAE,EAAE,aAAa,CAAC,EAClE,sBAAsB,CACpB,IAAI,CAAC,uBAAuB,IAAI,EAAE,EAClC,aAAa,CACd,CACF,CAAC;YAEF,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,sBAAsB,EAAE,MAAM,CAAC,EAAE,CAAC;gBACtD,IAAI,CAAC,sBAAsB,GAAG,MAAM,CAAC;YACvC,CAAC;YAED,OAAO,IAAI,CAAC,sBAAsB,CAAC;QACrC,CAAC;QAYD,gBAAgB;YACd,MAAM,aAAa,GAAuB;gBACxC,cAAc,EAAE,IAAI,CAAC,sBAAsB;gBAC3C,IAAI,EAAE,IAAI,CAAC,KAAK;gBAChB,SAAS,EAAE,IAAI,CAAC,SAAS;gBACzB,KAAK,EAAE,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,QAAQ,CAAC;aACnC,CAAC;YACF,MAAM,MAAM,GAAG,oBAAoB,CACjC,sBAAsB,CAAC,IAAI,CAAC,SAAS,IAAI,EAAE,EAAE,aAAa,CAAC,EAC3D,sBAAsB,CAAC,IAAI,CAAC,gBAAgB,IAAI,EAAE,EAAE,aAAa,CAAC,CACnE,CAAC;YAEF,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,eAAe,EAAE,MAAM,CAAC,EAAE,CAAC;gBAC/C,IAAI,CAAC,eAAe,GAAG,MAGlB,CAAC;YACR,CAAC;YAED,OAAO,IAAI,CAAC,eAAe,CAAC;QAC9B,CAAC;KACF;IA5DC;QADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,mBAAmB,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;wEACF;IAiCxE;QADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,WAAW,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;iEACD;IA6BnE,OAAO,0BACJ,CAAC;AACN,CAAC,CAAC","sourcesContent":["import { Constructor } from 'type-fest';\nimport { property } from 'lit/decorators.js';\nimport { isDeepEqual } from 'remeda';\nimport {\n GroupGetterOptions,\n PartDigitGetter,\n PartDigitValueOrGetter,\n} from '../types/group.js';\nimport {\n extractPartDigitOption,\n mergePartDigitOption,\n} from '../utils/extract-group-option.js';\nimport { CounterPartsMixin } from './counter-parts.js';\nimport { AvailableNumberAdapterValueType } from '../number-adapter/index.js';\n\nexport declare class CounterAnimationMixinInterface {\n animationOptions: PartDigitValueOrGetter<KeyframeAnimationOptions>;\n\n animationOptionsDynamic?: PartDigitGetter<KeyframeAnimationOptions>;\n\n extractAnimationOptions(): KeyframeAnimationOptions[][];\n\n keyframes: PartDigitValueOrGetter<PropertyIndexedKeyframes>;\n\n keyframesDynamic?: PartDigitGetter<PropertyIndexedKeyframes>;\n\n extractKeyframes(): PropertyIndexedKeyframes[][];\n}\n\nexport const CounterAnimationMixin = <\n V extends AvailableNumberAdapterValueType,\n T extends ReturnType<typeof CounterPartsMixin<V>> = ReturnType<\n typeof CounterPartsMixin<V>\n >,\n>(\n superClass: T,\n) => {\n class CounterAnimationMixinClass extends superClass {\n /**\n * 传递给 Web Animations API 的选项.\n */\n @property({ type: Object, attribute: 'animation-options', reflect: true })\n animationOptions: PartDigitValueOrGetter<KeyframeAnimationOptions> = {};\n\n animationOptionsDynamic?: PartDigitGetter<KeyframeAnimationOptions>;\n\n private cachedAnimationOptions: (KeyframeAnimationOptions | undefined)[][] =\n [];\n\n extractAnimationOptions() {\n const getterOptions: GroupGetterOptions = {\n preprocessData: this.partPreprocessDataList,\n data: this.parts,\n direction: this.direction,\n value: [this.value, this.oldValue],\n };\n const result = mergePartDigitOption(\n extractPartDigitOption(this.animationOptions ?? {}, getterOptions),\n extractPartDigitOption(\n this.animationOptionsDynamic ?? {},\n getterOptions,\n ),\n );\n\n if (!isDeepEqual(this.cachedAnimationOptions, result)) {\n this.cachedAnimationOptions = result;\n }\n\n return this.cachedAnimationOptions;\n }\n\n /**\n * 传递给 Web Animations API 的关键帧配置.\n */\n @property({ type: Object, attribute: 'keyframes', reflect: true })\n keyframes: PartDigitValueOrGetter<PropertyIndexedKeyframes> = {};\n\n keyframesDynamic?: PartDigitGetter<PropertyIndexedKeyframes>;\n\n private cachedKeyframes: (PropertyIndexedKeyframes | undefined)[][] = [];\n\n extractKeyframes() {\n const getterOptions: GroupGetterOptions = {\n preprocessData: this.partPreprocessDataList,\n data: this.parts,\n direction: this.direction,\n value: [this.value, this.oldValue],\n };\n const result = mergePartDigitOption(\n extractPartDigitOption(this.keyframes ?? {}, getterOptions),\n extractPartDigitOption(this.keyframesDynamic ?? {}, getterOptions),\n );\n\n if (!isDeepEqual(this.cachedKeyframes, result)) {\n this.cachedKeyframes = result as (\n | PropertyIndexedKeyframes\n | undefined\n )[][];\n }\n\n return this.cachedKeyframes;\n }\n }\n\n return CounterAnimationMixinClass as Constructor<CounterAnimationMixinInterface> &\n T;\n};\n"]}
|
|
@@ -77,7 +77,8 @@ export const CounterBaseMixin = (superClass) => {
|
|
|
77
77
|
}
|
|
78
78
|
willUpdate(changedProperties) {
|
|
79
79
|
super.willUpdate(changedProperties);
|
|
80
|
-
if (
|
|
80
|
+
if (changedProperties.has('value') &&
|
|
81
|
+
!changedProperties.has('oldValue')) {
|
|
81
82
|
// oldValue 未被手动设置时, 使用默认策略更新 oldValue.
|
|
82
83
|
this.oldValue = changedProperties.get('value') ?? this.value;
|
|
83
84
|
}
|
|
@@ -87,7 +88,6 @@ export const CounterBaseMixin = (superClass) => {
|
|
|
87
88
|
? 'down'
|
|
88
89
|
: 'up';
|
|
89
90
|
}
|
|
90
|
-
// }
|
|
91
91
|
}
|
|
92
92
|
/**
|
|
93
93
|
* oldValue 的默认初始值应当来自 initialValue 或 value.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"counter-base.js","sourceRoot":"","sources":["../../../src/mixins/counter-base.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, PropertyValues } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { isNonNullish, isNullish, isString } from 'remeda';\nimport { Constructor } from 'type-fest';\nimport {\n NumberAdapter,\n AvailableNumberAdapterValueType,\n} from '../number-adapter/index.js';\nimport { StringAdapter } from '../string-adapter/index.js';\nimport { CounterAdapter } from '../counter-adapter.js';\n\nexport declare class CounterBaseMixinInterface<\n V extends AvailableNumberAdapterValueType,\n> {\n static NUMBER_ADAPTER: NumberAdapter;\n\n static STRING_ADAPTER: StringAdapter;\n\n get value(): V;\n\n set value(value: V);\n\n get oldValue(): V;\n\n set oldValue(value: V);\n\n get initialValue(): V;\n\n set initialValue(value: V);\n\n direction: 'up' | 'down';\n\n oldDirection: 'up' | 'down';\n\n locale:\n | Intl.UnicodeBCP47LocaleIdentifier\n | [Intl.UnicodeBCP47LocaleIdentifier, Intl.LocaleOptions];\n\n localeInstance: Intl.Locale;\n\n numberAdapter: NumberAdapter;\n\n stringAdapter: StringAdapter;\n}\n\nexport const CounterBaseMixin = <\n V extends AvailableNumberAdapterValueType,\n T extends Constructor<LitElement> = Constructor<LitElement>,\n>(\n superClass: T,\n) => {\n class CounterBaseMixinClass extends superClass {\n private __value: V = CounterAdapter.NUMBER_ADAPTER.create(0);\n\n @property({\n attribute: 'value',\n reflect: true,\n converter: {\n toAttribute: CounterAdapter.VALUE_CONVERTER.toAttribute,\n },\n noAccessor: true,\n })\n get value() {\n return this.numberAdapter.create(this.__value);\n }\n\n set value(value: V) {\n value = CounterAdapter.NUMBER_ADAPTER.create(\n isNullish(value) || (isString(value) && value.trim() === '')\n ? 0\n : value,\n );\n\n const old = this.__value;\n this.__value = value;\n\n if (!this.numberAdapter.eq(this.__value, old)) {\n this.requestUpdate('value', old);\n }\n }\n // value: V = CounterBaseMixinClass.NUMBER_ADAPTER.create(0);\n\n private __oldValue: V = CounterAdapter.NUMBER_ADAPTER.create(0);\n\n @property({\n attribute: 'old-value',\n reflect: true,\n converter: CounterAdapter.VALUE_CONVERTER,\n noAccessor: true,\n })\n get oldValue() {\n return this.numberAdapter.create(this.__oldValue);\n }\n\n set oldValue(value: V) {\n const old = this.__oldValue;\n this.__oldValue = value;\n this.requestUpdate('oldValue', old);\n }\n // oldValue: V = CounterBaseMixinClass.NUMBER_ADAPTER.create(0);\n\n private __initialValue: V | null = null;\n\n /**\n * 如果初始值被设置, 组件初始化时会使用该值而不是 `value`, 然后在初始化完成后, 将内部值更新为 `value`.\n *\n * 这对于初始化完成后启动动画效果非常有用.\n */\n @property({\n attribute: 'initial-value',\n reflect: true,\n converter: CounterAdapter.VALUE_CONVERTER,\n noAccessor: true,\n })\n get initialValue() {\n return isNullish(this.__initialValue)\n ? this.__initialValue\n : this.numberAdapter.create(this.__initialValue);\n }\n\n set initialValue(value: V | null) {\n const old = this.__initialValue;\n this.__initialValue = value;\n this.requestUpdate('initialValue', old);\n }\n\n private __locale:\n | Intl.UnicodeBCP47LocaleIdentifier\n | [Intl.UnicodeBCP47LocaleIdentifier, Intl.LocaleOptions] = 'en-US';\n\n /**\n * 自定义本地化配置, 否则从浏览器环境中获取.\n * @see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/Locale\n *\n * @default \"en-US\"\n */\n @property({\n converter: value => {\n if (isNullish(value)) return value;\n\n try {\n return JSON.parse(value);\n } catch (error) {\n return value;\n }\n },\n reflect: true,\n noAccessor: true,\n })\n get locale() {\n return this.__locale;\n }\n\n set locale(\n value:\n | Intl.UnicodeBCP47LocaleIdentifier\n | [Intl.UnicodeBCP47LocaleIdentifier, Intl.LocaleOptions],\n ) {\n const old = this.__locale;\n this.__locale = value;\n this.requestUpdate('locale', old);\n\n this.localeInstance = isString(this.__locale)\n ? new Intl.Locale(this.__locale)\n : new Intl.Locale(...this.__locale);\n }\n\n localeInstance: Intl.Locale = isString(this.locale)\n ? new Intl.Locale(this.locale)\n : new Intl.Locale(...this.locale);\n\n @state()\n direction: 'up' | 'down' = 'up';\n\n @state()\n oldDirection: 'up' | 'down' = this.direction;\n\n numberAdapter: NumberAdapter;\n\n stringAdapter: StringAdapter;\n\n constructor(...args: any[]) {\n super(...args);\n\n // @ts-ignore\n this.numberAdapter = CounterAdapter.NUMBER_ADAPTER;\n // @ts-ignore\n this.stringAdapter = CounterAdapter.STRING_ADAPTER;\n }\n\n override willUpdate(changedProperties: PropertyValues<this>) {\n super.willUpdate(changedProperties);\n\n if (!changedProperties.has('oldValue')) {\n // oldValue 未被手动设置时, 使用默认策略更新 oldValue.\n this.oldValue = changedProperties.get('value') ?? this.value;\n }\n\n this.oldDirection = this.direction;\n if (!this.numberAdapter.eq(this.value, this.oldValue)) {\n this.direction = this.numberAdapter.gt(this.value, this.oldValue)\n ? 'down'\n : 'up';\n }\n // }\n }\n\n /**\n * oldValue 的默认初始值应当来自 initialValue 或 value.\n * 以保证 oldValue 始终有值.\n */\n override connectedCallback() {\n super.connectedCallback();\n\n this.oldValue = isNonNullish(this.initialValue)\n ? this.initialValue\n : this.value;\n }\n }\n\n return CounterBaseMixinClass as Constructor<CounterBaseMixinInterface<V>> & T;\n};\n"]}
|
|
1
|
+
{"version":3,"file":"counter-base.js","sourceRoot":"","sources":["../../../src/mixins/counter-base.ts"],"names":[],"mappings":";AACA,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAC;AAO3D,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAoCvD,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAI9B,UAAa,EACb,EAAE;IACF,MAAM,qBAAsB,SAAQ,UAAU;QAW5C,IAAI,KAAK;YACP,OAAO,IAAI,CAAC,aAAa,CAAC,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QACjD,CAAC;QAED,IAAI,KAAK,CAAC,KAAQ;YAChB,KAAK,GAAG,cAAc,CAAC,cAAc,CAAC,MAAM,CAC1C,SAAS,CAAC,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,IAAI,KAAK,CAAC,IAAI,EAAE,KAAK,EAAE,CAAC;gBAC1D,CAAC,CAAC,CAAC;gBACH,CAAC,CAAC,KAAK,CACV,CAAC;YAEF,MAAM,GAAG,GAAG,IAAI,CAAC,OAAO,CAAC;YACzB,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;YAErB,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,EAAE,CAAC,IAAI,CAAC,OAAO,EAAE,GAAG,CAAC,EAAE,CAAC;gBAC9C,IAAI,CAAC,aAAa,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC;YACnC,CAAC;QACH,CAAC;QAWD,IAAI,QAAQ;YACV,OAAO,IAAI,CAAC,aAAa,CAAC,MAAM,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;QACpD,CAAC;QAED,IAAI,QAAQ,CAAC,KAAQ;YACnB,MAAM,GAAG,GAAG,IAAI,CAAC,UAAU,CAAC;YAC5B,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;YACxB,IAAI,CAAC,aAAa,CAAC,UAAU,EAAE,GAAG,CAAC,CAAC;QACtC,CAAC;QAKD;;;;WAIG;QAOH,IAAI,YAAY;YACd,OAAO,SAAS,CAAC,IAAI,CAAC,cAAc,CAAC;gBACnC,CAAC,CAAC,IAAI,CAAC,cAAc;gBACrB,CAAC,CAAC,IAAI,CAAC,aAAa,CAAC,MAAM,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;QACrD,CAAC;QAED,IAAI,YAAY,CAAC,KAAe;YAC9B,MAAM,GAAG,GAAG,IAAI,CAAC,cAAc,CAAC;YAChC,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC;YAC5B,IAAI,CAAC,aAAa,CAAC,cAAc,EAAE,GAAG,CAAC,CAAC;QAC1C,CAAC;QAMD;;;;;WAKG;QAcH,IAAI,MAAM;YACR,OAAO,IAAI,CAAC,QAAQ,CAAC;QACvB,CAAC;QAED,IAAI,MAAM,CACR,KAE2D;YAE3D,MAAM,GAAG,GAAG,IAAI,CAAC,QAAQ,CAAC;YAC1B,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;YACtB,IAAI,CAAC,aAAa,CAAC,QAAQ,EAAE,GAAG,CAAC,CAAC;YAElC,IAAI,CAAC,cAAc,GAAG,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC;gBAC3C,CAAC,CAAC,IAAI,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC;gBAChC,CAAC,CAAC,IAAI,IAAI,CAAC,MAAM,CAAC,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC;QACxC,CAAC;QAgBD,YAAY,GAAG,IAAW;YACxB,KAAK,CAAC,GAAG,IAAI,CAAC,CAAC;YAlIT,YAAO,GAAM,cAAc,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;YA4B7D,6DAA6D;YAErD,eAAU,GAAM,cAAc,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;YAiBhE,gEAAgE;YAExD,mBAAc,GAAa,IAAI,CAAC;YAyBhC,aAAQ,GAE8C,OAAO,CAAC;YAuCtE,mBAAc,GAAgB,QAAQ,CAAC,IAAI,CAAC,MAAM,CAAC;gBACjD,CAAC,CAAC,IAAI,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC;gBAC9B,CAAC,CAAC,IAAI,IAAI,CAAC,MAAM,CAAC,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC;YAGpC,cAAS,GAAkB,IAAI,CAAC;YAGhC,iBAAY,GAAkB,IAAI,CAAC,SAAS,CAAC;YAS3C,aAAa;YACb,IAAI,CAAC,aAAa,GAAG,cAAc,CAAC,cAAc,CAAC;YACnD,aAAa;YACb,IAAI,CAAC,aAAa,GAAG,cAAc,CAAC,cAAc,CAAC;QACrD,CAAC;QAEQ,UAAU,CAAC,iBAAuC;YACzD,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,CAAC;YAEpC,IACE,iBAAiB,CAAC,GAAG,CAAC,OAAO,CAAC;gBAC9B,CAAC,iBAAiB,CAAC,GAAG,CAAC,UAAU,CAAC,EAClC,CAAC;gBACD,uCAAuC;gBACvC,IAAI,CAAC,QAAQ,GAAG,iBAAiB,CAAC,GAAG,CAAC,OAAO,CAAC,IAAI,IAAI,CAAC,KAAK,CAAC;YAC/D,CAAC;YAED,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,SAAS,CAAC;YACnC,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,QAAQ,CAAC,EAAE,CAAC;gBACtD,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,aAAa,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,QAAQ,CAAC;oBAC/D,CAAC,CAAC,MAAM;oBACR,CAAC,CAAC,IAAI,CAAC;YACX,CAAC;QACH,CAAC;QAED;;;WAGG;QACM,iBAAiB;YACxB,KAAK,CAAC,iBAAiB,EAAE,CAAC;YAE1B,IAAI,CAAC,QAAQ,GAAG,YAAY,CAAC,IAAI,CAAC,YAAY,CAAC;gBAC7C,CAAC,CAAC,IAAI,CAAC,YAAY;gBACnB,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC;QACjB,CAAC;KACF;IA9JC;QARC,QAAQ,CAAC;YACR,SAAS,EAAE,OAAO;YAClB,OAAO,EAAE,IAAI;YACb,SAAS,EAAE;gBACT,WAAW,EAAE,cAAc,CAAC,eAAe,CAAC,WAAW;aACxD;YACD,UAAU,EAAE,IAAI;SACjB,CAAC;sDAGD;IA0BD;QANC,QAAQ,CAAC;YACR,SAAS,EAAE,WAAW;YACtB,OAAO,EAAE,IAAI;YACb,SAAS,EAAE,cAAc,CAAC,eAAe;YACzC,UAAU,EAAE,IAAI;SACjB,CAAC;yDAGD;IAsBD;QANC,QAAQ,CAAC;YACR,SAAS,EAAE,eAAe;YAC1B,OAAO,EAAE,IAAI;YACb,SAAS,EAAE,cAAc,CAAC,eAAe;YACzC,UAAU,EAAE,IAAI;SACjB,CAAC;6DAKD;IA+BD;QAbC,QAAQ,CAAC;YACR,SAAS,EAAE,KAAK,CAAC,EAAE;gBACjB,IAAI,SAAS,CAAC,KAAK,CAAC;oBAAE,OAAO,KAAK,CAAC;gBAEnC,IAAI,CAAC;oBACH,OAAO,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;gBAC3B,CAAC;gBAAC,OAAO,KAAK,EAAE,CAAC;oBACf,OAAO,KAAK,CAAC;gBACf,CAAC;YACH,CAAC;YACD,OAAO,EAAE,IAAI;YACb,UAAU,EAAE,IAAI;SACjB,CAAC;uDAGD;IAqBD;QADC,KAAK,EAAE;4DACwB;IAGhC;QADC,KAAK,EAAE;+DACqC;IA+C/C,OAAO,qBAAsE,CAAC;AAChF,CAAC,CAAC","sourcesContent":["import { LitElement, PropertyValues } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { isNonNullish, isNullish, isString } from 'remeda';\nimport { Constructor } from 'type-fest';\nimport {\n NumberAdapter,\n AvailableNumberAdapterValueType,\n} from '../number-adapter/index.js';\nimport { StringAdapter } from '../string-adapter/index.js';\nimport { CounterAdapter } from '../counter-adapter.js';\n\nexport declare class CounterBaseMixinInterface<\n V extends AvailableNumberAdapterValueType,\n> {\n static NUMBER_ADAPTER: NumberAdapter;\n\n static STRING_ADAPTER: StringAdapter;\n\n get value(): V;\n\n set value(value: V);\n\n get oldValue(): V;\n\n set oldValue(value: V);\n\n get initialValue(): V;\n\n set initialValue(value: V);\n\n direction: 'up' | 'down';\n\n oldDirection: 'up' | 'down';\n\n locale:\n | Intl.UnicodeBCP47LocaleIdentifier\n | [Intl.UnicodeBCP47LocaleIdentifier, Intl.LocaleOptions];\n\n localeInstance: Intl.Locale;\n\n numberAdapter: NumberAdapter;\n\n stringAdapter: StringAdapter;\n}\n\nexport const CounterBaseMixin = <\n V extends AvailableNumberAdapterValueType,\n T extends Constructor<LitElement> = Constructor<LitElement>,\n>(\n superClass: T,\n) => {\n class CounterBaseMixinClass extends superClass {\n private __value: V = CounterAdapter.NUMBER_ADAPTER.create(0);\n\n @property({\n attribute: 'value',\n reflect: true,\n converter: {\n toAttribute: CounterAdapter.VALUE_CONVERTER.toAttribute,\n },\n noAccessor: true,\n })\n get value() {\n return this.numberAdapter.create(this.__value);\n }\n\n set value(value: V) {\n value = CounterAdapter.NUMBER_ADAPTER.create(\n isNullish(value) || (isString(value) && value.trim() === '')\n ? 0\n : value,\n );\n\n const old = this.__value;\n this.__value = value;\n\n if (!this.numberAdapter.eq(this.__value, old)) {\n this.requestUpdate('value', old);\n }\n }\n // value: V = CounterBaseMixinClass.NUMBER_ADAPTER.create(0);\n\n private __oldValue: V = CounterAdapter.NUMBER_ADAPTER.create(0);\n\n @property({\n attribute: 'old-value',\n reflect: true,\n converter: CounterAdapter.VALUE_CONVERTER,\n noAccessor: true,\n })\n get oldValue() {\n return this.numberAdapter.create(this.__oldValue);\n }\n\n set oldValue(value: V) {\n const old = this.__oldValue;\n this.__oldValue = value;\n this.requestUpdate('oldValue', old);\n }\n // oldValue: V = CounterBaseMixinClass.NUMBER_ADAPTER.create(0);\n\n private __initialValue: V | null = null;\n\n /**\n * 如果初始值被设置, 组件初始化时会使用该值而不是 `value`, 然后在初始化完成后, 将内部值更新为 `value`.\n *\n * 这对于初始化完成后启动动画效果非常有用.\n */\n @property({\n attribute: 'initial-value',\n reflect: true,\n converter: CounterAdapter.VALUE_CONVERTER,\n noAccessor: true,\n })\n get initialValue() {\n return isNullish(this.__initialValue)\n ? this.__initialValue\n : this.numberAdapter.create(this.__initialValue);\n }\n\n set initialValue(value: V | null) {\n const old = this.__initialValue;\n this.__initialValue = value;\n this.requestUpdate('initialValue', old);\n }\n\n private __locale:\n | Intl.UnicodeBCP47LocaleIdentifier\n | [Intl.UnicodeBCP47LocaleIdentifier, Intl.LocaleOptions] = 'en-US';\n\n /**\n * 自定义本地化配置, 否则从浏览器环境中获取.\n * @see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/Locale\n *\n * @default \"en-US\"\n */\n @property({\n converter: value => {\n if (isNullish(value)) return value;\n\n try {\n return JSON.parse(value);\n } catch (error) {\n return value;\n }\n },\n reflect: true,\n noAccessor: true,\n })\n get locale() {\n return this.__locale;\n }\n\n set locale(\n value:\n | Intl.UnicodeBCP47LocaleIdentifier\n | [Intl.UnicodeBCP47LocaleIdentifier, Intl.LocaleOptions],\n ) {\n const old = this.__locale;\n this.__locale = value;\n this.requestUpdate('locale', old);\n\n this.localeInstance = isString(this.__locale)\n ? new Intl.Locale(this.__locale)\n : new Intl.Locale(...this.__locale);\n }\n\n localeInstance: Intl.Locale = isString(this.locale)\n ? new Intl.Locale(this.locale)\n : new Intl.Locale(...this.locale);\n\n @state()\n direction: 'up' | 'down' = 'up';\n\n @state()\n oldDirection: 'up' | 'down' = this.direction;\n\n numberAdapter: NumberAdapter;\n\n stringAdapter: StringAdapter;\n\n constructor(...args: any[]) {\n super(...args);\n\n // @ts-ignore\n this.numberAdapter = CounterAdapter.NUMBER_ADAPTER;\n // @ts-ignore\n this.stringAdapter = CounterAdapter.STRING_ADAPTER;\n }\n\n override willUpdate(changedProperties: PropertyValues<this>) {\n super.willUpdate(changedProperties);\n\n if (\n changedProperties.has('value') &&\n !changedProperties.has('oldValue')\n ) {\n // oldValue 未被手动设置时, 使用默认策略更新 oldValue.\n this.oldValue = changedProperties.get('value') ?? this.value;\n }\n\n this.oldDirection = this.direction;\n if (!this.numberAdapter.eq(this.value, this.oldValue)) {\n this.direction = this.numberAdapter.gt(this.value, this.oldValue)\n ? 'down'\n : 'up';\n }\n }\n\n /**\n * oldValue 的默认初始值应当来自 initialValue 或 value.\n * 以保证 oldValue 始终有值.\n */\n override connectedCallback() {\n super.connectedCallback();\n\n this.oldValue = isNonNullish(this.initialValue)\n ? this.initialValue\n : this.value;\n }\n }\n\n return CounterBaseMixinClass as Constructor<CounterBaseMixinInterface<V>> & T;\n};\n"]}
|
|
@@ -66,10 +66,18 @@ export const CounterPartsMixin = (superClass) => {
|
|
|
66
66
|
}
|
|
67
67
|
willUpdate(changedProperties) {
|
|
68
68
|
super.willUpdate(changedProperties);
|
|
69
|
+
if (changedProperties.has('value')) {
|
|
70
|
+
this.oldParts = this.parts;
|
|
71
|
+
}
|
|
72
|
+
/**
|
|
73
|
+
* {@link processPartData} 依赖 {@link partsOptions} 和 {@link value} 生成数据.
|
|
74
|
+
* 当依赖项没有变化时, 不需要重新生成数据.
|
|
75
|
+
*/
|
|
69
76
|
if (changedProperties.has('value') ||
|
|
70
77
|
changedProperties.has('partsOptions')) {
|
|
71
|
-
this.oldParts = this.parts;
|
|
72
78
|
this.parts = this.processPartData();
|
|
79
|
+
}
|
|
80
|
+
if (changedProperties.has('value')) {
|
|
73
81
|
this.partPreprocessDataList = preprocessPartData(this.direction, this.parts, this.oldDirection, this.oldParts);
|
|
74
82
|
}
|
|
75
83
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"counter-parts.js","sourceRoot":"","sources":["../../../src/mixins/counter-parts.ts"],"names":[],"mappings":";AACA,OAAO,EAAE,GAAG,EAAE,MAAM,UAAU,CAAC;AAE/B,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,OAAO,EAAE,YAAY,EAAE,MAAM,QAAQ,CAAC;AAG/C,OAAO,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAC/D,OAAO,EAEL,kBAAkB,GACnB,MAAM,kCAAkC,CAAC;AAE1C,OAAO,EAAE,eAAe,EAAE,MAAM,+BAA+B,CAAC;AAoDhE,SAAS,MAAM,CAAC,KAAa;IAC3B,OAAO,MAAM,CAAC,aAAa,CAAC,KAAK,GAAG,EAAE,CAAC,CAAC;AAC1C,CAAC;AAED,SAAS,sBAAsB,CAAC,OAAqB;IACnD,MAAM,WAAW,GAA2B,EAAE,CAAC;IAE/C,IAAI,OAAO,CAAC,OAAO,CAAC,WAAW,CAAC,EAAE,CAAC;QACjC,OAAO,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;YAC1C,WAAW,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,GAAG,IAAI,CAAC;QACpC,CAAC,CAAC,CAAC;IACL,CAAC;SAAM,IAAI,YAAY,CAAC,OAAO,CAAC,WAAW,CAAC,EAAE,CAAC;QAC7C,MAAM,CAAC,OAAO,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,EAAE,KAAK,CAAC,EAAE,EAAE;YAC3D,WAAW,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC;QAC3B,CAAC,CAAC,CAAC;IACL,CAAC;IAED,OAAO;QACL,GAAG,OAAO;QACV,WAAW;KACZ,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAM/B,UAAa,EACb,EAAE;;IACF,MAAM,sBAAuB,SAAQ,UAAU;QAA/C;;YAUE,iDAAqC;gBACnC,GAAG,EAAsB,CAAC,qBAAqB;aAChD,EAAC;YAwBF,oCAAoC;YACpC,kDAAkD;YAElD,UAAK,GAAe,EAAE,CAAC;YAEvB,aAAQ,GAAe,EAAE,CAAC;YAE1B,2BAAsB,GAA6B,EAAE,CAAC;QAkKxD,CAAC;QA/LC;;;WAGG;QAOH,IAAI,YAAY;YACd,OAAO,uBAAA,IAAI,8CAAgB,CAAC;QAC9B,CAAC;QAED,IAAI,YAAY,CAAC,KAA4B;YAC3C,MAAM,GAAG,GAAG,uBAAA,IAAI,8CAAgB,CAAC;YACjC,uBAAA,IAAI,0CAAmB,sBAAsB,CAAC;gBAC5C,GAAG,EAAsB,CAAC,qBAAqB;gBAC/C,GAAG,KAAK;aACT,CAAC,MAAA,CAAC;YACH,IAAI,CAAC,aAAa,CAAC,cAAc,EAAE,GAAG,CAAC,CAAC;QAC1C,CAAC;QAUD,QAAQ,CAAC,IAAO,EAAE,EAAK;YACrB,OAAO,eAAe,CACpB,IAAI,CAAC,aAAa,EAClB,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,IAAI,EAAE,EAAE,CAAC,EAChC,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,IAAI,EAAE,EAAE,CAAC,EAChC,IAAI,CAAC,YAAY,CAAC,WAAW,CAC9B,CAAC;QACJ,CAAC;QAED,kDAAkD;QAClD,WAAW,CAAC,OAAY;YACtB,OAAO,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC,CAAC;QAC3B,CAAC;QAED,cAAc,CAAC,KAAQ;YACrB,OAAO,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;QAC5C,CAAC;QAEQ,UAAU,CAAC,iBAAuC;YACzD,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,CAAC;YAEpC,IACE,iBAAiB,CAAC,GAAG,CAAC,OAAO,CAAC;gBAC9B,iBAAiB,CAAC,GAAG,CAAC,cAAc,CAAC,EACrC,CAAC;gBACD,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC;gBAC3B,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,eAAe,EAAE,CAAC;gBACpC,IAAI,CAAC,sBAAsB,GAAG,kBAAkB,CAC9C,IAAI,CAAC,SAAS,EACd,IAAI,CAAC,KAAK,EACV,IAAI,CAAC,YAAY,EACjB,IAAI,CAAC,QAAQ,CACd,CAAC;YACJ,CAAC;YAED;;eAEG;YACH,yCAAyC;YACzC,OAAO;YACP,sCAAsC;YACtC,uCAAuC;YACvC,MAAM;YACN,IAAI;QACN,CAAC;QAED;;;;;WAKG;QACK,eAAe;YACrB,MAAM,EAAE,gBAAgB,EAAE,WAAW,EAAE,SAAS,EAAE,QAAQ,EAAE,IAAI,EAAE,GAChE,IAAI,CAAC,YAAY,CAAC;YAEpB,MAAM,IAAI,GAAG,IAAI,CAAC,KAAK,CAAC;YACxB,MAAM,EAAE,GAAG,IAAI,CAAC,QAAQ,CAAC;YAEzB,IAAI,eAAe,GAA2B,KAAK,CAAC,EAAE,CACpD,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,gBAAgB,CAAC,CAAC;YACrD,IAAI,IAAI,KAAK,QAAQ,EAAE,CAAC;gBACtB,eAAe,GAAG,KAAK,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,EAAE,CAAC,CAAC;YAC9D,CAAC;YAED,MAAM,MAAM,GAAe,EAAE,CAAC;YAE9B;;eAEG;YACH,MAAM,SAAS,GAAG,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,CAAC;YAE5D;;;;;eAKG;YACH,CAAC;gBACC,MAAM,cAAc,GAAG,IAAI,CAAC,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC;gBACvE,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,SAAS,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC;oBAC1C,MAAM,QAAQ,GAAG,SAAS,CAAC,CAAC,CAAC,CAAC;oBAC9B,qBAAqB;oBACrB,mEAAmE;oBACnE,MAAM,UAAU,GACd,QAAQ,CAAC,cAAc,KAAK,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;oBAEhE,MAAM,CAAC,gBAAgB,GAAG,CAAC,EAAE,gBAAgB,GAAG,CAAC,CAAC,GAAG,SAAS,CAAC;oBAE/D,MAAM,WAAW,GAAG,eAAe,CAAC,UAAU,CAAC,CAAC;oBAChD,MAAM,aAAa,GAAG,IAAI,CAAC,GAAG;oBAC5B,yBAAyB;oBACzB,IAAI,CAAC,aAAa,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,EACvD,gBAAgB,CACjB,CAAC;oBACF,MAAM,aAAa,GAAG,IAAI,CAAC,GAAG;oBAC5B,+BAA+B;oBAC/B,IAAI,CAAC,aAAa,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC,MAAM,EAC7D,gBAAgB,CACjB,CAAC;oBAEF;;uBAEG;oBACH,MAAM,IAAI,GAAG,GAAG,CACd,GAAG,QAAQ;wBACT;;2BAEG;yBACF,GAAG,CAAC,SAAS,CAAC,EAAE;wBACf,MAAM,CAAC,OAAO,GAAG,EAAE,EAAE,OAAO,GAAG,EAAE,CAAC,GAAG,eAAe,CAAC,SAAS,CAAC,CAAC;wBAEhE,MAAM,YAAY,GAAG,IAAI,CAAC,aAAa,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;wBAC/D,MAAM,YAAY,GAAG,IAAI,CAAC,aAAa,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;wBAE/D,MAAM,mBAAmB,GAAG,IAAI,CAAC,GAAG,CAClC,aAAa,GAAG,YAAY,CAAC,MAAM,EACnC,CAAC,CACF,CAAC;wBAEF,MAAM,mBAAmB,GAAG,IAAI,CAAC,GAAG,CAClC,aAAa,GAAG,YAAY,CAAC,MAAM,EACnC,CAAC,CACF,CAAC;wBAEF,IAAI,WAAW,GAAI,EAAe,CAAC,MAAM,CACvC,IAAI,KAAK,CAAC,mBAAmB,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,EAC7C,YAAY,CACb,CAAC;wBACF,IAAI,aAAa,GAAG,CAAC,EAAE,CAAC;4BACtB,WAAW,GAAG,WAAW,CAAC,MAAM,CAC9B,CAAC,gBAAgB,CAAC,EAClB,YAAY,EACZ,IAAI,KAAK,CAAC,mBAAmB,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,CAC9C,CAAC;wBACJ,CAAC;wBACD,OAAO,WAAW,CAAC;oBACrB,CAAC,CAAC,CACL;wBACC;;2BAEG;yBACF,GAAG,CAAC,CAAC,SAAS,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,CAAC,CAAC;wBACjC,IAAI,EAAE,SAAS;6BACZ,MAAM,CACL,CAAC,KAAK,EAAE,UAAU,EAAE,UAAU,EAAE,EAAE,CAChC,UAAU,KAAK,CAAC,IAAI,KAAK,KAAK,UAAU,CAAC,UAAU,GAAG,CAAC,CAAC,CAC3D;6BACA,GAAG,CAAC,KAAK,CAAC,EAAE,CAAC,WAAW,CAAC,KAAK,CAAC,IAAI,KAAK,CAAC;wBAC5C,KAAK,EAAE,KAAK,CAAC,MAAM,GAAG,KAAK;qBAC5B,CAAC,CAAC,CAAC;oBAEN,MAAM,CAAC,IAAI,CAAC;wBACV,MAAM,EAAE,IAAI;qBACb,CAAC,CAAC;gBACL,CAAC;YACH,CAAC;YAED,OAAO,MAAM,CAAC;QAChB,CAAC;;;IA3Mc,4CAAqB,GAAsB;QACxD,WAAW,EAAE,EAAE;QACf,gBAAgB,EAAE,GAAG;QACrB,QAAQ,EAAE,GAAG;QACb,SAAS,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC;QACjB,WAAW,EAAE,EAAE;QACf,IAAI,EAAE,QAAQ;KACf,AAPmC,CAOlC;IAgBF;QANC,QAAQ,CAAC;YACR,IAAI,EAAE,MAAM;YACZ,SAAS,EAAE,eAAe;YAC1B,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAAC,KAAK,IAAI,EAAE,CAAC,IAAI,EAAE;YACtD,UAAU,EAAE,IAAI;SACjB,CAAC;8DAGD;IAqLH,OAAO,sBACJ,CAAC;AACN,CAAC,CAAC","sourcesContent":["import { PropertyValues } from 'lit';\nimport { zip } from 'd3-array';\nimport { Constructor } from 'type-fest';\nimport { property } from 'lit/decorators.js';\nimport { isArray, isObjectType } from 'remeda';\nimport { CounterBaseMixin } from './counter-base.js';\nimport { PartData } from '../types/group.js';\nimport { transitionDigit } from '../utils/transition-digit.js';\nimport {\n PartPreprocessedData,\n preprocessPartData,\n} from '../utils/preprocess-part-data.js';\nimport { AvailableNumberAdapterValueType } from '../number-adapter/index.js';\nimport { parseJsonString } from '../utils/parse-json-string.js';\n\nexport interface PartsOptions {\n sampleCount: number;\n /**\n * 可以通过该属性将数字转换为你想要的任意字符串.\n */\n digitToChar: Record<string | number, string> | string[];\n /**\n * 小数点分隔符.\n */\n decimalSeparator: string;\n /**\n * 当**位数不足**时, 强制补全的 [整数, 小数] 位数. 为空时位数自适应.\n */\n minPlaces: [number | undefined, number | undefined];\n fillChar: string;\n /**\n * 数据类型.\n *\n * 1. `'string'`: 字符串类型.\n * 1. 不会使用 `decimalSeparator` 截取小数部分.\n * 2. `'number'`: 数字类型.\n *\n * @default `'number'`\n */\n type: 'string' | 'number';\n}\ntype InnerPartsOptions = Omit<PartsOptions, 'digitToChar'> & {\n digitToChar: Record<string | number, string>;\n};\n\nexport declare class CounterPartsMixinInterface<\n V extends AvailableNumberAdapterValueType,\n> {\n parts: PartData[];\n\n oldParts: PartData[];\n\n partPreprocessDataList: PartPreprocessedData[][];\n\n get partsOptions(): Partial<PartsOptions>;\n\n set partsOptions(value: Partial<PartsOptions>);\n\n sampling(from: V, to: V): V[];\n\n sampleSplit(samples: V[]): V[][];\n\n sampleToString(value: V): string;\n}\n\nfunction toChar(value: number) {\n return String.fromCodePoint(value + 48);\n}\n\nfunction preprocessPartsOptions(options: PartsOptions): InnerPartsOptions {\n const digitToChar: Record<string, string> = {};\n\n if (isArray(options.digitToChar)) {\n options.digitToChar.forEach((char, index) => {\n digitToChar[toChar(index)] = char;\n });\n } else if (isObjectType(options.digitToChar)) {\n Object.entries(options.digitToChar).forEach(([key, value]) => {\n digitToChar[key] = value;\n });\n }\n\n return {\n ...options,\n digitToChar,\n };\n}\n\nexport const CounterPartsMixin = <\n V extends AvailableNumberAdapterValueType,\n T extends ReturnType<typeof CounterBaseMixin<V>> = ReturnType<\n typeof CounterBaseMixin<V>\n >,\n>(\n superClass: T,\n) => {\n class CounterPartsMixinClass extends superClass {\n private static DEFAULT_PARTS_OPTIONS: InnerPartsOptions = {\n sampleCount: 16,\n decimalSeparator: '.',\n fillChar: '0',\n minPlaces: [1, 0],\n digitToChar: {},\n type: 'number',\n };\n\n #__partsOptions: InnerPartsOptions = {\n ...CounterPartsMixinClass.DEFAULT_PARTS_OPTIONS,\n };\n\n /**\n * 这是 `usePartData` 的配置项. `usePartData` 被用于从数值的变化中生成用于滚动的数据.\n * 这里不会有太多解释, 因为它是一个底层的配置项. 你可以查看 `CounterPartsMixinClass` 的源码了解更多信息.\n */\n @property({\n type: Object,\n attribute: 'parts-options',\n converter: value => parseJsonString(value ?? '') ?? {},\n noAccessor: true,\n })\n get partsOptions(): InnerPartsOptions {\n return this.#__partsOptions;\n }\n\n set partsOptions(value: Partial<PartsOptions>) {\n const old = this.#__partsOptions;\n this.#__partsOptions = preprocessPartsOptions({\n ...CounterPartsMixinClass.DEFAULT_PARTS_OPTIONS,\n ...value,\n });\n this.requestUpdate('partsOptions', old);\n }\n // partsOptions: InnerPartsOptions =\n // CounterPartsMixinClass.DEFAULT_PARTS_OPTIONS;\n\n parts: PartData[] = [];\n\n oldParts: PartData[] = [];\n\n partPreprocessDataList: PartPreprocessedData[][] = [];\n\n sampling(from: V, to: V) {\n return transitionDigit(\n this.numberAdapter,\n this.numberAdapter.max(from, to),\n this.numberAdapter.min(from, to),\n this.partsOptions.sampleCount,\n );\n }\n\n // eslint-disable-next-line class-methods-use-this\n sampleSplit(samples: V[]) {\n return [samples.slice()];\n }\n\n sampleToString(value: V) {\n return this.numberAdapter.toString(value);\n }\n\n override willUpdate(changedProperties: PropertyValues<this>) {\n super.willUpdate(changedProperties);\n\n if (\n changedProperties.has('value') ||\n changedProperties.has('partsOptions')\n ) {\n this.oldParts = this.parts;\n this.parts = this.processPartData();\n this.partPreprocessDataList = preprocessPartData(\n this.direction,\n this.parts,\n this.oldDirection,\n this.oldParts,\n );\n }\n\n /**\n * `value` 没变但 `direction` 变化时, 也要重新生成 `partPreprocessDataList`.\n */\n // todo test events 和 animationOptions 冲突\n // if (\n // changedProperties.has('value') ||\n // changedProperties.has('direction')\n // ) {\n // }\n }\n\n /**\n * process:\n * 1. 采样\n * 2. 转换\n * 3. 构造\n */\n private processPartData() {\n const { decimalSeparator, digitToChar, minPlaces, fillChar, type } =\n this.partsOptions;\n\n const from = this.value;\n const to = this.oldValue;\n\n let _sampleToString: (value: V) => string[] = value =>\n this.sampleToString(value).split(decimalSeparator);\n if (type === 'string') {\n _sampleToString = value => [this.sampleToString(value), ''];\n }\n\n const result: PartData[] = [];\n\n /**\n * 对 {@link from} 到 {@link to} 的范围采样.\n */\n const tempParts = this.sampleSplit(this.sampling(from, to));\n\n /**\n * 将时间部分的数字转换为用于滚动的字符串数组\n *\n * headNumber: 最先显示的数字. 向下滚动时, 为滚动列表的最后一个数字, 向上滚动时相反.\n * tailNumber: 最后显示的数字. 向下滚动时, 为滚动列表的第一个数字, 向上滚动时相反.\n */\n {\n const directionValue = this.numberAdapter.gt(from, to) ? 'down' : 'up';\n for (let i = 0; i < tempParts.length; i++) {\n const partData = tempParts[i];\n // const headNumber =\n // partData[directionValue === \"down\" ? partData.length - 1 : 0];\n const tailNumber =\n partData[directionValue === 'down' ? 0 : partData.length - 1];\n\n const [minIntegerPlaces = 1, minDecimalPlaces = 0] = minPlaces;\n\n const numberParts = _sampleToString(tailNumber);\n const integerPlaces = Math.max(\n // numberParts[0].length,\n this.stringAdapter.stringToChars(numberParts[0]).length,\n minIntegerPlaces,\n );\n const decimalPlaces = Math.max(\n // numberParts[1]?.length ?? 0,\n this.stringAdapter.stringToChars(numberParts[1] ?? '').length,\n minDecimalPlaces,\n );\n\n /**\n * 使用 zip 将二维矩阵, 旋转90度\n */\n const data = zip(\n ...partData\n /**\n * 保证位数一致, 向前补零\n */\n .map(digitData => {\n const [integer = '', decimal = ''] = _sampleToString(digitData);\n\n const integerChars = this.stringAdapter.stringToChars(integer);\n const decimalChars = this.stringAdapter.stringToChars(decimal);\n\n const filledIntegerPlaces = Math.max(\n integerPlaces - integerChars.length,\n 0,\n );\n\n const filledDecimalPlaces = Math.max(\n decimalPlaces - decimalChars.length,\n 0,\n );\n\n let filledChars = ([] as string[]).concat(\n new Array(filledIntegerPlaces).fill(fillChar),\n integerChars,\n );\n if (decimalPlaces > 0) {\n filledChars = filledChars.concat(\n [decimalSeparator],\n decimalChars,\n new Array(filledDecimalPlaces).fill(fillChar),\n );\n }\n return filledChars;\n }),\n )\n /**\n * 删除连续的重复项\n */\n .map((digitList, index, array) => ({\n data: digitList\n .filter(\n (digit, digitIndex, digitArray) =>\n digitIndex === 0 || digit !== digitArray[digitIndex - 1],\n )\n .map(digit => digitToChar[digit] ?? digit),\n place: array.length - index,\n }));\n\n result.push({\n digits: data,\n });\n }\n }\n\n return result;\n }\n }\n\n return CounterPartsMixinClass as Constructor<CounterPartsMixinInterface<V>> &\n T;\n};\n"]}
|
|
1
|
+
{"version":3,"file":"counter-parts.js","sourceRoot":"","sources":["../../../src/mixins/counter-parts.ts"],"names":[],"mappings":";AACA,OAAO,EAAE,GAAG,EAAE,MAAM,UAAU,CAAC;AAE/B,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,OAAO,EAAE,YAAY,EAAE,MAAM,QAAQ,CAAC;AAG/C,OAAO,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAC/D,OAAO,EAEL,kBAAkB,GACnB,MAAM,kCAAkC,CAAC;AAE1C,OAAO,EAAE,eAAe,EAAE,MAAM,+BAA+B,CAAC;AAoDhE,SAAS,MAAM,CAAC,KAAa;IAC3B,OAAO,MAAM,CAAC,aAAa,CAAC,KAAK,GAAG,EAAE,CAAC,CAAC;AAC1C,CAAC;AAED,SAAS,sBAAsB,CAAC,OAAqB;IACnD,MAAM,WAAW,GAA2B,EAAE,CAAC;IAE/C,IAAI,OAAO,CAAC,OAAO,CAAC,WAAW,CAAC,EAAE,CAAC;QACjC,OAAO,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;YAC1C,WAAW,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,GAAG,IAAI,CAAC;QACpC,CAAC,CAAC,CAAC;IACL,CAAC;SAAM,IAAI,YAAY,CAAC,OAAO,CAAC,WAAW,CAAC,EAAE,CAAC;QAC7C,MAAM,CAAC,OAAO,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,EAAE,KAAK,CAAC,EAAE,EAAE;YAC3D,WAAW,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC;QAC3B,CAAC,CAAC,CAAC;IACL,CAAC;IAED,OAAO;QACL,GAAG,OAAO;QACV,WAAW;KACZ,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAM/B,UAAa,EACb,EAAE;;IACF,MAAM,sBAAuB,SAAQ,UAAU;QAA/C;;YAUE,iDAAqC;gBACnC,GAAG,EAAsB,CAAC,qBAAqB;aAChD,EAAC;YAwBF,oCAAoC;YACpC,kDAAkD;YAElD,UAAK,GAAe,EAAE,CAAC;YAEvB,aAAQ,GAAe,EAAE,CAAC;YAE1B,2BAAsB,GAA6B,EAAE,CAAC;QA4KxD,CAAC;QAzMC;;;WAGG;QAOH,IAAI,YAAY;YACd,OAAO,uBAAA,IAAI,8CAAgB,CAAC;QAC9B,CAAC;QAED,IAAI,YAAY,CAAC,KAA4B;YAC3C,MAAM,GAAG,GAAG,uBAAA,IAAI,8CAAgB,CAAC;YACjC,uBAAA,IAAI,0CAAmB,sBAAsB,CAAC;gBAC5C,GAAG,EAAsB,CAAC,qBAAqB;gBAC/C,GAAG,KAAK;aACT,CAAC,MAAA,CAAC;YACH,IAAI,CAAC,aAAa,CAAC,cAAc,EAAE,GAAG,CAAC,CAAC;QAC1C,CAAC;QAUD,QAAQ,CAAC,IAAO,EAAE,EAAK;YACrB,OAAO,eAAe,CACpB,IAAI,CAAC,aAAa,EAClB,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,IAAI,EAAE,EAAE,CAAC,EAChC,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,IAAI,EAAE,EAAE,CAAC,EAChC,IAAI,CAAC,YAAY,CAAC,WAAW,CAC9B,CAAC;QACJ,CAAC;QAED,kDAAkD;QAClD,WAAW,CAAC,OAAY;YACtB,OAAO,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC,CAAC;QAC3B,CAAC;QAED,cAAc,CAAC,KAAQ;YACrB,OAAO,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;QAC5C,CAAC;QAEQ,UAAU,CAAC,iBAAuC;YACzD,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,CAAC;YAEpC,IAAI,iBAAiB,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE,CAAC;gBACnC,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC;YAC7B,CAAC;YAED;;;eAGG;YACH,IACE,iBAAiB,CAAC,GAAG,CAAC,OAAO,CAAC;gBAC9B,iBAAiB,CAAC,GAAG,CAAC,cAAc,CAAC,EACrC,CAAC;gBACD,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,eAAe,EAAE,CAAC;YACtC,CAAC;YAED,IAAI,iBAAiB,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE,CAAC;gBACnC,IAAI,CAAC,sBAAsB,GAAG,kBAAkB,CAC9C,IAAI,CAAC,SAAS,EACd,IAAI,CAAC,KAAK,EACV,IAAI,CAAC,YAAY,EACjB,IAAI,CAAC,QAAQ,CACd,CAAC;YACJ,CAAC;YAED;;eAEG;YACH,yCAAyC;YACzC,OAAO;YACP,sCAAsC;YACtC,uCAAuC;YACvC,MAAM;YACN,IAAI;QACN,CAAC;QAED;;;;;WAKG;QACK,eAAe;YACrB,MAAM,EAAE,gBAAgB,EAAE,WAAW,EAAE,SAAS,EAAE,QAAQ,EAAE,IAAI,EAAE,GAChE,IAAI,CAAC,YAAY,CAAC;YAEpB,MAAM,IAAI,GAAG,IAAI,CAAC,KAAK,CAAC;YACxB,MAAM,EAAE,GAAG,IAAI,CAAC,QAAQ,CAAC;YAEzB,IAAI,eAAe,GAA2B,KAAK,CAAC,EAAE,CACpD,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,gBAAgB,CAAC,CAAC;YACrD,IAAI,IAAI,KAAK,QAAQ,EAAE,CAAC;gBACtB,eAAe,GAAG,KAAK,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,EAAE,CAAC,CAAC;YAC9D,CAAC;YAED,MAAM,MAAM,GAAe,EAAE,CAAC;YAE9B;;eAEG;YACH,MAAM,SAAS,GAAG,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,CAAC;YAE5D;;;;;eAKG;YACH,CAAC;gBACC,MAAM,cAAc,GAAG,IAAI,CAAC,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC;gBACvE,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,SAAS,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC;oBAC1C,MAAM,QAAQ,GAAG,SAAS,CAAC,CAAC,CAAC,CAAC;oBAC9B,qBAAqB;oBACrB,mEAAmE;oBACnE,MAAM,UAAU,GACd,QAAQ,CAAC,cAAc,KAAK,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;oBAEhE,MAAM,CAAC,gBAAgB,GAAG,CAAC,EAAE,gBAAgB,GAAG,CAAC,CAAC,GAAG,SAAS,CAAC;oBAE/D,MAAM,WAAW,GAAG,eAAe,CAAC,UAAU,CAAC,CAAC;oBAChD,MAAM,aAAa,GAAG,IAAI,CAAC,GAAG;oBAC5B,yBAAyB;oBACzB,IAAI,CAAC,aAAa,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,EACvD,gBAAgB,CACjB,CAAC;oBACF,MAAM,aAAa,GAAG,IAAI,CAAC,GAAG;oBAC5B,+BAA+B;oBAC/B,IAAI,CAAC,aAAa,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC,MAAM,EAC7D,gBAAgB,CACjB,CAAC;oBAEF;;uBAEG;oBACH,MAAM,IAAI,GAAG,GAAG,CACd,GAAG,QAAQ;wBACT;;2BAEG;yBACF,GAAG,CAAC,SAAS,CAAC,EAAE;wBACf,MAAM,CAAC,OAAO,GAAG,EAAE,EAAE,OAAO,GAAG,EAAE,CAAC,GAAG,eAAe,CAAC,SAAS,CAAC,CAAC;wBAEhE,MAAM,YAAY,GAAG,IAAI,CAAC,aAAa,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;wBAC/D,MAAM,YAAY,GAAG,IAAI,CAAC,aAAa,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;wBAE/D,MAAM,mBAAmB,GAAG,IAAI,CAAC,GAAG,CAClC,aAAa,GAAG,YAAY,CAAC,MAAM,EACnC,CAAC,CACF,CAAC;wBAEF,MAAM,mBAAmB,GAAG,IAAI,CAAC,GAAG,CAClC,aAAa,GAAG,YAAY,CAAC,MAAM,EACnC,CAAC,CACF,CAAC;wBAEF,IAAI,WAAW,GAAI,EAAe,CAAC,MAAM,CACvC,IAAI,KAAK,CAAC,mBAAmB,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,EAC7C,YAAY,CACb,CAAC;wBACF,IAAI,aAAa,GAAG,CAAC,EAAE,CAAC;4BACtB,WAAW,GAAG,WAAW,CAAC,MAAM,CAC9B,CAAC,gBAAgB,CAAC,EAClB,YAAY,EACZ,IAAI,KAAK,CAAC,mBAAmB,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,CAC9C,CAAC;wBACJ,CAAC;wBACD,OAAO,WAAW,CAAC;oBACrB,CAAC,CAAC,CACL;wBACC;;2BAEG;yBACF,GAAG,CAAC,CAAC,SAAS,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,CAAC,CAAC;wBACjC,IAAI,EAAE,SAAS;6BACZ,MAAM,CACL,CAAC,KAAK,EAAE,UAAU,EAAE,UAAU,EAAE,EAAE,CAChC,UAAU,KAAK,CAAC,IAAI,KAAK,KAAK,UAAU,CAAC,UAAU,GAAG,CAAC,CAAC,CAC3D;6BACA,GAAG,CAAC,KAAK,CAAC,EAAE,CAAC,WAAW,CAAC,KAAK,CAAC,IAAI,KAAK,CAAC;wBAC5C,KAAK,EAAE,KAAK,CAAC,MAAM,GAAG,KAAK;qBAC5B,CAAC,CAAC,CAAC;oBAEN,MAAM,CAAC,IAAI,CAAC;wBACV,MAAM,EAAE,IAAI;qBACb,CAAC,CAAC;gBACL,CAAC;YACH,CAAC;YAED,OAAO,MAAM,CAAC;QAChB,CAAC;;;IArNc,4CAAqB,GAAsB;QACxD,WAAW,EAAE,EAAE;QACf,gBAAgB,EAAE,GAAG;QACrB,QAAQ,EAAE,GAAG;QACb,SAAS,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC;QACjB,WAAW,EAAE,EAAE;QACf,IAAI,EAAE,QAAQ;KACf,AAPmC,CAOlC;IAgBF;QANC,QAAQ,CAAC;YACR,IAAI,EAAE,MAAM;YACZ,SAAS,EAAE,eAAe;YAC1B,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAAC,KAAK,IAAI,EAAE,CAAC,IAAI,EAAE;YACtD,UAAU,EAAE,IAAI;SACjB,CAAC;8DAGD;IA+LH,OAAO,sBACJ,CAAC;AACN,CAAC,CAAC","sourcesContent":["import { PropertyValues } from 'lit';\nimport { zip } from 'd3-array';\nimport { Constructor } from 'type-fest';\nimport { property } from 'lit/decorators.js';\nimport { isArray, isObjectType } from 'remeda';\nimport { CounterBaseMixin } from './counter-base.js';\nimport { PartData } from '../types/group.js';\nimport { transitionDigit } from '../utils/transition-digit.js';\nimport {\n PartPreprocessedData,\n preprocessPartData,\n} from '../utils/preprocess-part-data.js';\nimport { AvailableNumberAdapterValueType } from '../number-adapter/index.js';\nimport { parseJsonString } from '../utils/parse-json-string.js';\n\nexport interface PartsOptions {\n sampleCount: number;\n /**\n * 可以通过该属性将数字转换为你想要的任意字符串.\n */\n digitToChar: Record<string | number, string> | string[];\n /**\n * 小数点分隔符.\n */\n decimalSeparator: string;\n /**\n * 当**位数不足**时, 强制补全的 [整数, 小数] 位数. 为空时位数自适应.\n */\n minPlaces: [number | undefined, number | undefined];\n fillChar: string;\n /**\n * 数据类型.\n *\n * 1. `'string'`: 字符串类型.\n * 1. 不会使用 `decimalSeparator` 截取小数部分.\n * 2. `'number'`: 数字类型.\n *\n * @default `'number'`\n */\n type: 'string' | 'number';\n}\ntype InnerPartsOptions = Omit<PartsOptions, 'digitToChar'> & {\n digitToChar: Record<string | number, string>;\n};\n\nexport declare class CounterPartsMixinInterface<\n V extends AvailableNumberAdapterValueType,\n> {\n parts: PartData[];\n\n oldParts: PartData[];\n\n partPreprocessDataList: PartPreprocessedData[][];\n\n get partsOptions(): Partial<PartsOptions>;\n\n set partsOptions(value: Partial<PartsOptions>);\n\n sampling(from: V, to: V): V[];\n\n sampleSplit(samples: V[]): V[][];\n\n sampleToString(value: V): string;\n}\n\nfunction toChar(value: number) {\n return String.fromCodePoint(value + 48);\n}\n\nfunction preprocessPartsOptions(options: PartsOptions): InnerPartsOptions {\n const digitToChar: Record<string, string> = {};\n\n if (isArray(options.digitToChar)) {\n options.digitToChar.forEach((char, index) => {\n digitToChar[toChar(index)] = char;\n });\n } else if (isObjectType(options.digitToChar)) {\n Object.entries(options.digitToChar).forEach(([key, value]) => {\n digitToChar[key] = value;\n });\n }\n\n return {\n ...options,\n digitToChar,\n };\n}\n\nexport const CounterPartsMixin = <\n V extends AvailableNumberAdapterValueType,\n T extends ReturnType<typeof CounterBaseMixin<V>> = ReturnType<\n typeof CounterBaseMixin<V>\n >,\n>(\n superClass: T,\n) => {\n class CounterPartsMixinClass extends superClass {\n private static DEFAULT_PARTS_OPTIONS: InnerPartsOptions = {\n sampleCount: 16,\n decimalSeparator: '.',\n fillChar: '0',\n minPlaces: [1, 0],\n digitToChar: {},\n type: 'number',\n };\n\n #__partsOptions: InnerPartsOptions = {\n ...CounterPartsMixinClass.DEFAULT_PARTS_OPTIONS,\n };\n\n /**\n * 这是 `usePartData` 的配置项. `usePartData` 被用于从数值的变化中生成用于滚动的数据.\n * 这里不会有太多解释, 因为它是一个底层的配置项. 你可以查看 `CounterPartsMixinClass` 的源码了解更多信息.\n */\n @property({\n type: Object,\n attribute: 'parts-options',\n converter: value => parseJsonString(value ?? '') ?? {},\n noAccessor: true,\n })\n get partsOptions(): InnerPartsOptions {\n return this.#__partsOptions;\n }\n\n set partsOptions(value: Partial<PartsOptions>) {\n const old = this.#__partsOptions;\n this.#__partsOptions = preprocessPartsOptions({\n ...CounterPartsMixinClass.DEFAULT_PARTS_OPTIONS,\n ...value,\n });\n this.requestUpdate('partsOptions', old);\n }\n // partsOptions: InnerPartsOptions =\n // CounterPartsMixinClass.DEFAULT_PARTS_OPTIONS;\n\n parts: PartData[] = [];\n\n oldParts: PartData[] = [];\n\n partPreprocessDataList: PartPreprocessedData[][] = [];\n\n sampling(from: V, to: V) {\n return transitionDigit(\n this.numberAdapter,\n this.numberAdapter.max(from, to),\n this.numberAdapter.min(from, to),\n this.partsOptions.sampleCount,\n );\n }\n\n // eslint-disable-next-line class-methods-use-this\n sampleSplit(samples: V[]) {\n return [samples.slice()];\n }\n\n sampleToString(value: V) {\n return this.numberAdapter.toString(value);\n }\n\n override willUpdate(changedProperties: PropertyValues<this>) {\n super.willUpdate(changedProperties);\n\n if (changedProperties.has('value')) {\n this.oldParts = this.parts;\n }\n\n /**\n * {@link processPartData} 依赖 {@link partsOptions} 和 {@link value} 生成数据.\n * 当依赖项没有变化时, 不需要重新生成数据.\n */\n if (\n changedProperties.has('value') ||\n changedProperties.has('partsOptions')\n ) {\n this.parts = this.processPartData();\n }\n\n if (changedProperties.has('value')) {\n this.partPreprocessDataList = preprocessPartData(\n this.direction,\n this.parts,\n this.oldDirection,\n this.oldParts,\n );\n }\n\n /**\n * `value` 没变但 `direction` 变化时, 也要重新生成 `partPreprocessDataList`.\n */\n // todo test events 和 animationOptions 冲突\n // if (\n // changedProperties.has('value') ||\n // changedProperties.has('direction')\n // ) {\n // }\n }\n\n /**\n * process:\n * 1. 采样\n * 2. 转换\n * 3. 构造\n */\n private processPartData() {\n const { decimalSeparator, digitToChar, minPlaces, fillChar, type } =\n this.partsOptions;\n\n const from = this.value;\n const to = this.oldValue;\n\n let _sampleToString: (value: V) => string[] = value =>\n this.sampleToString(value).split(decimalSeparator);\n if (type === 'string') {\n _sampleToString = value => [this.sampleToString(value), ''];\n }\n\n const result: PartData[] = [];\n\n /**\n * 对 {@link from} 到 {@link to} 的范围采样.\n */\n const tempParts = this.sampleSplit(this.sampling(from, to));\n\n /**\n * 将时间部分的数字转换为用于滚动的字符串数组\n *\n * headNumber: 最先显示的数字. 向下滚动时, 为滚动列表的最后一个数字, 向上滚动时相反.\n * tailNumber: 最后显示的数字. 向下滚动时, 为滚动列表的第一个数字, 向上滚动时相反.\n */\n {\n const directionValue = this.numberAdapter.gt(from, to) ? 'down' : 'up';\n for (let i = 0; i < tempParts.length; i++) {\n const partData = tempParts[i];\n // const headNumber =\n // partData[directionValue === \"down\" ? partData.length - 1 : 0];\n const tailNumber =\n partData[directionValue === 'down' ? 0 : partData.length - 1];\n\n const [minIntegerPlaces = 1, minDecimalPlaces = 0] = minPlaces;\n\n const numberParts = _sampleToString(tailNumber);\n const integerPlaces = Math.max(\n // numberParts[0].length,\n this.stringAdapter.stringToChars(numberParts[0]).length,\n minIntegerPlaces,\n );\n const decimalPlaces = Math.max(\n // numberParts[1]?.length ?? 0,\n this.stringAdapter.stringToChars(numberParts[1] ?? '').length,\n minDecimalPlaces,\n );\n\n /**\n * 使用 zip 将二维矩阵, 旋转90度\n */\n const data = zip(\n ...partData\n /**\n * 保证位数一致, 向前补零\n */\n .map(digitData => {\n const [integer = '', decimal = ''] = _sampleToString(digitData);\n\n const integerChars = this.stringAdapter.stringToChars(integer);\n const decimalChars = this.stringAdapter.stringToChars(decimal);\n\n const filledIntegerPlaces = Math.max(\n integerPlaces - integerChars.length,\n 0,\n );\n\n const filledDecimalPlaces = Math.max(\n decimalPlaces - decimalChars.length,\n 0,\n );\n\n let filledChars = ([] as string[]).concat(\n new Array(filledIntegerPlaces).fill(fillChar),\n integerChars,\n );\n if (decimalPlaces > 0) {\n filledChars = filledChars.concat(\n [decimalSeparator],\n decimalChars,\n new Array(filledDecimalPlaces).fill(fillChar),\n );\n }\n return filledChars;\n }),\n )\n /**\n * 删除连续的重复项\n */\n .map((digitList, index, array) => ({\n data: digitList\n .filter(\n (digit, digitIndex, digitArray) =>\n digitIndex === 0 || digit !== digitArray[digitIndex - 1],\n )\n .map(digit => digitToChar[digit] ?? digit),\n place: array.length - index,\n }));\n\n result.push({\n digits: data,\n });\n }\n }\n\n return result;\n }\n }\n\n return CounterPartsMixinClass as Constructor<CounterPartsMixinInterface<V>> &\n T;\n};\n"]}
|
|
@@ -1,15 +1,15 @@
|
|
|
1
1
|
import { Constructor } from 'type-fest';
|
|
2
|
-
import { PartDigitCellGetter,
|
|
2
|
+
import { PartDigitCellGetter, PartDigitCellValueOrGetter, PartDigitGetter, PartDigitValueOrGetter, PartGetter, PartValueOrGetter } from '../types/group.js';
|
|
3
3
|
import { CounterPartsMixin } from './counter-parts.js';
|
|
4
4
|
import { AvailableNumberAdapterValueType } from '../number-adapter/index.js';
|
|
5
5
|
export declare class CounterStylesMixinInterface {
|
|
6
|
-
cellStyles:
|
|
6
|
+
cellStyles: PartDigitCellValueOrGetter<Partial<CSSStyleDeclaration>>;
|
|
7
7
|
cellStylesDynamic?: PartDigitCellGetter<Partial<CSSStyleDeclaration>>;
|
|
8
8
|
extractCellStyles(): Partial<CSSStyleDeclaration>[][][];
|
|
9
|
-
digitStyles:
|
|
9
|
+
digitStyles: PartDigitValueOrGetter<Partial<CSSStyleDeclaration>>;
|
|
10
10
|
digitStylesDynamic?: PartDigitGetter<Partial<CSSStyleDeclaration>>;
|
|
11
11
|
extractDigitStyles(): Partial<CSSStyleDeclaration>[][];
|
|
12
|
-
partStyles:
|
|
12
|
+
partStyles: PartValueOrGetter<Partial<CSSStyleDeclaration>>;
|
|
13
13
|
partStylesDynamic?: PartGetter<Partial<CSSStyleDeclaration>>;
|
|
14
14
|
extractPartStyles(): Partial<CSSStyleDeclaration>[];
|
|
15
15
|
color: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"counter-styles.js","sourceRoot":"","sources":["../../../src/mixins/counter-styles.ts"],"names":[],"mappings":";AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,QAAQ,CAAC;AAUrC,OAAO,EACL,0BAA0B,EAC1B,sBAAsB,EACtB,iBAAiB,EACjB,wBAAwB,EACxB,oBAAoB,EACpB,eAAe,GAChB,MAAM,kCAAkC,CAAC;AA0B1C,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAMhC,UAAa,EACb,EAAE;IACF,MAAM,uBAAwB,SAAQ,UAAU;QAAhD;;YACE;;;eAGG;YAEH,eAAU,
|
|
1
|
+
{"version":3,"file":"counter-styles.js","sourceRoot":"","sources":["../../../src/mixins/counter-styles.ts"],"names":[],"mappings":";AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,QAAQ,CAAC;AAUrC,OAAO,EACL,0BAA0B,EAC1B,sBAAsB,EACtB,iBAAiB,EACjB,wBAAwB,EACxB,oBAAoB,EACpB,eAAe,GAChB,MAAM,kCAAkC,CAAC;AA0B1C,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAMhC,UAAa,EACb,EAAE;IACF,MAAM,uBAAwB,SAAQ,UAAU;QAAhD;;YACE;;;eAGG;YAEH,eAAU,GAA6D,EAAE,CAAC;YAIlE,qBAAgB,GACtB,EAAE,CAAC;YAqBL;;;eAGG;YAEH,gBAAW,GAAyD,EAAE,CAAC;YAI/D,sBAAiB,GACvB,EAAE,CAAC;YAqBL;;;eAGG;YAEH,eAAU,GAAoD,EAAE,CAAC;YAIzD,qBAAgB,GAA+C,EAAE,CAAC;YAqB1E;;;;;;;;;eASG;YAEH,UAAK,GAAW,SAAS,CAAC;QAC5B,CAAC;QA5FC,iBAAiB;YACf,MAAM,aAAa,GAAuB;gBACxC,cAAc,EAAE,IAAI,CAAC,sBAAsB;gBAC3C,IAAI,EAAE,IAAI,CAAC,KAAK;gBAChB,SAAS,EAAE,IAAI,CAAC,SAAS;gBACzB,KAAK,EAAE,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,QAAQ,CAAC;aACnC,CAAC;YACF,MAAM,MAAM,GAAG,wBAAwB,CACrC,0BAA0B,CAAC,IAAI,CAAC,UAAU,IAAI,EAAE,EAAE,aAAa,CAAC,EAChE,0BAA0B,CAAC,IAAI,CAAC,iBAAiB,IAAI,EAAE,EAAE,aAAa,CAAC,CACxE,CAAC;YAEF,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,gBAAgB,EAAE,MAAM,CAAC,EAAE,CAAC;gBAChD,IAAI,CAAC,gBAAgB,GAAG,MAAM,CAAC;YACjC,CAAC;YAED,OAAO,IAAI,CAAC,gBAAgB,CAAC;QAC/B,CAAC;QAcD,kBAAkB;YAChB,MAAM,aAAa,GAAuB;gBACxC,cAAc,EAAE,IAAI,CAAC,sBAAsB;gBAC3C,IAAI,EAAE,IAAI,CAAC,KAAK;gBAChB,SAAS,EAAE,IAAI,CAAC,SAAS;gBACzB,KAAK,EAAE,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,QAAQ,CAAC;aACnC,CAAC;YACF,MAAM,MAAM,GAAG,oBAAoB,CACjC,sBAAsB,CAAC,IAAI,CAAC,WAAW,IAAI,EAAE,EAAE,aAAa,CAAC,EAC7D,sBAAsB,CAAC,IAAI,CAAC,kBAAkB,IAAI,EAAE,EAAE,aAAa,CAAC,CACrE,CAAC;YAEF,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,iBAAiB,EAAE,MAAM,CAAC,EAAE,CAAC;gBACjD,IAAI,CAAC,iBAAiB,GAAG,MAAM,CAAC;YAClC,CAAC;YAED,OAAO,IAAI,CAAC,iBAAiB,CAAC;QAChC,CAAC;QAaD,iBAAiB;YACf,MAAM,aAAa,GAAuB;gBACxC,cAAc,EAAE,IAAI,CAAC,sBAAsB;gBAC3C,IAAI,EAAE,IAAI,CAAC,KAAK;gBAChB,SAAS,EAAE,IAAI,CAAC,SAAS;gBACzB,KAAK,EAAE,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,QAAQ,CAAC;aACnC,CAAC;YACF,MAAM,MAAM,GAAG,eAAe,CAC5B,iBAAiB,CAAC,IAAI,CAAC,UAAU,IAAI,EAAE,EAAE,aAAa,CAAC,EACvD,iBAAiB,CAAC,IAAI,CAAC,iBAAiB,IAAI,EAAE,EAAE,aAAa,CAAC,CAC/D,CAAC;YAEF,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,gBAAgB,EAAE,MAAM,CAAC,EAAE,CAAC;gBAChD,IAAI,CAAC,gBAAgB,GAAG,MAAM,CAAC;YACjC,CAAC;YAED,OAAO,IAAI,CAAC,gBAAgB,CAAC;QAC/B,CAAC;KAcF;IAnGC;QADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,aAAa,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;+DACM;IA+B1E;QADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,cAAc,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;gEACE;IA+BvE;QADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,aAAa,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;+DACH;IAoCjE;QADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;0DAChB;IAG5B,OAAO,uBACJ,CAAC;AACN,CAAC,CAAC","sourcesContent":["import { Constructor } from 'type-fest';\nimport { property } from 'lit/decorators.js';\nimport { isDeepEqual } from 'remeda';\nimport {\n GroupGetterOptions,\n PartDigitCellGetter,\n PartDigitCellValueOrGetter,\n PartDigitGetter,\n PartDigitValueOrGetter,\n PartGetter,\n PartValueOrGetter,\n} from '../types/group.js';\nimport {\n extractPartDigitCellOption,\n extractPartDigitOption,\n extractPartOption,\n mergePartDigitCellOption,\n mergePartDigitOption,\n mergePartOption,\n} from '../utils/extract-group-option.js';\nimport { CounterPartsMixin } from './counter-parts.js';\nimport { AvailableNumberAdapterValueType } from '../number-adapter/index.js';\n\nexport declare class CounterStylesMixinInterface {\n cellStyles: PartDigitCellValueOrGetter<Partial<CSSStyleDeclaration>>;\n\n cellStylesDynamic?: PartDigitCellGetter<Partial<CSSStyleDeclaration>>;\n\n extractCellStyles(): Partial<CSSStyleDeclaration>[][][];\n\n digitStyles: PartDigitValueOrGetter<Partial<CSSStyleDeclaration>>;\n\n digitStylesDynamic?: PartDigitGetter<Partial<CSSStyleDeclaration>>;\n\n extractDigitStyles(): Partial<CSSStyleDeclaration>[][];\n\n partStyles: PartValueOrGetter<Partial<CSSStyleDeclaration>>;\n\n partStylesDynamic?: PartGetter<Partial<CSSStyleDeclaration>>;\n\n extractPartStyles(): Partial<CSSStyleDeclaration>[];\n\n color: string;\n}\n\nexport const CounterStylesMixin = <\n V extends AvailableNumberAdapterValueType,\n T extends ReturnType<typeof CounterPartsMixin<V>> = ReturnType<\n typeof CounterPartsMixin<V>\n >,\n>(\n superClass: T,\n) => {\n class CounterStylesMixinClass extends superClass {\n /**\n * 对 `cell` 部分的样式进行设置. 传入的对象将被直接应用到 `cell` 的 `style` 上.\n * 你还可以使用 `cellStylesDynamic` 来动态设置样式.\n */\n @property({ type: Object, attribute: 'cell-styles', reflect: true })\n cellStyles: PartDigitCellValueOrGetter<Partial<CSSStyleDeclaration>> = {};\n\n cellStylesDynamic?: PartDigitCellGetter<Partial<CSSStyleDeclaration>>;\n\n private cachedCellStyles: Partial<CSSStyleDeclaration | undefined>[][][] =\n [];\n\n extractCellStyles() {\n const getterOptions: GroupGetterOptions = {\n preprocessData: this.partPreprocessDataList,\n data: this.parts,\n direction: this.direction,\n value: [this.value, this.oldValue],\n };\n const result = mergePartDigitCellOption(\n extractPartDigitCellOption(this.cellStyles ?? {}, getterOptions),\n extractPartDigitCellOption(this.cellStylesDynamic ?? {}, getterOptions),\n );\n\n if (!isDeepEqual(this.cachedCellStyles, result)) {\n this.cachedCellStyles = result;\n }\n\n return this.cachedCellStyles;\n }\n\n /**\n * 与 `cell` 类似, 但是是对 `digit` 部分的样式进行设置.\n * 你还可以使用 `digitStylesDynamic` 来动态设置样式.\n */\n @property({ type: Object, attribute: 'digit-styles', reflect: true })\n digitStyles: PartDigitValueOrGetter<Partial<CSSStyleDeclaration>> = {};\n\n digitStylesDynamic?: PartDigitGetter<Partial<CSSStyleDeclaration>>;\n\n private cachedDigitStyles: Partial<CSSStyleDeclaration | undefined>[][] =\n [];\n\n extractDigitStyles() {\n const getterOptions: GroupGetterOptions = {\n preprocessData: this.partPreprocessDataList,\n data: this.parts,\n direction: this.direction,\n value: [this.value, this.oldValue],\n };\n const result = mergePartDigitOption(\n extractPartDigitOption(this.digitStyles ?? {}, getterOptions),\n extractPartDigitOption(this.digitStylesDynamic ?? {}, getterOptions),\n );\n\n if (!isDeepEqual(this.cachedDigitStyles, result)) {\n this.cachedDigitStyles = result;\n }\n\n return this.cachedDigitStyles;\n }\n\n /**\n * 与 `cell` 类似, 但是是对 `part` 部分的样式进行设置.\n * 你还可以使用 `partStylesDynamic` 来动态设置样式.\n */\n @property({ type: Object, attribute: 'part-styles', reflect: true })\n partStyles: PartValueOrGetter<Partial<CSSStyleDeclaration>> = {};\n\n partStylesDynamic?: PartGetter<Partial<CSSStyleDeclaration>>;\n\n private cachedPartStyles: Partial<CSSStyleDeclaration | undefined>[] = [];\n\n extractPartStyles() {\n const getterOptions: GroupGetterOptions = {\n preprocessData: this.partPreprocessDataList,\n data: this.parts,\n direction: this.direction,\n value: [this.value, this.oldValue],\n };\n const result = mergePartOption(\n extractPartOption(this.partStyles ?? {}, getterOptions),\n extractPartOption(this.partStylesDynamic ?? {}, getterOptions),\n );\n\n if (!isDeepEqual(this.cachedPartStyles, result)) {\n this.cachedPartStyles = result;\n }\n\n return this.cachedPartStyles;\n }\n\n /**\n * 文本颜色, 可使用 CSS 属性 `color` 和 `background-image` 的值.\n *\n * @default 继承自父元素.\n *\n * @example \"red\" 红色\n * @example \"transparent\" 透明\n * @example \"linear-gradient(90deg, red, blue)\" 红蓝渐变\n * @example \"url('https://example.com/image.png')\" 图片背景\n */\n @property({ type: String, reflect: true })\n color: string = 'inherit';\n }\n\n return CounterStylesMixinClass as Constructor<CounterStylesMixinInterface> &\n T;\n};\n"]}
|
|
@@ -1,18 +1,25 @@
|
|
|
1
1
|
import { css } from 'lit';
|
|
2
2
|
export const timeredCounterStyles = css `
|
|
3
|
-
|
|
3
|
+
:host {
|
|
4
4
|
position: relative;
|
|
5
|
-
|
|
6
|
-
overflow: hidden;
|
|
5
|
+
white-space: nowrap;
|
|
7
6
|
|
|
8
|
-
|
|
9
|
-
inline-block 和 overflow-hidden 同时存在会使得基线为下边缘. 手动设置 align-bottom 以修正这个问题.
|
|
10
|
-
@see https://stackoverflow.com/questions/22421782/css-overflow-hidden-increases-height-of-container
|
|
11
|
-
@see https://www.w3.org/TR/CSS2/visudet.html#propdef-vertical-align
|
|
12
|
-
*/
|
|
13
|
-
vertical-align: bottom;
|
|
7
|
+
display: inline-block;
|
|
14
8
|
}
|
|
15
9
|
|
|
10
|
+
//.timered-counter {
|
|
11
|
+
// position: relative;
|
|
12
|
+
// display: inline-flex;
|
|
13
|
+
// overflow: hidden;
|
|
14
|
+
//
|
|
15
|
+
// /**
|
|
16
|
+
// inline-block 和 overflow-hidden 同时存在会使得基线为下边缘. 手动设置 align-bottom 以修正这个问题.
|
|
17
|
+
// @see https://stackoverflow.com/questions/22421782/css-overflow-hidden-increases-height-of-container
|
|
18
|
+
// @see https://www.w3.org/TR/CSS2/visudet.html#propdef-vertical-align
|
|
19
|
+
// */
|
|
20
|
+
// vertical-align: bottom;
|
|
21
|
+
//}
|
|
22
|
+
|
|
16
23
|
.timered-counter.debug {
|
|
17
24
|
overflow: visible;
|
|
18
25
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"timered-counter-styles.js","sourceRoot":"","sources":["../../../src/styles/timered-counter-styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,oBAAoB,GAAG,GAAG,CAAA
|
|
1
|
+
{"version":3,"file":"timered-counter-styles.js","sourceRoot":"","sources":["../../../src/styles/timered-counter-styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,oBAAoB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6BtC,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const timeredCounterStyles = css`\n :host {\n position: relative;\n white-space: nowrap;\n\n display: inline-block;\n }\n\n //.timered-counter {\n // position: relative;\n // display: inline-flex;\n // overflow: hidden;\n //\n // /**\n // inline-block 和 overflow-hidden 同时存在会使得基线为下边缘. 手动设置 align-bottom 以修正这个问题.\n // @see https://stackoverflow.com/questions/22421782/css-overflow-hidden-increases-height-of-container\n // @see https://www.w3.org/TR/CSS2/visudet.html#propdef-vertical-align\n // */\n // vertical-align: bottom;\n //}\n\n .timered-counter.debug {\n overflow: visible;\n }\n\n //.timered-counter-datetime-duration .duration-unit {\n // font-size: 0.4em;\n // line-height: 1;\n //}\n`;\n"]}
|
|
@@ -181,7 +181,8 @@ let TimeredCounterDatetimeDuration = class TimeredCounterDatetimeDuration extend
|
|
|
181
181
|
return html `
|
|
182
182
|
<timered-counter-roller
|
|
183
183
|
class="timered-counter timered-counter-datetime-duration"
|
|
184
|
-
exportparts="prefix, suffix, part-suffix"
|
|
184
|
+
exportparts="group, part, digit, cell, prefix, suffix, part-suffix"
|
|
185
|
+
part="group"
|
|
185
186
|
aria-hidden="true"
|
|
186
187
|
color=${this.color}
|
|
187
188
|
.parentContainerRect=${this.partsContainerRect}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"timered-counter-datetime-duration.js","sourceRoot":"","sources":["../../src/timered-counter-datetime-duration.ts"],"names":[],"mappings":"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","sourcesContent":["import { customElement, property } from 'lit/decorators.js';\nimport { html, PropertyValues } from 'lit';\nimport { repeat } from 'lit/directives/repeat.js';\nimport { isArray, isDate, isNullish, isString, map } from 'remeda';\nimport { isValid, toDate, isBefore } from 'date-fns';\nimport { TimeredCounter } from './timered-counter.js';\nimport { AvailableNumberAdapterValueType } from './number-adapter/index.js';\nimport { DurationPartMillisecond, DurationPartType } from './types/duration.js';\nimport { getLocalizedDateTimeFields } from './utils/localized-date-time-fields.js';\nimport { duration, durationObject } from './utils/duration.js';\nimport { iso8601Duration } from './utils/iso8601-duration.js';\nimport { timeredCounterDatetimeStyles } from './styles/timered-counter-datetime-styles.js';\nimport { parseJsonString } from './utils/parse-json-string.js';\nimport { PartsOptions } from './mixins/counter-parts.js';\n\n/**\n * 根据最小精度对 from 进行优化. 避免频繁更新.\n *\n * 1. from 先会被减小到 minPrecisionMs 的整数倍.\n * 2. 如果 from 和 to 的差值不是 minPrecisionMs 的整数倍, 则再加上/减去一个 minPrecisionMs 的值. 加上或减去取决于 from 和 to 的谁更大.\n * 这相当于将 from 中小于 minPrecisionMs 的值舍入到 minPrecisionMs 的整数倍.\n * 3. 加上 to 余 minPrecisionMs 的值, 保证 from 与 to 的差值是 minPrecisionMs 的整数倍.\n */\nfunction optimizeFrom(from: Date, to: Date, minPrecision: DurationPartType) {\n const minPrecisionMs = DurationPartMillisecond[minPrecision];\n const fromTS = from.getTime();\n const toTS = to.getTime();\n\n const base = fromTS - (fromTS % minPrecisionMs);\n const offset = Math.abs(toTS - fromTS) % minPrecisionMs;\n\n return (\n base +\n (offset > 0 ? (fromTS < toTS ? -1 : 1) * minPrecisionMs : 0) +\n // 加上 deadlineDate 的余数, 消除精度误差.\n (toTS % minPrecisionMs)\n );\n}\n\nfunction toDurationInMilliseconds(value: any, minPrecision: DurationPartType) {\n if (isString(value)) value = parseJsonString(value);\n\n if (!isArray(value)) value = [value, value];\n\n const result = [\n isDate(value[0]) ? value[0] : toDate(value[0]),\n isDate(value[1]) ? value[1] : toDate(value[1]),\n ] as const;\n\n if (!isValid(result[0]) || !isValid(result[1])) {\n throw new Error(`value ${value[0]} or ${value[1]} is not a valid date.`);\n }\n\n const durationInMilliseconds = Math.abs(\n result[1].getTime() - optimizeFrom(result[0], result[1], minPrecision),\n );\n\n return {\n durationInMilliseconds,\n from: result[0],\n to: result[1],\n };\n}\n\n@customElement('timered-counter-datetime-duration')\nexport class TimeredCounterDatetimeDuration extends TimeredCounter {\n static styles = [...TimeredCounter.styles, timeredCounterDatetimeStyles];\n\n private __precision: DurationPartType | [DurationPartType, DurationPartType] =\n [DurationPartType.Second, DurationPartType.Day];\n\n /**\n * 计数器显示的精度.\n * 1. 当为单个值时, 表示最小精度.\n * 2. 当为数组时, 第一个值表示最小精度, 第二个值表示最大精度.\n *\n * @default [DurationPartType.Second, DurationPartType.Day]\n *\n * @example DurationPartType.Second 显示从年份到秒数的所有精度.\n * @example [DurationPartType.Second, DurationPartType.Day] 显示从天数到秒数的所有精度.\n * @example [DurationPartType.Millisecond, DurationPartType.Year] 显示从年份到毫秒的所有精度.\n */\n @property({\n reflect: true,\n converter: value => {\n if (isNullish(value)) return value;\n\n return parseJsonString(value);\n },\n })\n get precision() {\n return this.__precision;\n }\n\n set precision(value: any) {\n if (isString(value)) value = parseJsonString(value);\n\n this.__precision = value;\n\n /**\n * `precision` 相关属性的更新需要立即更新, 以便于在 `value`, `initialValue` 等属性的 setter 中使用.\n */\n this.__minPrecision = isArray(this.__precision)\n ? this.__precision[0]\n : this.__precision;\n this.__maxPrecision = isArray(this.__precision)\n ? this.__precision[1]\n : this.__precision;\n\n this.__availableDurationParts = Object.values(DurationPartType)\n .reverse()\n .map(type => {\n const minPrecisionBreakpoint =\n DurationPartMillisecond[this.__minPrecision];\n const maxPrecisionBreakpoint =\n DurationPartMillisecond[this.__maxPrecision];\n const partMilliseconds = DurationPartMillisecond[type];\n return {\n type,\n available:\n partMilliseconds >= minPrecisionBreakpoint &&\n partMilliseconds <= maxPrecisionBreakpoint,\n };\n })\n .filter(part => part.available);\n }\n\n get value() {\n return super.value;\n }\n\n /**\n * 通过 property 设置 value 时, 支持 Date 类型.\n */\n set value(value: any) {\n const { from, to, durationInMilliseconds } = toDurationInMilliseconds(\n value,\n this.__minPrecision,\n );\n\n this.__from = from;\n this.__to = to;\n super.value = durationInMilliseconds;\n }\n\n private __initialValuePlain: any = null;\n\n get initialValue() {\n return super.initialValue;\n }\n\n /**\n * 同 value\n */\n set initialValue(value: any) {\n this.__initialValuePlain = value;\n\n const { durationInMilliseconds } = toDurationInMilliseconds(\n value,\n this.__minPrecision,\n );\n super.initialValue = durationInMilliseconds;\n }\n\n private __partsOptions: Partial<PartsOptions> | null = null;\n\n get partsOptions(): Partial<PartsOptions> {\n return super.partsOptions;\n }\n\n set partsOptions(value: Partial<PartsOptions>) {\n this.__partsOptions = value;\n super.partsOptions = {\n minPlaces: [2, undefined],\n ...this.__partsOptions,\n };\n }\n\n private __from: Date = new Date();\n\n private __to: Date = new Date();\n\n private __minPrecision: DurationPartType = DurationPartType.Second;\n\n private __maxPrecision: DurationPartType = DurationPartType.Day;\n\n private __availableDurationParts = [] as {\n type: DurationPartType;\n available: boolean;\n }[];\n\n private __dateTimeFieldLabels = {} as Record<DurationPartType, string>;\n\n override sampleSplit(\n samples: AvailableNumberAdapterValueType[],\n ): AvailableNumberAdapterValueType[][] {\n const availableDurationPartTypes = map(\n this.__availableDurationParts,\n part => part.type,\n );\n\n const tempParts = availableDurationPartTypes.map(() => [] as number[]);\n for (const n of samples) {\n const num = this.numberAdapter.toNumber(n);\n /**\n * 计算并保存每个在 {@link precision} 范围内的时间部分的值\n */\n const availablePartValues = duration(\n new Date(Math.min(num, 0)),\n new Date(Math.max(num, 0)),\n availableDurationPartTypes,\n );\n availablePartValues.forEach((value, i) => tempParts[i].push(value));\n }\n\n return tempParts;\n }\n\n override generateAriaLabel(): string {\n return iso8601Duration(\n durationObject(\n isBefore(this.__from, this.__to) ? this.__from : this.__to,\n isBefore(this.__from, this.__to) ? this.__to : this.__from,\n map(this.__availableDurationParts, part => part.type),\n ),\n );\n }\n\n override connectedCallback() {\n this.role = 'timer';\n\n /**\n * TimeredCounterDatetimeDuration 将 `minPlaces` 默认设置为 `[2]`. 实例化时需要手动触发 `partsOptions` 的 setter.\n */\n this.partsOptions = this.__partsOptions ?? {};\n\n this.initialValue = this.__initialValuePlain;\n\n /**\n * 类似上方的 partsOptions, precision 也需要在初始化时手动触发 setter. 以此确保 __minPrecision, __maxPrecision, __availableDurationParts 有值.\n */\n this.precision = this.__precision;\n\n super.connectedCallback();\n }\n\n override willUpdate(_changedProperties: PropertyValues) {\n super.willUpdate(_changedProperties);\n\n if (_changedProperties.has('locale')) {\n this.__dateTimeFieldLabels = getLocalizedDateTimeFields(\n this.localeInstance,\n );\n }\n }\n\n override render() {\n const cellStyles = this.extractCellStyles();\n const digitStyles = this.extractDigitStyles();\n const partStyles = this.extractPartStyles();\n\n const animationOptions = this.extractAnimationOptions();\n const keyframes = this.extractKeyframes();\n\n const availableDurationPartTypes = map(\n this.__availableDurationParts,\n part => part.type,\n );\n\n return html`\n <timered-counter-roller\n class=\"timered-counter timered-counter-datetime-duration\"\n exportparts=\"prefix, suffix, part-suffix\"\n aria-hidden=\"true\"\n color=${this.color}\n .parentContainerRect=${this.partsContainerRect}\n .parts=${this.parts}\n .partPreprocessDataList=${this.partPreprocessDataList}\n .animationOptions=${animationOptions}\n .keyframes=${keyframes}\n .cellStyles=${cellStyles}\n .digitStyles=${digitStyles}\n .partStyles=${partStyles}\n .direction=${this.direction}\n @roller-animation-start=${this.dispatchTimeredCounterAnimationStart}\n @roller-animation-end=${this.dispatchTimeredCounterAnimationEnd}\n ><slot name=\"prefix\" slot=\"prefix\"></slot\n ><slot name=\"suffix\" slot=\"suffix\"></slot>${repeat(\n this.parts,\n (_, index) => index,\n (_, partIndex) =>\n html`<span slot=${`part-suffix-${partIndex}`} class=\"duration-unit\"\n >${this.__dateTimeFieldLabels[\n availableDurationPartTypes[partIndex]\n ]}</span\n >`,\n )}\n </timered-counter-roller>\n `;\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"timered-counter-datetime-duration.js","sourceRoot":"","sources":["../../src/timered-counter-datetime-duration.ts"],"names":[],"mappings":"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","sourcesContent":["import { customElement, property } from 'lit/decorators.js';\nimport { html, PropertyValues } from 'lit';\nimport { repeat } from 'lit/directives/repeat.js';\nimport { isArray, isDate, isNullish, isString, map } from 'remeda';\nimport { isValid, toDate, isBefore } from 'date-fns';\nimport { TimeredCounter } from './timered-counter.js';\nimport { AvailableNumberAdapterValueType } from './number-adapter/index.js';\nimport { DurationPartMillisecond, DurationPartType } from './types/duration.js';\nimport { getLocalizedDateTimeFields } from './utils/localized-date-time-fields.js';\nimport { duration, durationObject } from './utils/duration.js';\nimport { iso8601Duration } from './utils/iso8601-duration.js';\nimport { timeredCounterDatetimeStyles } from './styles/timered-counter-datetime-styles.js';\nimport { parseJsonString } from './utils/parse-json-string.js';\nimport { PartsOptions } from './mixins/counter-parts.js';\n\n/**\n * 根据最小精度对 from 进行优化. 避免频繁更新.\n *\n * 1. from 先会被减小到 minPrecisionMs 的整数倍.\n * 2. 如果 from 和 to 的差值不是 minPrecisionMs 的整数倍, 则再加上/减去一个 minPrecisionMs 的值. 加上或减去取决于 from 和 to 的谁更大.\n * 这相当于将 from 中小于 minPrecisionMs 的值舍入到 minPrecisionMs 的整数倍.\n * 3. 加上 to 余 minPrecisionMs 的值, 保证 from 与 to 的差值是 minPrecisionMs 的整数倍.\n */\nfunction optimizeFrom(from: Date, to: Date, minPrecision: DurationPartType) {\n const minPrecisionMs = DurationPartMillisecond[minPrecision];\n const fromTS = from.getTime();\n const toTS = to.getTime();\n\n const base = fromTS - (fromTS % minPrecisionMs);\n const offset = Math.abs(toTS - fromTS) % minPrecisionMs;\n\n return (\n base +\n (offset > 0 ? (fromTS < toTS ? -1 : 1) * minPrecisionMs : 0) +\n // 加上 deadlineDate 的余数, 消除精度误差.\n (toTS % minPrecisionMs)\n );\n}\n\nfunction toDurationInMilliseconds(value: any, minPrecision: DurationPartType) {\n if (isString(value)) value = parseJsonString(value);\n\n if (!isArray(value)) value = [value, value];\n\n const result = [\n isDate(value[0]) ? value[0] : toDate(value[0]),\n isDate(value[1]) ? value[1] : toDate(value[1]),\n ] as const;\n\n if (!isValid(result[0]) || !isValid(result[1])) {\n throw new Error(`value ${value[0]} or ${value[1]} is not a valid date.`);\n }\n\n const durationInMilliseconds = Math.abs(\n result[1].getTime() - optimizeFrom(result[0], result[1], minPrecision),\n );\n\n return {\n durationInMilliseconds,\n from: result[0],\n to: result[1],\n };\n}\n\n@customElement('timered-counter-datetime-duration')\nexport class TimeredCounterDatetimeDuration extends TimeredCounter {\n static styles = [...TimeredCounter.styles, timeredCounterDatetimeStyles];\n\n private __precision: DurationPartType | [DurationPartType, DurationPartType] =\n [DurationPartType.Second, DurationPartType.Day];\n\n /**\n * 计数器显示的精度.\n * 1. 当为单个值时, 表示最小精度.\n * 2. 当为数组时, 第一个值表示最小精度, 第二个值表示最大精度.\n *\n * @default [DurationPartType.Second, DurationPartType.Day]\n *\n * @example DurationPartType.Second 显示从年份到秒数的所有精度.\n * @example [DurationPartType.Second, DurationPartType.Day] 显示从天数到秒数的所有精度.\n * @example [DurationPartType.Millisecond, DurationPartType.Year] 显示从年份到毫秒的所有精度.\n */\n @property({\n reflect: true,\n converter: value => {\n if (isNullish(value)) return value;\n\n return parseJsonString(value);\n },\n })\n get precision() {\n return this.__precision;\n }\n\n set precision(value: any) {\n if (isString(value)) value = parseJsonString(value);\n\n this.__precision = value;\n\n /**\n * `precision` 相关属性的更新需要立即更新, 以便于在 `value`, `initialValue` 等属性的 setter 中使用.\n */\n this.__minPrecision = isArray(this.__precision)\n ? this.__precision[0]\n : this.__precision;\n this.__maxPrecision = isArray(this.__precision)\n ? this.__precision[1]\n : this.__precision;\n\n this.__availableDurationParts = Object.values(DurationPartType)\n .reverse()\n .map(type => {\n const minPrecisionBreakpoint =\n DurationPartMillisecond[this.__minPrecision];\n const maxPrecisionBreakpoint =\n DurationPartMillisecond[this.__maxPrecision];\n const partMilliseconds = DurationPartMillisecond[type];\n return {\n type,\n available:\n partMilliseconds >= minPrecisionBreakpoint &&\n partMilliseconds <= maxPrecisionBreakpoint,\n };\n })\n .filter(part => part.available);\n }\n\n get value() {\n return super.value;\n }\n\n /**\n * 通过 property 设置 value 时, 支持 Date 类型.\n */\n set value(value: any) {\n const { from, to, durationInMilliseconds } = toDurationInMilliseconds(\n value,\n this.__minPrecision,\n );\n\n this.__from = from;\n this.__to = to;\n super.value = durationInMilliseconds;\n }\n\n private __initialValuePlain: any = null;\n\n get initialValue() {\n return super.initialValue;\n }\n\n /**\n * 同 value\n */\n set initialValue(value: any) {\n this.__initialValuePlain = value;\n\n const { durationInMilliseconds } = toDurationInMilliseconds(\n value,\n this.__minPrecision,\n );\n super.initialValue = durationInMilliseconds;\n }\n\n private __partsOptions: Partial<PartsOptions> | null = null;\n\n get partsOptions(): Partial<PartsOptions> {\n return super.partsOptions;\n }\n\n set partsOptions(value: Partial<PartsOptions>) {\n this.__partsOptions = value;\n super.partsOptions = {\n minPlaces: [2, undefined],\n ...this.__partsOptions,\n };\n }\n\n private __from: Date = new Date();\n\n private __to: Date = new Date();\n\n private __minPrecision: DurationPartType = DurationPartType.Second;\n\n private __maxPrecision: DurationPartType = DurationPartType.Day;\n\n private __availableDurationParts = [] as {\n type: DurationPartType;\n available: boolean;\n }[];\n\n private __dateTimeFieldLabels = {} as Record<DurationPartType, string>;\n\n override sampleSplit(\n samples: AvailableNumberAdapterValueType[],\n ): AvailableNumberAdapterValueType[][] {\n const availableDurationPartTypes = map(\n this.__availableDurationParts,\n part => part.type,\n );\n\n const tempParts = availableDurationPartTypes.map(() => [] as number[]);\n for (const n of samples) {\n const num = this.numberAdapter.toNumber(n);\n /**\n * 计算并保存每个在 {@link precision} 范围内的时间部分的值\n */\n const availablePartValues = duration(\n new Date(Math.min(num, 0)),\n new Date(Math.max(num, 0)),\n availableDurationPartTypes,\n );\n availablePartValues.forEach((value, i) => tempParts[i].push(value));\n }\n\n return tempParts;\n }\n\n override generateAriaLabel(): string {\n return iso8601Duration(\n durationObject(\n isBefore(this.__from, this.__to) ? this.__from : this.__to,\n isBefore(this.__from, this.__to) ? this.__to : this.__from,\n map(this.__availableDurationParts, part => part.type),\n ),\n );\n }\n\n override connectedCallback() {\n this.role = 'timer';\n\n /**\n * TimeredCounterDatetimeDuration 将 `minPlaces` 默认设置为 `[2]`. 实例化时需要手动触发 `partsOptions` 的 setter.\n */\n this.partsOptions = this.__partsOptions ?? {};\n\n this.initialValue = this.__initialValuePlain;\n\n /**\n * 类似上方的 partsOptions, precision 也需要在初始化时手动触发 setter. 以此确保 __minPrecision, __maxPrecision, __availableDurationParts 有值.\n */\n this.precision = this.__precision;\n\n super.connectedCallback();\n }\n\n override willUpdate(_changedProperties: PropertyValues) {\n super.willUpdate(_changedProperties);\n\n if (_changedProperties.has('locale')) {\n this.__dateTimeFieldLabels = getLocalizedDateTimeFields(\n this.localeInstance,\n );\n }\n }\n\n override render() {\n const cellStyles = this.extractCellStyles();\n const digitStyles = this.extractDigitStyles();\n const partStyles = this.extractPartStyles();\n\n const animationOptions = this.extractAnimationOptions();\n const keyframes = this.extractKeyframes();\n\n const availableDurationPartTypes = map(\n this.__availableDurationParts,\n part => part.type,\n );\n\n return html`\n <timered-counter-roller\n class=\"timered-counter timered-counter-datetime-duration\"\n exportparts=\"group, part, digit, cell, prefix, suffix, part-suffix\"\n part=\"group\"\n aria-hidden=\"true\"\n color=${this.color}\n .parentContainerRect=${this.partsContainerRect}\n .parts=${this.parts}\n .partPreprocessDataList=${this.partPreprocessDataList}\n .animationOptions=${animationOptions}\n .keyframes=${keyframes}\n .cellStyles=${cellStyles}\n .digitStyles=${digitStyles}\n .partStyles=${partStyles}\n .direction=${this.direction}\n @roller-animation-start=${this.dispatchTimeredCounterAnimationStart}\n @roller-animation-end=${this.dispatchTimeredCounterAnimationEnd}\n ><slot name=\"prefix\" slot=\"prefix\"></slot\n ><slot name=\"suffix\" slot=\"suffix\"></slot>${repeat(\n this.parts,\n (_, index) => index,\n (_, partIndex) =>\n html`<span slot=${`part-suffix-${partIndex}`} class=\"duration-unit\"\n >${this.__dateTimeFieldLabels[\n availableDurationPartTypes[partIndex]\n ]}</span\n >`,\n )}\n </timered-counter-roller>\n `;\n }\n}\n"]}
|
|
@@ -43,7 +43,8 @@ let TimeredCounterNumber = class TimeredCounterNumber extends TimeredCounter {
|
|
|
43
43
|
return html `
|
|
44
44
|
<timered-counter-roller
|
|
45
45
|
class="timered-counter timered-counter-datetime-duration"
|
|
46
|
-
exportparts="prefix, suffix, part-suffix"
|
|
46
|
+
exportparts="group, part, digit, cell, prefix, suffix, part-suffix"
|
|
47
|
+
part="group"
|
|
47
48
|
aria-hidden="true"
|
|
48
49
|
color=${this.color}
|
|
49
50
|
.parentContainerRect=${this.partsContainerRect}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"timered-counter-number.js","sourceRoot":"","sources":["../../src/timered-counter-number.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACnE,OAAO,EAAE,IAAI,EAAkB,MAAM,KAAK,CAAC;AAC3C,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAClD,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AAC9C,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAEtD,OAAO,EAAE,0BAA0B,EAAE,MAAM,2CAA2C,CAAC;AAGhF,IAAM,oBAAoB,GAA1B,MAAM,oBAAqB,SAAQ,cAAc;IAAjD;;QAGL;;;;;;WAMG;QAcH,iBAAY,GAAuC,KAAK,CAAC;QAEzD,yBAAoB,GAAsB,IAAI,IAAI,CAAC,YAAY,CAC7D,IAAI,CAAC,cAAc,EACnB,SAAS,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,YAAY,CACtD,CAAC;QAEF;;;WAGG;QAEH,0BAAqB,GAAG,EAAE,CAAC;QAE3B;;;WAGG;QAEH,4BAAuB,GAAG,EAAE,CAAC;
|
|
1
|
+
{"version":3,"file":"timered-counter-number.js","sourceRoot":"","sources":["../../src/timered-counter-number.ts"],"names":[],"mappings":"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","sourcesContent":["import { customElement, property, state } from 'lit/decorators.js';\nimport { html, PropertyValues } from 'lit';\nimport { repeat } from 'lit/directives/repeat.js';\nimport { isBoolean, isNullish } from 'remeda';\nimport { TimeredCounter } from './timered-counter.js';\nimport { AvailableNumberAdapterValueType } from './number-adapter/index.js';\nimport { timeredCounterNumberStyles } from './styles/timered-counter-number-styles.js';\n\n@customElement('timered-counter-number')\nexport class TimeredCounterNumber extends TimeredCounter {\n static styles = [...TimeredCounter.styles, timeredCounterNumberStyles];\n\n /**\n * 本地化数字格式化配置. 传入 `true` 时使用浏览器的默认配置.\n *\n * 详细配置参数请参考 [Intl.NumberFormat](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/NumberFormat)\n *\n * @default false\n */\n @property({\n converter: value => {\n if (isNullish(value)) return false;\n\n try {\n return JSON.parse(value);\n } catch (error) {\n return true;\n }\n },\n reflect: true,\n attribute: 'locale-number',\n })\n localeNumber: Intl.NumberFormatOptions | boolean = false;\n\n localeNumberInstance: Intl.NumberFormat = new Intl.NumberFormat(\n this.localeInstance,\n isBoolean(this.localeNumber) ? {} : this.localeNumber,\n );\n\n /**\n * 本地化数字格式化配置中的小数点分隔符. 根据不同的地区可能是 `.` 或 `,`.\n * @see https://en.wikipedia.org/wiki/Decimal_separator\n */\n @state()\n localDecimalSeparator = '';\n\n /**\n * 本地化数字格式化配置中的分组分隔符.\n * @see https://en.wikipedia.org/wiki/Decimal_separator#Digit_grouping\n */\n @state()\n localeGroupingSeparator = '';\n\n override sampleToString(value: AvailableNumberAdapterValueType): string {\n return this.localeNumber\n ? // todo Intl.NumberFormat 最大支持 21 位数.\n this.localeNumberInstance.format(this.numberAdapter.toNumber(value))\n : this.numberAdapter.toString(value);\n }\n\n override render() {\n const cellStyles = this.extractCellStyles();\n const digitStyles = this.extractDigitStyles();\n const partStyles = this.extractPartStyles();\n\n const animationOptions = this.extractAnimationOptions();\n const keyframes = this.extractKeyframes();\n\n return html`\n <timered-counter-roller\n class=\"timered-counter timered-counter-datetime-duration\"\n exportparts=\"group, part, digit, cell, prefix, suffix, part-suffix\"\n part=\"group\"\n aria-hidden=\"true\"\n color=${this.color}\n .parentContainerRect=${this.partsContainerRect}\n .parts=${this.parts}\n .partPreprocessDataList=${this.partPreprocessDataList}\n .animationOptions=${animationOptions}\n .keyframes=${keyframes}\n .cellStyles=${cellStyles}\n .digitStyles=${digitStyles}\n .partStyles=${partStyles}\n .direction=${this.direction}\n @roller-animation-start=${this.dispatchTimeredCounterAnimationStart}\n @roller-animation-end=${this.dispatchTimeredCounterAnimationEnd}\n >\n <slot name=\"prefix\" slot=\"prefix\"></slot>\n <slot name=\"suffix\" slot=\"suffix\"></slot>\n ${repeat(\n this.parts,\n (_, index) => index,\n (_, partIndex) =>\n html`<slot\n name=${`part-suffix-${partIndex}`}\n slot=${`part-suffix-${partIndex}`}\n ></slot>`,\n )}\n </timered-counter-roller>\n `;\n }\n\n override willUpdate(_changedProperties: PropertyValues<this>) {\n if (\n _changedProperties.has('localeNumber') ||\n _changedProperties.has('locale')\n ) {\n this.localeNumberInstance = new Intl.NumberFormat(\n this.localeInstance,\n isBoolean(this.localeNumber) ? {} : this.localeNumber,\n );\n\n /**\n * 本地化数字格式化配置变化时, 更新 `partsOptions` 中的 `decimalSeparator`.\n */\n {\n const numberParts = this.localeNumberInstance.formatToParts(123456.789);\n\n const decimalSeparator =\n numberParts.find(part => part.type === 'decimal')?.value || '.';\n const groupingSeparator =\n numberParts.find(part => part.type === 'group')?.value || '';\n\n if (\n this.localDecimalSeparator !== decimalSeparator ||\n this.localeGroupingSeparator !== groupingSeparator\n ) {\n this.localDecimalSeparator = decimalSeparator;\n\n const oldPartsOptions = this.partsOptions;\n this.partsOptions = {\n ...oldPartsOptions,\n decimalSeparator: this.localDecimalSeparator,\n };\n _changedProperties.set('partsOptions', oldPartsOptions);\n }\n }\n }\n\n super.willUpdate(_changedProperties);\n }\n}\n"]}
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import { PropertyValues } from 'lit';
|
|
2
1
|
import { TimeredCounter } from './timered-counter.js';
|
|
3
2
|
import { PartsOptions } from './mixins/counter-parts.js';
|
|
4
3
|
import { AvailableNumberAdapterValueType } from './number-adapter/index.js';
|
|
@@ -27,5 +26,4 @@ export declare class TimeredCounterString extends TimeredCounter {
|
|
|
27
26
|
private __anyBaseToDecimal;
|
|
28
27
|
sampleToString(value: AvailableNumberAdapterValueType): string;
|
|
29
28
|
connectedCallback(): void;
|
|
30
|
-
firstUpdated(_changedProperties: PropertyValues<this>): void;
|
|
31
29
|
}
|
|
@@ -73,14 +73,12 @@ let TimeredCounterString = class TimeredCounterString extends TimeredCounter {
|
|
|
73
73
|
super.value = this.numberAdapter.create(0);
|
|
74
74
|
return;
|
|
75
75
|
}
|
|
76
|
-
const oldValueString =
|
|
77
|
-
? ''
|
|
78
|
-
: this.__decimalToAnyBase(this.numberAdapter.toString(this.value));
|
|
76
|
+
const oldValueString = this.__oldValueString || this.__initialValueString;
|
|
79
77
|
this.__updateAlphabet(this.__valueString, oldValueString);
|
|
80
78
|
/**
|
|
81
79
|
* 由于 oldValue 基于之前的 `__alphabet` 计算, 当 通过 `__updateAlphabet` 更新 `__alphabet` 后, 需要同步更新 oldValue.
|
|
82
80
|
*/
|
|
83
|
-
super.oldValue = this.numberAdapter.create(this.__anyBaseToDecimal(
|
|
81
|
+
super.oldValue = this.numberAdapter.create(this.__anyBaseToDecimal(oldValueString));
|
|
84
82
|
super.value = this.numberAdapter.create(this.__anyBaseToDecimal(this.__valueString));
|
|
85
83
|
}
|
|
86
84
|
get partsOptions() {
|
|
@@ -127,9 +125,6 @@ let TimeredCounterString = class TimeredCounterString extends TimeredCounter {
|
|
|
127
125
|
this.__updateAlphabet(this.__valueString, this.__initialValueString);
|
|
128
126
|
this.initialValue = this.__initialValueString;
|
|
129
127
|
this.value = this.__valueString;
|
|
130
|
-
}
|
|
131
|
-
firstUpdated(_changedProperties) {
|
|
132
|
-
super.firstUpdated(_changedProperties);
|
|
133
128
|
/**
|
|
134
129
|
* TimeredCounterString 有自定义的 `fillChar` 和 `digitToChar`. 实例化时需要手动触发 `partsOptions` 的 setter.
|
|
135
130
|
*/
|