Timeline

Timeline components.

interface ElementTimelineClipArgs 
extends WithVisibility {
  clipId: string
  element?: TimelineClipElement
  frame: number
  frames: number
  label: string
  sizeHeight: number
  sizeWidth: number
  trackIndex: number
  visibility: boolean
}

type ElementTimelineClipFunction = (args: ElementTimelineClipArgs) => Promise<DataOrError<TimelineClipElement>>

interface ElementTimelineFrameArgs 
extends WithVisibility {
  changed: number
  clipId: string
  element?: TimelineFrameElement
  frame: number
  visibility: boolean
}

type ElementTimelineFrameFunction = (args: ElementTimelineFrameArgs) => Promise<DataOrError<TimelineFrameElement>>

interface ElementTimelineIconArgs  {
  dense: boolean
  element?: TimelineIconElement
  trackIndex: number
}

type ElementTimelineIconFunction = (args: ElementTimelineIconArgs) => Promise<DataOrError<TimelineIconElement>>

interface ElementTimelinePreviewArgs  {
  changed: number
  clipId: string
  element?: TimelinePreviewElement
}

type ElementTimelinePreviewFunction = (args: ElementTimelinePreviewArgs) => Promise<DataOrError<TimelinePreviewElement>>

interface ElementTimelineTrackArgs 
extends WithVisibility {
  element?: TimelineTrackElement
  trackIndex: number
  visibility: boolean
}

type ElementTimelineTrackFunction = (args: ElementTimelineTrackArgs) => Promise<DataOrError<TimelineTrackElement>>

type TimelineFrameTuple = ArrayOf2<string, DataOrError<TimelineFrameElement>>

/**
 * @implements DropHandled
 * @implements HeadHandled
 * @implements Handled
 */
class TimelineClipElement
extends LoaderElementBase {
  connectHandlers: (mediaMasher: MediaMasherNode) => void
  connectedCallback: () => void
  cssBorderBoxSizing: CSSResult
  cssHostDropping: CSSResult
  cssHostFlex: CSSResult
  defaultContent: () => OptionalContent
  disconnectHandlers: () => void
  disconnectedCallback: () => void
  drop: (dataTransfer: DataTransfer, clientX: number) => void
  dropValid: (dataTransfer: DataTransfer) => boolean
  head: OptionalContent
  iconIds: Strings
  label?: string
  mediaMasher: MediaMasherNode
  pluginsNeeded: Array<PluginId>
  properties: PropertyDeclarations
  signals: SignalsRecord
  styles: CSSResult
  subscribe: (handler: SignalFunction, arg: string | SignalId | PropertyObject, name?: string, type?: string) => Signal
  templateContent: (contents: TemplateContents) => TemplateContent
  trimming: undefined | TrimClickInfo
  unsubscribe: (arg: string | SignalId | PropertyObject, name?: string, type?: string) => void
  variable: (name: string) => number
  variableSet: (nameOrSignal: Signal | string, value?: Scalar, suffix?: string) => void
  variableString: (name: string) => string
  visibility: boolean
}

/**
 * @implements SizeHandled
 * @implements VisibilityHandled
 * @implements DropHandled
 */
class TimelineContentCenterElement
extends ScrollerElementBase {
  connectedCallback: () => void
  cssBorderBoxSizing: CSSResult
  cssHostDropping: CSSResult
  cssHostFlex: CSSResult
  defaultContent: () => OptionalContent
  disconnectedCallback: () => void
  drop: (dataTransfer: DataTransfer, clientX: number) => void
  dropValid: (dataTransfer: DataTransfer) => boolean
  handlePointerDown: (event: Event) => void
  mediaMasher: MediaMasherNode
  pluginsNeeded: Array<PluginId>
  properties: PropertyDeclarations
  signals: SignalsRecord
  sizeById: Record<string, Size>
  styles: CSSResult
  subscribe: (handler: SignalFunction, arg: string | SignalId | PropertyObject, name?: string, type?: string) => Signal
  templateContent: (contents: TemplateContents) => TemplateContent
  unsubscribe: (arg: string | SignalId | PropertyObject, name?: string, type?: string) => void
  variable: (name: string) => number
  variableSet: (nameOrSignal: Signal | string, value?: Scalar, suffix?: string) => void
  variableString: (name: string) => string
  visibilityById: Record<string, boolean>
}

