refactor(core): [CORE-21] generate compatible public and editor declarations

packages/artplayer/public/component.ts

@@ -0,0 +1,143 @@
+import type Artplayer from './artplayer'
+
+/** Input accepted by the existing HTML renderer, including numeric content. */
+export interface ComponentInput extends Omit<ComponentOption, 'html'> {
+  html?: string | HTMLElement | number
+}
+
+export interface Selector {
+  /**
+   * Whether the default is selected
+   */
+  default?: boolean
+
+  /**
+   * Html string of selector
+   */
+  html: string | HTMLElement
+
+  /**
+   * Value of selector item
+   */
+  value?: string | number
+
+  /**
+   * Allow custom properties
+   */
+  [key: string]: any
+}
+
+export interface Component {
+  /**
+   * Component self-increasing id
+   */
+  readonly id: number
+
+  /**
+   * Component parent name
+   */
+  readonly name: string | undefined
+
+  /**
+   * Component parent element
+   */
+  readonly $parent: HTMLElement | undefined
+
+  /**
+   * Whether to show component parent
+   */
+  get show(): boolean
+
+  /**
+   * Whether to show component parent
+   */
+  set show(state: boolean)
+
+  /**
+   * Toggle the component parent
+   */
+  toggle: () => void
+
+  /**
+   * Dynamic add a component
+   */
+  add: {
+    (option: ComponentOption | ((art: Artplayer) => ComponentOption)): HTMLElement | undefined
+    (option: ComponentInput | ((art: Artplayer) => ComponentInput)): HTMLElement | undefined
+  }
+
+  /**
+   * Dynamic remove a component by name
+   */
+  remove: (name: string) => void
+
+  /**
+   * Dynamic update a component
+   */
+  update: {
+    (option: ComponentOption): HTMLElement | undefined
+    (option: ComponentInput): HTMLElement | undefined
+  }
+}
+
+export interface ComponentOption {
+  /**
+   * Html string or html element of component
+   */
+  html?: string | HTMLElement
+
+  /**
+   * Whether to disable component
+   */
+  disable?: boolean
+
+  /**
+   * Unique name for component
+   */
+  name?: string
+
+  /**
+   * Component sort index
+   */
+  index?: number
+
+  /**
+   * Component style object
+   */
+  style?: Partial<CSSStyleDeclaration>
+
+  /**
+   * Component click event
+   */
+  click?: (this: Artplayer, component: Component, event: Event) => void
+
+  /**
+   * When the component was mounted
+   */
+  mounted?: (this: Artplayer, element: HTMLElement) => void
+
+  /**
+   * When the component was before unmount
+   */
+  beforeUnmount?: (this: Artplayer, element: HTMLElement) => void
+
+  /**
+   * Component tooltip, use in controls
+   */
+  tooltip?: string
+
+  /**
+   * Component position, use in controls
+   */
+  position?: 'top' | 'left' | 'right' | (string & Record<never, never>)
+
+  /**
+   * Custom selector list, use in controls
+   */
+  selector?: Selector[]
+
+  /**
+   * When selector item click, use in controls
+   */
+  onSelect?: (this: Artplayer, selector: Selector, element: HTMLElement, event: Event) => void
+}