@caperjs/core 0.2.2 → 0.2.3

package/src/ui/Button.ts

@@ -12,7 +12,11 @@ import {
 import { type LayoutOptions } from '@pixi/layout';
 import type { IApplication } from '../core';
 import { Application } from '../core/Application';
-import { Factory, Focusable, HTMLTextProps, Interactive, type TextProps, WithSignals } from '../mixins';
+import { Factory } from '../mixins/factory/Factory';
+import type { HTMLTextProps, TextProps } from '../mixins/factory/props';
+import { Focusable } from '../mixins/focus';
+import { Interactive } from '../mixins/interaction';
+import { WithSignals } from '../mixins/signals';
 import { Signal } from '../signals';
 import { AudioAsset, bindAllMethods, type SpritesheetAsset, type TextureAsset } from '../utils';
 

package/src/ui/FlexContainer.ts

@@ -1,8 +1,9 @@
 import type { LayoutOptions, NumberValue } from '@pixi/layout';
 import { BitmapText, Graphics, Container as PIXIContainer, Text } from 'pixi.js';
 import { Application } from '../core/Application';
-import { Container } from '../display';
-import { Factory, WithSignals } from '../mixins';
+import { Container } from '../display/Container';
+import { Factory } from '../mixins/factory/Factory';
+import { WithSignals } from '../mixins/signals';
 import { Signal } from '../signals';
 import {
   AppTypeOverrides,

package/src/ui/Input.ts

@@ -11,7 +11,10 @@ import {
   Texture,
 } from 'pixi.js';
 
-import { Focusable, Interactive, TextProps, WithSignals } from '../mixins';
+import type { TextProps } from '../mixins/factory/props';
+import { Focusable } from '../mixins/focus';
+import { Interactive } from '../mixins/interaction';
+import { WithSignals } from '../mixins/signals';
 
 import {
   EaseString,
@@ -27,7 +30,7 @@ import {
 } from '../utils';
 
 import { gsap } from 'gsap';
-import { Container } from '../display';
+import { Container } from '../display/Container';
 import { Signal } from '../signals';
 
 /**

package/src/ui/Joystick.ts

@@ -4,7 +4,7 @@
  * ported to TypeScript and adapted for Caper
  */
 import { DestroyOptions, FederatedPointerEvent, Graphics, Point, Sprite } from 'pixi.js';
-import { Container } from '../display';
+import { Container } from '../display/Container';
 import { JoystickDirection } from '../plugins';
 import { Signal } from '../signals';
 

package/src/ui/Toast.ts

@@ -1,7 +1,8 @@
 import { gsap } from 'gsap';
 import { Graphics, Text } from 'pixi.js';
 import { Container } from '../display/Container';
-import { type TextStyle, WithSignals } from '../mixins';
+import type { TextStyle } from '../mixins/factory/props';
+import { WithSignals } from '../mixins/signals';
 import { Signal } from '../signals';
 import { Button } from './Button';
 import { Toaster } from './Toaster';

package/src/ui/Toaster.ts

@@ -1,6 +1,6 @@
 import { gsap } from 'gsap';
 import { Container } from '../display/Container';
-import { WithSignals } from '../mixins';
+import { WithSignals } from '../mixins/signals';
 import { Signal } from '../signals';
 import { defaultToastConfig, Toast, ToastConfig } from './Toast';
 import { UICanvasEdge } from './UICanvas';

package/src/ui/UICanvas.test.ts

@@ -0,0 +1,35 @@
+import { describe, expect, it, vi } from 'vitest';
+
+// UICanvas transitively imports Application → Pixi display graph. Stub it — the
+// pure padding helper needs none of it.
+vi.mock('../core/Application', () => ({
+  Application: { getInstance: () => ({}) },
+}));
+
+import { computeEffectivePadding } from './UICanvas';
+
+const zero = { top: 0, right: 0, bottom: 0, left: 0 };
+
+describe('computeEffectivePadding', () => {
+  it('adds the safe area to the configured padding', () => {
+    expect(
+      computeEffectivePadding({ top: 10, right: 10, bottom: 10, left: 10 }, { ...zero, top: 44, bottom: 34 }),
+    ).toEqual({ top: 54, right: 10, bottom: 44, left: 10 });
+  });
+
+  it('returns the configured padding when there is no safe area', () => {
+    expect(computeEffectivePadding({ top: 10, right: 20, bottom: 30, left: 40 }, zero)).toEqual({
+      top: 10,
+      right: 20,
+      bottom: 30,
+      left: 40,
+    });
+  });
+
+  it('does not compound when applied repeatedly to the same base padding', () => {
+    const base = { top: 10, right: 10, bottom: 10, left: 10 };
+    const safeArea = { ...zero, top: 44 };
+    computeEffectivePadding(base, safeArea);
+    expect(computeEffectivePadding(base, safeArea).top).toBe(54);
+  });
+});

package/src/ui/UICanvas.ts

@@ -1,8 +1,9 @@
 import type { LayoutOptions } from '@pixi/layout';
 import { ContainerChild, Graphics, RenderLayer, Container as PIXIContainer, Text } from 'pixi.js';
 import { Application } from '../core/Application';
-import { Container } from '../display';
-import { Factory, WithSignals } from '../mixins';
+import { Container } from '../display/Container';
+import { Factory } from '../mixins/factory/Factory';
+import { WithSignals } from '../mixins/signals';
 import type { AppTypeOverrides, Padding, PointLike, Size, SizeLike } from '../utils';
 import {
   bindAllMethods,
@@ -72,21 +73,46 @@ export type UICanvasConfig = {
   padding: Padding;
   size: Size;
   useAppSize: boolean;
+  useSafeArea: boolean;
   layout?: Omit<LayoutOptions, 'target'> | null | boolean;
   autoLayoutChildren?: boolean;
 };
 
-export const UICanvasConfigKeys: (keyof UICanvasConfig)[] = ['debug', 'padding', 'size', 'useAppSize', 'layout'];
+export const UICanvasConfigKeys: (keyof UICanvasConfig)[] = [
+  'debug',
+  'padding',
+  'size',
+  'useAppSize',
+  'useSafeArea',
+  'layout',
+];
 
 export type UICanvasProps = {
   debug: boolean;
   padding: Partial<Padding> | PointLike;
   size?: SizeLike;
   useAppSize?: boolean;
+  useSafeArea?: boolean;
   layout?: Omit<LayoutOptions, 'target'> | null | boolean;
   autoLayoutChildren?: boolean;
 };
 
+const zeroPadding: Padding = { top: 0, right: 0, bottom: 0, left: 0 };
+
+/**
+ * The padding the canvas actually lays out with: the configured padding plus the
+ * device's safe-area insets. Kept separate from `config.padding` so it can be
+ * re-derived on every resize without compounding.
+ */
+export function computeEffectivePadding(padding: Padding, safeArea: Padding): Padding {
+  return {
+    top: padding.top + safeArea.top,
+    right: padding.right + safeArea.right,
+    bottom: padding.bottom + safeArea.bottom,
+    left: padding.left + safeArea.left,
+  };
+}
+
 const defaultLayout = {
   flexGrow: 0,
   flexShrink: 0,
@@ -124,6 +150,7 @@ export class UICanvas extends _UICanvas {
       padding: ensurePadding(config?.padding ?? 0),
       size: config.size !== undefined ? resolveSizeLike(config.size) : { width: 0, height: 0 },
       useAppSize: config.useAppSize === true,
+      useSafeArea: config.useSafeArea ?? true,
       autoLayoutChildren: config.autoLayoutChildren ?? true,
     };
 
@@ -414,13 +441,22 @@ export class UICanvas extends _UICanvas {
   set padding(value: Partial<Padding> | PointLike) {
     this.config.padding = ensurePadding(value);
     // Update position to account for padding
+    this._applyPadding();
+    this._updateLayout();
+  }
+
+  /** Writes the effective padding (configured padding + safe-area insets) into the layout. */
+  private _applyPadding() {
+    const padding = computeEffectivePadding(
+      this.config.padding,
+      this.config.useSafeArea ? this.app.safeArea : zeroPadding,
+    );
     this.layout = {
-      paddingLeft: this.config.padding.left,
-      paddingTop: this.config.padding.top,
-      paddingRight: this.config.padding.right,
-      paddingBottom: this.config.padding.bottom,
+      paddingLeft: padding.left,
+      paddingTop: padding.top,
+      paddingRight: padding.right,
+      paddingBottom: padding.bottom,
     };
-    this._updateLayout();
   }
 
   private static isFlexContainer(child: PIXIContainer): boolean {
@@ -494,6 +530,8 @@ export class UICanvas extends _UICanvas {
   }
 
   public resize() {
+    // Re-derived rather than cached: the safe area changes with the viewport.
+    this._applyPadding();
     if (this.config.useAppSize) {
       this.size = { width: this.app.size.width, height: this.app.size.height };
       this.position.set(-this.app.size.width * 0.5, -this.app.size.height * 0.5);

package/src/utils/types.ts

@@ -1,7 +1,7 @@
 import type { AssetInitOptions, AssetsManifest, AssetsPreferences, Texture, UnresolvedAsset } from 'pixi.js';
 import { Point } from 'pixi.js';
 import type { Scene } from '../display/Scene';
-import { SceneAssets } from '../display';
+import type { SceneAssets } from '../display/Scene';
 import type { FilterBitmapFontNames, FilterCleanAssetNames, FilterSpineAssetNames } from './typefilters';
 
 /**

package/src/version.ts

@@ -1,3 +1,3 @@
 // This file is auto-generated during the build process.
-export const version: string = '0.2.2';
+export const version: string = '0.2.3';
 export const pixiVersion: string = '8.19.0';

package/lib/CaptionsPlugin-DeGyPecB.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"CaptionsPlugin-DeGyPecB.js","names":[],"sources":["../src/plugins/captions/CaptionsRenderer.ts","../src/plugins/captions/CaptionsPlugin.ts"],"sourcesContent":["import { gsap } from 'gsap';\nimport { BitmapText, Container as PIXIContainer, Sprite, Texture } from 'pixi.js';\nimport { Container } from '../../display';\nimport { type Size } from '../../utils';\nimport { CaptionsPlugin } from './CaptionsPlugin';\n\nexport type CaptionLine = {\n  id: string;\n  start: number;\n  end: number;\n  content: string;\n  speaker?: string;\n};\n\nexport interface ICaptionRenderer extends PIXIContainer {\n  visible: boolean;\n\n  start(): void;\n\n  stop(): void;\n\n  lineBegin(line: CaptionLine): void;\n\n  lineEnd(line: CaptionLine): void;\n\n  resize(size?: Size): void;\n\n  updateSettings(): void;\n\n  destroy(): void;\n}\n\nexport class CaptionsRenderer extends Container implements ICaptionRenderer {\n  private readonly _bg: Sprite;\n  private readonly _text: BitmapText;\n  private readonly _size: Size = { width: 0, height: 0 };\n  private readonly fontSize = 48;\n\n  constructor(private plugin: CaptionsPlugin) {\n    super({ autoResize: false });\n\n    this._bg = this.add.sprite({ asset: Texture.WHITE, anchor: [0.5, 0] });\n    this._bg.tint = this.plugin.options.backgroundColor;\n    this._bg.alpha = 0;\n\n    this._text = this.add.bitmapText({\n      font: plugin.options.fontName,\n      resolution: 2,\n      roundPixels: true,\n      style: {\n        fill: this.plugin.options.textColor,\n        fontSize: this.fontSize * this.getSizeMultiplier(),\n        fontWeight: 'bold',\n        align: 'center',\n        wordWrapWidth: this.plugin.maxWidth,\n        wordWrap: true,\n        lineHeight: this.fontSize * this.getSizeMultiplier() * 2 + 20,\n      },\n    });\n    this._text.style.wordWrap = true;\n    this._text.alpha = 0;\n    this._text.visible = false;\n    this._text.anchor.x = 0.5;\n    this._text.anchor.y = 0;\n    this.addChild(this._text);\n\n    if (this.plugin.debug) {\n      let isTapping = false;\n      this._bg.eventMode = 'static';\n      this._bg.on('pointertap', () => {\n        if (isTapping) {\n          return;\n        }\n        isTapping = true;\n        setTimeout(() => {\n          isTapping = false;\n          void this.app.voiceover.stopVO();\n        }, 100);\n      });\n    }\n  }\n\n  public start(): void {\n    this._text.visible = true;\n    this._bg.visible = true;\n\n    gsap.killTweensOf([this._bg, this._text]);\n    this.animate({ alpha: this.plugin.options.backgroundAlpha, visible: true, duration: 0.2 }, this._bg);\n    this.animate({ alpha: 1, visible: true, duration: 0.2 }, this._text);\n  }\n\n  public stop(): void {\n    gsap.killTweensOf([this._bg, this._text]);\n    this.animate({ alpha: 0, visible: false, duration: 0.2 }, [this._bg, this._text]);\n  }\n\n  public lineBegin(line: CaptionLine): void {\n    let text = line.content\n      .replace(/<[^>]*>/gi, '') // remove html tags\n      .replace(/\\[.*]\\W*/gi, ''); // remove brackets\n    if (line.start === 0) {\n      text = text.charAt(0).toUpperCase() + text.slice(1);\n    }\n    this._text.text = text;\n    this.resize();\n  }\n\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  public lineEnd(_line: CaptionLine): void {}\n\n  public resize(): void {\n    const size = this.app.size;\n    const opts = this.plugin.options;\n\n    this._size.width = size.width;\n    this._size.height = size.height;\n\n    this._text.style.fontSize = this.fontSize * this.getSizeMultiplier();\n    this._text.style.wordWrapWidth = opts.maxWidth * 2;\n    this._text.scale.set(0.5);\n    this._text.position.set(this._size.width * 0.5, 0);\n\n    this._bg.position.set(this._size.width * 0.5, 0);\n\n    let h = this._text.height;\n    if (opts.padding.top) {\n      h += opts.padding.top;\n    }\n    if (opts.padding.bottom) {\n      h += opts.padding.bottom;\n    }\n    this._bg.height = h;\n\n    this._text.y += opts.padding.top;\n\n    if (opts.floating) {\n      let w = this._text.width;\n\n      if (opts.padding.left) {\n        w += opts.padding.left;\n      }\n      if (opts.padding.right) {\n        w += opts.padding.right;\n      }\n\n      this._bg.x += opts.padding.right * 0.5 - opts.padding.left * 0.5;\n      this._bg.width = w;\n    } else {\n      this._bg.width = size.width;\n    }\n\n    if (opts.position === 'top') {\n      this.position.set(-size.width * 0.5, Math.round(-size.height * 0.5));\n      if (opts.floating) {\n        this.position.y += Math.round(opts.distance - this._bg.y);\n      }\n    } else {\n      this.position.set(-size.width * 0.5, Math.round(size.height * 0.5 - this._bg.height));\n      if (opts.floating) {\n        this.position.y -= Math.round(opts.distance + this._bg.y);\n      }\n    }\n  }\n\n  updateSettings() {\n    if (this.plugin.options.enabled) {\n      this._text.style.fill = this.plugin.options.textColor;\n      this._bg.tint = this.plugin.options.backgroundColor;\n      if (this._bg.visible) {\n        this._bg.alpha = this.plugin.options.backgroundAlpha;\n        this.resize();\n      }\n    } else {\n      this.stop();\n      this._bg.visible = false;\n      this._text.visible = false;\n      this._bg.alpha = this._text.alpha = 0;\n    }\n  }\n\n  private getSizeMultiplier(): number {\n    return this.plugin.options.fontSizeMultiplier;\n  }\n}\n","import { Assets, Container, Ticker } from 'pixi.js';\nimport type { ImportListItem, ImportListItemModule, Padding, PointLike } from '../../utils';\nimport { ensurePadding, getDynamicModuleFromImportListItem, isDev, Logger } from '../../utils';\nimport type { IAudioInstance } from '../audio';\nimport type { IPlugin } from '../Plugin';\nimport { Plugin } from '../Plugin';\nimport type { ICaptionRenderer } from './CaptionsRenderer';\nimport { CaptionsRenderer } from './CaptionsRenderer';\n\nconst isDebug = isDev;\n\n/**\n * Type definition for i18n dictionary.\n */\ntype CaptionsDict = Record<string, any>;\n\n/**\n * Type definition for i18n import list item.\n */\ntype CaptionsImportListItem<T> = {\n  id: string;\n  namedExport?: string;\n  options?: any;\n  module?: ImportListItemModule<T>;\n} & {\n  json?: string;\n};\n\ntype CaptionRendererConstructor = new (owner: CaptionsPlugin) => ICaptionRenderer;\n\n/**\n * Type definition for i18n options.\n */\nexport type CaptionsOptions = {\n  renderer: CaptionRendererConstructor;\n  defaultLocale: string;\n  files: CaptionsImportListItem<CaptionsDict>[];\n  fontFile: string;\n  fontName: string;\n  fontSizeMultiplier: number;\n  maxWidth: number;\n  textColor: number;\n  backgroundColor: number;\n  backgroundAlpha: number;\n  enabled: boolean;\n  floating: boolean;\n  distance: number;\n  padding: Padding;\n  position: 'top' | 'bottom';\n};\n\n/**\n * Default options for i18n module.\n */\nconst defaultOptions: Partial<CaptionsOptions> = {\n  renderer: CaptionsRenderer,\n  defaultLocale: 'en',\n  fontFile: './caper/font/Sans.fnt',\n  fontName: 'Sans',\n  fontSizeMultiplier: 1,\n  maxWidth: 0.8,\n  textColor: 0xffffff,\n  backgroundColor: 0x0,\n  backgroundAlpha: 0.4,\n  enabled: true,\n  floating: false,\n  distance: 0,\n  padding: { top: 20, left: 0, bottom: 20, right: 0 },\n  position: 'top',\n};\n\nfunction resolveMaxWidth(value: number, appWidth: number) {\n  if (value <= 0) {\n    return 0;\n  }\n  if (value > 0 && value <= 1) {\n    return appWidth * value;\n  }\n  return value;\n}\n\n/**\n * Interface for i18n module.\n */\nexport interface ICaptionsPlugin extends IPlugin {\n  readonly locale: string;\n  view: Container;\n  enabled: boolean;\n  floating: boolean;\n  distance: number;\n  padding: Padding;\n  position: 'top' | 'bottom';\n  backgroundColor: number;\n  textColor: number;\n  backgroundAlpha: number;\n  fontSizeMultiplier: number;\n  maxWidth: number;\n  options: Partial<CaptionsOptions>;\n\n  setLocale(localeId: string): Promise<string>;\n\n  loadLocale(localeId: string): Promise<void>;\n\n  render(): void;\n}\n\n/**\n * i18n module class.\n */\nexport class CaptionsPlugin extends Plugin<CaptionsOptions> implements ICaptionsPlugin {\n  public readonly id = 'captions';\n  public view: Container = new Container();\n  public renderer: ICaptionRenderer;\n  private _dicts: Record<string, CaptionsDict> = {};\n  private _locales: string[];\n  private _activeCaptionLine = -1;\n  private _activeCaptionTime = 0;\n\n  private _locale: string;\n\n  /**\n   * Getter for locale.\n   */\n  get locale(): string {\n    return this._locale;\n  }\n\n  private _originalOptions: CaptionsOptions;\n\n  get options(): CaptionsOptions {\n    return this._options;\n  }\n\n  set options(value: Partial<CaptionsOptions>) {\n    this._options = { ...this._options, ...value };\n\n    if (value.padding) {\n      this._options.padding = ensurePadding(value.padding);\n    }\n  }\n\n  private _activeCaptionId?: string;\n\n  get activeCaptionId() {\n    return this._activeCaptionId;\n  }\n\n  private _paused: boolean = false;\n\n  get paused(): boolean {\n    return this._paused;\n  }\n\n  set paused(value: boolean) {\n    this._paused = value;\n  }\n\n  get floating(): boolean {\n    return this.options.floating;\n  }\n\n  set floating(value: boolean) {\n    this.options.floating = value;\n    this.updateRenderer();\n  }\n\n  public get enabled(): boolean {\n    return this.options.enabled;\n  }\n\n  set enabled(value: boolean) {\n    this.options.enabled = value;\n    if (this.enabled) {\n      this.view.visible = true;\n    } else {\n      this.view.visible = false;\n    }\n  }\n\n  public get position(): 'top' | 'bottom' {\n    return this.options.position;\n  }\n\n  public set position(value: 'top' | 'bottom') {\n    this.options.position = value;\n    this.renderer.updateSettings();\n  }\n\n  set backgroundColor(value: number) {\n    this.options.backgroundColor = value;\n    this.updateRenderer();\n  }\n\n  set textColor(value: number) {\n    this.options.textColor = value;\n    this.updateRenderer();\n  }\n\n  set backgroundAlpha(value: number) {\n    this.options.backgroundAlpha = value;\n    this.updateRenderer();\n  }\n\n  get padding(): Padding {\n    return this.options.padding;\n  }\n\n  set padding(value: Partial<Padding> | PointLike) {\n    this.options.padding = ensurePadding(value);\n    this.updateRenderer();\n  }\n\n  get distance(): number {\n    return this.options.distance;\n  }\n\n  set distance(value: number) {\n    this.options.distance = value;\n    this.updateRenderer();\n  }\n\n  public get fontSizeMultiplier(): number {\n    return this.options.fontSizeMultiplier;\n  }\n\n  public set fontSizeMultiplier(value: number) {\n    this.options.fontSizeMultiplier = value;\n    this.renderer.resize();\n  }\n\n  public get maxWidth(): number {\n    return this.options.maxWidth;\n  }\n\n  public set maxWidth(value: number) {\n    this.options.maxWidth = resolveMaxWidth(value, this.app.size.width);\n    this.renderer?.resize();\n  }\n\n  get list(): CaptionsDict {\n    return this._dicts[this._locale];\n  }\n\n  get debug(): boolean {\n    return isDebug;\n  }\n\n  /**\n   * Initializes the i18n module.\n   * sets the default locale and loads the locale files.\n   * @param _app\n   * @param options The i18n options.\n   * @returns Promise<void>\n   */\n  public async initialize(options: Partial<CaptionsOptions>): Promise<void> {\n    this._options = {\n      ...defaultOptions,\n      ...options,\n    } as CaptionsOptions;\n\n    this._originalOptions = { ...this._options };\n\n    if (options?.padding) {\n      this._options.padding = ensurePadding(options.padding);\n    }\n\n    this._locale = this.app.i18n.locale;\n    this._locales = this.app.i18n.locales;\n\n    if (this._options.fontFile) {\n      await Assets.load(this._options.fontFile);\n    }\n\n    if (this._options?.files?.length > 0) {\n      const files = this._options.files.filter((file) => this._locales.includes(file.id));\n      for (const file of files) {\n        await this.loadLocale(file.id);\n      }\n    }\n\n    this.addSignalConnection(this.app.onResize.connect(this.handleResize, 'highest'));\n  }\n\n  private handleResize() {\n    this.maxWidth = this._originalOptions.maxWidth;\n  }\n\n  public postInitialize(): void {\n    this.app.i18n.onLocaleChanged.connect(this._handleLocaleChange);\n    this.app.voiceover.onVoiceOverStart.connect(this._handleVoiceOverStart);\n    this.app.voiceover.onVoiceOverPaused.connect(this._handleVoiceOverPaused);\n    this.app.voiceover.onVoiceOverResumed.connect(this._handleVoiceOverResumed);\n    this.app.voiceover.onVoiceOverComplete.connect(this._handleVoiceoverComplete);\n    this.app.voiceover.onVoiceOverStopped.connect(this._handleVoiceoverStopped);\n\n    this.app.stage.addChild(this.view);\n    this._options.maxWidth = resolveMaxWidth(this._originalOptions.maxWidth, this.app.size.width);\n    const RendererClass: CaptionRendererConstructor = this.options.renderer;\n    this.renderer = this.view.addChild(new RendererClass(this)) as CaptionsRenderer;\n\n    this.app.ticker.add(this.update);\n    this.app.scenes.onSceneChangeStart.connect(this.stopAllCaptions);\n  }\n\n  /**\n   * Sets the locale.\n   * If the locale is not loaded, it will load it first.\n   * @param localeId The locale id to set.\n   * @returns Promise<string>\n   */\n  async setLocale(localeId: string) {\n    if (this._locale === localeId) {\n      return this._locale;\n    }\n    if (this._activeCaptionId) {\n      this.stopCaption(this._activeCaptionId);\n    }\n    this._activeCaptionId = undefined;\n    await this._loadAndSetLocale(localeId);\n    this._locale = localeId;\n    return this._locale;\n  }\n\n  /**\n   * Loads a locale.\n   * @param localeId The locale id to load.\n   * @returns Promise<void>\n   */\n  async loadLocale(localeId: string) {\n    if (this._locale === 'localeId') {\n      return;\n    }\n    const file = this._options.files.find((file) => localeId === file.id);\n    if (!file) {\n      Logger.error(`i18n:: Could not find locale file for ${localeId}`);\n      return;\n    }\n    this._dicts[localeId] = file.json\n      ? await Assets.load(file.json)\n      : await getDynamicModuleFromImportListItem(file as ImportListItem<CaptionsDict>);\n  }\n\n  render() {\n    this.renderer.resize();\n  }\n\n  update(ticker: Ticker): void {\n    if (this._paused) {\n      return;\n    }\n    const dt: number = ticker.deltaMS / 1000;\n    const id = this._activeCaptionId;\n    if (id) {\n      this._activeCaptionTime += dt;\n      const ms = this._activeCaptionTime * 1000;\n      const cc = this.list[id];\n      const n = cc.length;\n      for (let i = 0; i < n; i++) {\n        if (ms >= cc[i].start && ms < cc[i].end) {\n          if (this._activeCaptionLine !== i) {\n            this.playLine(id, i);\n          }\n          break;\n        }\n      }\n      if (ms >= cc[n - 1].end) {\n        this.playLine(id, -1);\n      }\n    }\n  }\n\n  public playCaption(id: string): void {\n    // remove extension from id\n    id = this._getId(id);\n    this.playLine(id, 0);\n  }\n\n  public stopCaption(id: string): void {\n    // remove extension from id\n    id = this._getId(id);\n    if (this._activeCaptionId === id) {\n      this.playLine(id, -1);\n    }\n  }\n\n  public stopAllCaptions(): void {\n    this.renderer?.stop();\n    this._activeCaptionId = undefined;\n    this._activeCaptionLine = -1;\n  }\n\n  private _getId(id: string) {\n    return id.replace(/\\.[^/.]+$/, '');\n  }\n\n  private updateRenderer() {\n    if (!this.enabled) {\n      return;\n    }\n    this.renderer.updateSettings();\n  }\n\n  private _handleLocaleChange() {\n    void this.setLocale(this.app.i18n.locale);\n  }\n\n  private _handleVoiceOverStart(vo: IAudioInstance) {\n    this.playCaption(vo.id);\n  }\n\n  private _handleVoiceOverPaused() {\n    this.paused = true;\n  }\n\n  private _handleVoiceOverResumed() {\n    this.paused = false;\n  }\n\n  private _handleVoiceoverComplete(vo: IAudioInstance) {\n    const id = this._getId(vo?.id || '');\n    if (this._activeCaptionId === id) {\n      this.stopCaption(id);\n    }\n  }\n\n  private _handleVoiceoverStopped() {\n    this.stopAllCaptions();\n  }\n\n  /**\n   * Loads and sets a locale.\n   * If the locale is not loaded, it will load it first.\n   * @param localeId The locale id to load and set.\n   */\n  private async _loadAndSetLocale(localeId: string) {\n    if (!this._dicts[localeId]) {\n      await this.loadLocale(localeId);\n    }\n  }\n\n  private playLine(id: string, index: number) {\n    const cc = this.list[id];\n    const line = cc ? cc[index] : undefined;\n    if (line) {\n      if (this._activeCaptionId !== id) {\n        this._activeCaptionId = id;\n        this._activeCaptionTime = 0;\n        this._activeCaptionLine = -1;\n        this.renderer?.start();\n      }\n      if (this._activeCaptionLine !== index) {\n        this._activeCaptionLine = index;\n        this.renderer?.lineBegin({\n          id: this._activeCaptionId,\n          ...cc[index],\n        });\n      }\n    } else if (this._activeCaptionId === id && cc) {\n      this.renderer?.lineEnd({\n        id: this._activeCaptionId,\n        ...cc[this._activeCaptionLine],\n      });\n      this.renderer?.stop();\n      this._activeCaptionId = undefined;\n      this._activeCaptionLine = -1;\n    }\n  }\n}\n"],"mappings":"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"}