timered-counter 1.0.0 → 1.1.1

package/dist/src/number-adapter/decimal-js.js

@@ -83,5 +83,12 @@ const DecimalJsAdapter = (config = { precision: 1e3 }) => {
         },
     };
 };
+export function register(counterAdapter, config) {
+    counterAdapter.registerNumberAdapter(['decimal.js', 'decimal-js', 'decimaljs'], () => DecimalJsAdapter(config));
+}
 export { DecimalJsAdapter };
+export default {
+    register,
+    DecimalJsAdapter,
+};
 //# sourceMappingURL=decimal-js.js.map

package/dist/src/number-adapter/decimal-js.js.map

@@ -1 +1 @@
-{"version":3,"file":"decimal-js.js","sourceRoot":"","sources":["../../../src/number-adapter/decimal-js.ts"],"names":[],"mappings":"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","sourcesContent":["import { Decimal } from 'decimal.js';\nimport { isString } from 'remeda';\nimport { NumberAdapter } from './types.js';\n\nconst numberRegex = /^-?\\d+(\\.\\d+)?$/;\n\nconst DecimalJsAdapter: (config?: Decimal.Config) => NumberAdapter<Decimal> = (\n  config = { precision: 1e3 },\n) => {\n  const InnerDecimal = Decimal.clone(config);\n  return {\n    create(value: string | number): Decimal {\n      if (isString(value) && !numberRegex.test(value)) value = 0;\n      return new InnerDecimal(value);\n    },\n    add(a, b) {\n      return a.plus(b);\n    },\n    sub(a, b) {\n      return a.minus(b);\n    },\n    mul(a, b) {\n      return a.times(b);\n    },\n    div(a, b) {\n      return a.div(b);\n    },\n    compare(a, b) {\n      return a.cmp(b) as 1 | 0 | -1;\n    },\n    eq(a, b) {\n      return a.eq(b);\n    },\n    gt(a, b) {\n      return a.gt(b);\n    },\n    gte(a, b) {\n      return a.gte(b);\n    },\n    lt(a, b) {\n      return a.lt(b);\n    },\n    lte(a, b) {\n      return a.lte(b);\n    },\n    isInteger(a) {\n      return a.isInteger();\n    },\n    isNegative(a) {\n      return a.isNegative();\n    },\n    isPositive(a) {\n      return a.isPositive();\n    },\n    isZero(a) {\n      return a.isZero();\n    },\n    isNaN(a) {\n      return a.isNaN();\n    },\n    isFinite(a) {\n      return a.isFinite();\n    },\n    abs(a) {\n      return a.abs();\n    },\n    ceil(a) {\n      return a.ceil();\n    },\n    floor(a) {\n      return a.floor();\n    },\n    round(a) {\n      return a.round();\n    },\n    max(a, b) {\n      return InnerDecimal.max(a, b);\n    },\n    min(a, b) {\n      return InnerDecimal.min(a, b);\n    },\n    toNumber(a) {\n      return a.toNumber();\n    },\n    toString(a) {\n      return a.toFixed();\n    },\n  };\n};\n\nexport { DecimalJsAdapter };\n"]}
+{"version":3,"file":"decimal-js.js","sourceRoot":"","sources":["../../../src/number-adapter/decimal-js.ts"],"names":[],"mappings":"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","sourcesContent":["import { Decimal } from 'decimal.js';\nimport { isString } from 'remeda';\nimport type { NumberAdapter } from './types.js';\nimport type { TimeredCounterAdapter } from '../timered-counter-adapter.js';\n\nconst numberRegex = /^-?\\d+(\\.\\d+)?$/;\n\nconst DecimalJsAdapter: (config?: Decimal.Config) => NumberAdapter<Decimal> = (\n  config = { precision: 1e3 },\n) => {\n  const InnerDecimal = Decimal.clone(config);\n  return {\n    create(value: string | number): Decimal {\n      if (isString(value) && !numberRegex.test(value)) value = 0;\n      return new InnerDecimal(value);\n    },\n    add(a, b) {\n      return a.plus(b);\n    },\n    sub(a, b) {\n      return a.minus(b);\n    },\n    mul(a, b) {\n      return a.times(b);\n    },\n    div(a, b) {\n      return a.div(b);\n    },\n    compare(a, b) {\n      return a.cmp(b) as 1 | 0 | -1;\n    },\n    eq(a, b) {\n      return a.eq(b);\n    },\n    gt(a, b) {\n      return a.gt(b);\n    },\n    gte(a, b) {\n      return a.gte(b);\n    },\n    lt(a, b) {\n      return a.lt(b);\n    },\n    lte(a, b) {\n      return a.lte(b);\n    },\n    isInteger(a) {\n      return a.isInteger();\n    },\n    isNegative(a) {\n      return a.isNegative();\n    },\n    isPositive(a) {\n      return a.isPositive();\n    },\n    isZero(a) {\n      return a.isZero();\n    },\n    isNaN(a) {\n      return a.isNaN();\n    },\n    isFinite(a) {\n      return a.isFinite();\n    },\n    abs(a) {\n      return a.abs();\n    },\n    ceil(a) {\n      return a.ceil();\n    },\n    floor(a) {\n      return a.floor();\n    },\n    round(a) {\n      return a.round();\n    },\n    max(a, b) {\n      return InnerDecimal.max(a, b);\n    },\n    min(a, b) {\n      return InnerDecimal.min(a, b);\n    },\n    toNumber(a) {\n      return a.toNumber();\n    },\n    toString(a) {\n      return a.toFixed();\n    },\n  };\n};\n\nexport function register(\n  counterAdapter: typeof TimeredCounterAdapter,\n  config?: Decimal.Config,\n) {\n  counterAdapter.registerNumberAdapter(\n    ['decimal.js', 'decimal-js', 'decimaljs'],\n    () => DecimalJsAdapter(config),\n  );\n}\n\nexport { DecimalJsAdapter };\n\nexport default {\n  register,\n  DecimalJsAdapter,\n};\n"]}

package/dist/src/number-adapter/index.d.ts

@@ -1,4 +1,6 @@
-export * from "./types.js";
-export * from "./build-in-number.js";
-export * from "./build-in-bigint.js";
-export * from "./decimal-js.js";
+export * from './types.js';
+export * from './build-in-number.js';
+export * from './build-in-bigint.js';
+/**
+ * decimal-js 作为外部模块, 按需引入
+ */

package/dist/src/number-adapter/index.js

@@ -1,5 +1,8 @@
-export * from "./types.js";
-export * from "./build-in-number.js";
-export * from "./build-in-bigint.js";
-export * from "./decimal-js.js";
+export * from './types.js';
+export * from './build-in-number.js';
+export * from './build-in-bigint.js';
+/**
+ * decimal-js 作为外部模块, 按需引入
+ */
+// export * from "./decimal-js.js";
 //# sourceMappingURL=index.js.map

package/dist/src/number-adapter/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/number-adapter/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,cAAc,sBAAsB,CAAC;AACrC,cAAc,sBAAsB,CAAC;AACrC,cAAc,iBAAiB,CAAC","sourcesContent":["export * from \"./types.js\";\nexport * from \"./build-in-number.js\";\nexport * from \"./build-in-bigint.js\";\nexport * from \"./decimal-js.js\";\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/number-adapter/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,cAAc,sBAAsB,CAAC;AACrC,cAAc,sBAAsB,CAAC;AAErC;;GAEG;AACH,mCAAmC","sourcesContent":["export * from './types.js';\nexport * from './build-in-number.js';\nexport * from './build-in-bigint.js';\n\n/**\n * decimal-js 作为外部模块, 按需引入\n */\n// export * from \"./decimal-js.js\";\n"]}

package/dist/src/string-adapter/grapheme-splitter.d.ts

@@ -1,8 +1,15 @@
 import { StringAdapter } from './types.js';
+import type { TimeredCounterAdapter } from '../timered-counter-adapter.js';
 /**
  * 使用 `grapheme-splitter` 库的字符串适配器. 该适配器使用 `grapheme-splitter` 库将字符串转换为字符数组.
  *
  * 要使用 {@link GraphemeSplitterAdapter} 需要安装 `grapheme-splitter`.
  */
 declare const GraphemeSplitterAdapter: () => StringAdapter;
+export declare function register(counterAdapter: typeof TimeredCounterAdapter): void;
 export { GraphemeSplitterAdapter };
+declare const _default: {
+    register: typeof register;
+    GraphemeSplitterAdapter: () => StringAdapter;
+};
+export default _default;

package/dist/src/string-adapter/grapheme-splitter.js

@@ -12,5 +12,12 @@ const GraphemeSplitterAdapter = () => {
         },
     };
 };
+export function register(counterAdapter) {
+    counterAdapter.registerStringAdapter(['grapheme-splitter'], () => GraphemeSplitterAdapter());
+}
 export { GraphemeSplitterAdapter };
+export default {
+    register,
+    GraphemeSplitterAdapter,
+};
 //# sourceMappingURL=grapheme-splitter.js.map

package/dist/src/string-adapter/grapheme-splitter.js.map

@@ -1 +1 @@
-{"version":3,"file":"grapheme-splitter.js","sourceRoot":"","sources":["../../../src/string-adapter/grapheme-splitter.ts"],"names":[],"mappings":"AAAA,OAAO,gBAAgB,MAAM,mBAAmB,CAAC;AAGjD;;;;GAIG;AACH,MAAM,uBAAuB,GAAwB,GAAG,EAAE;IACxD,MAAM,QAAQ,GAAG,IAAI,gBAAgB,EAAE,CAAC;IAExC,OAAO;QACL,aAAa,CAAC,KAAa;YACzB,OAAO,QAAQ,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;QACxC,CAAC;KACF,CAAC;AACJ,CAAC,CAAC;AAEF,OAAO,EAAE,uBAAuB,EAAE,CAAC","sourcesContent":["import GraphemeSplitter from 'grapheme-splitter';\nimport { StringAdapter } from './types.js';\n\n/**\n * 使用 `grapheme-splitter` 库的字符串适配器. 该适配器使用 `grapheme-splitter` 库将字符串转换为字符数组.\n *\n * 要使用 {@link GraphemeSplitterAdapter} 需要安装 `grapheme-splitter`.\n */\nconst GraphemeSplitterAdapter: () => StringAdapter = () => {\n  const splitter = new GraphemeSplitter();\n\n  return {\n    stringToChars(value: string): string[] {\n      return splitter.splitGraphemes(value);\n    },\n  };\n};\n\nexport { GraphemeSplitterAdapter };\n"]}
+{"version":3,"file":"grapheme-splitter.js","sourceRoot":"","sources":["../../../src/string-adapter/grapheme-splitter.ts"],"names":[],"mappings":"AAAA,OAAO,gBAAgB,MAAM,mBAAmB,CAAC;AAIjD;;;;GAIG;AACH,MAAM,uBAAuB,GAAwB,GAAG,EAAE;IACxD,MAAM,QAAQ,GAAG,IAAI,gBAAgB,EAAE,CAAC;IAExC,OAAO;QACL,aAAa,CAAC,KAAa;YACzB,OAAO,QAAQ,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;QACxC,CAAC;KACF,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,UAAU,QAAQ,CAAC,cAA4C;IACnE,cAAc,CAAC,qBAAqB,CAAC,CAAC,mBAAmB,CAAC,EAAE,GAAG,EAAE,CAC/D,uBAAuB,EAAE,CAC1B,CAAC;AACJ,CAAC;AAED,OAAO,EAAE,uBAAuB,EAAE,CAAC;AAEnC,eAAe;IACb,QAAQ;IACR,uBAAuB;CACxB,CAAC","sourcesContent":["import GraphemeSplitter from 'grapheme-splitter';\nimport { StringAdapter } from './types.js';\nimport type { TimeredCounterAdapter } from '../timered-counter-adapter.js';\n\n/**\n * 使用 `grapheme-splitter` 库的字符串适配器. 该适配器使用 `grapheme-splitter` 库将字符串转换为字符数组.\n *\n * 要使用 {@link GraphemeSplitterAdapter} 需要安装 `grapheme-splitter`.\n */\nconst GraphemeSplitterAdapter: () => StringAdapter = () => {\n  const splitter = new GraphemeSplitter();\n\n  return {\n    stringToChars(value: string): string[] {\n      return splitter.splitGraphemes(value);\n    },\n  };\n};\n\nexport function register(counterAdapter: typeof TimeredCounterAdapter) {\n  counterAdapter.registerStringAdapter(['grapheme-splitter'], () =>\n    GraphemeSplitterAdapter(),\n  );\n}\n\nexport { GraphemeSplitterAdapter };\n\nexport default {\n  register,\n  GraphemeSplitterAdapter,\n};\n"]}

