timered-counter 0.0.2 → 0.0.4

package/dist/src/timered-counter-datetime-duration.js

@@ -3,7 +3,7 @@ import { customElement, property } from 'lit/decorators.js';
 import { html } from 'lit';
 import { repeat } from 'lit/directives/repeat.js';
 import { isArray, isDate, isNullish, isString, map } from 'remeda';
-import { isValid, toDate } from 'date-fns';
+import { isValid, toDate, isBefore } from 'date-fns';
 import { TimeredCounter } from './timered-counter.js';
 import { DurationPartMillisecond, DurationPartType } from './types/duration.js';
 import { getLocalizedDateTimeFields } from './utils/localized-date-time-fields.js';
@@ -30,14 +30,33 @@ function optimizeFrom(from, to, minPrecision) {
         // 加上 deadlineDate 的余数, 消除精度误差.
         (toTS % minPrecisionMs));
 }
+function toDurationInMilliseconds(value, minPrecision) {
+    if (isString(value))
+        value = parseJsonString(value);
+    if (!isArray(value))
+        value = [value, value];
+    const result = [
+        isDate(value[0]) ? value[0] : toDate(value[0]),
+        isDate(value[1]) ? value[1] : toDate(value[1]),
+    ];
+    if (!isValid(result[0]) || !isValid(result[1])) {
+        throw new Error(`value ${value[0]} or ${value[1]} is not a valid date.`);
+    }
+    const durationInMilliseconds = Math.abs(result[1].getTime() - optimizeFrom(result[0], result[1], minPrecision));
+    return {
+        durationInMilliseconds,
+        from: result[0],
+        to: result[1],
+    };
+}
 let TimeredCounterDatetimeDuration = class TimeredCounterDatetimeDuration extends TimeredCounter {
     constructor() {
         super(...arguments);
         this.__precision = [DurationPartType.Second, DurationPartType.Day];
+        this.__initialValuePlain = null;
         this.__partsOptions = null;
         this.__from = new Date();
         this.__to = new Date();
-        this.__durationInMilliseconds = 0;
         this.__minPrecision = DurationPartType.Second;
         this.__maxPrecision = DurationPartType.Day;
         this.__availableDurationParts = [];
@@ -61,6 +80,28 @@ let TimeredCounterDatetimeDuration = class TimeredCounterDatetimeDuration extend
         if (isString(value))
             value = parseJsonString(value);
         this.__precision = value;
+        /**
+         * `precision` 相关属性的更新需要立即更新, 以便于在 `value`, `initialValue` 等属性的 setter 中使用.
+         */
+        this.__minPrecision = isArray(this.__precision)
+            ? this.__precision[0]
+            : this.__precision;
+        this.__maxPrecision = isArray(this.__precision)
+            ? this.__precision[1]
+            : this.__precision;
+        this.__availableDurationParts = Object.values(DurationPartType)
+            .reverse()
+            .map(type => {
+            const minPrecisionBreakpoint = DurationPartMillisecond[this.__minPrecision];
+            const maxPrecisionBreakpoint = DurationPartMillisecond[this.__maxPrecision];
+            const partMilliseconds = DurationPartMillisecond[type];
+            return {
+                type,
+                available: partMilliseconds >= minPrecisionBreakpoint &&
+                    partMilliseconds <= maxPrecisionBreakpoint,
+            };
+        })
+            .filter(part => part.available);
     }
     get value() {
         return super.value;
@@ -69,18 +110,21 @@ let TimeredCounterDatetimeDuration = class TimeredCounterDatetimeDuration extend
      * 通过 property 设置 value 时, 支持 Date 类型.
      */
     set value(value) {
-        if (isString(value))
-            value = parseJsonString(value);
-        if (!isArray(value))
-            value = [value, value];
-        this.__from = isDate(value[0]) ? value[0] : toDate(value[0]);
-        this.__to = isDate(value[1]) ? value[1] : toDate(value[1]);
-        if (!isValid(this.__from) || !isValid(this.__to)) {
-            throw new Error(`value ${value[0]} or ${value[1]} is not a valid date.`);
-        }
-        this.__durationInMilliseconds = Math.abs(this.__to.getTime() -
-            optimizeFrom(this.__from, this.__to, this.__minPrecision));
-        super.value = this.__durationInMilliseconds;
+        const { from, to, durationInMilliseconds } = toDurationInMilliseconds(value, this.__minPrecision);
+        this.__from = from;
+        this.__to = to;
+        super.value = durationInMilliseconds;
+    }
+    get initialValue() {
+        return super.initialValue;
+    }
+    /**
+     * 同 value
+     */
+    set initialValue(value) {
+        this.__initialValuePlain = value;
+        const { durationInMilliseconds } = toDurationInMilliseconds(value, this.__minPrecision);
+        super.initialValue = durationInMilliseconds;
     }
     get partsOptions() {
         return super.partsOptions;
@@ -106,11 +150,26 @@ let TimeredCounterDatetimeDuration = class TimeredCounterDatetimeDuration extend
         return tempParts;
     }
     generateAriaLabel() {
-        return iso8601Duration(durationObject(new Date(Math.min(this.__durationInMilliseconds, 0)), new Date(Math.max(this.__durationInMilliseconds, 0)), map(this.__availableDurationParts, part => part.type)));
+        return iso8601Duration(durationObject(isBefore(this.__from, this.__to) ? this.__from : this.__to, isBefore(this.__from, this.__to) ? this.__to : this.__from, map(this.__availableDurationParts, part => part.type)));
     }
     connectedCallback() {
-        super.connectedCallback();
         this.role = 'timer';
+        /**
+         * TimeredCounterDatetimeDuration 将 `minPlaces` 默认设置为 `[2]`. 实例化时需要手动触发 `partsOptions` 的 setter.
+         */
+        this.partsOptions = this.__partsOptions ?? {};
+        this.initialValue = this.__initialValuePlain;
+        /**
+         * 类似上方的 partsOptions, precision 也需要在初始化时手动触发 setter. 以此确保 __minPrecision, __maxPrecision, __availableDurationParts 有值.
+         */
+        this.precision = this.__precision;
+        super.connectedCallback();
+    }
+    willUpdate(_changedProperties) {
+        super.willUpdate(_changedProperties);
+        if (_changedProperties.has('locale')) {
+            this.__dateTimeFieldLabels = getLocalizedDateTimeFields(this.localeInstance);
+        }
     }
     render() {
         const cellStyles = this.extractCellStyles();
@@ -122,7 +181,8 @@ let TimeredCounterDatetimeDuration = class TimeredCounterDatetimeDuration extend
         return html `
       <timered-counter-roller
         class="timered-counter timered-counter-datetime-duration"
-        exportparts="prefix, suffix, part-suffix"
+        exportparts="group, part, digit, cell, prefix, suffix, part-suffix"
+        part="group"
         aria-hidden="true"
         color=${this.color}
         .parentContainerRect=${this.partsContainerRect}
@@ -136,55 +196,13 @@ let TimeredCounterDatetimeDuration = class TimeredCounterDatetimeDuration extend
         .direction=${this.direction}
         @roller-animation-start=${this.dispatchTimeredCounterAnimationStart}
         @roller-animation-end=${this.dispatchTimeredCounterAnimationEnd}
-      >
-        <slot name="prefix" slot="prefix"></slot>
-        <slot name="suffix" slot="suffix"></slot>
-        ${repeat(this.parts, (_, index) => index, (_, partIndex) => html `<span slot=${`part-suffix-${partIndex}`} class="duration-unit"
+        ><slot name="prefix" slot="prefix"></slot
+        ><slot name="suffix" slot="suffix"></slot>${repeat(this.parts, (_, index) => index, (_, partIndex) => html `<span slot=${`part-suffix-${partIndex}`} class="duration-unit"
               >${this.__dateTimeFieldLabels[availableDurationPartTypes[partIndex]]}</span
             >`)}
       </timered-counter-roller>
     `;
     }
-    willUpdate(_changedProperties) {
-        /**
-         * precision 相关属性的更新需要在 super.willUpdate 之前进行, 以便在 super.willUpdate 中使用到.
-         *
-         * __availableDurationParts 在 sampleSplit 中使用到, 而 sampleSplit 又会在 super.willUpdate 中使用(准确来说是 `CounterPartsMixinClass`).
-         * 所以需要在 super.willUpdate 之前更新.
-         */
-        if (_changedProperties.has('precision')) {
-            this.__minPrecision = isArray(this.precision)
-                ? this.precision[0]
-                : this.precision;
-            this.__maxPrecision = isArray(this.precision)
-                ? this.precision[1]
-                : this.precision;
-            this.__availableDurationParts = Object.values(DurationPartType)
-                .reverse()
-                .map(type => {
-                const minPrecisionBreakpoint = DurationPartMillisecond[this.__minPrecision];
-                const maxPrecisionBreakpoint = DurationPartMillisecond[this.__maxPrecision];
-                const partMilliseconds = DurationPartMillisecond[type];
-                return {
-                    type,
-                    available: partMilliseconds >= minPrecisionBreakpoint &&
-                        partMilliseconds <= maxPrecisionBreakpoint,
-                };
-            })
-                .filter(part => part.available);
-        }
-        super.willUpdate(_changedProperties);
-        if (_changedProperties.has('locale')) {
-            this.__dateTimeFieldLabels = getLocalizedDateTimeFields(this.localeInstance);
-        }
-    }
-    firstUpdated(_changedProperties) {
-        super.firstUpdated(_changedProperties);
-        /**
-         * TimeredCounterDatetimeDuration 将 `minPlaces` 默认设置为 `[2]`. 实例化时需要手动触发 `partsOptions` 的 setter.
-         */
-        this.partsOptions = this.__partsOptions ?? {};
-    }
 };
 TimeredCounterDatetimeDuration.styles = [...TimeredCounter.styles, timeredCounterDatetimeStyles];
 __decorate([

package/dist/src/timered-counter-datetime-duration.js.map

@@ -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 } 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\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  get value() {\n    return super.value;\n  }\n\n  /**\n   * 通过 property 设置 value 时, 支持 Date 类型.\n   */\n  set value(value: any) {\n    if (isString(value)) value = parseJsonString(value);\n\n    if (!isArray(value)) value = [value, value];\n\n    this.__from = isDate(value[0]) ? value[0] : toDate(value[0]);\n    this.__to = isDate(value[1]) ? value[1] : toDate(value[1]);\n    if (!isValid(this.__from) || !isValid(this.__to)) {\n      throw new Error(`value ${value[0]} or ${value[1]} is not a valid date.`);\n    }\n\n    this.__durationInMilliseconds = Math.abs(\n      this.__to.getTime() -\n        optimizeFrom(this.__from, this.__to, this.__minPrecision),\n    );\n\n    super.value = this.__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 __durationInMilliseconds = 0;\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        new Date(Math.min(this.__durationInMilliseconds, 0)),\n        new Date(Math.max(this.__durationInMilliseconds, 0)),\n        map(this.__availableDurationParts, part => part.type),\n      ),\n    );\n  }\n\n  override connectedCallback() {\n    super.connectedCallback();\n\n    this.role = 'timer';\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      >\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`<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  override willUpdate(_changedProperties: PropertyValues) {\n    /**\n     * precision 相关属性的更新需要在 super.willUpdate 之前进行, 以便在 super.willUpdate 中使用到.\n     *\n     * __availableDurationParts 在 sampleSplit 中使用到, 而 sampleSplit 又会在 super.willUpdate 中使用(准确来说是 `CounterPartsMixinClass`).\n     * 所以需要在 super.willUpdate 之前更新.\n     */\n    if (_changedProperties.has('precision')) {\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    super.willUpdate(_changedProperties);\n\n    if (_changedProperties.has('locale')) {\n      this.__dateTimeFieldLabels = getLocalizedDateTimeFields(\n        this.localeInstance,\n      );\n    }\n  }\n\n  override firstUpdated(_changedProperties: PropertyValues<this>) {\n    super.firstUpdated(_changedProperties);\n\n    /**\n     * TimeredCounterDatetimeDuration 将 `minPlaces` 默认设置为 `[2]`. 实例化时需要手动触发 `partsOptions` 的 setter.\n     */\n    this.partsOptions = this.__partsOptions ?? {};\n  }\n}\n"]}
+{"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"]}

package/dist/src/timered-counter-number.d.ts

@@ -17,6 +17,11 @@ export declare class TimeredCounterNumber extends TimeredCounter {
      * @see https://en.wikipedia.org/wiki/Decimal_separator
      */
     localDecimalSeparator: string;
+    /**
+     * 本地化数字格式化配置中的分组分隔符.
+     * @see https://en.wikipedia.org/wiki/Decimal_separator#Digit_grouping
+     */
+    localeGroupingSeparator: string;
     sampleToString(value: AvailableNumberAdapterValueType): string;
     render(): import("lit-html").TemplateResult<1>;
     willUpdate(_changedProperties: PropertyValues<this>): void;

package/dist/src/timered-counter-number.js

@@ -21,7 +21,12 @@ let TimeredCounterNumber = class TimeredCounterNumber extends TimeredCounter {
          * 本地化数字格式化配置中的小数点分隔符. 根据不同的地区可能是 `.` 或 `,`.
          * @see https://en.wikipedia.org/wiki/Decimal_separator
          */
-        this.localDecimalSeparator = '.';
+        this.localDecimalSeparator = '';
+        /**
+         * 本地化数字格式化配置中的分组分隔符.
+         * @see https://en.wikipedia.org/wiki/Decimal_separator#Digit_grouping
+         */
+        this.localeGroupingSeparator = '';
     }
     sampleToString(value) {
         return this.localeNumber
@@ -38,7 +43,8 @@ let TimeredCounterNumber = class TimeredCounterNumber extends TimeredCounter {
         return html `
       <timered-counter-roller
         class="timered-counter timered-counter-datetime-duration"
-        exportparts="prefix, suffix, part-suffix"
+        exportparts="group, part, digit, cell, prefix, suffix, part-suffix"
+        part="group"
         aria-hidden="true"
         color=${this.color}
         .parentContainerRect=${this.partsContainerRect}
@@ -70,10 +76,11 @@ let TimeredCounterNumber = class TimeredCounterNumber extends TimeredCounter {
              * 本地化数字格式化配置变化时, 更新 `partsOptions` 中的 `decimalSeparator`.
              */
             {
-                const decimalSeparator = this.localeNumberInstance
-                    .formatToParts(123456.789)
-                    .find(part => part.type === 'decimal')?.value || '.';
-                if (this.localDecimalSeparator !== decimalSeparator) {
+                const numberParts = this.localeNumberInstance.formatToParts(123456.789);
+                const decimalSeparator = numberParts.find(part => part.type === 'decimal')?.value || '.';
+                const groupingSeparator = numberParts.find(part => part.type === 'group')?.value || '';
+                if (this.localDecimalSeparator !== decimalSeparator ||
+                    this.localeGroupingSeparator !== groupingSeparator) {
                     this.localDecimalSeparator = decimalSeparator;
                     const oldPartsOptions = this.partsOptions;
                     this.partsOptions = {
@@ -92,12 +99,12 @@ __decorate([
     property({
         converter: value => {
             if (isNullish(value))
-                return value;
+                return false;
             try {
                 return JSON.parse(value);
             }
             catch (error) {
-                return value;
+                return true;
             }
         },
         reflect: true,
@@ -107,6 +114,9 @@ __decorate([
 __decorate([
     state()
 ], TimeredCounterNumber.prototype, "localDecimalSeparator", void 0);
+__decorate([
+    state()
+], TimeredCounterNumber.prototype, "localeGroupingSeparator", void 0);
 TimeredCounterNumber = __decorate([
     customElement('timered-counter-number')
 ], TimeredCounterNumber);

package/dist/src/timered-counter-number.js.map

@@ -1 +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 value;\n\n      try {\n        return JSON.parse(value);\n      } catch (error) {\n        return value;\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  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=\"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      >\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 decimalSeparator =\n          this.localeNumberInstance\n            .formatToParts(123456.789)\n            .find(part => part.type === 'decimal')?.value || '.';\n\n        if (this.localDecimalSeparator !== decimalSeparator) {\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"]}
+{"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"]}

package/dist/src/timered-counter-string.d.ts

@@ -1,4 +1,3 @@
-import { PropertyValues } from 'lit';
 import { TimeredCounter } from './timered-counter.js';
 import { PartsOptions } from './mixins/counter-parts.js';
 import { AvailableNumberAdapterValueType } from './number-adapter/index.js';
@@ -27,5 +26,4 @@ export declare class TimeredCounterString extends TimeredCounter {
     private __anyBaseToDecimal;
     sampleToString(value: AvailableNumberAdapterValueType): string;
     connectedCallback(): void;
-    firstUpdated(_changedProperties: PropertyValues<this>): void;
 }

package/dist/src/timered-counter-string.js

@@ -73,14 +73,12 @@ let TimeredCounterString = class TimeredCounterString extends TimeredCounter {
             super.value = this.numberAdapter.create(0);
             return;
         }
-        const oldValueString = isEmpty(this.__alphabet)
-            ? ''
-            : this.__decimalToAnyBase(this.numberAdapter.toString(this.value));
+        const oldValueString = this.__oldValueString || this.__initialValueString;
         this.__updateAlphabet(this.__valueString, oldValueString);
         /**
          * 由于 oldValue 基于之前的 `__alphabet` 计算, 当 通过 `__updateAlphabet` 更新 `__alphabet` 后, 需要同步更新 oldValue.
          */
-        super.oldValue = this.numberAdapter.create(this.__anyBaseToDecimal(this.__oldValueString));
+        super.oldValue = this.numberAdapter.create(this.__anyBaseToDecimal(oldValueString));
         super.value = this.numberAdapter.create(this.__anyBaseToDecimal(this.__valueString));
     }
     get partsOptions() {
@@ -127,9 +125,6 @@ let TimeredCounterString = class TimeredCounterString extends TimeredCounter {
         this.__updateAlphabet(this.__valueString, this.__initialValueString);
         this.initialValue = this.__initialValueString;
         this.value = this.__valueString;
-    }
-    firstUpdated(_changedProperties) {
-        super.firstUpdated(_changedProperties);
         /**
          * TimeredCounterString 有自定义的 `fillChar` 和 `digitToChar`. 实例化时需要手动触发 `partsOptions` 的 setter.
          */

package/dist/src/timered-counter-string.js.map

@@ -1 +1 @@
-{"version":3,"file":"timered-counter-string.js","sourceRoot":"","sources":["../../src/timered-counter-string.ts"],"names":[],"mappings":"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","sourcesContent":["import { customElement } from 'lit/decorators.js';\nimport { PropertyValues } from 'lit';\nimport { isEmpty, isString } from 'remeda';\nimport { TimeredCounter } from './timered-counter.js';\nimport { timeredCounterStringStyles } from './styles/timered-counter-string-styles.js';\nimport { anyBase } from './utils/any-base.js';\nimport { PartsOptions } from './mixins/counter-parts.js';\nimport { AvailableNumberAdapterValueType } from './number-adapter/index.js';\n\n/**\n * 替换一些特定的字符.\n * 1. \" \": 空格字符在 HTML 中会被忽略导致无法计算字符宽度, 使用 \\xa0 替换.\n */\nconst REPLACED_CHARS: Record<string, string> = {\n  ' ': '\\xa0', // &nbsp;\n};\n\n@customElement('timered-counter-string')\nexport class TimeredCounterString extends TimeredCounter {\n  static styles = [...TimeredCounter.styles, timeredCounterStringStyles];\n\n  // /**\n  //  * 自定义字符集, 传入的 `value` 的字符串表示形式的每个字符都**必须**被包含在该字符集中.\n  //  *\n  //  * @default `value` 的去重字符集.\n  //  */\n  // @property({\n  //   reflect: true,\n  // })\n  private __alphabet: string = '';\n\n  private __initialValueString = '';\n\n  get initialValue() {\n    return super.initialValue;\n  }\n\n  set initialValue(value: any) {\n    if (!isString(value)) {\n      try {\n        value = value.toString();\n      } catch (error) {\n        throw new Error(`value ${value} is not a string.`);\n      }\n    }\n\n    this.__initialValueString = value ?? '';\n\n    if (isEmpty(this.__alphabet) || isEmpty(this.__initialValueString)) {\n      super.initialValue = this.numberAdapter.create(0);\n      return;\n    }\n\n    super.initialValue = this.numberAdapter.create(\n      this.__anyBaseToDecimal(value),\n    );\n  }\n\n  private __valueString = '';\n\n  private __oldValueString = '';\n\n  get value() {\n    return super.value;\n  }\n\n  /**\n   * 通过 property 设置 value 时, 支持任意字符串.\n   */\n  set value(value: any) {\n    if (!isString(value)) {\n      try {\n        value = value.toString();\n      } catch (error) {\n        throw new Error(`value ${value} is not a string.`);\n      }\n    } else if (this.__valueString === value) {\n      return;\n    }\n\n    this.__oldValueString = this.__valueString;\n    this.__valueString = value ?? '';\n\n    if (isEmpty(this.__valueString)) {\n      super.value = this.numberAdapter.create(0);\n      return;\n    }\n\n    const oldValueString = isEmpty(this.__alphabet)\n      ? ''\n      : this.__decimalToAnyBase(this.numberAdapter.toString(this.value));\n\n    this.__updateAlphabet(this.__valueString, oldValueString);\n\n    /**\n     * 由于 oldValue 基于之前的 `__alphabet` 计算, 当 通过 `__updateAlphabet` 更新 `__alphabet` 后, 需要同步更新 oldValue.\n     */\n    super.oldValue = this.numberAdapter.create(\n      this.__anyBaseToDecimal(this.__oldValueString),\n    );\n\n    super.value = this.numberAdapter.create(\n      this.__anyBaseToDecimal(this.__valueString),\n    );\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      type: 'string',\n      fillChar: REPLACED_CHARS[' '],\n      ...this.__partsOptions,\n      digitToChar: {\n        ' ': REPLACED_CHARS[' '],\n        ...this.__partsOptions.digitToChar,\n      },\n    };\n  }\n\n  /**\n   * 根据 `value`, `initialValue`, `oldValue` 更新字符集.\n   * @private\n   */\n  private __updateAlphabet(value: string, oldValue: string) {\n    const allChars =\n      isEmpty(value) && isEmpty(oldValue)\n        ? ''\n        : `\\x00${oldValue ?? ''}${value ?? ''}`;\n\n    const charSet = new Set(this.stringAdapter.stringToChars(allChars));\n    // if (charSet.size < 10) {\n    //   for (let i = 0; i < 10; i++) {\n    //     charSet.add(i.toString());\n    //     if (charSet.size >= 10) break;\n    //   }\n    // }\n\n    this.__alphabet = Array.from(charSet).sort().join('');\n\n    const sa = this.stringAdapter;\n    const alphabet = this.__alphabet;\n\n    this.__decimalToAnyBase = anyBase(sa, '0123456789', alphabet);\n    this.__anyBaseToDecimal = anyBase(sa, alphabet, '0123456789');\n  }\n\n  private __decimalToAnyBase = anyBase(\n    this.stringAdapter,\n    '0123456789',\n    this.__alphabet,\n  );\n\n  private __anyBaseToDecimal = anyBase(\n    this.stringAdapter,\n    this.__alphabet,\n    '0123456789',\n  );\n\n  override sampleToString(value: AvailableNumberAdapterValueType): string {\n    return this.__decimalToAnyBase(this.numberAdapter.toString(value));\n  }\n\n  override connectedCallback() {\n    super.connectedCallback();\n\n    this.__updateAlphabet(this.__valueString, this.__initialValueString);\n    this.initialValue = this.__initialValueString;\n    this.value = this.__valueString;\n  }\n\n  override firstUpdated(_changedProperties: PropertyValues<this>) {\n    super.firstUpdated(_changedProperties);\n\n    /**\n     * TimeredCounterString 有自定义的 `fillChar` 和 `digitToChar`. 实例化时需要手动触发 `partsOptions` 的 setter.\n     */\n    this.partsOptions = this.__partsOptions ?? {};\n  }\n}\n"]}
+{"version":3,"file":"timered-counter-string.js","sourceRoot":"","sources":["../../src/timered-counter-string.ts"],"names":[],"mappings":"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","sourcesContent":["import { customElement } from 'lit/decorators.js';\nimport { isEmpty, isString } from 'remeda';\nimport { TimeredCounter } from './timered-counter.js';\nimport { timeredCounterStringStyles } from './styles/timered-counter-string-styles.js';\nimport { anyBase } from './utils/any-base.js';\nimport { PartsOptions } from './mixins/counter-parts.js';\nimport { AvailableNumberAdapterValueType } from './number-adapter/index.js';\n\n/**\n * 替换一些特定的字符.\n * 1. \" \": 空格字符在 HTML 中会被忽略导致无法计算字符宽度, 使用 \\xa0 替换.\n */\nconst REPLACED_CHARS: Record<string, string> = {\n  ' ': '\\xa0', // &nbsp;\n};\n\n@customElement('timered-counter-string')\nexport class TimeredCounterString extends TimeredCounter {\n  static styles = [...TimeredCounter.styles, timeredCounterStringStyles];\n\n  // /**\n  //  * 自定义字符集, 传入的 `value` 的字符串表示形式的每个字符都**必须**被包含在该字符集中.\n  //  *\n  //  * @default `value` 的去重字符集.\n  //  */\n  // @property({\n  //   reflect: true,\n  // })\n  private __alphabet: string = '';\n\n  private __initialValueString = '';\n\n  get initialValue() {\n    return super.initialValue;\n  }\n\n  set initialValue(value: any) {\n    if (!isString(value)) {\n      try {\n        value = value.toString();\n      } catch (error) {\n        throw new Error(`value ${value} is not a string.`);\n      }\n    }\n\n    this.__initialValueString = value ?? '';\n\n    if (isEmpty(this.__alphabet) || isEmpty(this.__initialValueString)) {\n      super.initialValue = this.numberAdapter.create(0);\n      return;\n    }\n\n    super.initialValue = this.numberAdapter.create(\n      this.__anyBaseToDecimal(value),\n    );\n  }\n\n  private __valueString = '';\n\n  private __oldValueString = '';\n\n  get value() {\n    return super.value;\n  }\n\n  /**\n   * 通过 property 设置 value 时, 支持任意字符串.\n   */\n  set value(value: any) {\n    if (!isString(value)) {\n      try {\n        value = value.toString();\n      } catch (error) {\n        throw new Error(`value ${value} is not a string.`);\n      }\n    } else if (this.__valueString === value) {\n      return;\n    }\n\n    this.__oldValueString = this.__valueString;\n    this.__valueString = value ?? '';\n\n    if (isEmpty(this.__valueString)) {\n      super.value = this.numberAdapter.create(0);\n      return;\n    }\n\n    const oldValueString = this.__oldValueString || this.__initialValueString;\n\n    this.__updateAlphabet(this.__valueString, oldValueString);\n\n    /**\n     * 由于 oldValue 基于之前的 `__alphabet` 计算, 当 通过 `__updateAlphabet` 更新 `__alphabet` 后, 需要同步更新 oldValue.\n     */\n    super.oldValue = this.numberAdapter.create(\n      this.__anyBaseToDecimal(oldValueString),\n    );\n\n    super.value = this.numberAdapter.create(\n      this.__anyBaseToDecimal(this.__valueString),\n    );\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      type: 'string',\n      fillChar: REPLACED_CHARS[' '],\n      ...this.__partsOptions,\n      digitToChar: {\n        ' ': REPLACED_CHARS[' '],\n        ...this.__partsOptions.digitToChar,\n      },\n    };\n  }\n\n  /**\n   * 根据 `value`, `initialValue`, `oldValue` 更新字符集.\n   * @private\n   */\n  private __updateAlphabet(value: string, oldValue: string) {\n    const allChars =\n      isEmpty(value) && isEmpty(oldValue)\n        ? ''\n        : `\\x00${oldValue ?? ''}${value ?? ''}`;\n\n    const charSet = new Set(this.stringAdapter.stringToChars(allChars));\n    // if (charSet.size < 10) {\n    //   for (let i = 0; i < 10; i++) {\n    //     charSet.add(i.toString());\n    //     if (charSet.size >= 10) break;\n    //   }\n    // }\n\n    this.__alphabet = Array.from(charSet).sort().join('');\n\n    const sa = this.stringAdapter;\n    const alphabet = this.__alphabet;\n\n    this.__decimalToAnyBase = anyBase(sa, '0123456789', alphabet);\n    this.__anyBaseToDecimal = anyBase(sa, alphabet, '0123456789');\n  }\n\n  private __decimalToAnyBase = anyBase(\n    this.stringAdapter,\n    '0123456789',\n    this.__alphabet,\n  );\n\n  private __anyBaseToDecimal = anyBase(\n    this.stringAdapter,\n    this.__alphabet,\n    '0123456789',\n  );\n\n  override sampleToString(value: AvailableNumberAdapterValueType): string {\n    return this.__decimalToAnyBase(this.numberAdapter.toString(value));\n  }\n\n  override connectedCallback() {\n    super.connectedCallback();\n\n    this.__updateAlphabet(this.__valueString, this.__initialValueString);\n    this.initialValue = this.__initialValueString;\n    this.value = this.__valueString;\n\n    /**\n     * TimeredCounterString 有自定义的 `fillChar` 和 `digitToChar`. 实例化时需要手动触发 `partsOptions` 的 setter.\n     */\n    this.partsOptions = this.__partsOptions ?? {};\n  }\n}\n"]}

package/dist/src/timered-counter.js

@@ -34,7 +34,8 @@ let TimeredCounter = class TimeredCounter extends CounterAiraMixin(CounterAnimat
         const keyframes = this.extractKeyframes();
         return html `
       <timered-counter-roller
-        exportparts="prefix, suffix, part-suffix"
+        exportparts="group, part, digit, cell, prefix, suffix, part-suffix"
+        part="group"
         class="timered-counter"
         aria-hidden="true"
         color=${this.color}

package/dist/src/timered-counter.js.map

@@ -1 +1 @@
-{"version":3,"file":"timered-counter.js","sourceRoot":"","sources":["../../src/timered-counter.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, PropertyValues } from 'lit';\nimport { customElement, query, state } from 'lit/decorators.js';\nimport { repeat } from 'lit/directives/repeat.js';\nimport { CounterStylesMixin } from './mixins/counter-styles.js';\nimport { CounterPartsMixin } from './mixins/counter-parts.js';\nimport { CounterBaseMixin } from './mixins/counter-base.js';\nimport { timeredCounterStyles } from './styles/timered-counter-styles.js';\nimport { CounterAnimationMixin } from './mixins/counter-animation.js';\nimport './transitions/roller/index.js';\nimport { CounterAiraMixin } from './mixins/counter-aira.js';\n\nclass TimeredCounterAnimationEvent extends Event {\n  // constructor(type: string, eventInitDict?: EventInit) {\n  //   super(type, eventInitDict);\n  // }\n}\n\n@customElement('timered-counter')\nexport class TimeredCounter extends CounterAiraMixin(\n  CounterAnimationMixin(\n    CounterStylesMixin(CounterPartsMixin(CounterBaseMixin(LitElement))),\n  ),\n) {\n  static styles = [timeredCounterStyles];\n\n  resizeObserver: ResizeObserver;\n\n  @state()\n  partsContainerRect: DOMRect | undefined;\n\n  @query('timered-counter-roller')\n  partsContainer: HTMLElement | undefined;\n\n  constructor() {\n    super();\n\n    this.resizeObserver = new ResizeObserver(() => {\n      this.partsContainerRect = this.partsContainer\n        ? this.partsContainer.getBoundingClientRect()\n        : new DOMRect();\n    });\n  }\n\n  protected firstUpdated(_changedProperties: PropertyValues) {\n    super.firstUpdated(_changedProperties);\n\n    if (this.partsContainer) {\n      this.resizeObserver.observe(this.partsContainer);\n    }\n  }\n\n  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        exportparts=\"prefix, suffix, part-suffix\"\n        class=\"timered-counter\"\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  dispatchTimeredCounterAnimationStart() {\n    this.dispatchEvent(\n      new TimeredCounterAnimationEvent('timered-counter-animation-start'),\n    );\n  }\n\n  dispatchTimeredCounterAnimationEnd() {\n    this.dispatchEvent(\n      new TimeredCounterAnimationEvent('timered-counter-animation-end'),\n    );\n  }\n}\n"]}
+{"version":3,"file":"timered-counter.js","sourceRoot":"","sources":["../../src/timered-counter.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, PropertyValues } from 'lit';\nimport { customElement, query, state } from 'lit/decorators.js';\nimport { repeat } from 'lit/directives/repeat.js';\nimport { CounterStylesMixin } from './mixins/counter-styles.js';\nimport { CounterPartsMixin } from './mixins/counter-parts.js';\nimport { CounterBaseMixin } from './mixins/counter-base.js';\nimport { timeredCounterStyles } from './styles/timered-counter-styles.js';\nimport { CounterAnimationMixin } from './mixins/counter-animation.js';\nimport './transitions/roller/index.js';\nimport { CounterAiraMixin } from './mixins/counter-aira.js';\n\nclass TimeredCounterAnimationEvent extends Event {\n  // constructor(type: string, eventInitDict?: EventInit) {\n  //   super(type, eventInitDict);\n  // }\n}\n\n@customElement('timered-counter')\nexport class TimeredCounter extends CounterAiraMixin(\n  CounterAnimationMixin(\n    CounterStylesMixin(CounterPartsMixin(CounterBaseMixin(LitElement))),\n  ),\n) {\n  static styles = [timeredCounterStyles];\n\n  resizeObserver: ResizeObserver;\n\n  @state()\n  partsContainerRect: DOMRect | undefined;\n\n  @query('timered-counter-roller')\n  partsContainer: HTMLElement | undefined;\n\n  constructor() {\n    super();\n\n    this.resizeObserver = new ResizeObserver(() => {\n      this.partsContainerRect = this.partsContainer\n        ? this.partsContainer.getBoundingClientRect()\n        : new DOMRect();\n    });\n  }\n\n  protected firstUpdated(_changedProperties: PropertyValues) {\n    super.firstUpdated(_changedProperties);\n\n    if (this.partsContainer) {\n      this.resizeObserver.observe(this.partsContainer);\n    }\n  }\n\n  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        exportparts=\"group, part, digit, cell, prefix, suffix, part-suffix\"\n        part=\"group\"\n        class=\"timered-counter\"\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  dispatchTimeredCounterAnimationStart() {\n    this.dispatchEvent(\n      new TimeredCounterAnimationEvent('timered-counter-animation-start'),\n    );\n  }\n\n  dispatchTimeredCounterAnimationEnd() {\n    this.dispatchEvent(\n      new TimeredCounterAnimationEvent('timered-counter-animation-end'),\n    );\n  }\n}\n"]}