class TimelineContentElement
extends ContentElementBase {
  chromeCss: CSSResult
  connectedCallback: () => void
  contentCss: CSSResult
  cssBorderBoxSizing: CSSResult
  cssHostDropping: CSSResult
  cssHostFlex: CSSResult
  cssShared: CSSResult
  defaultContent: () => OptionalContent
  disconnectedCallback: () => void
  partContent: (part: string, slots: Array<Element>) => OptionalContent
  partSeparator: string
  pluginsNeeded: Array<PluginId>
  properties: PropertyDeclarations
  refreshParts: () => string
  signals: SignalsRecord
  styles: CSSResult
  subscribe: (handler: SignalFunction, arg: string | SignalId | PropertyObject, name?: string, type?: string) => Signal
  templateContent: (contents: TemplateContents) => TemplateContent
  unsubscribe: (arg: string | SignalId | PropertyObject, name?: string, type?: string) => void
  variable: (name: string) => number
  variableSet: (nameOrSignal: Signal | string, value?: Scalar, suffix?: string) => void
  variableString: (name: string) => string
}

class TimelineElement
extends PanelElementBase {
  connectedCallback: () => void
  contentContent: (slots: Array<Element>) => OptionalContent
  cssBorderBoxSizing: CSSResult
  cssHostDropping: CSSResult
  cssHostFlex: CSSResult
  defaultContent: () => OptionalContent
  disconnectedCallback: () => void
  footerContent: (slots: Array<Element>) => OptionalContent
  handleCssSignal: (signal: Signal) => void
  handleGetScalar: (event: Event) => void
  handleSignalIds: (event: Event) => void
  headerContent: (slots: Array<Element>) => OptionalContent
  partContent: (part: string, slots: Array<Element>) => OptionalContent
  partSeparator: string
  pluginsNeeded: Array<PluginId>
  properties: PropertyDeclarations
  refreshParts: () => string
  signals: SignalsRecord
  styles: CSSResult
  subscribe: (handler: SignalFunction, arg: string | SignalId | PropertyObject, name?: string, type?: string) => Signal
  target: string
  templateContent: (contents: TemplateContents) => TemplateContent
  unsubscribe: (arg: string | SignalId | PropertyObject, name?: string, type?: string) => void
  variable: (name: string) => number
  variableSet: (nameOrSignal: Signal | string, value?: Scalar, suffix?: string) => void
  variableString: (name: string) => string
}

class TimelineFooterElement
extends FooterElementBase {
  chromeCss: CSSResult
  connectedCallback: () => void
  contentCss: CSSResult
  cssBorderBoxSizing: CSSResult
  cssHostDropping: CSSResult
  cssHostFlex: CSSResult
  cssShared: CSSResult
  defaultContent: () => OptionalContent
  disconnectedCallback: () => void
  partContent: (part: string, slots: Array<Element>) => OptionalContent
  partSeparator: string
  pluginsNeeded: Array<PluginId>
  properties: PropertyDeclarations
  refreshParts: () => string
  signals: SignalsRecord
  styles: CSSResult
  subscribe: (handler: SignalFunction, arg: string | SignalId | PropertyObject, name?: string, type?: string) => Signal
  templateContent: (contents: TemplateContents) => TemplateContent
  unsubscribe: (arg: string | SignalId | PropertyObject, name?: string, type?: string) => void
  variable: (name: string) => number
  variableSet: (nameOrSignal: Signal | string, value?: Scalar, suffix?: string) => void
  variableString: (name: string) => string
}

/** @implements Handled */
class TimelineFrameElement
extends ElementBase {
  clip: () => ClientClip | undefined
  connectHandlers: (mediaMasher: MediaMasherNode) => void
  connectedCallback: () => void
  cssBorderBoxSizing: CSSResult
  cssHostDropping: CSSResult
  cssHostFlex: CSSResult
  defaultContent: () => OptionalContent
  disconnectHandlers: () => void
  disconnectedCallback: () => void
  frameSize: Size
  mediaMasher: MediaMasherNode
  pluginsNeeded: Array<PluginId>
  previewBorder: () => number
  previewPromise: undefined | Promise<void>
  previewsPromise: () => Promise<DataOrError<Element>>
  properties: PropertyDeclarations
  refreshPreview: () => void
  signals: SignalsRecord
  styles: CSSResult
  subscribe: (handler: SignalFunction, arg: string | SignalId | PropertyObject, name?: string, type?: string) => Signal
  templateContent: (contents: TemplateContents) => TemplateContent
  unsubscribe: (arg: string | SignalId | PropertyObject, name?: string, type?: string) => void
  variable: (name: string) => number
  variableSet: (nameOrSignal: Signal | string, value?: Scalar, suffix?: string) => void
  variableString: (name: string) => string
}