package/dist/src/string-adapter/index.d.ts

@@ -1,4 +1,6 @@
-export * from "./types.js";
-export * from "./build-in-string.js";
-export * from "./build-in-intl-segmenter.js";
-export * from "./grapheme-splitter.js";
+export * from './types.js';
+export * from './build-in-string.js';
+export * from './build-in-intl-segmenter.js';
+/**
+ * grapheme-splitter 作为外部模块, 按需引入
+ */

package/dist/src/string-adapter/index.js

@@ -1,5 +1,8 @@
-export * from "./types.js";
-export * from "./build-in-string.js";
-export * from "./build-in-intl-segmenter.js";
-export * from "./grapheme-splitter.js";
+export * from './types.js';
+export * from './build-in-string.js';
+export * from './build-in-intl-segmenter.js';
+/**
+ * grapheme-splitter 作为外部模块, 按需引入
+ */
+// export * from "./grapheme-splitter.js";
 //# sourceMappingURL=index.js.map

package/dist/src/string-adapter/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/string-adapter/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,cAAc,sBAAsB,CAAC;AACrC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,wBAAwB,CAAC","sourcesContent":["export * from \"./types.js\";\nexport * from \"./build-in-string.js\";\nexport * from \"./build-in-intl-segmenter.js\";\nexport * from \"./grapheme-splitter.js\";\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/string-adapter/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,cAAc,sBAAsB,CAAC;AACrC,cAAc,8BAA8B,CAAC;AAE7C;;GAEG;AACH,0CAA0C","sourcesContent":["export * from './types.js';\nexport * from './build-in-string.js';\nexport * from './build-in-intl-segmenter.js';\n\n/**\n * grapheme-splitter 作为外部模块, 按需引入\n */\n// export * from \"./grapheme-splitter.js\";\n"]}

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

@@ -0,0 +1,65 @@
+import { NumberAdapter } from './number-adapter/index.js';
+import { StringAdapter } from './string-adapter/index.js';
+export declare class TimeredCounterAdapter {
+    static AVAILABLE_NUMBER_ADAPTERS: Map<string[], () => NumberAdapter>;
+    static AVAILABLE_STRING_ADAPTERS: Map<string[], () => StringAdapter>;
+    /**
+     * 数字适配器, 有以下两种:
+     * 1. BuildInNumberAdapter(默认): 使用内置 number 进行计算.
+     * 2. DecimalJsAdapter: 使用 Decimal.js 进行计算.
+     *
+     * 详细信息请查看[字符长度限制](/guide/optional-dependencies#字符长度限制)章节.
+     *
+     * @default BuildInNumberAdapter
+     */
+    static NUMBER_ADAPTER: NumberAdapter;
+    /**
+     * 字符串适配器, 有以下两种:
+     * 1. BuildInStringAdapter(默认): 使用内置 string 进行字符串处理.
+     * 2. BuildInIntlSegmenterAdapter: 使用 Intl.Segmenter 进行字符串处理. 能够支持 emoji, 字符集.
+     * 3. GraphemeSplitterAdapter: 使用 grapheme-splitter 进行字符串处理. 能够支持 emoji, 字符集.
+     *
+     * 详细信息请查看[支持 emoji 分词](/guide/optional-dependencies#支持-emoji-分词)章节.
+     *
+     * @default BuildInStringAdapter
+     */
+    static STRING_ADAPTER: StringAdapter;
+    /**
+     * 将 value 及其相关的属性, 在 attribute 和 property 上的互相转换.
+     *
+     * @see https://lit.dev/docs/components/properties/#attributes
+     * @protected
+     */
+    static VALUE_CONVERTER: {
+        fromAttribute(value: string | null): string | null;
+        toAttribute(value: unknown): string | null | undefined;
+    };
+    /**
+     * 设置要使用的数字适配器. 仅对设置完之后的 TimeredCounter 实例生效.
+     *
+     * 接受的关键字除了内置的 `number` 以外, 还可以通过 {@link registerNumberAdapter} 注册的 `keyword`.
+     *
+     * @param adapterOrType
+     */
+    static setNumberAdapter(adapterOrType: NumberAdapter | 'number' | string): void;
+    /**
+     * 与 {@link setNumberAdapter} 类似, 用于设置字符串适配器.
+     */
+    static setStringAdapter(adapterOrType: StringAdapter | 'string' | 'intl-segmenter' | string): void;
+    static registerNumberAdapter(keyword: string[], adapter: () => NumberAdapter): void;
+    static registerStringAdapter(keyword: string[], adapter: () => StringAdapter): void;
+    /**
+     * 可以直接使用 adapter 文件的导出进行注册.
+     *
+     * adapter 文件需要导出一个名为 register 的函数, 该函数接受一个 TimeredCounterAdapter 类型的参数.
+     *
+     * 具体示例请查看 {@link GraphemeSplitterAdapter} or {@link DecimalJsAdapter}.
+     */
+    static registryAdapter(adapter: {
+        register: (counterAdapter: typeof TimeredCounterAdapter) => void;
+    }): void;
+}
+export declare function setNumberAdapter(...args: Parameters<(typeof TimeredCounterAdapter)['setNumberAdapter']>): void;
+export declare function setStringAdapter(...args: Parameters<(typeof TimeredCounterAdapter)['setStringAdapter']>): void;
+export declare function registerNumberAdapter(...args: Parameters<(typeof TimeredCounterAdapter)['registerNumberAdapter']>): void;
+export declare function registerStringAdapter(...args: Parameters<(typeof TimeredCounterAdapter)['registerStringAdapter']>): void;

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

