refactor(core): CORE-13 type component registries and own control lifetimes

test/types/components.ts

@@ -0,0 +1,22 @@
+import type { ComponentHost } from '../../packages/artplayer/src/component/types'
+import type { ControlHost } from '../../packages/artplayer/src/control/types'
+import Control from '../../packages/artplayer/src/control'
+import Component from '../../packages/artplayer/src/utils/component'
+
+declare const host: ComponentHost & { extra: number }
+const component = new Component(host)
+const added: HTMLDivElement | undefined = component.add({ html: 42, mounted(element) {
+  const extra: number = this.extra
+  const div: HTMLDivElement = element
+  void [extra, div]
+} })
+const updated: HTMLDivElement | undefined = component.update({ name: 'entry', html: 'new' })
+declare const controlHost: ControlHost
+const control = new Control(controlHost)
+const empty: undefined = control.add({ position: 'right', html: 'entry' })
+const alsoEmpty: undefined = control.update({ name: 'entry', html: 'new' })
+// @ts-expect-error Control.add has always returned undefined at runtime.
+const invented: HTMLDivElement = control.add({ position: 'left', html: 'entry' })
+// @ts-expect-error Component indexes are numbers.
+component.add({ index: 'first' })
+void [added, updated, empty, alsoEmpty, invented]