class TimelineHeaderElement
extends HeaderElementBase {
  chromeCss: CSSResult
  clip: () => ClientClip | undefined
  connectedCallback: () => void
  contentCss: CSSResult
  cssBorderBoxSizing: CSSResult
  cssHostDropping: CSSResult
  cssHostFlex: CSSResult
  cssShared: CSSResult
  defaultContent: () => OptionalContent
  disabledSplitState: () => boolean
  disconnectedCallback: () => void
  frame: () => number
  partContent: (part: string, slots: Array<Element>) => OptionalContent
  partSeparator: string
  pluginsNeeded: Array<PluginId>
  properties: PropertyDeclarations
  refreshParts: () => string
  signals: SignalsRecord
  splitScalars: (instance: Instance, targetId: string, frame?: number) => ScalarRecord
  styles: CSSResult
  subscribe: (handler: SignalFunction, arg: string | SignalId | PropertyObject, name?: string, type?: string) => Signal
  templateContent: (contents: TemplateContents) => TemplateContent
  unsubscribe: (arg: string | SignalId | PropertyObject, name?: string, type?: string) => void
  variable: (name: string) => number
  variableSet: (nameOrSignal: Signal | string, value?: Scalar, suffix?: string) => void
  variableString: (name: string) => string
}

/** @implements DropHandled */
class TimelineIconElement
extends LoaderElementBase {
  connectedCallback: () => void
  cssBorderBoxSizing: CSSResult
  cssHostDropping: CSSResult
  cssHostFlex: CSSResult
  defaultContent: () => OptionalContent
  disconnectedCallback: () => void
  drop: (dataTransfer: DataTransfer, clientX: number) => void
  dropValid: (dataTransfer: DataTransfer) => boolean
  pluginsNeeded: Array<PluginId>
  properties: PropertyDeclarations
  signals: SignalsRecord
  styles: CSSResult
  subscribe: (handler: SignalFunction, arg: string | SignalId | PropertyObject, name?: string, type?: string) => Signal
  templateContent: (contents: TemplateContents) => TemplateContent
  unsubscribe: (arg: string | SignalId | PropertyObject, name?: string, type?: string) => void
  variable: (name: string) => number
  variableSet: (nameOrSignal: Signal | string, value?: Scalar, suffix?: string) => void
  variableString: (name: string) => string
}

/**
 * @implements VisibilityHandled
 * @implements Handled
 */
class TimelinePreviewElement
extends ElementBase {
  connectHandlers: (mediaMasher: MediaMasherNode) => void
  connectedCallback: () => void
  cssBorderBoxSizing: CSSResult
  cssHostDropping: CSSResult
  cssHostFlex: CSSResult
  defaultContent: () => OptionalContent
  disconnectHandlers: () => void
  disconnectedCallback: () => void
  hasWaveform: () => boolean
  mediaMasher: MediaMasherNode
  pluginsNeeded: Array<PluginId>
  properties: PropertyDeclarations
  signals: SignalsRecord
  styles: CSSResult
  subscribe: (handler: SignalFunction, arg: string | SignalId | PropertyObject, name?: string, type?: string) => Signal
  templateContent: (contents: TemplateContents) => TemplateContent
  unsubscribe: (arg: string | SignalId | PropertyObject, name?: string, type?: string) => void
  variable: (name: string) => number
  variableSet: (nameOrSignal: Signal | string, value?: Scalar, suffix?: string) => void
  variableString: (name: string) => string
  visibilityById: Record<string, boolean>
}

/**
 * @implements SizeHandled
 * @implements VisibilityHandled
 * @implements DropHandled
 * @implements Handled
 */
class TimelineTrackElement
extends LoaderElementBase {
  connectHandlers: (mediaMasher: MediaMasherNode) => void
  connectedCallback: () => void
  cssBorderBoxSizing: CSSResult
  cssHostDropping: CSSResult
  cssHostFlex: CSSResult
  defaultContent: () => OptionalContent
  disconnectHandlers: () => void
  disconnectedCallback: () => void
  drop: (dataTransfer: DataTransfer, clientX: number) => void
  dropValid: (dataTransfer: DataTransfer) => boolean
  mediaMasher: MediaMasherNode
  pluginsNeeded: Array<PluginId>
  properties: PropertyDeclarations
  signals: SignalsRecord
  sizeById: Record<string, Size>
  styles: CSSResult
  subscribe: (handler: SignalFunction, arg: string | SignalId | PropertyObject, name?: string, type?: string) => Signal
  templateContent: (contents: TemplateContents) => TemplateContent
  unsubscribe: (arg: string | SignalId | PropertyObject, name?: string, type?: string) => void
  variable: (name: string) => number
  variableSet: (nameOrSignal: Signal | string, value?: Scalar, suffix?: string) => void
  variableString: (name: string) => string
  visibilityById: Record<string, boolean>
}