@@ -0,0 +1,120 @@
+import { isNullish, isString } from 'remeda';
+import { BuildInNumberAdapter } from './number-adapter/index.js';
+import { BuildInIntlSegmenterAdapter, BuildInStringAdapter, } from './string-adapter/index.js';
+export class TimeredCounterAdapter {
+    /**
+     * 设置要使用的数字适配器. 仅对设置完之后的 TimeredCounter 实例生效.
+     *
+     * 接受的关键字除了内置的 `number` 以外, 还可以通过 {@link registerNumberAdapter} 注册的 `keyword`.
+     *
+     * @param adapterOrType
+     */
+    static setNumberAdapter(adapterOrType) {
+        let adapter = BuildInNumberAdapter();
+        if (isString(adapterOrType)) {
+            for (const [keywords, adapterFactory,] of TimeredCounterAdapter.AVAILABLE_NUMBER_ADAPTERS) {
+                if (keywords.includes(adapterOrType)) {
+                    adapter = adapterFactory();
+                    break;
+                }
+            }
+        }
+        else {
+            adapter = adapterOrType;
+        }
+        TimeredCounterAdapter.NUMBER_ADAPTER = adapter;
+    }
+    /**
+     * 与 {@link setNumberAdapter} 类似, 用于设置字符串适配器.
+     */
+    static setStringAdapter(adapterOrType) {
+        let adapter = BuildInStringAdapter();
+        if (isString(adapterOrType)) {
+            for (const [keywords, adapterFactory,] of TimeredCounterAdapter.AVAILABLE_STRING_ADAPTERS) {
+                if (keywords.includes(adapterOrType)) {
+                    adapter = adapterFactory();
+                    break;
+                }
+            }
+        }
+        else {
+            adapter = adapterOrType;
+        }
+        TimeredCounterAdapter.STRING_ADAPTER = adapter;
+    }
+    static registerNumberAdapter(keyword, adapter) {
+        TimeredCounterAdapter.AVAILABLE_NUMBER_ADAPTERS.set(keyword, adapter);
+    }
+    static registerStringAdapter(keyword, adapter) {
+        TimeredCounterAdapter.AVAILABLE_STRING_ADAPTERS.set(keyword, adapter);
+    }
+    /**
+     * 可以直接使用 adapter 文件的导出进行注册.
+     *
+     * adapter 文件需要导出一个名为 register 的函数, 该函数接受一个 TimeredCounterAdapter 类型的参数.
+     *
+     * 具体示例请查看 {@link GraphemeSplitterAdapter} or {@link DecimalJsAdapter}.
+     */
+    static registryAdapter(adapter) {
+        adapter.register(this);
+    }
+}
+TimeredCounterAdapter.AVAILABLE_NUMBER_ADAPTERS = new Map([
+    [['number'], BuildInNumberAdapter],
+    // [['decimal.js', 'decimaljs'], DecimalJsAdapter()],
+]);
+TimeredCounterAdapter.AVAILABLE_STRING_ADAPTERS = new Map([
+    [['string'], BuildInStringAdapter],
+    [['intl-segmenter'], BuildInIntlSegmenterAdapter],
+    // [['grapheme-splitter'], GraphemeSplitterAdapter()],
+]);
+/**
+ * 数字适配器, 有以下两种:
+ * 1. BuildInNumberAdapter(默认): 使用内置 number 进行计算.
+ * 2. DecimalJsAdapter: 使用 Decimal.js 进行计算.
+ *
+ * 详细信息请查看[字符长度限制](/guide/optional-dependencies#字符长度限制)章节.
+ *
+ * @default BuildInNumberAdapter
+ */
+TimeredCounterAdapter.NUMBER_ADAPTER = BuildInNumberAdapter();
+/**
+ * 字符串适配器, 有以下两种:
+ * 1. BuildInStringAdapter(默认): 使用内置 string 进行字符串处理.
+ * 2. BuildInIntlSegmenterAdapter: 使用 Intl.Segmenter 进行字符串处理. 能够支持 emoji, 字符集.
+ * 3. GraphemeSplitterAdapter: 使用 grapheme-splitter 进行字符串处理. 能够支持 emoji, 字符集.
+ *
+ * 详细信息请查看[支持 emoji 分词](/guide/optional-dependencies#支持-emoji-分词)章节.
+ *
+ * @default BuildInStringAdapter
+ */
+TimeredCounterAdapter.STRING_ADAPTER = BuildInStringAdapter();
+/**
+ * 将 value 及其相关的属性, 在 attribute 和 property 上的互相转换.
+ *
+ * @see https://lit.dev/docs/components/properties/#attributes
+ * @protected
+ */
+TimeredCounterAdapter.VALUE_CONVERTER = {
+    fromAttribute(value) {
+        return value;
+    },
+    toAttribute(value) {
+        return isNullish(value)
+            ? value
+            : TimeredCounterAdapter.NUMBER_ADAPTER.toString(value);
+    },
+};
+export function setNumberAdapter(...args) {
+    TimeredCounterAdapter.setNumberAdapter(...args);
+}
+export function setStringAdapter(...args) {
+    TimeredCounterAdapter.setStringAdapter(...args);
+}
+export function registerNumberAdapter(...args) {
+    TimeredCounterAdapter.registerNumberAdapter(...args);
+}
+export function registerStringAdapter(...args) {
+    TimeredCounterAdapter.registerStringAdapter(...args);
+}
+//# sourceMappingURL=timered-counter-adapter.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"timered-counter-adapter.js","sourceRoot":"","sources":["../../src/timered-counter-adapter.ts"],"names":[],"mappings":"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","sourcesContent":["import { isNullish, isString } from 'remeda';\nimport { BuildInNumberAdapter, NumberAdapter } from './number-adapter/index.js';\nimport {\n  BuildInIntlSegmenterAdapter,\n  BuildInStringAdapter,\n  StringAdapter,\n} from './string-adapter/index.js';\n\nexport class TimeredCounterAdapter {\n  static AVAILABLE_NUMBER_ADAPTERS: Map<string[], () => NumberAdapter> =\n    new Map([\n      [['number'], BuildInNumberAdapter],\n      // [['decimal.js', 'decimaljs'], DecimalJsAdapter()],\n    ]);\n\n  static AVAILABLE_STRING_ADAPTERS: Map<string[], () => StringAdapter> =\n    new Map([\n      [['string'], BuildInStringAdapter],\n      [['intl-segmenter'], BuildInIntlSegmenterAdapter],\n      // [['grapheme-splitter'], GraphemeSplitterAdapter()],\n    ]);\n\n  /**\n   * 数字适配器, 有以下两种:\n   * 1. BuildInNumberAdapter(默认): 使用内置 number 进行计算.\n   * 2. DecimalJsAdapter: 使用 Decimal.js 进行计算.\n   *\n   * 详细信息请查看[字符长度限制](/guide/optional-dependencies#字符长度限制)章节.\n   *\n   * @default BuildInNumberAdapter\n   */\n  static NUMBER_ADAPTER: NumberAdapter = BuildInNumberAdapter();\n\n  /**\n   * 字符串适配器, 有以下两种:\n   * 1. BuildInStringAdapter(默认): 使用内置 string 进行字符串处理.\n   * 2. BuildInIntlSegmenterAdapter: 使用 Intl.Segmenter 进行字符串处理. 能够支持 emoji, 字符集.\n   * 3. GraphemeSplitterAdapter: 使用 grapheme-splitter 进行字符串处理. 能够支持 emoji, 字符集.\n   *\n   * 详细信息请查看[支持 emoji 分词](/guide/optional-dependencies#支持-emoji-分词)章节.\n   *\n   * @default BuildInStringAdapter\n   */\n  static STRING_ADAPTER: StringAdapter = BuildInStringAdapter();\n\n  /**\n   * 将 value 及其相关的属性, 在 attribute 和 property 上的互相转换.\n   *\n   * @see https://lit.dev/docs/components/properties/#attributes\n   * @protected\n   */\n  static VALUE_CONVERTER = {\n    fromAttribute(value: string | null) {\n      return value;\n    },\n    toAttribute(value: unknown) {\n      return isNullish(value)\n        ? value\n        : TimeredCounterAdapter.NUMBER_ADAPTER.toString(value);\n    },\n  };\n\n  /**\n   * 设置要使用的数字适配器. 仅对设置完之后的 TimeredCounter 实例生效.\n   *\n   * 接受的关键字除了内置的 `number` 以外, 还可以通过 {@link registerNumberAdapter} 注册的 `keyword`.\n   *\n   * @param adapterOrType\n   */\n  static setNumberAdapter(adapterOrType: NumberAdapter | 'number' | string) {\n    let adapter: NumberAdapter = BuildInNumberAdapter();\n\n    if (isString(adapterOrType)) {\n      for (const [\n        keywords,\n        adapterFactory,\n      ] of TimeredCounterAdapter.AVAILABLE_NUMBER_ADAPTERS) {\n        if (keywords.includes(adapterOrType)) {\n          adapter = adapterFactory();\n          break;\n        }\n      }\n    } else {\n      adapter = adapterOrType;\n    }\n\n    TimeredCounterAdapter.NUMBER_ADAPTER = adapter;\n  }\n\n  /**\n   * 与 {@link setNumberAdapter} 类似, 用于设置字符串适配器.\n   */\n  static setStringAdapter(\n    adapterOrType: StringAdapter | 'string' | 'intl-segmenter' | string,\n  ) {\n    let adapter: StringAdapter = BuildInStringAdapter();\n\n    if (isString(adapterOrType)) {\n      for (const [\n        keywords,\n        adapterFactory,\n      ] of TimeredCounterAdapter.AVAILABLE_STRING_ADAPTERS) {\n        if (keywords.includes(adapterOrType)) {\n          adapter = adapterFactory();\n          break;\n        }\n      }\n    } else {\n      adapter = adapterOrType;\n    }\n\n    TimeredCounterAdapter.STRING_ADAPTER = adapter;\n  }\n\n  static registerNumberAdapter(\n    keyword: string[],\n    adapter: () => NumberAdapter,\n  ) {\n    TimeredCounterAdapter.AVAILABLE_NUMBER_ADAPTERS.set(keyword, adapter);\n  }\n\n  static registerStringAdapter(\n    keyword: string[],\n    adapter: () => StringAdapter,\n  ) {\n    TimeredCounterAdapter.AVAILABLE_STRING_ADAPTERS.set(keyword, adapter);\n  }\n\n  /**\n   * 可以直接使用 adapter 文件的导出进行注册.\n   *\n   * adapter 文件需要导出一个名为 register 的函数, 该函数接受一个 TimeredCounterAdapter 类型的参数.\n   *\n   * 具体示例请查看 {@link GraphemeSplitterAdapter} or {@link DecimalJsAdapter}.\n   */\n  static registryAdapter(adapter: {\n    register: (counterAdapter: typeof TimeredCounterAdapter) => void;\n  }) {\n    adapter.register(this);\n  }\n}\n\nexport function setNumberAdapter(\n  ...args: Parameters<(typeof TimeredCounterAdapter)['setNumberAdapter']>\n) {\n  TimeredCounterAdapter.setNumberAdapter(...args);\n}\n\nexport function setStringAdapter(\n  ...args: Parameters<(typeof TimeredCounterAdapter)['setStringAdapter']>\n) {\n  TimeredCounterAdapter.setStringAdapter(...args);\n}\n\nexport function registerNumberAdapter(\n  ...args: Parameters<(typeof TimeredCounterAdapter)['registerNumberAdapter']>\n) {\n  TimeredCounterAdapter.registerNumberAdapter(...args);\n}\n\nexport function registerStringAdapter(\n  ...args: Parameters<(typeof TimeredCounterAdapter)['registerStringAdapter']>\n) {\n  TimeredCounterAdapter.registerStringAdapter(...args);\n}\n"]}

package/dist/src/transitions/roller/roller-digit.js

