refactor: adjust api

demo/src/components/danmu/Transmitter.tsx

@@ -37,7 +37,9 @@ export const Transmitter = ({
   const [content, setContent] = useState('');
   const [x, setX] = useState(50);
   const [y, setY] = useState(50);
-  const [duration, setDuration] = useState(random(...manager.options.times));
+  const [duration, setDuration] = useState(
+    random(...manager.options.durationRange),
+  );
   const [direction, setDirection] = useState<Direction>(
     manager.options.direction,
   );
@@ -183,7 +185,7 @@ export const Transmitter = ({
                   }
                   setOpen(false);
                   setContent('');
-                  setDuration(random(...manager.options.times));
+                  setDuration(random(...manager.options.durationRange));
                   manager.pushFlexibleDanmaku(
                     {
                       content,

demo/src/components/sidebar/SidebarMoveTimes.tsx → demo/src/components/sidebar/SidebarMoveDuration.tsx

@@ -13,7 +13,7 @@ import {
   TooltipTrigger,
 } from '@/components/ui/tooltip';
 
-export const SidebarMoveTimes = memo(
+export const SidebarMoveDuration = memo(
   ({ manager }: { manager: Manager<DanmakuValue> }) => {
     const { t } = useTranslation();
 
@@ -22,13 +22,13 @@ export const SidebarMoveTimes = memo(
         <Label className="shrink-0 mr-3 h-full text-base font-bold leading-8">
           <div className="flex items-center">
             <Rabbit />
-            <span className="ml-3 mr-1">{t('setTimes')} (ms)</span>
+            <span className="ml-3 mr-1">{t('setDuration')} (ms)</span>
             <TooltipProvider>
               <Tooltip>
                 <TooltipTrigger asChild>
                   <CircleAlert size={16} className="cursor-pointer" />
                 </TooltipTrigger>
-                <TooltipContent>{t('setTimesTip')}</TooltipContent>
+                <TooltipContent>{t('setDurationTip')}</TooltipContent>
               </Tooltip>
             </TooltipProvider>
           </div>
@@ -37,22 +37,26 @@ export const SidebarMoveTimes = memo(
           className="h-4/5 mr-2"
           type="number"
           placeholder="min"
-          defaultValue={manager.options.times[0]}
+          defaultValue={manager.options.durationRange[0]}
           onChange={throttle(1000, (e) => {
             manager.updateOptions({
-              times: [Number(e.target.value), manager.options.times[1]],
+              durationRange: [
+                Number(e.target.value),
+                manager.options.durationRange[1],
+              ],
             });
           })}
         />
         <Input
           className="h-4/5"
           type="number"
           placeholder="max"
-          defaultValue={manager.options.times[1]}
+          defaultValue={manager.options.durationRange[1]}
           onChange={throttle(1000, (e) => {
-            manager.updateOptions({
-              times: [manager.options.times[0], Number(e.target.value)],
-            });
+            manager.setDurationRange([
+              manager.options.durationRange[0],
+              Number(e.target.value),
+            ]);
           })}
         />
       </div>

demo/src/components/sidebar/index.tsx

@@ -9,10 +9,10 @@ import { SidebarOpacity } from '@/components/sidebar/SidebarOpacity';
 import { SidebarNumbers } from '@/components/sidebar/SidebarNumbers';
 import { SidebarDirection } from '@/components/sidebar/SidebarDirection';
 import { SidebarFrequency } from '@/components/sidebar/SidebarFrequency';
-import { SidebarMoveTimes } from '@/components/sidebar/SidebarMoveTimes';
 import { SidebarOcclusion } from '@/components/sidebar/SidebarOcclusion';
 import { SidebarModeSelect } from '@/components/sidebar/SidebarModeSelect';
 import { SidebarShowAndHide } from '@/components/sidebar/SidebarShowAndHide';
+import { SidebarMoveDuration } from '@/components/sidebar/SidebarMoveDuration';
 import { SidebarStartAndStop } from '@/components/sidebar/SidebarStartAndStop';
 
 export const Sidebar = ({ manager }: { manager: Manager<DanmakuValue> }) => {
@@ -23,7 +23,7 @@ export const Sidebar = ({ manager }: { manager: Manager<DanmakuValue> }) => {
       <SidebarAreaY manager={manager} />
       <SidebarGap manager={manager} />
       <SidebarFrequency manager={manager} />
-      <SidebarMoveTimes manager={manager} />
+      <SidebarMoveDuration manager={manager} />
       <SidebarRate manager={manager} />
       <SidebarModeSelect manager={manager} />
       <SidebarFreeze manager={manager} />

demo/src/i18n/en.ts

@@ -34,8 +34,8 @@ export const enMap = {
     'When set to `strict` mode, strict collision detection will be performed, and if the conditions are not met, rendering will be delayed',
   setModeTipThree:
     'When set to `adaptive` mode, collision detection will be performed as much as possible under the premise of immediate rendering (recommended)',
-  setTimes: 'Times',
-  setTimesTip:
+  setDuration: 'Duration',
+  setDurationTip:
     'Normal danmaku will randomly take a value between these two values as the movement duration',
   setNumbersTitle: 'Real-time rendering danmaku',
   stashNumber: 'Stashed danmaku',

demo/src/i18n/zh.ts

@@ -31,8 +31,8 @@ export const zhMap = {
     '当设置为 strict 模式时，会进行严格的碰撞检测，如果不满足条件则会推迟渲染',
   setModeTipThree:
     '当设置为 adaptive 模式时，在满足立即渲染的前提下，会尽力进行碰撞检测（推荐）',
-  setTimes: '运动时长',
-  setTimesTip: '普通弹幕会从这两个值之间随机取一个值作为弹幕运动的时间',
+  setDuration: '运动时长',
+  setDurationTip: '普通弹幕会从这两个值之间随机取一个值作为弹幕运动的时间',
   setNumbersTitle: '实时渲染弹幕',
   stashNumber: '暂存区弹幕',
   allNumber: '弹幕总量（包含暂存区）',

demo/src/manager.tsx

@@ -9,7 +9,7 @@ export const initManager = () => {
   const manager = create<DanmakuValue, Statuses>({
     interval: 500,
     trackHeight: 40,
-    times: [10000, 13000],
+    durationRange: [10000, 13000],
     plugin: {
       init(manager) {
         'shadow shadow-slate-200 bg-slate-100'.split(' ').forEach((c) => {

docs/en/guide/getting-started.md

@@ -125,7 +125,7 @@ Facile danmaku will be limited by the collision rendering algorithm. For those d
 ```ts
 manager.pushFlexibleDanmaku('content', {
   id: 1, // Optional parameters
-  duration: 1000, // Defaults to a random value from `manager.options.times`
+  duration: 1000, // Defaults to a random value from `manager.options.durationRange`
   direction: 'none', // Defaults to the value of `manager.options.direction`
   position: (danmaku, container) => {
     // This will make the danmaku appear in the center of the container.

docs/en/reference/manager-api.md

@@ -426,11 +426,11 @@ Sets the **collision detection algorithm** for subsequent rendered danmaku. This
 
 Sets the **horizontal spacing** between subsequent rendered danmaku. This is a syntactic sugar for `manager.updateOptions()` and will trigger the `updateOptions` hook.
 
-## `manager.setTimes()`
+## `manager.setDurationRange()`
 
-**Type: `(times: [number, number]) => void`**
+**Type: `(durationRange: [number, number]) => void`**
 
-Sets the **motion time range** for subsequent rendered danmaku. This is a syntactic sugar for `manager.updateOptions()` and will trigger the `updateOptions` hook.
+Sets the **motion duration range** for subsequent rendered danmaku. This is a syntactic sugar for `manager.updateOptions()` and will trigger the `updateOptions` hook.
 
 ## `manager.setLimits()`
 

docs/en/reference/manager-configuration.md

@@ -12,7 +12,7 @@ interface CreateOption {
   rate?: number;
   interval?: number;
   gap?: number | string;
-  times?: [number, number];
+  durationRange?: [number, number];
   trackHeight?: number | string;
   plugin?: ManagerPlugin;
   limits?: {
@@ -100,7 +100,7 @@ manager.setTrackHeight(100); // Height is 100px
 manager.setTrackHeight('33%'); // Height is 33% of the container height
 ```
 
-## `config.times`
+## `config.durationRange`
 
 **Type: `[number, number]`**<br/>
 **Default: `[4000, 6000]`**

docs/en/reference/manager-properties.md

@@ -23,7 +23,7 @@ The current version of the `danmu` library.
 [**`manager.options`**](./manager-configuration), you can get some initial values from here and use them.
 
 ```ts
-console.log(manager.options.times); // [number, number]
+console.log(manager.options.durationRange); // [number, number]
 ```
 
 ## `manager.statuses`

docs/zh/guide/getting-started.md

@@ -118,7 +118,7 @@ manager.push('弹幕内容', {
 ```ts
 manager.pushFlexibleDanmaku('弹幕内容', {
   id: 1, // 可选参数
-  duration: 1000, // 默认从 manager.options.times 中随机取一个值
+  duration: 1000, // 默认从 manager.options.durationRange 中随机取一个值
   direction: 'none', // 默认取 manager.options.direction 的值
   position: (danmaku, container) => {
     // 这会让弹幕在容器居中的位置出现，因为 direction 为 none，所以会静止播放 1s

docs/zh/reference/manager-api.md

@@ -426,9 +426,9 @@ interface AreaOptions {
 
 设置后续渲染的弹幕之间的**横向间距**，是 `manager.updateOptions()` 的语法糖，会触发 `updateOptions` 钩子。
 
-## `manager.setTimes()`
+## `manager.setDurationRange()`
 
-**类型：`(times: [number, number]) => void`**
+**类型：`(durationRange: [number, number]) => void`**
 
 设置后续渲染的弹幕之间的**运动时间取值范围**，是 `manager.updateOptions()` 的语法糖，会触发 `updateOptions` 钩子。
 

docs/zh/reference/manager-configuration.md

@@ -12,7 +12,7 @@ interface CreateOption {
   rate?: number;
   interval?: number;
   gap?: number | string;
-  times?: [number, number];
+  durationRange?: [number, number];
   trackHeight?: number | string;
   plugin?: ManagerPlugin;
   limits?: {
@@ -100,7 +100,7 @@ manager.setTrackHeight(100); // 高度为 100px
 manager.setTrackHeight('33%'); // 高度为容器高度的 33%
 ```
 
-## `config.times`
+## `config.durationRange`
 
 **类型：`[number, number]`**<br/>
 **默认值：`[4000, 6000]`**

docs/zh/reference/manager-properties.md

@@ -23,7 +23,7 @@
 [**`manager.options`**](./manager-configuration)，你可以从这里取到一些初始值并使用。
 
 ```ts
-console.log(manager.options.times); // [number, number]
+console.log(manager.options.durationRange); // [number, number]
 ```
 
 ## `manager.statuses`

src/engine.ts

@@ -12,33 +12,19 @@ import { FacileDanmaku } from './danmaku/facile';
 import { FlexibleDanmaku } from './danmaku/flexible';
 import { toNumber, randomIdx, nextFrame, INTERNAL_FLAG } from './utils';
 import type {
-  Mode,
   TrackData,
   StashData,
-  Direction,
   EachCallback,
   Danmaku,
   PushOptions,
   PushFlexOptions,
   DanmakuType,
   DanmakuPlugin,
   RenderOptions,
+  EngineOptions,
   InternalStatuses,
 } from './types';
 
-export interface EngineOptions {
-  mode: Mode;
-  rate: number;
-  gap: number | string;
-  trackHeight: number | string;
-  times: [number, number];
-  direction: Exclude<Direction, 'none'>;
-  limits: {
-    view?: number;
-    stash: number;
-  };
-}
-
 export class Engine<T> {
   public rows = 0;
   public container = new Container();
@@ -387,7 +373,7 @@ export class Engine<T> {
           resolve(true);
           return;
         }
-        const { mode, times } = this._options;
+        const { mode, durationRange } = this._options;
         if (mode !== 'none' && cur.type === 'facile') {
           assert(cur.trackData, 'Danmaku missing "trackData"');
           const prev = this._last(cur.trackData.list, 1);
@@ -397,7 +383,7 @@ export class Engine<T> {
               cur as FacileDanmaku<T>,
             );
             if (fixTime !== null) {
-              if (isInBounds(times, fixTime)) {
+              if (isInBounds(durationRange, fixTime)) {
                 cur.updateDuration(fixTime, true);
               } else if (mode === 'strict') {
                 resolve(true);

src/index.ts

@@ -12,7 +12,7 @@ const formatOptions = <T>(options?: CreateOption<T>) => {
       mode: 'strict',
       direction: 'right',
       trackHeight: '20%',
-      times: [4000, 6000],
+      durationRange: [4000, 6000],
     },
     options,
   );
@@ -39,7 +39,7 @@ export function create<
   return manager;
 }
 
-export type { Manager, ManagerOptions } from './manager';
+export type { Manager } from './manager';
 export type { HookOn, HooksOn, Plugin, HookType } from 'hooks-plugin';
 export type {
   Mode,
@@ -49,9 +49,10 @@ export type {
   PushFlexOptions,
   ValueType,
   Direction,
-  CreateOption,
   Danmaku,
   DanmakuType,
   DanmakuPlugin,
   ManagerPlugin,
+  ManagerOptions,
+  CreateOption,
 } from './types';

src/lifeCycle.ts

@@ -5,8 +5,13 @@ import {
   PluginSystem,
 } from 'hooks-plugin';
 import { ids } from './utils';
-import type { Manager, ManagerOptions } from './manager';
-import type { Danmaku, DanmakuType, DanmakuPlugin } from './types';
+import type { Manager } from './manager';
+import type {
+  Danmaku,
+  DanmakuType,
+  DanmakuPlugin,
+  ManagerOptions,
+} from './types';
 
 export function createDanmakuLifeCycle<T extends Danmaku<any>>() {
   return new PluginSystem({

src/manager.ts

@@ -1,7 +1,7 @@
 import { assert, hasOwn, random, isEmptyObject } from 'aidly';
+import { Engine } from './engine';
 import { FacileDanmaku } from './danmaku/facile';
 import { FlexibleDanmaku } from './danmaku/flexible';
-import { Engine, type EngineOptions } from './engine';
 import { ids, nextFrame, INTERNAL_FLAG } from './utils';
 import { createDanmakuPlugin, createManagerLifeCycle } from './lifeCycle';
 import type {
@@ -15,15 +15,12 @@ import type {
   FreezeOptions,
   FilterCallback,
   ManagerPlugin,
+  ManagerOptions,
   PushOptions,
   PushFlexOptions,
   InternalStatuses,
 } from './types';
 
-export interface ManagerOptions extends EngineOptions {
-  interval: number;
-}
-
 export class Manager<
   T extends unknown,
   U extends Record<any, unknown> = Record<PropertyKey, unknown>,
@@ -57,7 +54,7 @@ export class Manager<
       options.direction = this.options.direction;
     }
     if (!('duration' in options)) {
-      const duration = random(...this.options.times);
+      const duration = random(...this.options.durationRange);
       assert(duration > 0, `Invalid move time "${duration}"`);
       options.duration = duration;
     }
@@ -378,8 +375,8 @@ export class Manager<
     this.updateOptions({ interval });
   }
 
-  public setTimes(times: [number, number]) {
-    this.updateOptions({ times });
+  public setDurationRange(durationRange: [number, number]) {
+    this.updateOptions({ durationRange });
   }
 
   public setRate(rate: number) {