@@ -28,9 +28,9 @@ let TimeredCounterRollerDigit = class TimeredCounterRollerDigit extends LitEleme
         this.keyframes = {};
         this.digitWidth = 0;
         this.resizeObserver = new ResizeObserver(() => {
-            this.digitWidth = (this.clonedRollDigitList
-                ? this.clonedRollDigitList.getBoundingClientRect()
-                : new DOMRect()).width;
+            this.digitWidth = this.clonedRollDigitList
+                ? this.clonedRollDigitList.offsetWidth
+                : 0;
         });
     }
     firstUpdated(_changedProperties) {

package/dist/src/transitions/roller/roller-digit.js.map

@@ -1 +1 @@
-{"version":3,"file":"roller-digit.js","sourceRoot":"","sources":["../../../../src/transitions/roller/roller-digit.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, PropertyValues } from 'lit';\nimport { repeat } from 'lit/directives/repeat.js';\nimport { StyleInfo, styleMap } from 'lit/directives/style-map.js';\nimport {\n  intersection,\n  isEmpty,\n  isNullish,\n  isString,\n  merge,\n  omit,\n  range,\n} from 'remeda';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { PartPreprocessedData } from '../../utils/preprocess-part-data.js';\nimport { PartDataDigit } from '../../types/group.js';\nimport { rollerDigitStyles } from './styles.js';\nimport * as EasingFunctions from '../../easing/penner-easing-functions.js';\n\nclass RollerDigitAnimationEvent extends Event {\n  // constructor(type: string, eventInitDict?: EventInit) {\n  //   super(type, eventInitDict);\n  // }\n}\n\n@customElement('timered-counter-roller-digit')\nexport class TimeredCounterRollerDigit extends LitElement {\n  static styles = [rollerDigitStyles];\n\n  @property({ type: Object })\n  digit: PartDataDigit = { data: [], place: 0 };\n\n  @property({ type: Object })\n  preprocessData: PartPreprocessedData = {\n    animate: true,\n    cancelPrevAnimation: false,\n    earlyReturn: '',\n    index: 0,\n    partIndex: 0,\n    digitIndex: 0,\n  };\n\n  @property({ type: String })\n  direction: 'up' | 'down' = 'up';\n\n  @property({ type: Object })\n  textStyle: Partial<CSSStyleDeclaration> = {};\n\n  @property({ type: Array })\n  cellStyle: Partial<CSSStyleDeclaration>[] = [];\n\n  @property({ type: Object })\n  animationOptions: KeyframeAnimationOptions = {};\n\n  @property({ type: Object })\n  keyframes: PropertyIndexedKeyframes = {};\n\n  @query('.roll-list__shadow')\n  clonedRollDigitList: HTMLElement | undefined;\n\n  @query('.roll-list')\n  rollList: HTMLElement | undefined;\n\n  @state()\n  digitWidth: number = 0;\n\n  resizeObserver: ResizeObserver;\n\n  animation: Animation | undefined;\n\n  constructor() {\n    super();\n\n    this.resizeObserver = new ResizeObserver(() => {\n      this.digitWidth = (\n        this.clonedRollDigitList\n          ? this.clonedRollDigitList.getBoundingClientRect()\n          : new DOMRect()\n      ).width;\n    });\n  }\n\n  protected firstUpdated(_changedProperties: PropertyValues<this>) {\n    super.firstUpdated(_changedProperties);\n\n    if (this.clonedRollDigitList) {\n      this.resizeObserver.observe(this.clonedRollDigitList);\n    }\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n\n    this.resizeObserver.disconnect();\n  }\n\n  protected updated(_changedProperties: PropertyValues) {\n    super.updated(_changedProperties);\n\n    /**\n     * 仅当影响滚动列表 dom 结构的属性发生变化时才会触发动画.\n     */\n    if (\n      intersection(Array.from(_changedProperties.keys()), [\n        'digit',\n        'preprocessData',\n        'direction',\n        'animationOptions',\n        'keyframes',\n      ]).length > 0\n    ) {\n      if (this.shouldAnimate()) {\n        this.startAnimation().then();\n      }\n    }\n  }\n\n  render() {\n    const shadowCellStyle = this.cellStyle.map(style =>\n      omit(style, ['position']),\n    );\n\n    return html`<span class=\"roller-part-digit\">\n      <!--    占位      -->\n      <span\n        class=\"placeholder\"\n        style=${styleMap({ width: `${Math.round(this.digitWidth)}px` })}\n        >0</span\n      >\n      <!--  一个不可见的滚动列表的复制, 用于计算该列表的最大宽度.  -->\n      <span class=\"roll-list__shadow\">\n        ${repeat(\n          this.digit.data,\n          (_, index) => index,\n          (digit, index) =>\n            html`<span style=${styleMap(shadowCellStyle[index] as StyleInfo)}\n              >${digit}</span\n            >`,\n        )}\n      </span>\n      <span\n        class=${classMap({\n          /**\n           * 向上(up)滚动时, 使滚动列表顶部对齐以便于应用 `translationY(-100%)` 实现向上滚动效果\n           * 向下同理\n           */\n          'roll-list__up': this.direction === 'up',\n          'roll-list__down': this.direction === 'down',\n          'roll-list': true,\n        })}\n      >\n        ${this.digit.data.length > 1\n          ? repeat(\n              this.digit.data,\n              (_, index) => index,\n              (digit, index) => {\n                if (\n                  this.direction === 'up' &&\n                  index === this.digit.data.length - 1\n                ) {\n                  return html`<span\n                    part=\"cell\"\n                    class=\"roll-item roll-item__head\"\n                    style=${styleMap(this.cellStyle[index] as StyleInfo)}\n                    ><span style=${styleMap(this.textStyle as StyleInfo)}\n                      >${digit}</span\n                    ></span\n                  >`;\n                }\n                if (this.direction === 'down' && index === 0) {\n                  return html`\n                    <span\n                      part=\"cell\"\n                      class=\"roll-item roll-item__tail\"\n                      style=${styleMap(this.cellStyle[index] as StyleInfo)}\n                      ><span style=${styleMap(this.textStyle as StyleInfo)}\n                        >${digit}</span\n                      ></span\n                    >\n                  `;\n                }\n                return html`<span\n                  part=\"cell\"\n                  class=\"roll-item\"\n                  style=${styleMap(this.cellStyle[index] as StyleInfo)}\n                  ><span style=${styleMap(this.textStyle as StyleInfo)}\n                    >${digit}</span\n                  ></span\n                >`;\n              },\n            )\n          : html`<span\n              part=\"cell\"\n              class=\"roll-item\"\n              style=${styleMap(this.cellStyle[0] as StyleInfo)}\n              ><span style=${styleMap(this.textStyle as StyleInfo)}\n                >${this.digit.data[0]}</span\n              ></span\n            >`}</span\n      ></span\n    > `;\n  }\n\n  shouldAnimate() {\n    const { cancelPrevAnimation, animate } = this.preprocessData;\n    if (cancelPrevAnimation) {\n      if (this.animation) {\n        this.animation.cancel();\n      }\n\n      if (this.rollList && this.rollList.style && this.rollList.style.cssText) {\n        this.rollList.style.cssText = '';\n      }\n    }\n\n    if (!animate) return false;\n\n    return true;\n  }\n\n  async startAnimation() {\n    if (isNullish(this.rollList)) return;\n\n    this.__emitAnimationStart();\n\n    const anmOptions = merge(\n      { duration: 1000, iterations: 1, easing: 'ease-out', fill: 'forwards' },\n      this.animationOptions,\n    );\n\n    const keyframes = isEmpty(this.keyframes)\n      ? {\n          up: { transform: ['translateY(0)', 'translateY(-100%)'] },\n          down: { transform: ['translateY(0)', 'translateY(100%)'] },\n        }[this.direction]\n      : this.keyframes;\n\n    /**\n     * 尝试从 `PennerEasingFunctions` 中获取对应的 easing 函数\n     */\n    // {\n    if (\n      isString(anmOptions.easing) &&\n      EasingFunctions[anmOptions.easing as keyof typeof EasingFunctions]\n    ) {\n      const func =\n        EasingFunctions[anmOptions.easing as keyof typeof EasingFunctions];\n      anmOptions.easing = `linear(${range(0, 64)\n        .map((_, i) => func(i / 63))\n        .join(',')})`;\n    }\n    // }\n\n    try {\n      this.clearAnimation();\n      this.animation = this.rollList.animate(keyframes, anmOptions);\n\n      this.animation.addEventListener(\n        'finish',\n        () => this.__emitAnimationEnd(),\n        {\n          once: true,\n        },\n      );\n\n      // /**\n      //  * 动画播放完成或被其他动画中断都会使得 `finished` resolve.\n      //  * 只有当动画顺利播放完成的情况下, 才能调用 `cancel` 取消动画. 在其他情况下调用, 会抛出异常[1].\n      //  *\n      //  * 因此, 提前检查 `playState` 的值. 当 `playState` 不是 `finished` 时, 说明动画被其他 `Animation` 实例中断.\n      //  * 因为已经有其他 `Animation` 实例的存在, 我们可以直接丢弃这个 `Animation` 实例, 而不用担心无动画可用.\n      //  *\n      //  * [1]: https://developer.mozilla.org/en-US/docs/Web/API/Animation/cancel#exceptions\n      //  */\n      // await this.animation.finished;\n      // if (\n      //   this.animation.playState === 'finished' &&\n      //   this.rollList.checkVisibility()\n      // ) {\n      //   // this.animation.commitStyles();\n      //   // this.animation.cancel();\n      // }\n    } catch (e) {\n      // eslint-disable-next-line no-console\n      console.error(e);\n    }\n  }\n\n  clearAnimation() {\n    this.animation?.removeEventListener('finish', this.__emitAnimationEnd);\n    this.animation?.cancel();\n  }\n\n  private __emitAnimationStart() {\n    if (!this.isConnected) return;\n\n    this.dispatchEvent(\n      new RollerDigitAnimationEvent('roller-digit-animation-start'),\n    );\n  }\n\n  private __emitAnimationEnd() {\n    if (!this.isConnected) return;\n\n    this.dispatchEvent(\n      new RollerDigitAnimationEvent('roller-digit-animation-end'),\n    );\n  }\n}\n"]}
+{"version":3,"file":"roller-digit.js","sourceRoot":"","sources":["../../../../src/transitions/roller/roller-digit.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, PropertyValues } from 'lit';\nimport { repeat } from 'lit/directives/repeat.js';\nimport { StyleInfo, styleMap } from 'lit/directives/style-map.js';\nimport {\n  intersection,\n  isEmpty,\n  isNullish,\n  isString,\n  merge,\n  omit,\n  range,\n} from 'remeda';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { PartPreprocessedData } from '../../utils/preprocess-part-data.js';\nimport { PartDataDigit } from '../../types/group.js';\nimport { rollerDigitStyles } from './styles.js';\nimport * as EasingFunctions from '../../easing/penner-easing-functions.js';\n\nclass RollerDigitAnimationEvent extends Event {\n  // constructor(type: string, eventInitDict?: EventInit) {\n  //   super(type, eventInitDict);\n  // }\n}\n\n@customElement('timered-counter-roller-digit')\nexport class TimeredCounterRollerDigit extends LitElement {\n  static styles = [rollerDigitStyles];\n\n  @property({ type: Object })\n  digit: PartDataDigit = { data: [], place: 0 };\n\n  @property({ type: Object })\n  preprocessData: PartPreprocessedData = {\n    animate: true,\n    cancelPrevAnimation: false,\n    earlyReturn: '',\n    index: 0,\n    partIndex: 0,\n    digitIndex: 0,\n  };\n\n  @property({ type: String })\n  direction: 'up' | 'down' = 'up';\n\n  @property({ type: Object })\n  textStyle: Partial<CSSStyleDeclaration> = {};\n\n  @property({ type: Array })\n  cellStyle: Partial<CSSStyleDeclaration>[] = [];\n\n  @property({ type: Object })\n  animationOptions: KeyframeAnimationOptions = {};\n\n  @property({ type: Object })\n  keyframes: PropertyIndexedKeyframes = {};\n\n  @query('.roll-list__shadow')\n  clonedRollDigitList: HTMLElement | undefined;\n\n  @query('.roll-list')\n  rollList: HTMLElement | undefined;\n\n  @state()\n  digitWidth: number = 0;\n\n  resizeObserver: ResizeObserver;\n\n  animation: Animation | undefined;\n\n  constructor() {\n    super();\n\n    this.resizeObserver = new ResizeObserver(() => {\n      this.digitWidth = this.clonedRollDigitList\n        ? this.clonedRollDigitList.offsetWidth\n        : 0;\n    });\n  }\n\n  protected firstUpdated(_changedProperties: PropertyValues<this>) {\n    super.firstUpdated(_changedProperties);\n\n    if (this.clonedRollDigitList) {\n      this.resizeObserver.observe(this.clonedRollDigitList);\n    }\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n\n    this.resizeObserver.disconnect();\n  }\n\n  protected updated(_changedProperties: PropertyValues) {\n    super.updated(_changedProperties);\n\n    /**\n     * 仅当影响滚动列表 dom 结构的属性发生变化时才会触发动画.\n     */\n    if (\n      intersection(Array.from(_changedProperties.keys()), [\n        'digit',\n        'preprocessData',\n        'direction',\n        'animationOptions',\n        'keyframes',\n      ]).length > 0\n    ) {\n      if (this.shouldAnimate()) {\n        this.startAnimation().then();\n      }\n    }\n  }\n\n  render() {\n    const shadowCellStyle = this.cellStyle.map(style =>\n      omit(style, ['position']),\n    );\n\n    return html`<span class=\"roller-part-digit\">\n      <!--    占位      -->\n      <span\n        class=\"placeholder\"\n        style=${styleMap({ width: `${Math.round(this.digitWidth)}px` })}\n        >0</span\n      >\n      <!--  一个不可见的滚动列表的复制, 用于计算该列表的最大宽度.  -->\n      <span class=\"roll-list__shadow\">\n        ${repeat(\n          this.digit.data,\n          (_, index) => index,\n          (digit, index) =>\n            html`<span style=${styleMap(shadowCellStyle[index] as StyleInfo)}\n              >${digit}</span\n            >`,\n        )}\n      </span>\n      <span\n        class=${classMap({\n          /**\n           * 向上(up)滚动时, 使滚动列表顶部对齐以便于应用 `translationY(-100%)` 实现向上滚动效果\n           * 向下同理\n           */\n          'roll-list__up': this.direction === 'up',\n          'roll-list__down': this.direction === 'down',\n          'roll-list': true,\n        })}\n      >\n        ${this.digit.data.length > 1\n          ? repeat(\n              this.digit.data,\n              (_, index) => index,\n              (digit, index) => {\n                if (\n                  this.direction === 'up' &&\n                  index === this.digit.data.length - 1\n                ) {\n                  return html`<span\n                    part=\"cell\"\n                    class=\"roll-item roll-item__head\"\n                    style=${styleMap(this.cellStyle[index] as StyleInfo)}\n                    ><span style=${styleMap(this.textStyle as StyleInfo)}\n                      >${digit}</span\n                    ></span\n                  >`;\n                }\n                if (this.direction === 'down' && index === 0) {\n                  return html`\n                    <span\n                      part=\"cell\"\n                      class=\"roll-item roll-item__tail\"\n                      style=${styleMap(this.cellStyle[index] as StyleInfo)}\n                      ><span style=${styleMap(this.textStyle as StyleInfo)}\n                        >${digit}</span\n                      ></span\n                    >\n                  `;\n                }\n                return html`<span\n                  part=\"cell\"\n                  class=\"roll-item\"\n                  style=${styleMap(this.cellStyle[index] as StyleInfo)}\n                  ><span style=${styleMap(this.textStyle as StyleInfo)}\n                    >${digit}</span\n                  ></span\n                >`;\n              },\n            )\n          : html`<span\n              part=\"cell\"\n              class=\"roll-item\"\n              style=${styleMap(this.cellStyle[0] as StyleInfo)}\n              ><span style=${styleMap(this.textStyle as StyleInfo)}\n                >${this.digit.data[0]}</span\n              ></span\n            >`}</span\n      ></span\n    > `;\n  }\n\n  shouldAnimate() {\n    const { cancelPrevAnimation, animate } = this.preprocessData;\n    if (cancelPrevAnimation) {\n      if (this.animation) {\n        this.animation.cancel();\n      }\n\n      if (this.rollList && this.rollList.style && this.rollList.style.cssText) {\n        this.rollList.style.cssText = '';\n      }\n    }\n\n    if (!animate) return false;\n\n    return true;\n  }\n\n  async startAnimation() {\n    if (isNullish(this.rollList)) return;\n\n    this.__emitAnimationStart();\n\n    const anmOptions = merge(\n      { duration: 1000, iterations: 1, easing: 'ease-out', fill: 'forwards' },\n      this.animationOptions,\n    );\n\n    const keyframes = isEmpty(this.keyframes)\n      ? {\n          up: { transform: ['translateY(0)', 'translateY(-100%)'] },\n          down: { transform: ['translateY(0)', 'translateY(100%)'] },\n        }[this.direction]\n      : this.keyframes;\n\n    /**\n     * 尝试从 `PennerEasingFunctions` 中获取对应的 easing 函数\n     */\n    // {\n    if (\n      isString(anmOptions.easing) &&\n      EasingFunctions[anmOptions.easing as keyof typeof EasingFunctions]\n    ) {\n      const func =\n        EasingFunctions[anmOptions.easing as keyof typeof EasingFunctions];\n      anmOptions.easing = `linear(${range(0, 64)\n        .map((_, i) => func(i / 63))\n        .join(',')})`;\n    }\n    // }\n\n    try {\n      this.clearAnimation();\n      this.animation = this.rollList.animate(keyframes, anmOptions);\n\n      this.animation.addEventListener(\n        'finish',\n        () => this.__emitAnimationEnd(),\n        {\n          once: true,\n        },\n      );\n\n      // /**\n      //  * 动画播放完成或被其他动画中断都会使得 `finished` resolve.\n      //  * 只有当动画顺利播放完成的情况下, 才能调用 `cancel` 取消动画. 在其他情况下调用, 会抛出异常[1].\n      //  *\n      //  * 因此, 提前检查 `playState` 的值. 当 `playState` 不是 `finished` 时, 说明动画被其他 `Animation` 实例中断.\n      //  * 因为已经有其他 `Animation` 实例的存在, 我们可以直接丢弃这个 `Animation` 实例, 而不用担心无动画可用.\n      //  *\n      //  * [1]: https://developer.mozilla.org/en-US/docs/Web/API/Animation/cancel#exceptions\n      //  */\n      // await this.animation.finished;\n      // if (\n      //   this.animation.playState === 'finished' &&\n      //   this.rollList.checkVisibility()\n      // ) {\n      //   // this.animation.commitStyles();\n      //   // this.animation.cancel();\n      // }\n    } catch (e) {\n      // eslint-disable-next-line no-console\n      console.error(e);\n    }\n  }\n\n  clearAnimation() {\n    this.animation?.removeEventListener('finish', this.__emitAnimationEnd);\n    this.animation?.cancel();\n  }\n\n  private __emitAnimationStart() {\n    if (!this.isConnected) return;\n\n    this.dispatchEvent(\n      new RollerDigitAnimationEvent('roller-digit-animation-start'),\n    );\n  }\n\n  private __emitAnimationEnd() {\n    if (!this.isConnected) return;\n\n    this.dispatchEvent(\n      new RollerDigitAnimationEvent('roller-digit-animation-end'),\n    );\n  }\n}\n"]}

package/dist/src/transitions/roller/roller.js

@@ -167,7 +167,7 @@ let TimeredCounterRoller = class TimeredCounterRoller extends LitElement {
                 result[partId][digitId] = {
                     backgroundImage: color,
                     backgroundClip: 'text',
-                    backgroundSize: `${containerRect.width}px ${containerRect.height}px`,
+                    backgroundSize: `${this.offsetWidth}px ${this.offsetHeight}px`,
                     backgroundPositionX: `${-el.offsetLeft}px`,
                     backgroundPositionY: `${-el.offsetTop}px`,
                     backgroundRepeat: 'no-repeat',

package/dist/src/transitions/roller/roller.js.map

@@ -1 +1 @@
-{"version":3,"file":"roller.js","sourceRoot":"","sources":["../../../../src/transitions/roller/roller.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, PropertyValues } from 'lit';\nimport { repeat } from 'lit/directives/repeat.js';\nimport { customElement, property, query } from 'lit/decorators.js';\nimport { StyleInfo, styleMap } from 'lit/directives/style-map.js';\nimport { isNumber, values } from 'remeda';\nimport { PartData } from '../../types/group.js';\nimport { PartPreprocessedData } from '../../utils/preprocess-part-data.js';\nimport './roller-digit.js';\nimport { rollerStyles } from './styles.js';\n\nclass RollerAnimationEvent extends Event {\n  // constructor(type: string, eventInitDict?: EventInit) {\n  //   super(type, eventInitDict);\n  // }\n}\n\n@customElement('timered-counter-roller')\nexport class TimeredCounterRoller extends LitElement {\n  static styles = [rollerStyles];\n\n  @property({ type: String })\n  color: string = '';\n\n  @property({ type: String })\n  direction: 'up' | 'down' = 'up';\n\n  @property({ type: Array })\n  parts: PartData[] = [];\n\n  @property({ type: Array })\n  partPreprocessDataList: PartPreprocessedData[][] = [];\n\n  @property({ type: Array })\n  animationOptions: KeyframeAnimationOptions[][] = [];\n\n  @property({ type: Array })\n  keyframes: PropertyIndexedKeyframes[][] = [];\n\n  @property({ type: Array })\n  cellStyles: Partial<CSSStyleDeclaration>[][][] = [];\n\n  @property({ type: Array })\n  digitStyles: Partial<CSSStyleDeclaration>[][] = [];\n\n  @property({ type: Array })\n  partStyles: Partial<CSSStyleDeclaration>[] = [];\n\n  @property({ type: Object })\n  parentContainerRect: DOMRect = {} as DOMRect;\n\n  @query('.roller__prefix')\n  prefixContainer: HTMLElement | undefined;\n\n  @query('.roller__suffix')\n  suffixContainer: HTMLElement | undefined;\n\n  private __partDigitsColorStyles: Partial<CSSStyleDeclaration>[][] = [];\n\n  protected render() {\n    return html`<span\n        class=\"roller__prefix\"\n        data-part-id=\"-1\"\n        data-digit-id=\"0\"\n        style=${styleMap(\n          (this.__partDigitsColorStyles?.[-1]?.[0] ?? {}) as StyleInfo,\n        )}\n      >\n        <slot part=\"prefix\" name=\"prefix\"></slot>\n      </span>\n      <span class=\"counter-parts\">\n        ${repeat(\n          this.parts,\n          (_, index) => index,\n          (part, partIndex) =>\n            html`<span\n              part=\"part\"\n              class=\"roller-part\"\n              style=${styleMap(\n                (this.partStyles?.[partIndex] ?? {}) as StyleInfo,\n              )}\n              >${repeat(\n                part.digits,\n                (_, index) => `${part.digits.length - index}`,\n                (digitInfo, digitIndex) =>\n                  html`<timered-counter-roller-digit\n                    exportparts=\"digit, cell\"\n                    part=\"digit\"\n                    class=\"roller-part__wrapper\"\n                    style=${styleMap(\n                      (this.digitStyles?.[partIndex]?.[digitIndex] ??\n                        {}) as StyleInfo,\n                    )}\n                    data-part-id=\"${partIndex}\"\n                    data-digit-id=\"${digitIndex}\"\n                    .digit=${digitInfo}\n                    .preprocessData=${this.partPreprocessDataList[partIndex][\n                      digitIndex\n                    ]}\n                    .direction=${this.direction}\n                    .textStyle=${this.__partDigitsColorStyles?.[partIndex]?.[\n                      digitIndex\n                    ] ?? {}}\n                    .cellStyle=${this.cellStyles[partIndex][digitIndex]}\n                    .animationOptions=${this.animationOptions[partIndex][\n                      digitIndex\n                    ]}\n                    .keyframes=${this.keyframes[partIndex][digitIndex]}\n                    @roller-digit-animation-end=${this\n                      .__handleDigitAnimationEnd}\n                  ></timered-counter-roller-digit>`,\n              )}${html`<span\n                class=\"roller-part__suffix\"\n                data-part-id=\"${partIndex}\"\n                data-digit-id=\"-1\"\n                style=${styleMap(\n                  (this.__partDigitsColorStyles?.[partIndex]?.[-1] ??\n                    {}) as StyleInfo,\n                )}\n                ><slot\n                  part=\"part-suffix\"\n                  name=${`part-suffix-${partIndex}`}\n                ></slot\n              ></span>`}</span\n            > `,\n        )}</span\n      ><span\n        class=\"roller__suffix\"\n        data-part-id=\"-2\"\n        data-digit-id=\"0\"\n        style=${styleMap(\n          (this.__partDigitsColorStyles?.[-2]?.[0] ?? {}) as StyleInfo,\n        )}\n        ><slot part=\"suffix\" name=\"suffix\"></slot\n      ></span>`;\n  }\n\n  protected willUpdate(_changedProperties: PropertyValues) {\n    super.willUpdate(_changedProperties);\n\n    if (\n      _changedProperties.has('direction') ||\n      _changedProperties.has('parts')\n    ) {\n      this.digitAnimateEndCount = 0;\n      this.digitAnimatedCount = this.partPreprocessDataList\n        .flat()\n        .filter(({ animate }) => animate).length;\n\n      if (this.digitAnimatedCount > 0) {\n        this.__emitAnimationStart();\n      }\n    }\n\n    this.__partDigitsColorStyles = this.__generatePartDigitsColorStyles();\n  }\n\n  /**\n   * 记录一次更新中, 启动动画并结束的 <timered-counter-roller-digit> 元素个数.\n   *\n   * 在每次更新前重置为 0.\n   *\n   * @see {@link __handleDigitAnimationEnd}\n   * @private\n   */\n  private digitAnimateEndCount = 0;\n\n  /**\n   * 记录一次更新中, 需要启动动画的 <timered-counter-roller-digit> 元素总数.\n   *\n   * 在每次更新前重新计算.\n   * @private\n   */\n  private digitAnimatedCount = 0;\n\n  private __handleDigitAnimationEnd() {\n    this.digitAnimateEndCount++;\n\n    if (this.digitAnimateEndCount < this.digitAnimatedCount) return;\n\n    this.__emitAnimationEnd();\n  }\n\n  private __emitAnimationStart() {\n    if (!this.isConnected) return;\n\n    this.dispatchEvent(new RollerAnimationEvent('roller-animation-start'));\n  }\n\n  private __emitAnimationEnd() {\n    if (!this.isConnected) return;\n\n    this.dispatchEvent(new RollerAnimationEvent('roller-animation-end'));\n  }\n\n  private __generatePartDigitsColorStyles() {\n    const result: Partial<CSSStyleDeclaration>[][] = [];\n\n    const containerRect = this.parentContainerRect;\n    const {\n      // parts,\n      // oldParts,\n      prefixContainer,\n      suffixContainer,\n      color,\n    } = this;\n    const partDigitElements = Array.from(\n      this.shadowRoot?.querySelectorAll('[data-part-id]').values() ?? [],\n    ) as HTMLElement[];\n\n    /**\n     * 当某次更新**将**会导致 DOM 宽高发生变化时(如: 滚动数字的位数增加/减少会导致宽度变化),\n     * 需要跳过这次更新然后等待 DOM 宽高变化完成才能更新(宽高变化后将通过 {@link containerRect} 触发).\n     */\n    if (!containerRect) {\n      return result;\n    }\n    /**\n     * 比较 {@link data} 前后不同判断是否导致 DOM 宽度会发生变化.\n     */\n    // if (parts.length !== oldParts.length) {\n    //   this.requestUpdate();\n    //   return result;\n    // }\n    // for (let i = 0; i < parts.length; i++) {\n    //   if (parts[i].digits.length !== oldParts[i].digits.length) {\n    //     this.requestUpdate();\n    //     return result;\n    //   }\n    // }\n\n    if (prefixContainer) partDigitElements[-1] = prefixContainer;\n    if (suffixContainer) partDigitElements[-2] = suffixContainer;\n\n    for (const el of values(partDigitElements)) {\n      const partId = Number.parseInt(el.dataset.partId ?? '-1', 10);\n      const digitId = Number.parseInt(el.dataset.digitId ?? '-1', 10);\n      if (!isNumber(partId) || !isNumber(digitId)) {\n        throw new Error(\n          'The data-part-id and data-digit-id attributes are required.',\n        );\n      }\n\n      if (!result[partId]) result[partId] = [];\n\n      if (CSS.supports('color', color)) {\n        result[partId][digitId] = { color };\n      } else if (CSS.supports('background-image', color)) {\n        result[partId][digitId] = {\n          backgroundImage: color,\n          backgroundClip: 'text',\n          backgroundSize: `${containerRect.width}px ${containerRect.height}px`,\n          backgroundPositionX: `${-el.offsetLeft}px`,\n          backgroundPositionY: `${-el.offsetTop}px`,\n          backgroundRepeat: 'no-repeat',\n          color: 'transparent',\n          // @ts-ignore\n          '-webkit-text-fill-color': 'transparent',\n        };\n      } else {\n        result[partId][digitId] = {};\n        // todo error event\n        // eslint-disable-next-line no-console\n        console.warn(new Error('The color property is not supported.'));\n      }\n    }\n\n    return result;\n  }\n}\n"]}
+{"version":3,"file":"roller.js","sourceRoot":"","sources":["../../../../src/transitions/roller/roller.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, PropertyValues } from 'lit';\nimport { repeat } from 'lit/directives/repeat.js';\nimport { customElement, property, query } from 'lit/decorators.js';\nimport { StyleInfo, styleMap } from 'lit/directives/style-map.js';\nimport { isNumber, values } from 'remeda';\nimport { PartData } from '../../types/group.js';\nimport { PartPreprocessedData } from '../../utils/preprocess-part-data.js';\nimport './roller-digit.js';\nimport { rollerStyles } from './styles.js';\n\nclass RollerAnimationEvent extends Event {\n  // constructor(type: string, eventInitDict?: EventInit) {\n  //   super(type, eventInitDict);\n  // }\n}\n\n@customElement('timered-counter-roller')\nexport class TimeredCounterRoller extends LitElement {\n  static styles = [rollerStyles];\n\n  @property({ type: String })\n  color: string = '';\n\n  @property({ type: String })\n  direction: 'up' | 'down' = 'up';\n\n  @property({ type: Array })\n  parts: PartData[] = [];\n\n  @property({ type: Array })\n  partPreprocessDataList: PartPreprocessedData[][] = [];\n\n  @property({ type: Array })\n  animationOptions: KeyframeAnimationOptions[][] = [];\n\n  @property({ type: Array })\n  keyframes: PropertyIndexedKeyframes[][] = [];\n\n  @property({ type: Array })\n  cellStyles: Partial<CSSStyleDeclaration>[][][] = [];\n\n  @property({ type: Array })\n  digitStyles: Partial<CSSStyleDeclaration>[][] = [];\n\n  @property({ type: Array })\n  partStyles: Partial<CSSStyleDeclaration>[] = [];\n\n  @property({ type: Object })\n  parentContainerRect: DOMRect = {} as DOMRect;\n\n  @query('.roller__prefix')\n  prefixContainer: HTMLElement | undefined;\n\n  @query('.roller__suffix')\n  suffixContainer: HTMLElement | undefined;\n\n  private __partDigitsColorStyles: Partial<CSSStyleDeclaration>[][] = [];\n\n  protected render() {\n    return html`<span\n        class=\"roller__prefix\"\n        data-part-id=\"-1\"\n        data-digit-id=\"0\"\n        style=${styleMap(\n          (this.__partDigitsColorStyles?.[-1]?.[0] ?? {}) as StyleInfo,\n        )}\n      >\n        <slot part=\"prefix\" name=\"prefix\"></slot>\n      </span>\n      <span class=\"counter-parts\">\n        ${repeat(\n          this.parts,\n          (_, index) => index,\n          (part, partIndex) =>\n            html`<span\n              part=\"part\"\n              class=\"roller-part\"\n              style=${styleMap(\n                (this.partStyles?.[partIndex] ?? {}) as StyleInfo,\n              )}\n              >${repeat(\n                part.digits,\n                (_, index) => `${part.digits.length - index}`,\n                (digitInfo, digitIndex) =>\n                  html`<timered-counter-roller-digit\n                    exportparts=\"digit, cell\"\n                    part=\"digit\"\n                    class=\"roller-part__wrapper\"\n                    style=${styleMap(\n                      (this.digitStyles?.[partIndex]?.[digitIndex] ??\n                        {}) as StyleInfo,\n                    )}\n                    data-part-id=\"${partIndex}\"\n                    data-digit-id=\"${digitIndex}\"\n                    .digit=${digitInfo}\n                    .preprocessData=${this.partPreprocessDataList[partIndex][\n                      digitIndex\n                    ]}\n                    .direction=${this.direction}\n                    .textStyle=${this.__partDigitsColorStyles?.[partIndex]?.[\n                      digitIndex\n                    ] ?? {}}\n                    .cellStyle=${this.cellStyles[partIndex][digitIndex]}\n                    .animationOptions=${this.animationOptions[partIndex][\n                      digitIndex\n                    ]}\n                    .keyframes=${this.keyframes[partIndex][digitIndex]}\n                    @roller-digit-animation-end=${this\n                      .__handleDigitAnimationEnd}\n                  ></timered-counter-roller-digit>`,\n              )}${html`<span\n                class=\"roller-part__suffix\"\n                data-part-id=\"${partIndex}\"\n                data-digit-id=\"-1\"\n                style=${styleMap(\n                  (this.__partDigitsColorStyles?.[partIndex]?.[-1] ??\n                    {}) as StyleInfo,\n                )}\n                ><slot\n                  part=\"part-suffix\"\n                  name=${`part-suffix-${partIndex}`}\n                ></slot\n              ></span>`}</span\n            > `,\n        )}</span\n      ><span\n        class=\"roller__suffix\"\n        data-part-id=\"-2\"\n        data-digit-id=\"0\"\n        style=${styleMap(\n          (this.__partDigitsColorStyles?.[-2]?.[0] ?? {}) as StyleInfo,\n        )}\n        ><slot part=\"suffix\" name=\"suffix\"></slot\n      ></span>`;\n  }\n\n  protected willUpdate(_changedProperties: PropertyValues) {\n    super.willUpdate(_changedProperties);\n\n    if (\n      _changedProperties.has('direction') ||\n      _changedProperties.has('parts')\n    ) {\n      this.digitAnimateEndCount = 0;\n      this.digitAnimatedCount = this.partPreprocessDataList\n        .flat()\n        .filter(({ animate }) => animate).length;\n\n      if (this.digitAnimatedCount > 0) {\n        this.__emitAnimationStart();\n      }\n    }\n\n    this.__partDigitsColorStyles = this.__generatePartDigitsColorStyles();\n  }\n\n  /**\n   * 记录一次更新中, 启动动画并结束的 <timered-counter-roller-digit> 元素个数.\n   *\n   * 在每次更新前重置为 0.\n   *\n   * @see {@link __handleDigitAnimationEnd}\n   * @private\n   */\n  private digitAnimateEndCount = 0;\n\n  /**\n   * 记录一次更新中, 需要启动动画的 <timered-counter-roller-digit> 元素总数.\n   *\n   * 在每次更新前重新计算.\n   * @private\n   */\n  private digitAnimatedCount = 0;\n\n  private __handleDigitAnimationEnd() {\n    this.digitAnimateEndCount++;\n\n    if (this.digitAnimateEndCount < this.digitAnimatedCount) return;\n\n    this.__emitAnimationEnd();\n  }\n\n  private __emitAnimationStart() {\n    if (!this.isConnected) return;\n\n    this.dispatchEvent(new RollerAnimationEvent('roller-animation-start'));\n  }\n\n  private __emitAnimationEnd() {\n    if (!this.isConnected) return;\n\n    this.dispatchEvent(new RollerAnimationEvent('roller-animation-end'));\n  }\n\n  private __generatePartDigitsColorStyles() {\n    const result: Partial<CSSStyleDeclaration>[][] = [];\n\n    const containerRect = this.parentContainerRect;\n    const {\n      // parts,\n      // oldParts,\n      prefixContainer,\n      suffixContainer,\n      color,\n    } = this;\n    const partDigitElements = Array.from(\n      this.shadowRoot?.querySelectorAll('[data-part-id]').values() ?? [],\n    ) as HTMLElement[];\n\n    /**\n     * 当某次更新**将**会导致 DOM 宽高发生变化时(如: 滚动数字的位数增加/减少会导致宽度变化),\n     * 需要跳过这次更新然后等待 DOM 宽高变化完成才能更新(宽高变化后将通过 {@link containerRect} 触发).\n     */\n    if (!containerRect) {\n      return result;\n    }\n    /**\n     * 比较 {@link data} 前后不同判断是否导致 DOM 宽度会发生变化.\n     */\n    // if (parts.length !== oldParts.length) {\n    //   this.requestUpdate();\n    //   return result;\n    // }\n    // for (let i = 0; i < parts.length; i++) {\n    //   if (parts[i].digits.length !== oldParts[i].digits.length) {\n    //     this.requestUpdate();\n    //     return result;\n    //   }\n    // }\n\n    if (prefixContainer) partDigitElements[-1] = prefixContainer;\n    if (suffixContainer) partDigitElements[-2] = suffixContainer;\n\n    for (const el of values(partDigitElements)) {\n      const partId = Number.parseInt(el.dataset.partId ?? '-1', 10);\n      const digitId = Number.parseInt(el.dataset.digitId ?? '-1', 10);\n      if (!isNumber(partId) || !isNumber(digitId)) {\n        throw new Error(\n          'The data-part-id and data-digit-id attributes are required.',\n        );\n      }\n\n      if (!result[partId]) result[partId] = [];\n\n      if (CSS.supports('color', color)) {\n        result[partId][digitId] = { color };\n      } else if (CSS.supports('background-image', color)) {\n        result[partId][digitId] = {\n          backgroundImage: color,\n          backgroundClip: 'text',\n          backgroundSize: `${this.offsetWidth}px ${this.offsetHeight}px`,\n          backgroundPositionX: `${-el.offsetLeft}px`,\n          backgroundPositionY: `${-el.offsetTop}px`,\n          backgroundRepeat: 'no-repeat',\n          color: 'transparent',\n          // @ts-ignore\n          '-webkit-text-fill-color': 'transparent',\n        };\n      } else {\n        result[partId][digitId] = {};\n        // todo error event\n        // eslint-disable-next-line no-console\n        console.warn(new Error('The color property is not supported.'));\n      }\n    }\n\n    return result;\n  }\n}\n"]}

package/dist/stories/timered-counter/decimaljs.stories.js

@@ -1,6 +1,7 @@
 import { setCustomElementsManifest, } from '@storybook/web-components';
 import customElementsManifest from '../../custom-elements.json' with { type: 'json' };
-import { setNumberAdapter } from '../../src/index.js';
+import { TimeredCounterAdapter } from '../../src/index.js';
+import DecimalJsNumberAdapter from '../../src/number-adapter/decimal-js.js';
 import { bigNumber } from '../story-parts/big-number.js';
 import { setByAttr, setByProp } from '../utils/index.js';
 setCustomElementsManifest(customElementsManifest);
@@ -12,7 +13,8 @@ const meta = {
         controls: { expanded: true },
     },
     beforeEach: () => {
-        setNumberAdapter('decimal.js');
+        TimeredCounterAdapter.registryAdapter(DecimalJsNumberAdapter);
+        TimeredCounterAdapter.setNumberAdapter('decimal.js');
     },
 };
 export default meta;

package/dist/stories/timered-counter/decimaljs.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"decimaljs.stories.js","sourceRoot":"","sources":["../../../stories/timered-counter/decimaljs.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAEL,yBAAyB,GAE1B,MAAM,2BAA2B,CAAC;AACnC,OAAO,sBAAsB,MAAM,4BAA4B,CAAC,OAAO,IAAI,EAAE,MAAM,EAAE,CAAC;AACtF,OAAO,EAAE,gBAAgB,EAAuB,MAAM,oBAAoB,CAAC;AAC3E,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAEzD,yBAAyB,CAAC,sBAAsB,CAAC,CAAC;AAElD,MAAM,IAAI,GAAS;IACjB,KAAK,EAAE,gCAAgC;IACvC,SAAS,EAAE,iBAAiB;IAC5B,IAAI,EAAE,CAAC,UAAU,EAAE,iBAAiB,CAAC;IACrC,UAAU,EAAE;QACV,QAAQ,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE;KAC7B;IACD,UAAU,EAAE,GAAG,EAAE;QACf,gBAAgB,CAAC,YAAY,CAAC,CAAC;IACjC,CAAC;CACF,CAAC;AACF,eAAe,IAAI,CAAC;AAEpB,OAAO,EACL,KAAK,EACL,MAAM,EACN,gBAAgB,EAChB,KAAK,EACL,MAAM,GACP,MAAM,oBAAoB,CAAC;AAE5B,MAAM,CAAC,MAAM,SAAS,GAA6B;IACjD,IAAI,EAAE;QACJ,SAAS,EAAE,aAAa;QACxB,gBAAgB,EAAE;YAChB,QAAQ,EAAE,GAAG;SACd;KACF;IACD,KAAK,CAAC,IAAI,CAAC,OAAO;QAChB,MAAM,EAAE,aAAa,EAAE,IAAI,EAAE,GAAG,OAAO,CAAC;QACxC,MAAM,OAAO,GAAG,aAAa,CAAC,aAAa,CACzC,cAAc,CACG,CAAC;QAEpB,MAAM,IAAI,CAAC,wBAAwB,EAAE,KAAK,IAAI,EAAE,CAC9C,SAAS,CAAC,OAAO,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,CAClD,CAAC;QAEF,MAAM,IAAI,CAAC,uBAAuB,EAAE,KAAK,IAAI,EAAE,CAC7C,SAAS,CAAC,OAAO,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,CAClD,CAAC;IACJ,CAAC;CACF,CAAC","sourcesContent":["import {\n  Meta,\n  setCustomElementsManifest,\n  StoryObj,\n} from '@storybook/web-components';\nimport customElementsManifest from '../../custom-elements.json' with { type: 'json' };\nimport { setNumberAdapter, type TimeredCounter } from '../../src/index.js';\nimport { bigNumber } from '../story-parts/big-number.js';\nimport { setByAttr, setByProp } from '../utils/index.js';\n\nsetCustomElementsManifest(customElementsManifest);\n\nconst meta: Meta = {\n  title: 'TimeredCounter/with decimal.js',\n  component: 'timered-counter',\n  tags: ['autodocs', 'timered-counter'],\n  parameters: {\n    controls: { expanded: true },\n  },\n  beforeEach: () => {\n    setNumberAdapter('decimal.js');\n  },\n};\nexport default meta;\n\nexport {\n  Basic,\n  Events,\n  AnimationOptions,\n  Slots,\n  Styles,\n} from './index.stories.js';\n\nexport const BigNumber: StoryObj<TimeredCounter> = {\n  args: {\n    className: 'test-target',\n    animationOptions: {\n      duration: 100,\n    },\n  },\n  async play(context) {\n    const { canvasElement, step } = context;\n    const counter = canvasElement.querySelector(\n      '.test-target',\n    ) as TimeredCounter;\n\n    await step('Testing with attribute', async () =>\n      bigNumber(context, { counter, setBy: setByAttr }),\n    );\n\n    await step('Testing with property', async () =>\n      bigNumber(context, { counter, setBy: setByProp }),\n    );\n  },\n};\n"]}
+{"version":3,"file":"decimaljs.stories.js","sourceRoot":"","sources":["../../../stories/timered-counter/decimaljs.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAEL,yBAAyB,GAE1B,MAAM,2BAA2B,CAAC;AACnC,OAAO,sBAAsB,MAAM,4BAA4B,CAAC,OAAO,IAAI,EAAE,MAAM,EAAE,CAAC;AACtF,OAAO,EAAE,qBAAqB,EAAuB,MAAM,oBAAoB,CAAC;AAChF,OAAO,sBAAsB,MAAM,wCAAwC,CAAC;AAC5E,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAEzD,yBAAyB,CAAC,sBAAsB,CAAC,CAAC;AAElD,MAAM,IAAI,GAAS;IACjB,KAAK,EAAE,gCAAgC;IACvC,SAAS,EAAE,iBAAiB;IAC5B,IAAI,EAAE,CAAC,UAAU,EAAE,iBAAiB,CAAC;IACrC,UAAU,EAAE;QACV,QAAQ,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE;KAC7B;IACD,UAAU,EAAE,GAAG,EAAE;QACf,qBAAqB,CAAC,eAAe,CAAC,sBAAsB,CAAC,CAAC;QAC9D,qBAAqB,CAAC,gBAAgB,CAAC,YAAY,CAAC,CAAC;IACvD,CAAC;CACF,CAAC;AACF,eAAe,IAAI,CAAC;AAEpB,OAAO,EACL,KAAK,EACL,MAAM,EACN,gBAAgB,EAChB,KAAK,EACL,MAAM,GACP,MAAM,oBAAoB,CAAC;AAE5B,MAAM,CAAC,MAAM,SAAS,GAA6B;IACjD,IAAI,EAAE;QACJ,SAAS,EAAE,aAAa;QACxB,gBAAgB,EAAE;YAChB,QAAQ,EAAE,GAAG;SACd;KACF;IACD,KAAK,CAAC,IAAI,CAAC,OAAO;QAChB,MAAM,EAAE,aAAa,EAAE,IAAI,EAAE,GAAG,OAAO,CAAC;QACxC,MAAM,OAAO,GAAG,aAAa,CAAC,aAAa,CACzC,cAAc,CACG,CAAC;QAEpB,MAAM,IAAI,CAAC,wBAAwB,EAAE,KAAK,IAAI,EAAE,CAC9C,SAAS,CAAC,OAAO,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,CAClD,CAAC;QAEF,MAAM,IAAI,CAAC,uBAAuB,EAAE,KAAK,IAAI,EAAE,CAC7C,SAAS,CAAC,OAAO,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,CAClD,CAAC;IACJ,CAAC;CACF,CAAC","sourcesContent":["import {\n  Meta,\n  setCustomElementsManifest,\n  StoryObj,\n} from '@storybook/web-components';\nimport customElementsManifest from '../../custom-elements.json' with { type: 'json' };\nimport { TimeredCounterAdapter, type TimeredCounter } from '../../src/index.js';\nimport DecimalJsNumberAdapter from '../../src/number-adapter/decimal-js.js';\nimport { bigNumber } from '../story-parts/big-number.js';\nimport { setByAttr, setByProp } from '../utils/index.js';\n\nsetCustomElementsManifest(customElementsManifest);\n\nconst meta: Meta = {\n  title: 'TimeredCounter/with decimal.js',\n  component: 'timered-counter',\n  tags: ['autodocs', 'timered-counter'],\n  parameters: {\n    controls: { expanded: true },\n  },\n  beforeEach: () => {\n    TimeredCounterAdapter.registryAdapter(DecimalJsNumberAdapter);\n    TimeredCounterAdapter.setNumberAdapter('decimal.js');\n  },\n};\nexport default meta;\n\nexport {\n  Basic,\n  Events,\n  AnimationOptions,\n  Slots,\n  Styles,\n} from './index.stories.js';\n\nexport const BigNumber: StoryObj<TimeredCounter> = {\n  args: {\n    className: 'test-target',\n    animationOptions: {\n      duration: 100,\n    },\n  },\n  async play(context) {\n    const { canvasElement, step } = context;\n    const counter = canvasElement.querySelector(\n      '.test-target',\n    ) as TimeredCounter;\n\n    await step('Testing with attribute', async () =>\n      bigNumber(context, { counter, setBy: setByAttr }),\n    );\n\n    await step('Testing with property', async () =>\n      bigNumber(context, { counter, setBy: setByProp }),\n    );\n  },\n};\n"]}

package/dist/stories/timered-counter-number/decimaljs.stories.js

@@ -1,6 +1,7 @@
 import { setCustomElementsManifest, } from '@storybook/web-components';
 import customElementsManifest from '../../custom-elements.json' with { type: 'json' };
-import { setNumberAdapter, } from '../../src/index.js';
+import { TimeredCounterAdapter, } from '../../src/index.js';
+import DecimalJsNumberAdapter from '../../src/number-adapter/decimal-js.js';
 import { setByAttr, setByProp } from '../utils/index.js';
 import { bigNumber } from '../story-parts/big-number.js';
 export { Basic, Events, Styles, LocaleNumber, AnimationOptions, } from './index.stories.js';
@@ -13,7 +14,8 @@ const meta = {
         controls: { expanded: true },
     },
     beforeEach: () => {
-        setNumberAdapter('decimal.js');
+        TimeredCounterAdapter.registryAdapter(DecimalJsNumberAdapter);
+        TimeredCounterAdapter.setNumberAdapter('decimal.js');
     },
 };
 export default meta;

package/dist/stories/timered-counter-number/decimaljs.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"decimaljs.stories.js","sourceRoot":"","sources":["../../../stories/timered-counter-number/decimaljs.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAEL,yBAAyB,GAE1B,MAAM,2BAA2B,CAAC;AACnC,OAAO,sBAAsB,MAAM,4BAA4B,CAAC,OAAO,IAAI,EAAE,MAAM,EAAE,CAAC;AACtF,OAAO,EACL,gBAAgB,GAGjB,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AACzD,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AAEzD,OAAO,EACL,KAAK,EACL,MAAM,EACN,MAAM,EACN,YAAY,EACZ,gBAAgB,GACjB,MAAM,oBAAoB,CAAC;AAE5B,yBAAyB,CAAC,sBAAsB,CAAC,CAAC;AAElD,MAAM,IAAI,GAAS;IACjB,KAAK,EAAE,sCAAsC;IAC7C,SAAS,EAAE,wBAAwB;IACnC,IAAI,EAAE,CAAC,UAAU,EAAE,wBAAwB,CAAC;IAC5C,UAAU,EAAE;QACV,QAAQ,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE;KAC7B;IACD,UAAU,EAAE,GAAG,EAAE;QACf,gBAAgB,CAAC,YAAY,CAAC,CAAC;IACjC,CAAC;CACF,CAAC;AACF,eAAe,IAAI,CAAC;AAEpB,MAAM,CAAC,MAAM,SAAS,GAAmC;IACvD,IAAI,EAAE;QACJ,SAAS,EAAE,aAAa;QACxB,gBAAgB,EAAE;YAChB,QAAQ,EAAE,GAAG;SACd;KACF;IACD,KAAK,CAAC,IAAI,CAAC,OAAO;QAChB,MAAM,EAAE,aAAa,EAAE,IAAI,EAAE,GAAG,OAAO,CAAC;QACxC,MAAM,OAAO,GAAG,aAAa,CAAC,aAAa,CACzC,cAAc,CACG,CAAC;QAEpB,MAAM,IAAI,CAAC,wBAAwB,EAAE,KAAK,IAAI,EAAE,CAC9C,SAAS,CAAC,OAAO,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,CAClD,CAAC;QAEF,MAAM,IAAI,CAAC,uBAAuB,EAAE,KAAK,IAAI,EAAE,CAC7C,SAAS,CAAC,OAAO,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,CAClD,CAAC;IACJ,CAAC;CACF,CAAC","sourcesContent":["import {\n  Meta,\n  setCustomElementsManifest,\n  StoryObj,\n} from '@storybook/web-components';\nimport customElementsManifest from '../../custom-elements.json' with { type: 'json' };\nimport {\n  setNumberAdapter,\n  type TimeredCounter,\n  TimeredCounterNumber,\n} from '../../src/index.js';\nimport { setByAttr, setByProp } from '../utils/index.js';\nimport { bigNumber } from '../story-parts/big-number.js';\n\nexport {\n  Basic,\n  Events,\n  Styles,\n  LocaleNumber,\n  AnimationOptions,\n} from './index.stories.js';\n\nsetCustomElementsManifest(customElementsManifest);\n\nconst meta: Meta = {\n  title: 'TimeredCounterNumber/with decimal.js',\n  component: 'timered-counter-number',\n  tags: ['autodocs', 'timered-counter-number'],\n  parameters: {\n    controls: { expanded: true },\n  },\n  beforeEach: () => {\n    setNumberAdapter('decimal.js');\n  },\n};\nexport default meta;\n\nexport const BigNumber: StoryObj<TimeredCounterNumber> = {\n  args: {\n    className: 'test-target',\n    animationOptions: {\n      duration: 100,\n    },\n  },\n  async play(context) {\n    const { canvasElement, step } = context;\n    const counter = canvasElement.querySelector(\n      '.test-target',\n    ) as TimeredCounter;\n\n    await step('Testing with attribute', async () =>\n      bigNumber(context, { counter, setBy: setByAttr }),\n    );\n\n    await step('Testing with property', async () =>\n      bigNumber(context, { counter, setBy: setByProp }),\n    );\n  },\n};\n"]}
+{"version":3,"file":"decimaljs.stories.js","sourceRoot":"","sources":["../../../stories/timered-counter-number/decimaljs.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAEL,yBAAyB,GAE1B,MAAM,2BAA2B,CAAC;AACnC,OAAO,sBAAsB,MAAM,4BAA4B,CAAC,OAAO,IAAI,EAAE,MAAM,EAAE,CAAC;AACtF,OAAO,EACL,qBAAqB,GAGtB,MAAM,oBAAoB,CAAC;AAC5B,OAAO,sBAAsB,MAAM,wCAAwC,CAAC;AAC5E,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AACzD,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AAEzD,OAAO,EACL,KAAK,EACL,MAAM,EACN,MAAM,EACN,YAAY,EACZ,gBAAgB,GACjB,MAAM,oBAAoB,CAAC;AAE5B,yBAAyB,CAAC,sBAAsB,CAAC,CAAC;AAElD,MAAM,IAAI,GAAS;IACjB,KAAK,EAAE,sCAAsC;IAC7C,SAAS,EAAE,wBAAwB;IACnC,IAAI,EAAE,CAAC,UAAU,EAAE,wBAAwB,CAAC;IAC5C,UAAU,EAAE;QACV,QAAQ,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE;KAC7B;IACD,UAAU,EAAE,GAAG,EAAE;QACf,qBAAqB,CAAC,eAAe,CAAC,sBAAsB,CAAC,CAAC;QAC9D,qBAAqB,CAAC,gBAAgB,CAAC,YAAY,CAAC,CAAC;IACvD,CAAC;CACF,CAAC;AACF,eAAe,IAAI,CAAC;AAEpB,MAAM,CAAC,MAAM,SAAS,GAAmC;IACvD,IAAI,EAAE;QACJ,SAAS,EAAE,aAAa;QACxB,gBAAgB,EAAE;YAChB,QAAQ,EAAE,GAAG;SACd;KACF;IACD,KAAK,CAAC,IAAI,CAAC,OAAO;QAChB,MAAM,EAAE,aAAa,EAAE,IAAI,EAAE,GAAG,OAAO,CAAC;QACxC,MAAM,OAAO,GAAG,aAAa,CAAC,aAAa,CACzC,cAAc,CACG,CAAC;QAEpB,MAAM,IAAI,CAAC,wBAAwB,EAAE,KAAK,IAAI,EAAE,CAC9C,SAAS,CAAC,OAAO,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,CAClD,CAAC;QAEF,MAAM,IAAI,CAAC,uBAAuB,EAAE,KAAK,IAAI,EAAE,CAC7C,SAAS,CAAC,OAAO,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,CAClD,CAAC;IACJ,CAAC;CACF,CAAC","sourcesContent":["import {\n  Meta,\n  setCustomElementsManifest,\n  StoryObj,\n} from '@storybook/web-components';\nimport customElementsManifest from '../../custom-elements.json' with { type: 'json' };\nimport {\n  TimeredCounterAdapter,\n  type TimeredCounter,\n  TimeredCounterNumber,\n} from '../../src/index.js';\nimport DecimalJsNumberAdapter from '../../src/number-adapter/decimal-js.js';\nimport { setByAttr, setByProp } from '../utils/index.js';\nimport { bigNumber } from '../story-parts/big-number.js';\n\nexport {\n  Basic,\n  Events,\n  Styles,\n  LocaleNumber,\n  AnimationOptions,\n} from './index.stories.js';\n\nsetCustomElementsManifest(customElementsManifest);\n\nconst meta: Meta = {\n  title: 'TimeredCounterNumber/with decimal.js',\n  component: 'timered-counter-number',\n  tags: ['autodocs', 'timered-counter-number'],\n  parameters: {\n    controls: { expanded: true },\n  },\n  beforeEach: () => {\n    TimeredCounterAdapter.registryAdapter(DecimalJsNumberAdapter);\n    TimeredCounterAdapter.setNumberAdapter('decimal.js');\n  },\n};\nexport default meta;\n\nexport const BigNumber: StoryObj<TimeredCounterNumber> = {\n  args: {\n    className: 'test-target',\n    animationOptions: {\n      duration: 100,\n    },\n  },\n  async play(context) {\n    const { canvasElement, step } = context;\n    const counter = canvasElement.querySelector(\n      '.test-target',\n    ) as TimeredCounter;\n\n    await step('Testing with attribute', async () =>\n      bigNumber(context, { counter, setBy: setByAttr }),\n    );\n\n    await step('Testing with property', async () =>\n      bigNumber(context, { counter, setBy: setByProp }),\n    );\n  },\n};\n"]}