Kibo UI
Grid

Video Player

A composable, shadcn/ui styled video player component that uses the media-chrome library.

Powered by

Installation

npx kibo-ui@latest add video-player

Features

  • Customizable media player controls
  • Responsive design that works across devices
  • Keyboard accessibility for media controls
  • Support for various media formats
  • Themeable with CSS variables
  • Lightweight and performant
  • Modular architecture allowing use of only needed components
  • Time display with customizable format
  • Volume controls with mute functionality
  • Playback controls (play/pause, seek forward/backward)
  • Progress bar with interactive seeking
  • Cross-browser compatibility

Props

The video player is made up of the following props:

VideoPlayer

The VideoPlayer component is used to control the video player.

PropTypeDefault
key?
Key | null
-
ref?
Ref<MediaController>
-
userInteractive?
boolean
-
autohideOverControls?
boolean
-
noAutohide?
boolean
-
keyboardControl?
boolean
-
gesturesDisabled?
boolean
-
audio?
boolean
-
breakpoints?
string
-
autohide?
string
-
handleEvent?
((event: Event) => void)
-
handleMediaUpdated?
((media: HTMLMediaElement) => Promise<void>)
-
media?
HTMLVideoElement | null
-
breakpointsComputed?
boolean
-
keyboardShortcutHandler?
((e: KeyboardEvent) => void)
-
hotkeys?
string
-
disableHotkeys?
(() => void)
-
enableHotkeys?
(() => void)
-
unregisterMediaStateReceiver?
((el: HTMLElement) => void)
-
registerMediaStateReceiver?
((el: HTMLElement) => void)
-
unassociateElement?
((element: HTMLElement) => void)
-
associateElement?
((element: HTMLElement) => void)
-
propagateMediaState?
((stateName: string, state: any) => void)
-
mediaUnsetCallback?
((media: HTMLMediaElement) => void)
-
mediaSetCallback?
((media: HTMLMediaElement) => void)
-
noDefaultStore?
boolean
-
noSubtitlesLangPref?
boolean
-
noVolumePref?
boolean
-
noAutoSeekToLive?
boolean
-
liveEdgeOffset?
number
-
keysUsed?
string
-
noHotkeys?
boolean
-
defaultDuration?
number
-
defaultStreamType?
string
-
defaultSubtitles?
boolean
-
fullscreenElement?
HTMLElement
-
mediaStore?
MediaStore
-
associatedElementSubscriptions?
Map<HTMLElement, () => void>
-
mediaStateReceivers?
HTMLElement[]
-
onTransitionStartCapture?
TransitionEventHandler<MediaController>
-
onTransitionStart?
TransitionEventHandler<MediaController>
-
onTransitionRunCapture?
TransitionEventHandler<MediaController>
-
onTransitionRun?
TransitionEventHandler<MediaController>
-
onTransitionEndCapture?
TransitionEventHandler<MediaController>
-
onTransitionEnd?
TransitionEventHandler<MediaController>
-
onTransitionCancelCapture?
TransitionEventHandler<MediaController>
-
onTransitionCancel?
TransitionEventHandler<MediaController>
-
onBeforeToggle?
ToggleEventHandler<MediaController>
-
onToggle?
ToggleEventHandler<MediaController>
-
onAnimationIterationCapture?
AnimationEventHandler<MediaController>
-
onAnimationIteration?
AnimationEventHandler<MediaController>
-
onAnimationEndCapture?
AnimationEventHandler<MediaController>
-
onAnimationEnd?
AnimationEventHandler<MediaController>
-
onAnimationStartCapture?
AnimationEventHandler<MediaController>
-
onAnimationStart?
AnimationEventHandler<MediaController>
-
onWheelCapture?
WheelEventHandler<MediaController>
-
onWheel?
WheelEventHandler<MediaController>
-
onScrollEndCapture?
UIEventHandler<MediaController>
-
onScrollEnd?
UIEventHandler<MediaController>
-
onScrollCapture?
UIEventHandler<MediaController>
-
onScroll?
UIEventHandler<MediaController>
-
onLostPointerCaptureCapture?
PointerEventHandler<MediaController>
-
onLostPointerCapture?
PointerEventHandler<MediaController>
-
onGotPointerCaptureCapture?
PointerEventHandler<MediaController>
-
onGotPointerCapture?
PointerEventHandler<MediaController>
-
onPointerOutCapture?
PointerEventHandler<MediaController>
-
onPointerOut?
PointerEventHandler<MediaController>
-
onPointerOverCapture?
PointerEventHandler<MediaController>
-
onPointerOver?
PointerEventHandler<MediaController>
-
onPointerLeave?
PointerEventHandler<MediaController>
-
onPointerEnter?
PointerEventHandler<MediaController>
-
onPointerCancelCapture?
PointerEventHandler<MediaController>
-
onPointerCancel?
PointerEventHandler<MediaController>
-
onPointerUpCapture?
PointerEventHandler<MediaController>
-
onPointerUp?
PointerEventHandler<MediaController>
-
onPointerMoveCapture?
PointerEventHandler<MediaController>
-
onPointerMove?
PointerEventHandler<MediaController>
-
onPointerDownCapture?
PointerEventHandler<MediaController>
-
onPointerDown?
PointerEventHandler<MediaController>
-
onTouchStartCapture?
TouchEventHandler<MediaController>
-
onTouchStart?
TouchEventHandler<MediaController>
-
onTouchMoveCapture?
TouchEventHandler<MediaController>
-
onTouchMove?
TouchEventHandler<MediaController>
-
onTouchEndCapture?
TouchEventHandler<MediaController>
-
onTouchEnd?
TouchEventHandler<MediaController>
-
onTouchCancelCapture?
TouchEventHandler<MediaController>
-
onTouchCancel?
TouchEventHandler<MediaController>
-
onSelectCapture?
ReactEventHandler<MediaController>
-
onSelect?
ReactEventHandler<MediaController>
-
onMouseUpCapture?
MouseEventHandler<MediaController>
-
onMouseUp?
MouseEventHandler<MediaController>
-
onMouseOverCapture?
MouseEventHandler<MediaController>
-
onMouseOver?
MouseEventHandler<MediaController>
-
onMouseOutCapture?
MouseEventHandler<MediaController>
-
onMouseOut?
MouseEventHandler<MediaController>
-
onMouseMoveCapture?
MouseEventHandler<MediaController>
-
onMouseMove?
MouseEventHandler<MediaController>
-
onMouseLeave?
MouseEventHandler<MediaController>
-
onMouseEnter?
MouseEventHandler<MediaController>
-
onMouseDownCapture?
MouseEventHandler<MediaController>
-
onMouseDown?
MouseEventHandler<MediaController>
-
onDropCapture?
DragEventHandler<MediaController>
-
onDrop?
DragEventHandler<MediaController>
-
onDragStartCapture?
DragEventHandler<MediaController>
-
onDragStart?
DragEventHandler<MediaController>
-
onDragOverCapture?
DragEventHandler<MediaController>
-
onDragOver?
DragEventHandler<MediaController>
-
onDragLeaveCapture?
DragEventHandler<MediaController>
-
onDragLeave?
DragEventHandler<MediaController>
-
onDragExitCapture?
DragEventHandler<MediaController>
-
onDragExit?
DragEventHandler<MediaController>
-
onDragEnterCapture?
DragEventHandler<MediaController>
-
onDragEnter?
DragEventHandler<MediaController>
-
onDragEndCapture?
DragEventHandler<MediaController>
-
onDragEnd?
DragEventHandler<MediaController>
-
onDragCapture?
DragEventHandler<MediaController>
-
onDrag?
DragEventHandler<MediaController>
-
onDoubleClickCapture?
MouseEventHandler<MediaController>
-
onDoubleClick?
MouseEventHandler<MediaController>
-
onContextMenuCapture?
MouseEventHandler<MediaController>
-
onContextMenu?
MouseEventHandler<MediaController>
-
onClickCapture?
MouseEventHandler<MediaController>
-
onClick?
MouseEventHandler<MediaController>
-
onAuxClickCapture?
MouseEventHandler<MediaController>
-
onAuxClick?
MouseEventHandler<MediaController>
-
onWaitingCapture?
ReactEventHandler<MediaController>
-
onWaiting?
ReactEventHandler<MediaController>
-
onVolumeChangeCapture?
ReactEventHandler<MediaController>
-
onVolumeChange?
ReactEventHandler<MediaController>
-
onTimeUpdateCapture?
ReactEventHandler<MediaController>
-
onTimeUpdate?
ReactEventHandler<MediaController>
-
onSuspendCapture?
ReactEventHandler<MediaController>
-
onSuspend?
ReactEventHandler<MediaController>
-
onStalledCapture?
ReactEventHandler<MediaController>
-
onStalled?
ReactEventHandler<MediaController>
-
onSeekingCapture?
ReactEventHandler<MediaController>
-
onSeeking?
ReactEventHandler<MediaController>
-
onSeekedCapture?
ReactEventHandler<MediaController>
-
onSeeked?
ReactEventHandler<MediaController>
-
onResizeCapture?
ReactEventHandler<MediaController>
-
onResize?
ReactEventHandler<MediaController>
-
onRateChangeCapture?
ReactEventHandler<MediaController>
-
onRateChange?
ReactEventHandler<MediaController>
-
onProgressCapture?
ReactEventHandler<MediaController>
-
onProgress?
ReactEventHandler<MediaController>
-
onPlayingCapture?
ReactEventHandler<MediaController>
-
onPlaying?
ReactEventHandler<MediaController>
-
onPlayCapture?
ReactEventHandler<MediaController>
-
onPlay?
ReactEventHandler<MediaController>
-
onPauseCapture?
ReactEventHandler<MediaController>
-
onPause?
ReactEventHandler<MediaController>
-
onLoadStartCapture?
ReactEventHandler<MediaController>
-
onLoadStart?
ReactEventHandler<MediaController>
-
onLoadedMetadataCapture?
ReactEventHandler<MediaController>
-
onLoadedMetadata?
ReactEventHandler<MediaController>
-
onLoadedDataCapture?
ReactEventHandler<MediaController>
-
onLoadedData?
ReactEventHandler<MediaController>
-
onEndedCapture?
ReactEventHandler<MediaController>
-
onEnded?
ReactEventHandler<MediaController>
-
onEncryptedCapture?
ReactEventHandler<MediaController>
-
onEncrypted?
ReactEventHandler<MediaController>
-
onEmptiedCapture?
ReactEventHandler<MediaController>
-
onEmptied?
ReactEventHandler<MediaController>
-
onDurationChangeCapture?
ReactEventHandler<MediaController>
-
onDurationChange?
ReactEventHandler<MediaController>
-
onCanPlayThroughCapture?
ReactEventHandler<MediaController>
-
onCanPlayThrough?
ReactEventHandler<MediaController>
-
onCanPlayCapture?
ReactEventHandler<MediaController>
-
onCanPlay?
ReactEventHandler<MediaController>
-
onAbortCapture?
ReactEventHandler<MediaController>
-
onAbort?
ReactEventHandler<MediaController>
-
onKeyUpCapture?
KeyboardEventHandler<MediaController>
-
onKeyUp?
KeyboardEventHandler<MediaController>
-
onKeyDownCapture?
KeyboardEventHandler<MediaController>
-
onKeyDown?
KeyboardEventHandler<MediaController>
-
onErrorCapture?
ReactEventHandler<MediaController>
-
onError?
ReactEventHandler<MediaController>
-
onLoadCapture?
ReactEventHandler<MediaController>
-
onLoad?
ReactEventHandler<MediaController>
-
onInvalidCapture?
FormEventHandler<MediaController>
-
onInvalid?
FormEventHandler<MediaController>
-
onSubmitCapture?
FormEventHandler<MediaController>
-
onSubmit?
FormEventHandler<MediaController>
-
onResetCapture?
FormEventHandler<MediaController>
-
onReset?
FormEventHandler<MediaController>
-
onInputCapture?
FormEventHandler<MediaController>
-
onInput?
FormEventHandler<MediaController>
-
onBeforeInputCapture?
FormEventHandler<MediaController>
-
onBeforeInput?
FormEventHandler<MediaController>
-
onChangeCapture?
FormEventHandler<MediaController>
-
onChange?
FormEventHandler<MediaController>
-
onBlurCapture?
FocusEventHandler<MediaController>
-
onBlur?
FocusEventHandler<MediaController>
-
onFocusCapture?
FocusEventHandler<MediaController>
-
onFocus?
FocusEventHandler<MediaController>
-
onCompositionUpdateCapture?
CompositionEventHandler<MediaController>
-
onCompositionUpdate?
CompositionEventHandler<MediaController>
-
onCompositionStartCapture?
CompositionEventHandler<MediaController>
-
onCompositionStart?
CompositionEventHandler<MediaController>
-
onCompositionEndCapture?
CompositionEventHandler<MediaController>
-
onCompositionEnd?
CompositionEventHandler<MediaController>
-
onPasteCapture?
ClipboardEventHandler<MediaController>
-
onPaste?
ClipboardEventHandler<MediaController>
-
onCutCapture?
ClipboardEventHandler<MediaController>
-
onCut?
ClipboardEventHandler<MediaController>
-
onCopyCapture?
ClipboardEventHandler<MediaController>
-
onCopy?
ClipboardEventHandler<MediaController>
-
dangerouslySetInnerHTML?
{ __html: string | TrustedHTML; }
-
aria-valuetext?
string
-
aria-valuenow?
number
-
aria-valuemin?
number
-
aria-valuemax?
number
-
aria-sort?
"none" | "ascending" | "descending" | "other"
-
aria-setsize?
number
-
aria-selected?
Booleanish
-
aria-rowspan?
number
-
aria-rowindextext?
string
-
aria-rowindex?
number
-
aria-rowcount?
number
-
aria-roledescription?
string
-
aria-required?
Booleanish
-
aria-relevant?
"text" | "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals"
-
aria-readonly?
Booleanish
-
aria-pressed?
boolean | "true" | "false" | "mixed"
-
aria-posinset?
number
-
aria-placeholder?
string
-
aria-owns?
string
-
aria-orientation?
"horizontal" | "vertical"
-
aria-multiselectable?
Booleanish
-
aria-multiline?
Booleanish
-
aria-modal?
Booleanish
-
aria-live?
"off" | "assertive" | "polite"
-
aria-level?
number
-
aria-labelledby?
string
-
aria-label?
string
-
aria-keyshortcuts?
string
-
aria-invalid?
boolean | "true" | "false" | "grammar" | "spelling"
-
aria-hidden?
Booleanish
-
aria-haspopup?
boolean | "true" | "false" | "dialog" | "grid" | "listbox" | "menu" | "tree"
-
aria-flowto?
string
-
aria-expanded?
Booleanish
-
aria-errormessage?
string
-
aria-disabled?
Booleanish
-
aria-details?
string
-
aria-description?
string
-
aria-describedby?
string
-
aria-current?
boolean | "true" | "false" | "page" | "step" | "location" | "date" | "time"
-
aria-controls?
string
-
aria-colspan?
number
-
aria-colindextext?
string
-
aria-colindex?
number
-
aria-colcount?
number
-
aria-checked?
boolean | "true" | "false" | "mixed"
-
aria-busy?
Booleanish
-
aria-brailleroledescription?
string
-
aria-braillelabel?
string
-
aria-autocomplete?
"list" | "none" | "inline" | "both"
-
aria-atomic?
Booleanish
-
aria-activedescendant?
string
-
exportparts?
string
-
is?
string
-
popoverTarget?
string
-
popoverTargetAction?
"toggle" | "show" | "hide"
-
unselectable?
"off" | "on"
-
security?
string
-
results?
number
-
itemRef?
string
-
itemID?
string
-
itemType?
string
-
itemScope?
boolean
-
itemProp?
string
-
color?
string
-
autoSave?
string
-
autoCorrect?
string
-
vocab?
string
-
typeof?
string
-
rev?
string
-
resource?
string
-
rel?
string
-
property?
string
-
inlist?
any
-
datatype?
string
-
content?
string
-
about?
string
-
radioGroup?
string
-
spellCheck?
Booleanish
-
contextMenu?
string
-
autoFocus?
boolean
-
autoCapitalize?
"none" | (string & {}) | "off" | "on" | "sentences" | "words" | "characters"
-
suppressHydrationWarning?
boolean
-
suppressContentEditableWarning?
boolean
-
defaultValue?
string | number | readonly string[]
-
defaultChecked?
boolean
-
tabIndex?
number
-
nonce?
string
-
inputMode?
"none" | "search" | "text" | "tel" | "url" | "email" | "numeric" | "decimal"
-
enterKeyHint?
"search" | "enter" | "done" | "go" | "next" | "previous" | "send"
-
contentEditable?
Booleanish | "inherit" | "plaintext-only"
-
style?
CSSProperties
-
children?
ReactNode
-
role?
AriaRole
-
slot?
string
-
prefix?
string
-
part?
string
-
id?
string
-
className?
string
-
translate?
"yes" | "no"
-
title?
string
-
popover?
"" | "auto" | "manual"
-
lang?
string
-
inert?
boolean
-
hidden?
boolean
-
draggable?
Booleanish
-
dir?
string
-
accessKey?
string
-
aria-dropeffect?
"link" | "none" | "copy" | "execute" | "move" | "popup"
-
aria-grabbed?
Booleanish
-
onKeyPress?
KeyboardEventHandler<MediaController>
-
onKeyPressCapture?
KeyboardEventHandler<MediaController>
-

VideoPlayerContent

The VideoPlayerContent component is used to control the video player.

PropTypeDefault
onTransitionStartCapture?
TransitionEventHandler<HTMLVideoElement>
-
onTransitionStart?
TransitionEventHandler<HTMLVideoElement>
-
onTransitionRunCapture?
TransitionEventHandler<HTMLVideoElement>
-
onTransitionRun?
TransitionEventHandler<HTMLVideoElement>
-
onTransitionEndCapture?
TransitionEventHandler<HTMLVideoElement>
-
onTransitionEnd?
TransitionEventHandler<HTMLVideoElement>
-
onTransitionCancelCapture?
TransitionEventHandler<HTMLVideoElement>
-
onTransitionCancel?
TransitionEventHandler<HTMLVideoElement>
-
onBeforeToggle?
ToggleEventHandler<HTMLVideoElement>
-
onToggle?
ToggleEventHandler<HTMLVideoElement>
-
onAnimationIterationCapture?
AnimationEventHandler<HTMLVideoElement>
-
onAnimationIteration?
AnimationEventHandler<HTMLVideoElement>
-
onAnimationEndCapture?
AnimationEventHandler<HTMLVideoElement>
-
onAnimationEnd?
AnimationEventHandler<HTMLVideoElement>
-
onAnimationStartCapture?
AnimationEventHandler<HTMLVideoElement>
-
onAnimationStart?
AnimationEventHandler<HTMLVideoElement>
-
onWheelCapture?
WheelEventHandler<HTMLVideoElement>
-
onWheel?
WheelEventHandler<HTMLVideoElement>
-
onScrollEndCapture?
UIEventHandler<HTMLVideoElement>
-
onScrollEnd?
UIEventHandler<HTMLVideoElement>
-
onScrollCapture?
UIEventHandler<HTMLVideoElement>
-
onScroll?
UIEventHandler<HTMLVideoElement>
-
onLostPointerCaptureCapture?
PointerEventHandler<HTMLVideoElement>
-
onLostPointerCapture?
PointerEventHandler<HTMLVideoElement>
-
onGotPointerCaptureCapture?
PointerEventHandler<HTMLVideoElement>
-
onGotPointerCapture?
PointerEventHandler<HTMLVideoElement>
-
onPointerOutCapture?
PointerEventHandler<HTMLVideoElement>
-
onPointerOut?
PointerEventHandler<HTMLVideoElement>
-
onPointerOverCapture?
PointerEventHandler<HTMLVideoElement>
-
onPointerOver?
PointerEventHandler<HTMLVideoElement>
-
onPointerLeave?
PointerEventHandler<HTMLVideoElement>
-
onPointerEnter?
PointerEventHandler<HTMLVideoElement>
-
onPointerCancelCapture?
PointerEventHandler<HTMLVideoElement>
-
onPointerCancel?
PointerEventHandler<HTMLVideoElement>
-
onPointerUpCapture?
PointerEventHandler<HTMLVideoElement>
-
onPointerUp?
PointerEventHandler<HTMLVideoElement>
-
onPointerMoveCapture?
PointerEventHandler<HTMLVideoElement>
-
onPointerMove?
PointerEventHandler<HTMLVideoElement>
-
onPointerDownCapture?
PointerEventHandler<HTMLVideoElement>
-
onPointerDown?
PointerEventHandler<HTMLVideoElement>
-
onTouchStartCapture?
TouchEventHandler<HTMLVideoElement>
-
onTouchStart?
TouchEventHandler<HTMLVideoElement>
-
onTouchMoveCapture?
TouchEventHandler<HTMLVideoElement>
-
onTouchMove?
TouchEventHandler<HTMLVideoElement>
-
onTouchEndCapture?
TouchEventHandler<HTMLVideoElement>
-
onTouchEnd?
TouchEventHandler<HTMLVideoElement>
-
onTouchCancelCapture?
TouchEventHandler<HTMLVideoElement>
-
onTouchCancel?
TouchEventHandler<HTMLVideoElement>
-
onSelectCapture?
ReactEventHandler<HTMLVideoElement>
-
onSelect?
ReactEventHandler<HTMLVideoElement>
-
onMouseUpCapture?
MouseEventHandler<HTMLVideoElement>
-
onMouseUp?
MouseEventHandler<HTMLVideoElement>
-
onMouseOverCapture?
MouseEventHandler<HTMLVideoElement>
-
onMouseOver?
MouseEventHandler<HTMLVideoElement>
-
onMouseOutCapture?
MouseEventHandler<HTMLVideoElement>
-
onMouseOut?
MouseEventHandler<HTMLVideoElement>
-
onMouseMoveCapture?
MouseEventHandler<HTMLVideoElement>
-
onMouseMove?
MouseEventHandler<HTMLVideoElement>
-
onMouseLeave?
MouseEventHandler<HTMLVideoElement>
-
onMouseEnter?
MouseEventHandler<HTMLVideoElement>
-
onMouseDownCapture?
MouseEventHandler<HTMLVideoElement>
-
onMouseDown?
MouseEventHandler<HTMLVideoElement>
-
onDropCapture?
DragEventHandler<HTMLVideoElement>
-
onDrop?
DragEventHandler<HTMLVideoElement>
-
onDragStartCapture?
DragEventHandler<HTMLVideoElement>
-
onDragStart?
DragEventHandler<HTMLVideoElement>
-
onDragOverCapture?
DragEventHandler<HTMLVideoElement>
-
onDragOver?
DragEventHandler<HTMLVideoElement>
-
onDragLeaveCapture?
DragEventHandler<HTMLVideoElement>
-
onDragLeave?
DragEventHandler<HTMLVideoElement>
-
onDragExitCapture?
DragEventHandler<HTMLVideoElement>
-
onDragExit?
DragEventHandler<HTMLVideoElement>
-
onDragEnterCapture?
DragEventHandler<HTMLVideoElement>
-
onDragEnter?
DragEventHandler<HTMLVideoElement>
-
onDragEndCapture?
DragEventHandler<HTMLVideoElement>
-
onDragEnd?
DragEventHandler<HTMLVideoElement>
-
onDragCapture?
DragEventHandler<HTMLVideoElement>
-
onDrag?
DragEventHandler<HTMLVideoElement>
-
onDoubleClickCapture?
MouseEventHandler<HTMLVideoElement>
-
onDoubleClick?
MouseEventHandler<HTMLVideoElement>
-
onContextMenuCapture?
MouseEventHandler<HTMLVideoElement>
-
onContextMenu?
MouseEventHandler<HTMLVideoElement>
-
onClickCapture?
MouseEventHandler<HTMLVideoElement>
-
onClick?
MouseEventHandler<HTMLVideoElement>
-
onAuxClickCapture?
MouseEventHandler<HTMLVideoElement>
-
onAuxClick?
MouseEventHandler<HTMLVideoElement>
-
onWaitingCapture?
ReactEventHandler<HTMLVideoElement>
-
onWaiting?
ReactEventHandler<HTMLVideoElement>
-
onVolumeChangeCapture?
ReactEventHandler<HTMLVideoElement>
-
onVolumeChange?
ReactEventHandler<HTMLVideoElement>
-
onTimeUpdateCapture?
ReactEventHandler<HTMLVideoElement>
-
onTimeUpdate?
ReactEventHandler<HTMLVideoElement>
-
onSuspendCapture?
ReactEventHandler<HTMLVideoElement>
-
onSuspend?
ReactEventHandler<HTMLVideoElement>
-
onStalledCapture?
ReactEventHandler<HTMLVideoElement>
-
onStalled?
ReactEventHandler<HTMLVideoElement>
-
onSeekingCapture?
ReactEventHandler<HTMLVideoElement>
-
onSeeking?
ReactEventHandler<HTMLVideoElement>
-
onSeekedCapture?
ReactEventHandler<HTMLVideoElement>
-
onSeeked?
ReactEventHandler<HTMLVideoElement>
-
onResizeCapture?
ReactEventHandler<HTMLVideoElement>
-
onResize?
ReactEventHandler<HTMLVideoElement>
-
onRateChangeCapture?
ReactEventHandler<HTMLVideoElement>
-
onRateChange?
ReactEventHandler<HTMLVideoElement>
-
onProgressCapture?
ReactEventHandler<HTMLVideoElement>
-
onProgress?
ReactEventHandler<HTMLVideoElement>
-
onPlayingCapture?
ReactEventHandler<HTMLVideoElement>
-
onPlaying?
ReactEventHandler<HTMLVideoElement>
-
onPlayCapture?
ReactEventHandler<HTMLVideoElement>
-
onPlay?
ReactEventHandler<HTMLVideoElement>
-
onPauseCapture?
ReactEventHandler<HTMLVideoElement>
-
onPause?
ReactEventHandler<HTMLVideoElement>
-
onLoadStartCapture?
ReactEventHandler<HTMLVideoElement>
-
onLoadStart?
ReactEventHandler<HTMLVideoElement>
-
onLoadedMetadataCapture?
ReactEventHandler<HTMLVideoElement>
-
onLoadedMetadata?
ReactEventHandler<HTMLVideoElement>
-
onLoadedDataCapture?
ReactEventHandler<HTMLVideoElement>
-
onLoadedData?
ReactEventHandler<HTMLVideoElement>
-
onEndedCapture?
ReactEventHandler<HTMLVideoElement>
-
onEnded?
ReactEventHandler<HTMLVideoElement>
-
onEncryptedCapture?
ReactEventHandler<HTMLVideoElement>
-
onEncrypted?
ReactEventHandler<HTMLVideoElement>
-
onEmptiedCapture?
ReactEventHandler<HTMLVideoElement>
-
onEmptied?
ReactEventHandler<HTMLVideoElement>
-
onDurationChangeCapture?
ReactEventHandler<HTMLVideoElement>
-
onDurationChange?
ReactEventHandler<HTMLVideoElement>
-
onCanPlayThroughCapture?
ReactEventHandler<HTMLVideoElement>
-
onCanPlayThrough?
ReactEventHandler<HTMLVideoElement>
-
onCanPlayCapture?
ReactEventHandler<HTMLVideoElement>
-
onCanPlay?
ReactEventHandler<HTMLVideoElement>
-
onAbortCapture?
ReactEventHandler<HTMLVideoElement>
-
onAbort?
ReactEventHandler<HTMLVideoElement>
-
onKeyUpCapture?
KeyboardEventHandler<HTMLVideoElement>
-
onKeyUp?
KeyboardEventHandler<HTMLVideoElement>
-
onKeyDownCapture?
KeyboardEventHandler<HTMLVideoElement>
-
onKeyDown?
KeyboardEventHandler<HTMLVideoElement>
-
onErrorCapture?
ReactEventHandler<HTMLVideoElement>
-
onError?
ReactEventHandler<HTMLVideoElement>
-
onLoadCapture?
ReactEventHandler<HTMLVideoElement>
-
onLoad?
ReactEventHandler<HTMLVideoElement>
-
onInvalidCapture?
FormEventHandler<HTMLVideoElement>
-
onInvalid?
FormEventHandler<HTMLVideoElement>
-
onSubmitCapture?
FormEventHandler<HTMLVideoElement>
-
onSubmit?
FormEventHandler<HTMLVideoElement>
-
onResetCapture?
FormEventHandler<HTMLVideoElement>
-
onReset?
FormEventHandler<HTMLVideoElement>
-
onInputCapture?
FormEventHandler<HTMLVideoElement>
-
onInput?
FormEventHandler<HTMLVideoElement>
-
onBeforeInputCapture?
FormEventHandler<HTMLVideoElement>
-
onBeforeInput?
FormEventHandler<HTMLVideoElement>
-
onChangeCapture?
FormEventHandler<HTMLVideoElement>
-
onChange?
FormEventHandler<HTMLVideoElement>
-
onBlurCapture?
FocusEventHandler<HTMLVideoElement>
-
onBlur?
FocusEventHandler<HTMLVideoElement>
-
onFocusCapture?
FocusEventHandler<HTMLVideoElement>
-
onFocus?
FocusEventHandler<HTMLVideoElement>
-
onCompositionUpdateCapture?
CompositionEventHandler<HTMLVideoElement>
-
onCompositionUpdate?
CompositionEventHandler<HTMLVideoElement>
-
onCompositionStartCapture?
CompositionEventHandler<HTMLVideoElement>
-
onCompositionStart?
CompositionEventHandler<HTMLVideoElement>
-
onCompositionEndCapture?
CompositionEventHandler<HTMLVideoElement>
-
onCompositionEnd?
CompositionEventHandler<HTMLVideoElement>
-
onPasteCapture?
ClipboardEventHandler<HTMLVideoElement>
-
onPaste?
ClipboardEventHandler<HTMLVideoElement>
-
onCutCapture?
ClipboardEventHandler<HTMLVideoElement>
-
onCut?
ClipboardEventHandler<HTMLVideoElement>
-
onCopyCapture?
ClipboardEventHandler<HTMLVideoElement>
-
onCopy?
ClipboardEventHandler<HTMLVideoElement>
-
dangerouslySetInnerHTML?
{ __html: string | TrustedHTML; }
-
children?
ReactNode
-
aria-valuetext?
string
-
aria-valuenow?
number
-
aria-valuemin?
number
-
aria-valuemax?
number
-
aria-sort?
"none" | "ascending" | "descending" | "other"
-
aria-setsize?
number
-
aria-selected?
Booleanish
-
aria-rowspan?
number
-
aria-rowindextext?
string
-
aria-rowindex?
number
-
aria-rowcount?
number
-
aria-roledescription?
string
-
aria-required?
Booleanish
-
aria-relevant?
"text" | "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals"
-
aria-readonly?
Booleanish
-
aria-pressed?
boolean | "true" | "false" | "mixed"
-
aria-posinset?
number
-
aria-placeholder?
string
-
aria-owns?
string
-
aria-orientation?
"horizontal" | "vertical"
-
aria-multiselectable?
Booleanish
-
aria-multiline?
Booleanish
-
aria-modal?
Booleanish
-
aria-live?
"off" | "assertive" | "polite"
-
aria-level?
number
-
aria-labelledby?
string
-
aria-label?
string
-
aria-keyshortcuts?
string
-
aria-invalid?
boolean | "true" | "false" | "grammar" | "spelling"
-
aria-hidden?
Booleanish
-
aria-haspopup?
boolean | "dialog" | "menu" | "true" | "false" | "grid" | "listbox" | "tree"
-
aria-flowto?
string
-
aria-expanded?
Booleanish
-
aria-errormessage?
string
-
aria-disabled?
Booleanish
-
aria-details?
string
-
aria-description?
string
-
aria-describedby?
string
-
aria-current?
boolean | "time" | "true" | "false" | "page" | "step" | "location" | "date"
-
aria-controls?
string
-
aria-colspan?
number
-
aria-colindextext?
string
-
aria-colindex?
number
-
aria-colcount?
number
-
aria-checked?
boolean | "true" | "false" | "mixed"
-
aria-busy?
Booleanish
-
aria-brailleroledescription?
string
-
aria-braillelabel?
string
-
aria-autocomplete?
"none" | "list" | "inline" | "both"
-
aria-atomic?
Booleanish
-
aria-activedescendant?
string
-
part?
string
-
exportparts?
string
-
is?
string
-
inputMode?
"search" | "text" | "none" | "tel" | "url" | "email" | "numeric" | "decimal"
-
inert?
boolean
-
popoverTarget?
string
-
popoverTargetAction?
"toggle" | "show" | "hide"
-
popover?
"" | "auto" | "manual"
-
unselectable?
"off" | "on"
-
security?
string
-
results?
number
-
itemRef?
string
-
itemID?
string
-
itemType?
string
-
itemScope?
boolean
-
itemProp?
string
-
color?
string
-
autoSave?
string
-
autoCorrect?
string
-
vocab?
string
-
typeof?
string
-
rev?
string
-
resource?
string
-
rel?
string
-
property?
string
-
prefix?
string
-
inlist?
any
-
datatype?
string
-
content?
string
-
about?
string
-
role?
AriaRole
-
radioGroup?
string
-
translate?
"yes" | "no"
-
title?
string
-
tabIndex?
number
-
style?
CSSProperties
-
spellCheck?
Booleanish
-
slot?
string
-
nonce?
string
-
lang?
string
-
id?
string
-
hidden?
boolean
-
enterKeyHint?
"search" | "enter" | "done" | "go" | "next" | "previous" | "send"
-
draggable?
Booleanish
-
dir?
string
-
contextMenu?
string
-
contentEditable?
Booleanish | "inherit" | "plaintext-only"
-
className?
string
-
autoFocus?
boolean
-
autoCapitalize?
"off" | "none" | "on" | "sentences" | "words" | "characters" | (string & {})
-
accessKey?
string
-
suppressHydrationWarning?
boolean
-
suppressContentEditableWarning?
boolean
-
defaultValue?
string | number | readonly string[]
-
defaultChecked?
boolean
-
src?
string
-
preload?
string
-
muted?
boolean
-
mediaGroup?
string
-
loop?
boolean
-
crossOrigin?
CrossOrigin
-
controlsList?
string
-
controls?
boolean
-
autoPlay?
boolean
-
disableRemotePlayback?
boolean
-
disablePictureInPicture?
boolean
-
width?
string | number
-
poster?
string
-
playsInline?
boolean
-
height?
string | number
-
key?
Key | null
-
ref?
Ref<HTMLVideoElement>
-
aria-dropeffect?
"link" | "none" | "copy" | "execute" | "move" | "popup"
-
aria-grabbed?
Booleanish
-
onKeyPress?
KeyboardEventHandler<HTMLVideoElement>
-
onKeyPressCapture?
KeyboardEventHandler<HTMLVideoElement>
-

VideoPlayerControlBar

The VideoPlayerControlBar component is used to control the video player.

PropTypeDefault
key?
Key | null
-
ref?
Ref<MediaControlBar>
-
onTransitionStartCapture?
TransitionEventHandler<MediaControlBar>
-
onTransitionStart?
TransitionEventHandler<MediaControlBar>
-
onTransitionRunCapture?
TransitionEventHandler<MediaControlBar>
-
onTransitionRun?
TransitionEventHandler<MediaControlBar>
-
onTransitionEndCapture?
TransitionEventHandler<MediaControlBar>
-
onTransitionEnd?
TransitionEventHandler<MediaControlBar>
-
onTransitionCancelCapture?
TransitionEventHandler<MediaControlBar>
-
onTransitionCancel?
TransitionEventHandler<MediaControlBar>
-
onBeforeToggle?
ToggleEventHandler<MediaControlBar>
-
onToggle?
ToggleEventHandler<MediaControlBar>
-
onAnimationIterationCapture?
AnimationEventHandler<MediaControlBar>
-
onAnimationIteration?
AnimationEventHandler<MediaControlBar>
-
onAnimationEndCapture?
AnimationEventHandler<MediaControlBar>
-
onAnimationEnd?
AnimationEventHandler<MediaControlBar>
-
onAnimationStartCapture?
AnimationEventHandler<MediaControlBar>
-
onAnimationStart?
AnimationEventHandler<MediaControlBar>
-
onWheelCapture?
WheelEventHandler<MediaControlBar>
-
onWheel?
WheelEventHandler<MediaControlBar>
-
onScrollEndCapture?
UIEventHandler<MediaControlBar>
-
onScrollEnd?
UIEventHandler<MediaControlBar>
-
onScrollCapture?
UIEventHandler<MediaControlBar>
-
onScroll?
UIEventHandler<MediaControlBar>
-
onLostPointerCaptureCapture?
PointerEventHandler<MediaControlBar>
-
onLostPointerCapture?
PointerEventHandler<MediaControlBar>
-
onGotPointerCaptureCapture?
PointerEventHandler<MediaControlBar>
-
onGotPointerCapture?
PointerEventHandler<MediaControlBar>
-
onPointerOutCapture?
PointerEventHandler<MediaControlBar>
-
onPointerOut?
PointerEventHandler<MediaControlBar>
-
onPointerOverCapture?
PointerEventHandler<MediaControlBar>
-
onPointerOver?
PointerEventHandler<MediaControlBar>
-
onPointerLeave?
PointerEventHandler<MediaControlBar>
-
onPointerEnter?
PointerEventHandler<MediaControlBar>
-
onPointerCancelCapture?
PointerEventHandler<MediaControlBar>
-
onPointerCancel?
PointerEventHandler<MediaControlBar>
-
onPointerUpCapture?
PointerEventHandler<MediaControlBar>
-
onPointerUp?
PointerEventHandler<MediaControlBar>
-
onPointerMoveCapture?
PointerEventHandler<MediaControlBar>
-
onPointerMove?
PointerEventHandler<MediaControlBar>
-
onPointerDownCapture?
PointerEventHandler<MediaControlBar>
-
onPointerDown?
PointerEventHandler<MediaControlBar>
-
onTouchStartCapture?
TouchEventHandler<MediaControlBar>
-
onTouchStart?
TouchEventHandler<MediaControlBar>
-
onTouchMoveCapture?
TouchEventHandler<MediaControlBar>
-
onTouchMove?
TouchEventHandler<MediaControlBar>
-
onTouchEndCapture?
TouchEventHandler<MediaControlBar>
-
onTouchEnd?
TouchEventHandler<MediaControlBar>
-
onTouchCancelCapture?
TouchEventHandler<MediaControlBar>
-
onTouchCancel?
TouchEventHandler<MediaControlBar>
-
onSelectCapture?
ReactEventHandler<MediaControlBar>
-
onSelect?
ReactEventHandler<MediaControlBar>
-
onMouseUpCapture?
MouseEventHandler<MediaControlBar>
-
onMouseUp?
MouseEventHandler<MediaControlBar>
-
onMouseOverCapture?
MouseEventHandler<MediaControlBar>
-
onMouseOver?
MouseEventHandler<MediaControlBar>
-
onMouseOutCapture?
MouseEventHandler<MediaControlBar>
-
onMouseOut?
MouseEventHandler<MediaControlBar>
-
onMouseMoveCapture?
MouseEventHandler<MediaControlBar>
-
onMouseMove?
MouseEventHandler<MediaControlBar>
-
onMouseLeave?
MouseEventHandler<MediaControlBar>
-
onMouseEnter?
MouseEventHandler<MediaControlBar>
-
onMouseDownCapture?
MouseEventHandler<MediaControlBar>
-
onMouseDown?
MouseEventHandler<MediaControlBar>
-
onDropCapture?
DragEventHandler<MediaControlBar>
-
onDrop?
DragEventHandler<MediaControlBar>
-
onDragStartCapture?
DragEventHandler<MediaControlBar>
-
onDragStart?
DragEventHandler<MediaControlBar>
-
onDragOverCapture?
DragEventHandler<MediaControlBar>
-
onDragOver?
DragEventHandler<MediaControlBar>
-
onDragLeaveCapture?
DragEventHandler<MediaControlBar>
-
onDragLeave?
DragEventHandler<MediaControlBar>
-
onDragExitCapture?
DragEventHandler<MediaControlBar>
-
onDragExit?
DragEventHandler<MediaControlBar>
-
onDragEnterCapture?
DragEventHandler<MediaControlBar>
-
onDragEnter?
DragEventHandler<MediaControlBar>
-
onDragEndCapture?
DragEventHandler<MediaControlBar>
-
onDragEnd?
DragEventHandler<MediaControlBar>
-
onDragCapture?
DragEventHandler<MediaControlBar>
-
onDrag?
DragEventHandler<MediaControlBar>
-
onDoubleClickCapture?
MouseEventHandler<MediaControlBar>
-
onDoubleClick?
MouseEventHandler<MediaControlBar>
-
onContextMenuCapture?
MouseEventHandler<MediaControlBar>
-
onContextMenu?
MouseEventHandler<MediaControlBar>
-
onClickCapture?
MouseEventHandler<MediaControlBar>
-
onClick?
MouseEventHandler<MediaControlBar>
-
onAuxClickCapture?
MouseEventHandler<MediaControlBar>
-
onAuxClick?
MouseEventHandler<MediaControlBar>
-
onWaitingCapture?
ReactEventHandler<MediaControlBar>
-
onWaiting?
ReactEventHandler<MediaControlBar>
-
onVolumeChangeCapture?
ReactEventHandler<MediaControlBar>
-
onVolumeChange?
ReactEventHandler<MediaControlBar>
-
onTimeUpdateCapture?
ReactEventHandler<MediaControlBar>
-
onTimeUpdate?
ReactEventHandler<MediaControlBar>
-
onSuspendCapture?
ReactEventHandler<MediaControlBar>
-
onSuspend?
ReactEventHandler<MediaControlBar>
-
onStalledCapture?
ReactEventHandler<MediaControlBar>
-
onStalled?
ReactEventHandler<MediaControlBar>
-
onSeekingCapture?
ReactEventHandler<MediaControlBar>
-
onSeeking?
ReactEventHandler<MediaControlBar>
-
onSeekedCapture?
ReactEventHandler<MediaControlBar>
-
onSeeked?
ReactEventHandler<MediaControlBar>
-
onResizeCapture?
ReactEventHandler<MediaControlBar>
-
onResize?
ReactEventHandler<MediaControlBar>
-
onRateChangeCapture?
ReactEventHandler<MediaControlBar>
-
onRateChange?
ReactEventHandler<MediaControlBar>
-
onProgressCapture?
ReactEventHandler<MediaControlBar>
-
onProgress?
ReactEventHandler<MediaControlBar>
-
onPlayingCapture?
ReactEventHandler<MediaControlBar>
-
onPlaying?
ReactEventHandler<MediaControlBar>
-
onPlayCapture?
ReactEventHandler<MediaControlBar>
-
onPlay?
ReactEventHandler<MediaControlBar>
-
onPauseCapture?
ReactEventHandler<MediaControlBar>
-
onPause?
ReactEventHandler<MediaControlBar>
-
onLoadStartCapture?
ReactEventHandler<MediaControlBar>
-
onLoadStart?
ReactEventHandler<MediaControlBar>
-
onLoadedMetadataCapture?
ReactEventHandler<MediaControlBar>
-
onLoadedMetadata?
ReactEventHandler<MediaControlBar>
-
onLoadedDataCapture?
ReactEventHandler<MediaControlBar>
-
onLoadedData?
ReactEventHandler<MediaControlBar>
-
onEndedCapture?
ReactEventHandler<MediaControlBar>
-
onEnded?
ReactEventHandler<MediaControlBar>
-
onEncryptedCapture?
ReactEventHandler<MediaControlBar>
-
onEncrypted?
ReactEventHandler<MediaControlBar>
-
onEmptiedCapture?
ReactEventHandler<MediaControlBar>
-
onEmptied?
ReactEventHandler<MediaControlBar>
-
onDurationChangeCapture?
ReactEventHandler<MediaControlBar>
-
onDurationChange?
ReactEventHandler<MediaControlBar>
-
onCanPlayThroughCapture?
ReactEventHandler<MediaControlBar>
-
onCanPlayThrough?
ReactEventHandler<MediaControlBar>
-
onCanPlayCapture?
ReactEventHandler<MediaControlBar>
-
onCanPlay?
ReactEventHandler<MediaControlBar>
-
onAbortCapture?
ReactEventHandler<MediaControlBar>
-
onAbort?
ReactEventHandler<MediaControlBar>
-
onKeyUpCapture?
KeyboardEventHandler<MediaControlBar>
-
onKeyUp?
KeyboardEventHandler<MediaControlBar>
-
onKeyDownCapture?
KeyboardEventHandler<MediaControlBar>
-
onKeyDown?
KeyboardEventHandler<MediaControlBar>
-
onErrorCapture?
ReactEventHandler<MediaControlBar>
-
onError?
ReactEventHandler<MediaControlBar>
-
onLoadCapture?
ReactEventHandler<MediaControlBar>
-
onLoad?
ReactEventHandler<MediaControlBar>
-
onInvalidCapture?
FormEventHandler<MediaControlBar>
-
onInvalid?
FormEventHandler<MediaControlBar>
-
onSubmitCapture?
FormEventHandler<MediaControlBar>
-
onSubmit?
FormEventHandler<MediaControlBar>
-
onResetCapture?
FormEventHandler<MediaControlBar>
-
onReset?
FormEventHandler<MediaControlBar>
-
onInputCapture?
FormEventHandler<MediaControlBar>
-
onInput?
FormEventHandler<MediaControlBar>
-
onBeforeInputCapture?
FormEventHandler<MediaControlBar>
-
onBeforeInput?
FormEventHandler<MediaControlBar>
-
onChangeCapture?
FormEventHandler<MediaControlBar>
-
onChange?
FormEventHandler<MediaControlBar>
-
onBlurCapture?
FocusEventHandler<MediaControlBar>
-
onBlur?
FocusEventHandler<MediaControlBar>
-
onFocusCapture?
FocusEventHandler<MediaControlBar>
-
onFocus?
FocusEventHandler<MediaControlBar>
-
onCompositionUpdateCapture?
CompositionEventHandler<MediaControlBar>
-
onCompositionUpdate?
CompositionEventHandler<MediaControlBar>
-
onCompositionStartCapture?
CompositionEventHandler<MediaControlBar>
-
onCompositionStart?
CompositionEventHandler<MediaControlBar>
-
onCompositionEndCapture?
CompositionEventHandler<MediaControlBar>
-
onCompositionEnd?
CompositionEventHandler<MediaControlBar>
-
onPasteCapture?
ClipboardEventHandler<MediaControlBar>
-
onPaste?
ClipboardEventHandler<MediaControlBar>
-
onCutCapture?
ClipboardEventHandler<MediaControlBar>
-
onCut?
ClipboardEventHandler<MediaControlBar>
-
onCopyCapture?
ClipboardEventHandler<MediaControlBar>
-
onCopy?
ClipboardEventHandler<MediaControlBar>
-
dangerouslySetInnerHTML?
{ __html: string | TrustedHTML; }
-
aria-valuetext?
string
-
aria-valuenow?
number
-
aria-valuemin?
number
-
aria-valuemax?
number
-
aria-sort?
"none" | "ascending" | "descending" | "other"
-
aria-setsize?
number
-
aria-selected?
Booleanish
-
aria-rowspan?
number
-
aria-rowindextext?
string
-
aria-rowindex?
number
-
aria-rowcount?
number
-
aria-roledescription?
string
-
aria-required?
Booleanish
-
aria-relevant?
"text" | "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals"
-
aria-readonly?
Booleanish
-
aria-pressed?
boolean | "true" | "false" | "mixed"
-
aria-posinset?
number
-
aria-placeholder?
string
-
aria-owns?
string
-
aria-orientation?
"horizontal" | "vertical"
-
aria-multiselectable?
Booleanish
-
aria-multiline?
Booleanish
-
aria-modal?
Booleanish
-
aria-live?
"off" | "assertive" | "polite"
-
aria-level?
number
-
aria-labelledby?
string
-
aria-label?
string
-
aria-keyshortcuts?
string
-
aria-invalid?
boolean | "true" | "false" | "grammar" | "spelling"
-
aria-hidden?
Booleanish
-
aria-haspopup?
boolean | "true" | "false" | "dialog" | "grid" | "listbox" | "menu" | "tree"
-
aria-flowto?
string
-
aria-expanded?
Booleanish
-
aria-errormessage?
string
-
aria-disabled?
Booleanish
-
aria-details?
string
-
aria-description?
string
-
aria-describedby?
string
-
aria-current?
boolean | "true" | "false" | "page" | "step" | "location" | "date" | "time"
-
aria-controls?
string
-
aria-colspan?
number
-
aria-colindextext?
string
-
aria-colindex?
number
-
aria-colcount?
number
-
aria-checked?
boolean | "true" | "false" | "mixed"
-
aria-busy?
Booleanish
-
aria-brailleroledescription?
string
-
aria-braillelabel?
string
-
aria-autocomplete?
"list" | "none" | "inline" | "both"
-
aria-atomic?
Booleanish
-
aria-activedescendant?
string
-
exportparts?
string
-
is?
string
-
popoverTarget?
string
-
popoverTargetAction?
"toggle" | "show" | "hide"
-
unselectable?
"off" | "on"
-
security?
string
-
results?
number
-
itemRef?
string
-
itemID?
string
-
itemType?
string
-
itemScope?
boolean
-
itemProp?
string
-
color?
string
-
autoSave?
string
-
autoCorrect?
string
-
vocab?
string
-
typeof?
string
-
rev?
string
-
resource?
string
-
rel?
string
-
property?
string
-
inlist?
any
-
datatype?
string
-
content?
string
-
about?
string
-
radioGroup?
string
-
spellCheck?
Booleanish
-
contextMenu?
string
-
autoFocus?
boolean
-
autoCapitalize?
"none" | (string & {}) | "off" | "on" | "sentences" | "words" | "characters"
-
suppressHydrationWarning?
boolean
-
suppressContentEditableWarning?
boolean
-
defaultValue?
string | number | readonly string[]
-
defaultChecked?
boolean
-
tabIndex?
number
-
nonce?
string
-
inputMode?
"none" | "search" | "text" | "tel" | "url" | "email" | "numeric" | "decimal"
-
enterKeyHint?
"search" | "enter" | "done" | "go" | "next" | "previous" | "send"
-
contentEditable?
Booleanish | "inherit" | "plaintext-only"
-
style?
CSSProperties
-
children?
ReactNode
-
role?
AriaRole
-
slot?
string
-
prefix?
string
-
part?
string
-
id?
string
-
className?
string
-
translate?
"yes" | "no"
-
title?
string
-
popover?
"" | "auto" | "manual"
-
lang?
string
-
inert?
boolean
-
hidden?
boolean
-
draggable?
Booleanish
-
dir?
string
-
accessKey?
string
-
aria-dropeffect?
"link" | "none" | "copy" | "execute" | "move" | "popup"
-
aria-grabbed?
Booleanish
-
onKeyPress?
KeyboardEventHandler<MediaControlBar>
-
onKeyPressCapture?
KeyboardEventHandler<MediaControlBar>
-

VideoPlayerMuteButton

The VideoPlayerMuteButton component is used to mute/unmute the video player.

PropTypeDefault
key?
Key | null
-
ref?
Ref<MediaMuteButton>
-
noTooltip?
boolean
-
disabled?
boolean
-
mediaController?
string
-
tooltipPlacement?
TooltipPlacement
-
keysUsed?
string[]
-
disable?
(() => void)
-
enable?
(() => void)
-
tooltipContent?
string
-
tooltipEl?
MediaTooltip
-
nativeEl?
DocumentFragment
-
preventClick?
boolean
-
handleClick?
(() => void)
-
mediaVolumeLevel?
string
-
onTransitionStartCapture?
TransitionEventHandler<MediaMuteButton>
-
onTransitionStart?
TransitionEventHandler<MediaMuteButton>
-
onTransitionRunCapture?
TransitionEventHandler<MediaMuteButton>
-
onTransitionRun?
TransitionEventHandler<MediaMuteButton>
-
onTransitionEndCapture?
TransitionEventHandler<MediaMuteButton>
-
onTransitionEnd?
TransitionEventHandler<MediaMuteButton>
-
onTransitionCancelCapture?
TransitionEventHandler<MediaMuteButton>
-
onTransitionCancel?
TransitionEventHandler<MediaMuteButton>
-
onBeforeToggle?
ToggleEventHandler<MediaMuteButton>
-
onToggle?
ToggleEventHandler<MediaMuteButton>
-
onAnimationIterationCapture?
AnimationEventHandler<MediaMuteButton>
-
onAnimationIteration?
AnimationEventHandler<MediaMuteButton>
-
onAnimationEndCapture?
AnimationEventHandler<MediaMuteButton>
-
onAnimationEnd?
AnimationEventHandler<MediaMuteButton>
-
onAnimationStartCapture?
AnimationEventHandler<MediaMuteButton>
-
onAnimationStart?
AnimationEventHandler<MediaMuteButton>
-
onWheelCapture?
WheelEventHandler<MediaMuteButton>
-
onWheel?
WheelEventHandler<MediaMuteButton>
-
onScrollEndCapture?
UIEventHandler<MediaMuteButton>
-
onScrollEnd?
UIEventHandler<MediaMuteButton>
-
onScrollCapture?
UIEventHandler<MediaMuteButton>
-
onScroll?
UIEventHandler<MediaMuteButton>
-
onLostPointerCaptureCapture?
PointerEventHandler<MediaMuteButton>
-
onLostPointerCapture?
PointerEventHandler<MediaMuteButton>
-
onGotPointerCaptureCapture?
PointerEventHandler<MediaMuteButton>
-
onGotPointerCapture?
PointerEventHandler<MediaMuteButton>
-
onPointerOutCapture?
PointerEventHandler<MediaMuteButton>
-
onPointerOut?
PointerEventHandler<MediaMuteButton>
-
onPointerOverCapture?
PointerEventHandler<MediaMuteButton>
-
onPointerOver?
PointerEventHandler<MediaMuteButton>
-
onPointerLeave?
PointerEventHandler<MediaMuteButton>
-
onPointerEnter?
PointerEventHandler<MediaMuteButton>
-
onPointerCancelCapture?
PointerEventHandler<MediaMuteButton>
-
onPointerCancel?
PointerEventHandler<MediaMuteButton>
-
onPointerUpCapture?
PointerEventHandler<MediaMuteButton>
-
onPointerUp?
PointerEventHandler<MediaMuteButton>
-
onPointerMoveCapture?
PointerEventHandler<MediaMuteButton>
-
onPointerMove?
PointerEventHandler<MediaMuteButton>
-
onPointerDownCapture?
PointerEventHandler<MediaMuteButton>
-
onPointerDown?
PointerEventHandler<MediaMuteButton>
-
onTouchStartCapture?
TouchEventHandler<MediaMuteButton>
-
onTouchStart?
TouchEventHandler<MediaMuteButton>
-
onTouchMoveCapture?
TouchEventHandler<MediaMuteButton>
-
onTouchMove?
TouchEventHandler<MediaMuteButton>
-
onTouchEndCapture?
TouchEventHandler<MediaMuteButton>
-
onTouchEnd?
TouchEventHandler<MediaMuteButton>
-
onTouchCancelCapture?
TouchEventHandler<MediaMuteButton>
-
onTouchCancel?
TouchEventHandler<MediaMuteButton>
-
onSelectCapture?
ReactEventHandler<MediaMuteButton>
-
onSelect?
ReactEventHandler<MediaMuteButton>
-
onMouseUpCapture?
MouseEventHandler<MediaMuteButton>
-
onMouseUp?
MouseEventHandler<MediaMuteButton>
-
onMouseOverCapture?
MouseEventHandler<MediaMuteButton>
-
onMouseOver?
MouseEventHandler<MediaMuteButton>
-
onMouseOutCapture?
MouseEventHandler<MediaMuteButton>
-
onMouseOut?
MouseEventHandler<MediaMuteButton>
-
onMouseMoveCapture?
MouseEventHandler<MediaMuteButton>
-
onMouseMove?
MouseEventHandler<MediaMuteButton>
-
onMouseLeave?
MouseEventHandler<MediaMuteButton>
-
onMouseEnter?
MouseEventHandler<MediaMuteButton>
-
onMouseDownCapture?
MouseEventHandler<MediaMuteButton>
-
onMouseDown?
MouseEventHandler<MediaMuteButton>
-
onDropCapture?
DragEventHandler<MediaMuteButton>
-
onDrop?
DragEventHandler<MediaMuteButton>
-
onDragStartCapture?
DragEventHandler<MediaMuteButton>
-
onDragStart?
DragEventHandler<MediaMuteButton>
-
onDragOverCapture?
DragEventHandler<MediaMuteButton>
-
onDragOver?
DragEventHandler<MediaMuteButton>
-
onDragLeaveCapture?
DragEventHandler<MediaMuteButton>
-
onDragLeave?
DragEventHandler<MediaMuteButton>
-
onDragExitCapture?
DragEventHandler<MediaMuteButton>
-
onDragExit?
DragEventHandler<MediaMuteButton>
-
onDragEnterCapture?
DragEventHandler<MediaMuteButton>
-
onDragEnter?
DragEventHandler<MediaMuteButton>
-
onDragEndCapture?
DragEventHandler<MediaMuteButton>
-
onDragEnd?
DragEventHandler<MediaMuteButton>
-
onDragCapture?
DragEventHandler<MediaMuteButton>
-
onDrag?
DragEventHandler<MediaMuteButton>
-
onDoubleClickCapture?
MouseEventHandler<MediaMuteButton>
-
onDoubleClick?
MouseEventHandler<MediaMuteButton>
-
onContextMenuCapture?
MouseEventHandler<MediaMuteButton>
-
onContextMenu?
MouseEventHandler<MediaMuteButton>
-
onClickCapture?
MouseEventHandler<MediaMuteButton>
-
onClick?
MouseEventHandler<MediaMuteButton>
-
onAuxClickCapture?
MouseEventHandler<MediaMuteButton>
-
onAuxClick?
MouseEventHandler<MediaMuteButton>
-
onWaitingCapture?
ReactEventHandler<MediaMuteButton>
-
onWaiting?
ReactEventHandler<MediaMuteButton>
-
onVolumeChangeCapture?
ReactEventHandler<MediaMuteButton>
-
onVolumeChange?
ReactEventHandler<MediaMuteButton>
-
onTimeUpdateCapture?
ReactEventHandler<MediaMuteButton>
-
onTimeUpdate?
ReactEventHandler<MediaMuteButton>
-
onSuspendCapture?
ReactEventHandler<MediaMuteButton>
-
onSuspend?
ReactEventHandler<MediaMuteButton>
-
onStalledCapture?
ReactEventHandler<MediaMuteButton>
-
onStalled?
ReactEventHandler<MediaMuteButton>
-
onSeekingCapture?
ReactEventHandler<MediaMuteButton>
-
onSeeking?
ReactEventHandler<MediaMuteButton>
-
onSeekedCapture?
ReactEventHandler<MediaMuteButton>
-
onSeeked?
ReactEventHandler<MediaMuteButton>
-
onResizeCapture?
ReactEventHandler<MediaMuteButton>
-
onResize?
ReactEventHandler<MediaMuteButton>
-
onRateChangeCapture?
ReactEventHandler<MediaMuteButton>
-
onRateChange?
ReactEventHandler<MediaMuteButton>
-
onProgressCapture?
ReactEventHandler<MediaMuteButton>
-
onProgress?
ReactEventHandler<MediaMuteButton>
-
onPlayingCapture?
ReactEventHandler<MediaMuteButton>
-
onPlaying?
ReactEventHandler<MediaMuteButton>
-
onPlayCapture?
ReactEventHandler<MediaMuteButton>
-
onPlay?
ReactEventHandler<MediaMuteButton>
-
onPauseCapture?
ReactEventHandler<MediaMuteButton>
-
onPause?
ReactEventHandler<MediaMuteButton>
-
onLoadStartCapture?
ReactEventHandler<MediaMuteButton>
-
onLoadStart?
ReactEventHandler<MediaMuteButton>
-
onLoadedMetadataCapture?
ReactEventHandler<MediaMuteButton>
-
onLoadedMetadata?
ReactEventHandler<MediaMuteButton>
-
onLoadedDataCapture?
ReactEventHandler<MediaMuteButton>
-
onLoadedData?
ReactEventHandler<MediaMuteButton>
-
onEndedCapture?
ReactEventHandler<MediaMuteButton>
-
onEnded?
ReactEventHandler<MediaMuteButton>
-
onEncryptedCapture?
ReactEventHandler<MediaMuteButton>
-
onEncrypted?
ReactEventHandler<MediaMuteButton>
-
onEmptiedCapture?
ReactEventHandler<MediaMuteButton>
-
onEmptied?
ReactEventHandler<MediaMuteButton>
-
onDurationChangeCapture?
ReactEventHandler<MediaMuteButton>
-
onDurationChange?
ReactEventHandler<MediaMuteButton>
-
onCanPlayThroughCapture?
ReactEventHandler<MediaMuteButton>
-
onCanPlayThrough?
ReactEventHandler<MediaMuteButton>
-
onCanPlayCapture?
ReactEventHandler<MediaMuteButton>
-
onCanPlay?
ReactEventHandler<MediaMuteButton>
-
onAbortCapture?
ReactEventHandler<MediaMuteButton>
-
onAbort?
ReactEventHandler<MediaMuteButton>
-
onKeyUpCapture?
KeyboardEventHandler<MediaMuteButton>
-
onKeyUp?
KeyboardEventHandler<MediaMuteButton>
-
onKeyDownCapture?
KeyboardEventHandler<MediaMuteButton>
-
onKeyDown?
KeyboardEventHandler<MediaMuteButton>
-
onErrorCapture?
ReactEventHandler<MediaMuteButton>
-
onError?
ReactEventHandler<MediaMuteButton>
-
onLoadCapture?
ReactEventHandler<MediaMuteButton>
-
onLoad?
ReactEventHandler<MediaMuteButton>
-
onInvalidCapture?
FormEventHandler<MediaMuteButton>
-
onInvalid?
FormEventHandler<MediaMuteButton>
-
onSubmitCapture?
FormEventHandler<MediaMuteButton>
-
onSubmit?
FormEventHandler<MediaMuteButton>
-
onResetCapture?
FormEventHandler<MediaMuteButton>
-
onReset?
FormEventHandler<MediaMuteButton>
-
onInputCapture?
FormEventHandler<MediaMuteButton>
-
onInput?
FormEventHandler<MediaMuteButton>
-
onBeforeInputCapture?
FormEventHandler<MediaMuteButton>
-
onBeforeInput?
FormEventHandler<MediaMuteButton>
-
onChangeCapture?
FormEventHandler<MediaMuteButton>
-
onChange?
FormEventHandler<MediaMuteButton>
-
onBlurCapture?
FocusEventHandler<MediaMuteButton>
-
onBlur?
FocusEventHandler<MediaMuteButton>
-
onFocusCapture?
FocusEventHandler<MediaMuteButton>
-
onFocus?
FocusEventHandler<MediaMuteButton>
-
onCompositionUpdateCapture?
CompositionEventHandler<MediaMuteButton>
-
onCompositionUpdate?
CompositionEventHandler<MediaMuteButton>
-
onCompositionStartCapture?
CompositionEventHandler<MediaMuteButton>
-
onCompositionStart?
CompositionEventHandler<MediaMuteButton>
-
onCompositionEndCapture?
CompositionEventHandler<MediaMuteButton>
-
onCompositionEnd?
CompositionEventHandler<MediaMuteButton>
-
onPasteCapture?
ClipboardEventHandler<MediaMuteButton>
-
onPaste?
ClipboardEventHandler<MediaMuteButton>
-
onCutCapture?
ClipboardEventHandler<MediaMuteButton>
-
onCut?
ClipboardEventHandler<MediaMuteButton>
-
onCopyCapture?
ClipboardEventHandler<MediaMuteButton>
-
onCopy?
ClipboardEventHandler<MediaMuteButton>
-
dangerouslySetInnerHTML?
{ __html: string | TrustedHTML; }
-
aria-valuetext?
string
-
aria-valuenow?
number
-
aria-valuemin?
number
-
aria-valuemax?
number
-
aria-sort?
"none" | "ascending" | "descending" | "other"
-
aria-setsize?
number
-
aria-selected?
Booleanish
-
aria-rowspan?
number
-
aria-rowindextext?
string
-
aria-rowindex?
number
-
aria-rowcount?
number
-
aria-roledescription?
string
-
aria-required?
Booleanish
-
aria-relevant?
"text" | "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals"
-
aria-readonly?
Booleanish
-
aria-pressed?
boolean | "true" | "false" | "mixed"
-
aria-posinset?
number
-
aria-placeholder?
string
-
aria-owns?
string
-
aria-orientation?
"horizontal" | "vertical"
-
aria-multiselectable?
Booleanish
-
aria-multiline?
Booleanish
-
aria-modal?
Booleanish
-
aria-live?
"off" | "assertive" | "polite"
-
aria-level?
number
-
aria-labelledby?
string
-
aria-label?
string
-
aria-keyshortcuts?
string
-
aria-invalid?
boolean | "true" | "false" | "grammar" | "spelling"
-
aria-hidden?
Booleanish
-
aria-haspopup?
boolean | "true" | "false" | "dialog" | "grid" | "listbox" | "menu" | "tree"
-
aria-flowto?
string
-
aria-expanded?
Booleanish
-
aria-errormessage?
string
-
aria-disabled?
Booleanish
-
aria-details?
string
-
aria-description?
string
-
aria-describedby?
string
-
aria-current?
boolean | "true" | "false" | "page" | "step" | "location" | "date" | "time"
-
aria-controls?
string
-
aria-colspan?
number
-
aria-colindextext?
string
-
aria-colindex?
number
-
aria-colcount?
number
-
aria-checked?
boolean | "true" | "false" | "mixed"
-
aria-busy?
Booleanish
-
aria-brailleroledescription?
string
-
aria-braillelabel?
string
-
aria-autocomplete?
"list" | "none" | "inline" | "both"
-
aria-atomic?
Booleanish
-
aria-activedescendant?
string
-
exportparts?
string
-
is?
string
-
popoverTarget?
string
-
popoverTargetAction?
"toggle" | "show" | "hide"
-
unselectable?
"off" | "on"
-
security?
string
-
results?
number
-
itemRef?
string
-
itemID?
string
-
itemType?
string
-
itemScope?
boolean
-
itemProp?
string
-
color?
string
-
autoSave?
string
-
autoCorrect?
string
-
vocab?
string
-
typeof?
string
-
rev?
string
-
resource?
string
-
rel?
string
-
property?
string
-
inlist?
any
-
datatype?
string
-
content?
string
-
about?
string
-
radioGroup?
string
-
spellCheck?
Booleanish
-
contextMenu?
string
-
autoFocus?
boolean
-
autoCapitalize?
"none" | (string & {}) | "off" | "on" | "sentences" | "words" | "characters"
-
suppressHydrationWarning?
boolean
-
suppressContentEditableWarning?
boolean
-
defaultValue?
string | number | readonly string[]
-
defaultChecked?
boolean
-
tabIndex?
number
-
nonce?
string
-
inputMode?
"none" | "search" | "text" | "tel" | "url" | "email" | "numeric" | "decimal"
-
enterKeyHint?
"search" | "enter" | "done" | "go" | "next" | "previous" | "send"
-
contentEditable?
Booleanish | "inherit" | "plaintext-only"
-
style?
CSSProperties
-
children?
ReactNode
-
role?
AriaRole
-
slot?
string
-
prefix?
string
-
part?
string
-
id?
string
-
className?
string
-
translate?
"yes" | "no"
-
title?
string
-
popover?
"" | "auto" | "manual"
-
lang?
string
-
inert?
boolean
-
hidden?
boolean
-
draggable?
Booleanish
-
dir?
string
-
accessKey?
string
-
aria-dropeffect?
"link" | "none" | "copy" | "execute" | "move" | "popup"
-
aria-grabbed?
Booleanish
-
onKeyPress?
KeyboardEventHandler<MediaMuteButton>
-
onKeyPressCapture?
KeyboardEventHandler<MediaMuteButton>
-

VideoPlayerPlayButton

The VideoPlayerPlayButton component is used to play/pause the video player.

PropTypeDefault
key?
Key | null
-
ref?
Ref<MediaPlayButton>
-
noTooltip?
boolean
-
disabled?
boolean
-
mediaController?
string
-
tooltipPlacement?
TooltipPlacement
-
keysUsed?
string[]
-
disable?
(() => void)
-
enable?
(() => void)
-
tooltipContent?
string
-
tooltipEl?
MediaTooltip
-
nativeEl?
DocumentFragment
-
preventClick?
boolean
-
handleClick?
(() => void)
-
mediaPaused?
boolean
-
onTransitionStartCapture?
TransitionEventHandler<MediaPlayButton>
-
onTransitionStart?
TransitionEventHandler<MediaPlayButton>
-
onTransitionRunCapture?
TransitionEventHandler<MediaPlayButton>
-
onTransitionRun?
TransitionEventHandler<MediaPlayButton>
-
onTransitionEndCapture?
TransitionEventHandler<MediaPlayButton>
-
onTransitionEnd?
TransitionEventHandler<MediaPlayButton>
-
onTransitionCancelCapture?
TransitionEventHandler<MediaPlayButton>
-
onTransitionCancel?
TransitionEventHandler<MediaPlayButton>
-
onBeforeToggle?
ToggleEventHandler<MediaPlayButton>
-
onToggle?
ToggleEventHandler<MediaPlayButton>
-
onAnimationIterationCapture?
AnimationEventHandler<MediaPlayButton>
-
onAnimationIteration?
AnimationEventHandler<MediaPlayButton>
-
onAnimationEndCapture?
AnimationEventHandler<MediaPlayButton>
-
onAnimationEnd?
AnimationEventHandler<MediaPlayButton>
-
onAnimationStartCapture?
AnimationEventHandler<MediaPlayButton>
-
onAnimationStart?
AnimationEventHandler<MediaPlayButton>
-
onWheelCapture?
WheelEventHandler<MediaPlayButton>
-
onWheel?
WheelEventHandler<MediaPlayButton>
-
onScrollEndCapture?
UIEventHandler<MediaPlayButton>
-
onScrollEnd?
UIEventHandler<MediaPlayButton>
-
onScrollCapture?
UIEventHandler<MediaPlayButton>
-
onScroll?
UIEventHandler<MediaPlayButton>
-
onLostPointerCaptureCapture?
PointerEventHandler<MediaPlayButton>
-
onLostPointerCapture?
PointerEventHandler<MediaPlayButton>
-
onGotPointerCaptureCapture?
PointerEventHandler<MediaPlayButton>
-
onGotPointerCapture?
PointerEventHandler<MediaPlayButton>
-
onPointerOutCapture?
PointerEventHandler<MediaPlayButton>
-
onPointerOut?
PointerEventHandler<MediaPlayButton>
-
onPointerOverCapture?
PointerEventHandler<MediaPlayButton>
-
onPointerOver?
PointerEventHandler<MediaPlayButton>
-
onPointerLeave?
PointerEventHandler<MediaPlayButton>
-
onPointerEnter?
PointerEventHandler<MediaPlayButton>
-
onPointerCancelCapture?
PointerEventHandler<MediaPlayButton>
-
onPointerCancel?
PointerEventHandler<MediaPlayButton>
-
onPointerUpCapture?
PointerEventHandler<MediaPlayButton>
-
onPointerUp?
PointerEventHandler<MediaPlayButton>
-
onPointerMoveCapture?
PointerEventHandler<MediaPlayButton>
-
onPointerMove?
PointerEventHandler<MediaPlayButton>
-
onPointerDownCapture?
PointerEventHandler<MediaPlayButton>
-
onPointerDown?
PointerEventHandler<MediaPlayButton>
-
onTouchStartCapture?
TouchEventHandler<MediaPlayButton>
-
onTouchStart?
TouchEventHandler<MediaPlayButton>
-
onTouchMoveCapture?
TouchEventHandler<MediaPlayButton>
-
onTouchMove?
TouchEventHandler<MediaPlayButton>
-
onTouchEndCapture?
TouchEventHandler<MediaPlayButton>
-
onTouchEnd?
TouchEventHandler<MediaPlayButton>
-
onTouchCancelCapture?
TouchEventHandler<MediaPlayButton>
-
onTouchCancel?
TouchEventHandler<MediaPlayButton>
-
onSelectCapture?
ReactEventHandler<MediaPlayButton>
-
onSelect?
ReactEventHandler<MediaPlayButton>
-
onMouseUpCapture?
MouseEventHandler<MediaPlayButton>
-
onMouseUp?
MouseEventHandler<MediaPlayButton>
-
onMouseOverCapture?
MouseEventHandler<MediaPlayButton>
-
onMouseOver?
MouseEventHandler<MediaPlayButton>
-
onMouseOutCapture?
MouseEventHandler<MediaPlayButton>
-
onMouseOut?
MouseEventHandler<MediaPlayButton>
-
onMouseMoveCapture?
MouseEventHandler<MediaPlayButton>
-
onMouseMove?
MouseEventHandler<MediaPlayButton>
-
onMouseLeave?
MouseEventHandler<MediaPlayButton>
-
onMouseEnter?
MouseEventHandler<MediaPlayButton>
-
onMouseDownCapture?
MouseEventHandler<MediaPlayButton>
-
onMouseDown?
MouseEventHandler<MediaPlayButton>
-
onDropCapture?
DragEventHandler<MediaPlayButton>
-
onDrop?
DragEventHandler<MediaPlayButton>
-
onDragStartCapture?
DragEventHandler<MediaPlayButton>
-
onDragStart?
DragEventHandler<MediaPlayButton>
-
onDragOverCapture?
DragEventHandler<MediaPlayButton>
-
onDragOver?
DragEventHandler<MediaPlayButton>
-
onDragLeaveCapture?
DragEventHandler<MediaPlayButton>
-
onDragLeave?
DragEventHandler<MediaPlayButton>
-
onDragExitCapture?
DragEventHandler<MediaPlayButton>
-
onDragExit?
DragEventHandler<MediaPlayButton>
-
onDragEnterCapture?
DragEventHandler<MediaPlayButton>
-
onDragEnter?
DragEventHandler<MediaPlayButton>
-
onDragEndCapture?
DragEventHandler<MediaPlayButton>
-
onDragEnd?
DragEventHandler<MediaPlayButton>
-
onDragCapture?
DragEventHandler<MediaPlayButton>
-
onDrag?
DragEventHandler<MediaPlayButton>
-
onDoubleClickCapture?
MouseEventHandler<MediaPlayButton>
-
onDoubleClick?
MouseEventHandler<MediaPlayButton>
-
onContextMenuCapture?
MouseEventHandler<MediaPlayButton>
-
onContextMenu?
MouseEventHandler<MediaPlayButton>
-
onClickCapture?
MouseEventHandler<MediaPlayButton>
-
onClick?
MouseEventHandler<MediaPlayButton>
-
onAuxClickCapture?
MouseEventHandler<MediaPlayButton>
-
onAuxClick?
MouseEventHandler<MediaPlayButton>
-
onWaitingCapture?
ReactEventHandler<MediaPlayButton>
-
onWaiting?
ReactEventHandler<MediaPlayButton>
-
onVolumeChangeCapture?
ReactEventHandler<MediaPlayButton>
-
onVolumeChange?
ReactEventHandler<MediaPlayButton>
-
onTimeUpdateCapture?
ReactEventHandler<MediaPlayButton>
-
onTimeUpdate?
ReactEventHandler<MediaPlayButton>
-
onSuspendCapture?
ReactEventHandler<MediaPlayButton>
-
onSuspend?
ReactEventHandler<MediaPlayButton>
-
onStalledCapture?
ReactEventHandler<MediaPlayButton>
-
onStalled?
ReactEventHandler<MediaPlayButton>
-
onSeekingCapture?
ReactEventHandler<MediaPlayButton>
-
onSeeking?
ReactEventHandler<MediaPlayButton>
-
onSeekedCapture?
ReactEventHandler<MediaPlayButton>
-
onSeeked?
ReactEventHandler<MediaPlayButton>
-
onResizeCapture?
ReactEventHandler<MediaPlayButton>
-
onResize?
ReactEventHandler<MediaPlayButton>
-
onRateChangeCapture?
ReactEventHandler<MediaPlayButton>
-
onRateChange?
ReactEventHandler<MediaPlayButton>
-
onProgressCapture?
ReactEventHandler<MediaPlayButton>
-
onProgress?
ReactEventHandler<MediaPlayButton>
-
onPlayingCapture?
ReactEventHandler<MediaPlayButton>
-
onPlaying?
ReactEventHandler<MediaPlayButton>
-
onPlayCapture?
ReactEventHandler<MediaPlayButton>
-
onPlay?
ReactEventHandler<MediaPlayButton>
-
onPauseCapture?
ReactEventHandler<MediaPlayButton>
-
onPause?
ReactEventHandler<MediaPlayButton>
-
onLoadStartCapture?
ReactEventHandler<MediaPlayButton>
-
onLoadStart?
ReactEventHandler<MediaPlayButton>
-
onLoadedMetadataCapture?
ReactEventHandler<MediaPlayButton>
-
onLoadedMetadata?
ReactEventHandler<MediaPlayButton>
-
onLoadedDataCapture?
ReactEventHandler<MediaPlayButton>
-
onLoadedData?
ReactEventHandler<MediaPlayButton>
-
onEndedCapture?
ReactEventHandler<MediaPlayButton>
-
onEnded?
ReactEventHandler<MediaPlayButton>
-
onEncryptedCapture?
ReactEventHandler<MediaPlayButton>
-
onEncrypted?
ReactEventHandler<MediaPlayButton>
-
onEmptiedCapture?
ReactEventHandler<MediaPlayButton>
-
onEmptied?
ReactEventHandler<MediaPlayButton>
-
onDurationChangeCapture?
ReactEventHandler<MediaPlayButton>
-
onDurationChange?
ReactEventHandler<MediaPlayButton>
-
onCanPlayThroughCapture?
ReactEventHandler<MediaPlayButton>
-
onCanPlayThrough?
ReactEventHandler<MediaPlayButton>
-
onCanPlayCapture?
ReactEventHandler<MediaPlayButton>
-
onCanPlay?
ReactEventHandler<MediaPlayButton>
-
onAbortCapture?
ReactEventHandler<MediaPlayButton>
-
onAbort?
ReactEventHandler<MediaPlayButton>
-
onKeyUpCapture?
KeyboardEventHandler<MediaPlayButton>
-
onKeyUp?
KeyboardEventHandler<MediaPlayButton>
-
onKeyDownCapture?
KeyboardEventHandler<MediaPlayButton>
-
onKeyDown?
KeyboardEventHandler<MediaPlayButton>
-
onErrorCapture?
ReactEventHandler<MediaPlayButton>
-
onError?
ReactEventHandler<MediaPlayButton>
-
onLoadCapture?
ReactEventHandler<MediaPlayButton>
-
onLoad?
ReactEventHandler<MediaPlayButton>
-
onInvalidCapture?
FormEventHandler<MediaPlayButton>
-
onInvalid?
FormEventHandler<MediaPlayButton>
-
onSubmitCapture?
FormEventHandler<MediaPlayButton>
-
onSubmit?
FormEventHandler<MediaPlayButton>
-
onResetCapture?
FormEventHandler<MediaPlayButton>
-
onReset?
FormEventHandler<MediaPlayButton>
-
onInputCapture?
FormEventHandler<MediaPlayButton>
-
onInput?
FormEventHandler<MediaPlayButton>
-
onBeforeInputCapture?
FormEventHandler<MediaPlayButton>
-
onBeforeInput?
FormEventHandler<MediaPlayButton>
-
onChangeCapture?
FormEventHandler<MediaPlayButton>
-
onChange?
FormEventHandler<MediaPlayButton>
-
onBlurCapture?
FocusEventHandler<MediaPlayButton>
-
onBlur?
FocusEventHandler<MediaPlayButton>
-
onFocusCapture?
FocusEventHandler<MediaPlayButton>
-
onFocus?
FocusEventHandler<MediaPlayButton>
-
onCompositionUpdateCapture?
CompositionEventHandler<MediaPlayButton>
-
onCompositionUpdate?
CompositionEventHandler<MediaPlayButton>
-
onCompositionStartCapture?
CompositionEventHandler<MediaPlayButton>
-
onCompositionStart?
CompositionEventHandler<MediaPlayButton>
-
onCompositionEndCapture?
CompositionEventHandler<MediaPlayButton>
-
onCompositionEnd?
CompositionEventHandler<MediaPlayButton>
-
onPasteCapture?
ClipboardEventHandler<MediaPlayButton>
-
onPaste?
ClipboardEventHandler<MediaPlayButton>
-
onCutCapture?
ClipboardEventHandler<MediaPlayButton>
-
onCut?
ClipboardEventHandler<MediaPlayButton>
-
onCopyCapture?
ClipboardEventHandler<MediaPlayButton>
-
onCopy?
ClipboardEventHandler<MediaPlayButton>
-
dangerouslySetInnerHTML?
{ __html: string | TrustedHTML; }
-
aria-valuetext?
string
-
aria-valuenow?
number
-
aria-valuemin?
number
-
aria-valuemax?
number
-
aria-sort?
"none" | "ascending" | "descending" | "other"
-
aria-setsize?
number
-
aria-selected?
Booleanish
-
aria-rowspan?
number
-
aria-rowindextext?
string
-
aria-rowindex?
number
-
aria-rowcount?
number
-
aria-roledescription?
string
-
aria-required?
Booleanish
-
aria-relevant?
"text" | "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals"
-
aria-readonly?
Booleanish
-
aria-pressed?
boolean | "true" | "false" | "mixed"
-
aria-posinset?
number
-
aria-placeholder?
string
-
aria-owns?
string
-
aria-orientation?
"horizontal" | "vertical"
-
aria-multiselectable?
Booleanish
-
aria-multiline?
Booleanish
-
aria-modal?
Booleanish
-
aria-live?
"off" | "assertive" | "polite"
-
aria-level?
number
-
aria-labelledby?
string
-
aria-label?
string
-
aria-keyshortcuts?
string
-
aria-invalid?
boolean | "true" | "false" | "grammar" | "spelling"
-
aria-hidden?
Booleanish
-
aria-haspopup?
boolean | "true" | "false" | "dialog" | "grid" | "listbox" | "menu" | "tree"
-
aria-flowto?
string
-
aria-expanded?
Booleanish
-
aria-errormessage?
string
-
aria-disabled?
Booleanish
-
aria-details?
string
-
aria-description?
string
-
aria-describedby?
string
-
aria-current?
boolean | "true" | "false" | "page" | "step" | "location" | "date" | "time"
-
aria-controls?
string
-
aria-colspan?
number
-
aria-colindextext?
string
-
aria-colindex?
number
-
aria-colcount?
number
-
aria-checked?
boolean | "true" | "false" | "mixed"
-
aria-busy?
Booleanish
-
aria-brailleroledescription?
string
-
aria-braillelabel?
string
-
aria-autocomplete?
"list" | "none" | "inline" | "both"
-
aria-atomic?
Booleanish
-
aria-activedescendant?
string
-
exportparts?
string
-
is?
string
-
popoverTarget?
string
-
popoverTargetAction?
"toggle" | "show" | "hide"
-
unselectable?
"off" | "on"
-
security?
string
-
results?
number
-
itemRef?
string
-
itemID?
string
-
itemType?
string
-
itemScope?
boolean
-
itemProp?
string
-
color?
string
-
autoSave?
string
-
autoCorrect?
string
-
vocab?
string
-
typeof?
string
-
rev?
string
-
resource?
string
-
rel?
string
-
property?
string
-
inlist?
any
-
datatype?
string
-
content?
string
-
about?
string
-
radioGroup?
string
-
spellCheck?
Booleanish
-
contextMenu?
string
-
autoFocus?
boolean
-
autoCapitalize?
"none" | (string & {}) | "off" | "on" | "sentences" | "words" | "characters"
-
suppressHydrationWarning?
boolean
-
suppressContentEditableWarning?
boolean
-
defaultValue?
string | number | readonly string[]
-
defaultChecked?
boolean
-
tabIndex?
number
-
nonce?
string
-
inputMode?
"none" | "search" | "text" | "tel" | "url" | "email" | "numeric" | "decimal"
-
enterKeyHint?
"search" | "enter" | "done" | "go" | "next" | "previous" | "send"
-
contentEditable?
Booleanish | "inherit" | "plaintext-only"
-
style?
CSSProperties
-
children?
ReactNode
-
role?
AriaRole
-
slot?
string
-
prefix?
string
-
part?
string
-
id?
string
-
className?
string
-
translate?
"yes" | "no"
-
title?
string
-
popover?
"" | "auto" | "manual"
-
lang?
string
-
inert?
boolean
-
hidden?
boolean
-
draggable?
Booleanish
-
dir?
string
-
accessKey?
string
-
aria-dropeffect?
"link" | "none" | "copy" | "execute" | "move" | "popup"
-
aria-grabbed?
Booleanish
-
onKeyPress?
KeyboardEventHandler<MediaPlayButton>
-
onKeyPressCapture?
KeyboardEventHandler<MediaPlayButton>
-

VideoPlayerSeekBackwardButton

The VideoPlayerSeekBackwardButton component is used to seek backward in the video player.

PropTypeDefault
key?
Key | null
-
ref?
Ref<MediaSeekBackwardButton>
-
noTooltip?
boolean
-
disabled?
boolean
-
mediaController?
string
-
tooltipPlacement?
TooltipPlacement
-
keysUsed?
string[]
-
disable?
(() => void)
-
enable?
(() => void)
-
tooltipContent?
string
-
tooltipEl?
MediaTooltip
-
nativeEl?
DocumentFragment
-
preventClick?
boolean
-
handleClick?
(() => void)
-
mediaCurrentTime?
number
-
seekOffset?
number
-
onTransitionStartCapture?
TransitionEventHandler<MediaSeekBackwardButton>
-
onTransitionStart?
TransitionEventHandler<MediaSeekBackwardButton>
-
onTransitionRunCapture?
TransitionEventHandler<MediaSeekBackwardButton>
-
onTransitionRun?
TransitionEventHandler<MediaSeekBackwardButton>
-
onTransitionEndCapture?
TransitionEventHandler<MediaSeekBackwardButton>
-
onTransitionEnd?
TransitionEventHandler<MediaSeekBackwardButton>
-
onTransitionCancelCapture?
TransitionEventHandler<MediaSeekBackwardButton>
-
onTransitionCancel?
TransitionEventHandler<MediaSeekBackwardButton>
-
onBeforeToggle?
ToggleEventHandler<MediaSeekBackwardButton>
-
onToggle?
ToggleEventHandler<MediaSeekBackwardButton>
-
onAnimationIterationCapture?
AnimationEventHandler<MediaSeekBackwardButton>
-
onAnimationIteration?
AnimationEventHandler<MediaSeekBackwardButton>
-
onAnimationEndCapture?
AnimationEventHandler<MediaSeekBackwardButton>
-
onAnimationEnd?
AnimationEventHandler<MediaSeekBackwardButton>
-
onAnimationStartCapture?
AnimationEventHandler<MediaSeekBackwardButton>
-
onAnimationStart?
AnimationEventHandler<MediaSeekBackwardButton>
-
onWheelCapture?
WheelEventHandler<MediaSeekBackwardButton>
-
onWheel?
WheelEventHandler<MediaSeekBackwardButton>
-
onScrollEndCapture?
UIEventHandler<MediaSeekBackwardButton>
-
onScrollEnd?
UIEventHandler<MediaSeekBackwardButton>
-
onScrollCapture?
UIEventHandler<MediaSeekBackwardButton>
-
onScroll?
UIEventHandler<MediaSeekBackwardButton>
-
onLostPointerCaptureCapture?
PointerEventHandler<MediaSeekBackwardButton>
-
onLostPointerCapture?
PointerEventHandler<MediaSeekBackwardButton>
-
onGotPointerCaptureCapture?
PointerEventHandler<MediaSeekBackwardButton>
-
onGotPointerCapture?
PointerEventHandler<MediaSeekBackwardButton>
-
onPointerOutCapture?
PointerEventHandler<MediaSeekBackwardButton>
-
onPointerOut?
PointerEventHandler<MediaSeekBackwardButton>
-
onPointerOverCapture?
PointerEventHandler<MediaSeekBackwardButton>
-
onPointerOver?
PointerEventHandler<MediaSeekBackwardButton>
-
onPointerLeave?
PointerEventHandler<MediaSeekBackwardButton>
-
onPointerEnter?
PointerEventHandler<MediaSeekBackwardButton>
-
onPointerCancelCapture?
PointerEventHandler<MediaSeekBackwardButton>
-
onPointerCancel?
PointerEventHandler<MediaSeekBackwardButton>
-
onPointerUpCapture?
PointerEventHandler<MediaSeekBackwardButton>
-
onPointerUp?
PointerEventHandler<MediaSeekBackwardButton>
-
onPointerMoveCapture?
PointerEventHandler<MediaSeekBackwardButton>
-
onPointerMove?
PointerEventHandler<MediaSeekBackwardButton>
-
onPointerDownCapture?
PointerEventHandler<MediaSeekBackwardButton>
-
onPointerDown?
PointerEventHandler<MediaSeekBackwardButton>
-
onTouchStartCapture?
TouchEventHandler<MediaSeekBackwardButton>
-
onTouchStart?
TouchEventHandler<MediaSeekBackwardButton>
-
onTouchMoveCapture?
TouchEventHandler<MediaSeekBackwardButton>
-
onTouchMove?
TouchEventHandler<MediaSeekBackwardButton>
-
onTouchEndCapture?
TouchEventHandler<MediaSeekBackwardButton>
-
onTouchEnd?
TouchEventHandler<MediaSeekBackwardButton>
-
onTouchCancelCapture?
TouchEventHandler<MediaSeekBackwardButton>
-
onTouchCancel?
TouchEventHandler<MediaSeekBackwardButton>
-
onSelectCapture?
ReactEventHandler<MediaSeekBackwardButton>
-
onSelect?
ReactEventHandler<MediaSeekBackwardButton>
-
onMouseUpCapture?
MouseEventHandler<MediaSeekBackwardButton>
-
onMouseUp?
MouseEventHandler<MediaSeekBackwardButton>
-
onMouseOverCapture?
MouseEventHandler<MediaSeekBackwardButton>
-
onMouseOver?
MouseEventHandler<MediaSeekBackwardButton>
-
onMouseOutCapture?
MouseEventHandler<MediaSeekBackwardButton>
-
onMouseOut?
MouseEventHandler<MediaSeekBackwardButton>
-
onMouseMoveCapture?
MouseEventHandler<MediaSeekBackwardButton>
-
onMouseMove?
MouseEventHandler<MediaSeekBackwardButton>
-
onMouseLeave?
MouseEventHandler<MediaSeekBackwardButton>
-
onMouseEnter?
MouseEventHandler<MediaSeekBackwardButton>
-
onMouseDownCapture?
MouseEventHandler<MediaSeekBackwardButton>
-
onMouseDown?
MouseEventHandler<MediaSeekBackwardButton>
-
onDropCapture?
DragEventHandler<MediaSeekBackwardButton>
-
onDrop?
DragEventHandler<MediaSeekBackwardButton>
-
onDragStartCapture?
DragEventHandler<MediaSeekBackwardButton>
-
onDragStart?
DragEventHandler<MediaSeekBackwardButton>
-
onDragOverCapture?
DragEventHandler<MediaSeekBackwardButton>
-
onDragOver?
DragEventHandler<MediaSeekBackwardButton>
-
onDragLeaveCapture?
DragEventHandler<MediaSeekBackwardButton>
-
onDragLeave?
DragEventHandler<MediaSeekBackwardButton>
-
onDragExitCapture?
DragEventHandler<MediaSeekBackwardButton>
-
onDragExit?
DragEventHandler<MediaSeekBackwardButton>
-
onDragEnterCapture?
DragEventHandler<MediaSeekBackwardButton>
-
onDragEnter?
DragEventHandler<MediaSeekBackwardButton>
-
onDragEndCapture?
DragEventHandler<MediaSeekBackwardButton>
-
onDragEnd?
DragEventHandler<MediaSeekBackwardButton>
-
onDragCapture?
DragEventHandler<MediaSeekBackwardButton>
-
onDrag?
DragEventHandler<MediaSeekBackwardButton>
-
onDoubleClickCapture?
MouseEventHandler<MediaSeekBackwardButton>
-
onDoubleClick?
MouseEventHandler<MediaSeekBackwardButton>
-
onContextMenuCapture?
MouseEventHandler<MediaSeekBackwardButton>
-
onContextMenu?
MouseEventHandler<MediaSeekBackwardButton>
-
onClickCapture?
MouseEventHandler<MediaSeekBackwardButton>
-
onClick?
MouseEventHandler<MediaSeekBackwardButton>
-
onAuxClickCapture?
MouseEventHandler<MediaSeekBackwardButton>
-
onAuxClick?
MouseEventHandler<MediaSeekBackwardButton>
-
onWaitingCapture?
ReactEventHandler<MediaSeekBackwardButton>
-
onWaiting?
ReactEventHandler<MediaSeekBackwardButton>
-
onVolumeChangeCapture?
ReactEventHandler<MediaSeekBackwardButton>
-
onVolumeChange?
ReactEventHandler<MediaSeekBackwardButton>
-
onTimeUpdateCapture?
ReactEventHandler<MediaSeekBackwardButton>
-
onTimeUpdate?
ReactEventHandler<MediaSeekBackwardButton>
-
onSuspendCapture?
ReactEventHandler<MediaSeekBackwardButton>
-
onSuspend?
ReactEventHandler<MediaSeekBackwardButton>
-
onStalledCapture?
ReactEventHandler<MediaSeekBackwardButton>
-
onStalled?
ReactEventHandler<MediaSeekBackwardButton>
-
onSeekingCapture?
ReactEventHandler<MediaSeekBackwardButton>
-
onSeeking?
ReactEventHandler<MediaSeekBackwardButton>
-
onSeekedCapture?
ReactEventHandler<MediaSeekBackwardButton>
-
onSeeked?
ReactEventHandler<MediaSeekBackwardButton>
-
onResizeCapture?
ReactEventHandler<MediaSeekBackwardButton>
-
onResize?
ReactEventHandler<MediaSeekBackwardButton>
-
onRateChangeCapture?
ReactEventHandler<MediaSeekBackwardButton>
-
onRateChange?
ReactEventHandler<MediaSeekBackwardButton>
-
onProgressCapture?
ReactEventHandler<MediaSeekBackwardButton>
-
onProgress?
ReactEventHandler<MediaSeekBackwardButton>
-
onPlayingCapture?
ReactEventHandler<MediaSeekBackwardButton>
-
onPlaying?
ReactEventHandler<MediaSeekBackwardButton>
-
onPlayCapture?
ReactEventHandler<MediaSeekBackwardButton>
-
onPlay?
ReactEventHandler<MediaSeekBackwardButton>
-
onPauseCapture?
ReactEventHandler<MediaSeekBackwardButton>
-
onPause?
ReactEventHandler<MediaSeekBackwardButton>
-
onLoadStartCapture?
ReactEventHandler<MediaSeekBackwardButton>
-
onLoadStart?
ReactEventHandler<MediaSeekBackwardButton>
-
onLoadedMetadataCapture?
ReactEventHandler<MediaSeekBackwardButton>
-
onLoadedMetadata?
ReactEventHandler<MediaSeekBackwardButton>
-
onLoadedDataCapture?
ReactEventHandler<MediaSeekBackwardButton>
-
onLoadedData?
ReactEventHandler<MediaSeekBackwardButton>
-
onEndedCapture?
ReactEventHandler<MediaSeekBackwardButton>
-
onEnded?
ReactEventHandler<MediaSeekBackwardButton>
-
onEncryptedCapture?
ReactEventHandler<MediaSeekBackwardButton>
-
onEncrypted?
ReactEventHandler<MediaSeekBackwardButton>
-
onEmptiedCapture?
ReactEventHandler<MediaSeekBackwardButton>
-
onEmptied?
ReactEventHandler<MediaSeekBackwardButton>
-
onDurationChangeCapture?
ReactEventHandler<MediaSeekBackwardButton>
-
onDurationChange?
ReactEventHandler<MediaSeekBackwardButton>
-
onCanPlayThroughCapture?
ReactEventHandler<MediaSeekBackwardButton>
-
onCanPlayThrough?
ReactEventHandler<MediaSeekBackwardButton>
-
onCanPlayCapture?
ReactEventHandler<MediaSeekBackwardButton>
-
onCanPlay?
ReactEventHandler<MediaSeekBackwardButton>
-
onAbortCapture?
ReactEventHandler<MediaSeekBackwardButton>
-
onAbort?
ReactEventHandler<MediaSeekBackwardButton>
-
onKeyUpCapture?
KeyboardEventHandler<MediaSeekBackwardButton>
-
onKeyUp?
KeyboardEventHandler<MediaSeekBackwardButton>
-
onKeyDownCapture?
KeyboardEventHandler<MediaSeekBackwardButton>
-
onKeyDown?
KeyboardEventHandler<MediaSeekBackwardButton>
-
onErrorCapture?
ReactEventHandler<MediaSeekBackwardButton>
-
onError?
ReactEventHandler<MediaSeekBackwardButton>
-
onLoadCapture?
ReactEventHandler<MediaSeekBackwardButton>
-
onLoad?
ReactEventHandler<MediaSeekBackwardButton>
-
onInvalidCapture?
FormEventHandler<MediaSeekBackwardButton>
-
onInvalid?
FormEventHandler<MediaSeekBackwardButton>
-
onSubmitCapture?
FormEventHandler<MediaSeekBackwardButton>
-
onSubmit?
FormEventHandler<MediaSeekBackwardButton>
-
onResetCapture?
FormEventHandler<MediaSeekBackwardButton>
-
onReset?
FormEventHandler<MediaSeekBackwardButton>
-
onInputCapture?
FormEventHandler<MediaSeekBackwardButton>
-
onInput?
FormEventHandler<MediaSeekBackwardButton>
-
onBeforeInputCapture?
FormEventHandler<MediaSeekBackwardButton>
-
onBeforeInput?
FormEventHandler<MediaSeekBackwardButton>
-
onChangeCapture?
FormEventHandler<MediaSeekBackwardButton>
-
onChange?
FormEventHandler<MediaSeekBackwardButton>
-
onBlurCapture?
FocusEventHandler<MediaSeekBackwardButton>
-
onBlur?
FocusEventHandler<MediaSeekBackwardButton>
-
onFocusCapture?
FocusEventHandler<MediaSeekBackwardButton>
-
onFocus?
FocusEventHandler<MediaSeekBackwardButton>
-
onCompositionUpdateCapture?
CompositionEventHandler<MediaSeekBackwardButton>
-
onCompositionUpdate?
CompositionEventHandler<MediaSeekBackwardButton>
-
onCompositionStartCapture?
CompositionEventHandler<MediaSeekBackwardButton>
-
onCompositionStart?
CompositionEventHandler<MediaSeekBackwardButton>
-
onCompositionEndCapture?
CompositionEventHandler<MediaSeekBackwardButton>
-
onCompositionEnd?
CompositionEventHandler<MediaSeekBackwardButton>
-
onPasteCapture?
ClipboardEventHandler<MediaSeekBackwardButton>
-
onPaste?
ClipboardEventHandler<MediaSeekBackwardButton>
-
onCutCapture?
ClipboardEventHandler<MediaSeekBackwardButton>
-
onCut?
ClipboardEventHandler<MediaSeekBackwardButton>
-
onCopyCapture?
ClipboardEventHandler<MediaSeekBackwardButton>
-
onCopy?
ClipboardEventHandler<MediaSeekBackwardButton>
-
dangerouslySetInnerHTML?
{ __html: string | TrustedHTML; }
-
aria-valuetext?
string
-
aria-valuenow?
number
-
aria-valuemin?
number
-
aria-valuemax?
number
-
aria-sort?
"none" | "ascending" | "descending" | "other"
-
aria-setsize?
number
-
aria-selected?
Booleanish
-
aria-rowspan?
number
-
aria-rowindextext?
string
-
aria-rowindex?
number
-
aria-rowcount?
number
-
aria-roledescription?
string
-
aria-required?
Booleanish
-
aria-relevant?
"text" | "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals"
-
aria-readonly?
Booleanish
-
aria-pressed?
boolean | "true" | "false" | "mixed"
-
aria-posinset?
number
-
aria-placeholder?
string
-
aria-owns?
string
-
aria-orientation?
"horizontal" | "vertical"
-
aria-multiselectable?
Booleanish
-
aria-multiline?
Booleanish
-
aria-modal?
Booleanish
-
aria-live?
"off" | "assertive" | "polite"
-
aria-level?
number
-
aria-labelledby?
string
-
aria-label?
string
-
aria-keyshortcuts?
string
-
aria-invalid?
boolean | "true" | "false" | "grammar" | "spelling"
-
aria-hidden?
Booleanish
-
aria-haspopup?
boolean | "true" | "false" | "dialog" | "grid" | "listbox" | "menu" | "tree"
-
aria-flowto?
string
-
aria-expanded?
Booleanish
-
aria-errormessage?
string
-
aria-disabled?
Booleanish
-
aria-details?
string
-
aria-description?
string
-
aria-describedby?
string
-
aria-current?
boolean | "true" | "false" | "page" | "step" | "location" | "date" | "time"
-
aria-controls?
string
-
aria-colspan?
number
-
aria-colindextext?
string
-
aria-colindex?
number
-
aria-colcount?
number
-
aria-checked?
boolean | "true" | "false" | "mixed"
-
aria-busy?
Booleanish
-
aria-brailleroledescription?
string
-
aria-braillelabel?
string
-
aria-autocomplete?
"list" | "none" | "inline" | "both"
-
aria-atomic?
Booleanish
-
aria-activedescendant?
string
-
exportparts?
string
-
is?
string
-
popoverTarget?
string
-
popoverTargetAction?
"toggle" | "show" | "hide"
-
unselectable?
"off" | "on"
-
security?
string
-
results?
number
-
itemRef?
string
-
itemID?
string
-
itemType?
string
-
itemScope?
boolean
-
itemProp?
string
-
color?
string
-
autoSave?
string
-
autoCorrect?
string
-
vocab?
string
-
typeof?
string
-
rev?
string
-
resource?
string
-
rel?
string
-
property?
string
-
inlist?
any
-
datatype?
string
-
content?
string
-
about?
string
-
radioGroup?
string
-
spellCheck?
Booleanish
-
contextMenu?
string
-
autoFocus?
boolean
-
autoCapitalize?
"none" | (string & {}) | "off" | "on" | "sentences" | "words" | "characters"
-
suppressHydrationWarning?
boolean
-
suppressContentEditableWarning?
boolean
-
defaultValue?
string | number | readonly string[]
-
defaultChecked?
boolean
-
tabIndex?
number
-
nonce?
string
-
inputMode?
"none" | "search" | "text" | "tel" | "url" | "email" | "numeric" | "decimal"
-
enterKeyHint?
"search" | "enter" | "done" | "go" | "next" | "previous" | "send"
-
contentEditable?
Booleanish | "inherit" | "plaintext-only"
-
style?
CSSProperties
-
children?
ReactNode
-
role?
AriaRole
-
slot?
string
-
prefix?
string
-
part?
string
-
id?
string
-
className?
string
-
translate?
"yes" | "no"
-
title?
string
-
popover?
"" | "auto" | "manual"
-
lang?
string
-
inert?
boolean
-
hidden?
boolean
-
draggable?
Booleanish
-
dir?
string
-
accessKey?
string
-
aria-dropeffect?
"link" | "none" | "copy" | "execute" | "move" | "popup"
-
aria-grabbed?
Booleanish
-
onKeyPress?
KeyboardEventHandler<MediaSeekBackwardButton>
-
onKeyPressCapture?
KeyboardEventHandler<MediaSeekBackwardButton>
-

VideoPlayerSeekForwardButton

The VideoPlayerSeekForwardButton component is used to seek forward in the video player.

PropTypeDefault
key?
Key | null
-
ref?
Ref<MediaSeekForwardButton>
-
noTooltip?
boolean
-
disabled?
boolean
-
mediaController?
string
-
tooltipPlacement?
TooltipPlacement
-
keysUsed?
string[]
-
disable?
(() => void)
-
enable?
(() => void)
-
tooltipContent?
string
-
tooltipEl?
MediaTooltip
-
nativeEl?
DocumentFragment
-
preventClick?
boolean
-
handleClick?
(() => void)
-
mediaCurrentTime?
number
-
seekOffset?
number
-
onTransitionStartCapture?
TransitionEventHandler<MediaSeekForwardButton>
-
onTransitionStart?
TransitionEventHandler<MediaSeekForwardButton>
-
onTransitionRunCapture?
TransitionEventHandler<MediaSeekForwardButton>
-
onTransitionRun?
TransitionEventHandler<MediaSeekForwardButton>
-
onTransitionEndCapture?
TransitionEventHandler<MediaSeekForwardButton>
-
onTransitionEnd?
TransitionEventHandler<MediaSeekForwardButton>
-
onTransitionCancelCapture?
TransitionEventHandler<MediaSeekForwardButton>
-
onTransitionCancel?
TransitionEventHandler<MediaSeekForwardButton>
-
onBeforeToggle?
ToggleEventHandler<MediaSeekForwardButton>
-
onToggle?
ToggleEventHandler<MediaSeekForwardButton>
-
onAnimationIterationCapture?
AnimationEventHandler<MediaSeekForwardButton>
-
onAnimationIteration?
AnimationEventHandler<MediaSeekForwardButton>
-
onAnimationEndCapture?
AnimationEventHandler<MediaSeekForwardButton>
-
onAnimationEnd?
AnimationEventHandler<MediaSeekForwardButton>
-
onAnimationStartCapture?
AnimationEventHandler<MediaSeekForwardButton>
-
onAnimationStart?
AnimationEventHandler<MediaSeekForwardButton>
-
onWheelCapture?
WheelEventHandler<MediaSeekForwardButton>
-
onWheel?
WheelEventHandler<MediaSeekForwardButton>
-
onScrollEndCapture?
UIEventHandler<MediaSeekForwardButton>
-
onScrollEnd?
UIEventHandler<MediaSeekForwardButton>
-
onScrollCapture?
UIEventHandler<MediaSeekForwardButton>
-
onScroll?
UIEventHandler<MediaSeekForwardButton>
-
onLostPointerCaptureCapture?
PointerEventHandler<MediaSeekForwardButton>
-
onLostPointerCapture?
PointerEventHandler<MediaSeekForwardButton>
-
onGotPointerCaptureCapture?
PointerEventHandler<MediaSeekForwardButton>
-
onGotPointerCapture?
PointerEventHandler<MediaSeekForwardButton>
-
onPointerOutCapture?
PointerEventHandler<MediaSeekForwardButton>
-
onPointerOut?
PointerEventHandler<MediaSeekForwardButton>
-
onPointerOverCapture?
PointerEventHandler<MediaSeekForwardButton>
-
onPointerOver?
PointerEventHandler<MediaSeekForwardButton>
-
onPointerLeave?
PointerEventHandler<MediaSeekForwardButton>
-
onPointerEnter?
PointerEventHandler<MediaSeekForwardButton>
-
onPointerCancelCapture?
PointerEventHandler<MediaSeekForwardButton>
-
onPointerCancel?
PointerEventHandler<MediaSeekForwardButton>
-
onPointerUpCapture?
PointerEventHandler<MediaSeekForwardButton>
-
onPointerUp?
PointerEventHandler<MediaSeekForwardButton>
-
onPointerMoveCapture?
PointerEventHandler<MediaSeekForwardButton>
-
onPointerMove?
PointerEventHandler<MediaSeekForwardButton>
-
onPointerDownCapture?
PointerEventHandler<MediaSeekForwardButton>
-
onPointerDown?
PointerEventHandler<MediaSeekForwardButton>
-
onTouchStartCapture?
TouchEventHandler<MediaSeekForwardButton>
-
onTouchStart?
TouchEventHandler<MediaSeekForwardButton>
-
onTouchMoveCapture?
TouchEventHandler<MediaSeekForwardButton>
-
onTouchMove?
TouchEventHandler<MediaSeekForwardButton>
-
onTouchEndCapture?
TouchEventHandler<MediaSeekForwardButton>
-
onTouchEnd?
TouchEventHandler<MediaSeekForwardButton>
-
onTouchCancelCapture?
TouchEventHandler<MediaSeekForwardButton>
-
onTouchCancel?
TouchEventHandler<MediaSeekForwardButton>
-
onSelectCapture?
ReactEventHandler<MediaSeekForwardButton>
-
onSelect?
ReactEventHandler<MediaSeekForwardButton>
-
onMouseUpCapture?
MouseEventHandler<MediaSeekForwardButton>
-
onMouseUp?
MouseEventHandler<MediaSeekForwardButton>
-
onMouseOverCapture?
MouseEventHandler<MediaSeekForwardButton>
-
onMouseOver?
MouseEventHandler<MediaSeekForwardButton>
-
onMouseOutCapture?
MouseEventHandler<MediaSeekForwardButton>
-
onMouseOut?
MouseEventHandler<MediaSeekForwardButton>
-
onMouseMoveCapture?
MouseEventHandler<MediaSeekForwardButton>
-
onMouseMove?
MouseEventHandler<MediaSeekForwardButton>
-
onMouseLeave?
MouseEventHandler<MediaSeekForwardButton>
-
onMouseEnter?
MouseEventHandler<MediaSeekForwardButton>
-
onMouseDownCapture?
MouseEventHandler<MediaSeekForwardButton>
-
onMouseDown?
MouseEventHandler<MediaSeekForwardButton>
-
onDropCapture?
DragEventHandler<MediaSeekForwardButton>
-
onDrop?
DragEventHandler<MediaSeekForwardButton>
-
onDragStartCapture?
DragEventHandler<MediaSeekForwardButton>
-
onDragStart?
DragEventHandler<MediaSeekForwardButton>
-
onDragOverCapture?
DragEventHandler<MediaSeekForwardButton>
-
onDragOver?
DragEventHandler<MediaSeekForwardButton>
-
onDragLeaveCapture?
DragEventHandler<MediaSeekForwardButton>
-
onDragLeave?
DragEventHandler<MediaSeekForwardButton>
-
onDragExitCapture?
DragEventHandler<MediaSeekForwardButton>
-
onDragExit?
DragEventHandler<MediaSeekForwardButton>
-
onDragEnterCapture?
DragEventHandler<MediaSeekForwardButton>
-
onDragEnter?
DragEventHandler<MediaSeekForwardButton>
-
onDragEndCapture?
DragEventHandler<MediaSeekForwardButton>
-
onDragEnd?
DragEventHandler<MediaSeekForwardButton>
-
onDragCapture?
DragEventHandler<MediaSeekForwardButton>
-
onDrag?
DragEventHandler<MediaSeekForwardButton>
-
onDoubleClickCapture?
MouseEventHandler<MediaSeekForwardButton>
-
onDoubleClick?
MouseEventHandler<MediaSeekForwardButton>
-
onContextMenuCapture?
MouseEventHandler<MediaSeekForwardButton>
-
onContextMenu?
MouseEventHandler<MediaSeekForwardButton>
-
onClickCapture?
MouseEventHandler<MediaSeekForwardButton>
-
onClick?
MouseEventHandler<MediaSeekForwardButton>
-
onAuxClickCapture?
MouseEventHandler<MediaSeekForwardButton>
-
onAuxClick?
MouseEventHandler<MediaSeekForwardButton>
-
onWaitingCapture?
ReactEventHandler<MediaSeekForwardButton>
-
onWaiting?
ReactEventHandler<MediaSeekForwardButton>
-
onVolumeChangeCapture?
ReactEventHandler<MediaSeekForwardButton>
-
onVolumeChange?
ReactEventHandler<MediaSeekForwardButton>
-
onTimeUpdateCapture?
ReactEventHandler<MediaSeekForwardButton>
-
onTimeUpdate?
ReactEventHandler<MediaSeekForwardButton>
-
onSuspendCapture?
ReactEventHandler<MediaSeekForwardButton>
-
onSuspend?
ReactEventHandler<MediaSeekForwardButton>
-
onStalledCapture?
ReactEventHandler<MediaSeekForwardButton>
-
onStalled?
ReactEventHandler<MediaSeekForwardButton>
-
onSeekingCapture?
ReactEventHandler<MediaSeekForwardButton>
-
onSeeking?
ReactEventHandler<MediaSeekForwardButton>
-
onSeekedCapture?
ReactEventHandler<MediaSeekForwardButton>
-
onSeeked?
ReactEventHandler<MediaSeekForwardButton>
-
onResizeCapture?
ReactEventHandler<MediaSeekForwardButton>
-
onResize?
ReactEventHandler<MediaSeekForwardButton>
-
onRateChangeCapture?
ReactEventHandler<MediaSeekForwardButton>
-
onRateChange?
ReactEventHandler<MediaSeekForwardButton>
-
onProgressCapture?
ReactEventHandler<MediaSeekForwardButton>
-
onProgress?
ReactEventHandler<MediaSeekForwardButton>
-
onPlayingCapture?
ReactEventHandler<MediaSeekForwardButton>
-
onPlaying?
ReactEventHandler<MediaSeekForwardButton>
-
onPlayCapture?
ReactEventHandler<MediaSeekForwardButton>
-
onPlay?
ReactEventHandler<MediaSeekForwardButton>
-
onPauseCapture?
ReactEventHandler<MediaSeekForwardButton>
-
onPause?
ReactEventHandler<MediaSeekForwardButton>
-
onLoadStartCapture?
ReactEventHandler<MediaSeekForwardButton>
-
onLoadStart?
ReactEventHandler<MediaSeekForwardButton>
-
onLoadedMetadataCapture?
ReactEventHandler<MediaSeekForwardButton>
-
onLoadedMetadata?
ReactEventHandler<MediaSeekForwardButton>
-
onLoadedDataCapture?
ReactEventHandler<MediaSeekForwardButton>
-
onLoadedData?
ReactEventHandler<MediaSeekForwardButton>
-
onEndedCapture?
ReactEventHandler<MediaSeekForwardButton>
-
onEnded?
ReactEventHandler<MediaSeekForwardButton>
-
onEncryptedCapture?
ReactEventHandler<MediaSeekForwardButton>
-
onEncrypted?
ReactEventHandler<MediaSeekForwardButton>
-
onEmptiedCapture?
ReactEventHandler<MediaSeekForwardButton>
-
onEmptied?
ReactEventHandler<MediaSeekForwardButton>
-
onDurationChangeCapture?
ReactEventHandler<MediaSeekForwardButton>
-
onDurationChange?
ReactEventHandler<MediaSeekForwardButton>
-
onCanPlayThroughCapture?
ReactEventHandler<MediaSeekForwardButton>
-
onCanPlayThrough?
ReactEventHandler<MediaSeekForwardButton>
-
onCanPlayCapture?
ReactEventHandler<MediaSeekForwardButton>
-
onCanPlay?
ReactEventHandler<MediaSeekForwardButton>
-
onAbortCapture?
ReactEventHandler<MediaSeekForwardButton>
-
onAbort?
ReactEventHandler<MediaSeekForwardButton>
-
onKeyUpCapture?
KeyboardEventHandler<MediaSeekForwardButton>
-
onKeyUp?
KeyboardEventHandler<MediaSeekForwardButton>
-
onKeyDownCapture?
KeyboardEventHandler<MediaSeekForwardButton>
-
onKeyDown?
KeyboardEventHandler<MediaSeekForwardButton>
-
onErrorCapture?
ReactEventHandler<MediaSeekForwardButton>
-
onError?
ReactEventHandler<MediaSeekForwardButton>
-
onLoadCapture?
ReactEventHandler<MediaSeekForwardButton>
-
onLoad?
ReactEventHandler<MediaSeekForwardButton>
-
onInvalidCapture?
FormEventHandler<MediaSeekForwardButton>
-
onInvalid?
FormEventHandler<MediaSeekForwardButton>
-
onSubmitCapture?
FormEventHandler<MediaSeekForwardButton>
-
onSubmit?
FormEventHandler<MediaSeekForwardButton>
-
onResetCapture?
FormEventHandler<MediaSeekForwardButton>
-
onReset?
FormEventHandler<MediaSeekForwardButton>
-
onInputCapture?
FormEventHandler<MediaSeekForwardButton>
-
onInput?
FormEventHandler<MediaSeekForwardButton>
-
onBeforeInputCapture?
FormEventHandler<MediaSeekForwardButton>
-
onBeforeInput?
FormEventHandler<MediaSeekForwardButton>
-
onChangeCapture?
FormEventHandler<MediaSeekForwardButton>
-
onChange?
FormEventHandler<MediaSeekForwardButton>
-
onBlurCapture?
FocusEventHandler<MediaSeekForwardButton>
-
onBlur?
FocusEventHandler<MediaSeekForwardButton>
-
onFocusCapture?
FocusEventHandler<MediaSeekForwardButton>
-
onFocus?
FocusEventHandler<MediaSeekForwardButton>
-
onCompositionUpdateCapture?
CompositionEventHandler<MediaSeekForwardButton>
-
onCompositionUpdate?
CompositionEventHandler<MediaSeekForwardButton>
-
onCompositionStartCapture?
CompositionEventHandler<MediaSeekForwardButton>
-
onCompositionStart?
CompositionEventHandler<MediaSeekForwardButton>
-
onCompositionEndCapture?
CompositionEventHandler<MediaSeekForwardButton>
-
onCompositionEnd?
CompositionEventHandler<MediaSeekForwardButton>
-
onPasteCapture?
ClipboardEventHandler<MediaSeekForwardButton>
-
onPaste?
ClipboardEventHandler<MediaSeekForwardButton>
-
onCutCapture?
ClipboardEventHandler<MediaSeekForwardButton>
-
onCut?
ClipboardEventHandler<MediaSeekForwardButton>
-
onCopyCapture?
ClipboardEventHandler<MediaSeekForwardButton>
-
onCopy?
ClipboardEventHandler<MediaSeekForwardButton>
-
dangerouslySetInnerHTML?
{ __html: string | TrustedHTML; }
-
aria-valuetext?
string
-
aria-valuenow?
number
-
aria-valuemin?
number
-
aria-valuemax?
number
-
aria-sort?
"none" | "ascending" | "descending" | "other"
-
aria-setsize?
number
-
aria-selected?
Booleanish
-
aria-rowspan?
number
-
aria-rowindextext?
string
-
aria-rowindex?
number
-
aria-rowcount?
number
-
aria-roledescription?
string
-
aria-required?
Booleanish
-
aria-relevant?
"text" | "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals"
-
aria-readonly?
Booleanish
-
aria-pressed?
boolean | "true" | "false" | "mixed"
-
aria-posinset?
number
-
aria-placeholder?
string
-
aria-owns?
string
-
aria-orientation?
"horizontal" | "vertical"
-
aria-multiselectable?
Booleanish
-
aria-multiline?
Booleanish
-
aria-modal?
Booleanish
-
aria-live?
"off" | "assertive" | "polite"
-
aria-level?
number
-
aria-labelledby?
string
-
aria-label?
string
-
aria-keyshortcuts?
string
-
aria-invalid?
boolean | "true" | "false" | "grammar" | "spelling"
-
aria-hidden?
Booleanish
-
aria-haspopup?
boolean | "true" | "false" | "dialog" | "grid" | "listbox" | "menu" | "tree"
-
aria-flowto?
string
-
aria-expanded?
Booleanish
-
aria-errormessage?
string
-
aria-disabled?
Booleanish
-
aria-details?
string
-
aria-description?
string
-
aria-describedby?
string
-
aria-current?
boolean | "true" | "false" | "page" | "step" | "location" | "date" | "time"
-
aria-controls?
string
-
aria-colspan?
number
-
aria-colindextext?
string
-
aria-colindex?
number
-
aria-colcount?
number
-
aria-checked?
boolean | "true" | "false" | "mixed"
-
aria-busy?
Booleanish
-
aria-brailleroledescription?
string
-
aria-braillelabel?
string
-
aria-autocomplete?
"list" | "none" | "inline" | "both"
-
aria-atomic?
Booleanish
-
aria-activedescendant?
string
-
exportparts?
string
-
is?
string
-
popoverTarget?
string
-
popoverTargetAction?
"toggle" | "show" | "hide"
-
unselectable?
"off" | "on"
-
security?
string
-
results?
number
-
itemRef?
string
-
itemID?
string
-
itemType?
string
-
itemScope?
boolean
-
itemProp?
string
-
color?
string
-
autoSave?
string
-
autoCorrect?
string
-
vocab?
string
-
typeof?
string
-
rev?
string
-
resource?
string
-
rel?
string
-
property?
string
-
inlist?
any
-
datatype?
string
-
content?
string
-
about?
string
-
radioGroup?
string
-
spellCheck?
Booleanish
-
contextMenu?
string
-
autoFocus?
boolean
-
autoCapitalize?
"none" | (string & {}) | "off" | "on" | "sentences" | "words" | "characters"
-
suppressHydrationWarning?
boolean
-
suppressContentEditableWarning?
boolean
-
defaultValue?
string | number | readonly string[]
-
defaultChecked?
boolean
-
tabIndex?
number
-
nonce?
string
-
inputMode?
"none" | "search" | "text" | "tel" | "url" | "email" | "numeric" | "decimal"
-
enterKeyHint?
"search" | "enter" | "done" | "go" | "next" | "previous" | "send"
-
contentEditable?
Booleanish | "inherit" | "plaintext-only"
-
style?
CSSProperties
-
children?
ReactNode
-
role?
AriaRole
-
slot?
string
-
prefix?
string
-
part?
string
-
id?
string
-
className?
string
-
translate?
"yes" | "no"
-
title?
string
-
popover?
"" | "auto" | "manual"
-
lang?
string
-
inert?
boolean
-
hidden?
boolean
-
draggable?
Booleanish
-
dir?
string
-
accessKey?
string
-
aria-dropeffect?
"link" | "none" | "copy" | "execute" | "move" | "popup"
-
aria-grabbed?
Booleanish
-
onKeyPress?
KeyboardEventHandler<MediaSeekForwardButton>
-
onKeyPressCapture?
KeyboardEventHandler<MediaSeekForwardButton>
-

VideoPlayerTimeDisplay

The VideoPlayerTimeDisplay component is used to display the current time of the video player.

PropTypeDefault
key?
Key | null
-
ref?
Ref<MediaTimeDisplay>
-
update?
(() => void)
-
mediaSeekable?
[number, number]
-
mediaCurrentTime?
number
-
mediaDuration?
number
-
noToggle?
boolean
-
showDuration?
boolean
-
remaining?
boolean
-
disable?
(() => void)
-
enable?
(() => void)
-
toggleTimeDisplay?
(() => void)
-
onTransitionStartCapture?
TransitionEventHandler<MediaTimeDisplay>
-
onTransitionStart?
TransitionEventHandler<MediaTimeDisplay>
-
onTransitionRunCapture?
TransitionEventHandler<MediaTimeDisplay>
-
onTransitionRun?
TransitionEventHandler<MediaTimeDisplay>
-
onTransitionEndCapture?
TransitionEventHandler<MediaTimeDisplay>
-
onTransitionEnd?
TransitionEventHandler<MediaTimeDisplay>
-
onTransitionCancelCapture?
TransitionEventHandler<MediaTimeDisplay>
-
onTransitionCancel?
TransitionEventHandler<MediaTimeDisplay>
-
onBeforeToggle?
ToggleEventHandler<MediaTimeDisplay>
-
onToggle?
ToggleEventHandler<MediaTimeDisplay>
-
onAnimationIterationCapture?
AnimationEventHandler<MediaTimeDisplay>
-
onAnimationIteration?
AnimationEventHandler<MediaTimeDisplay>
-
onAnimationEndCapture?
AnimationEventHandler<MediaTimeDisplay>
-
onAnimationEnd?
AnimationEventHandler<MediaTimeDisplay>
-
onAnimationStartCapture?
AnimationEventHandler<MediaTimeDisplay>
-
onAnimationStart?
AnimationEventHandler<MediaTimeDisplay>
-
onWheelCapture?
WheelEventHandler<MediaTimeDisplay>
-
onWheel?
WheelEventHandler<MediaTimeDisplay>
-
onScrollEndCapture?
UIEventHandler<MediaTimeDisplay>
-
onScrollEnd?
UIEventHandler<MediaTimeDisplay>
-
onScrollCapture?
UIEventHandler<MediaTimeDisplay>
-
onScroll?
UIEventHandler<MediaTimeDisplay>
-
onLostPointerCaptureCapture?
PointerEventHandler<MediaTimeDisplay>
-
onLostPointerCapture?
PointerEventHandler<MediaTimeDisplay>
-
onGotPointerCaptureCapture?
PointerEventHandler<MediaTimeDisplay>
-
onGotPointerCapture?
PointerEventHandler<MediaTimeDisplay>
-
onPointerOutCapture?
PointerEventHandler<MediaTimeDisplay>
-
onPointerOut?
PointerEventHandler<MediaTimeDisplay>
-
onPointerOverCapture?
PointerEventHandler<MediaTimeDisplay>
-
onPointerOver?
PointerEventHandler<MediaTimeDisplay>
-
onPointerLeave?
PointerEventHandler<MediaTimeDisplay>
-
onPointerEnter?
PointerEventHandler<MediaTimeDisplay>
-
onPointerCancelCapture?
PointerEventHandler<MediaTimeDisplay>
-
onPointerCancel?
PointerEventHandler<MediaTimeDisplay>
-
onPointerUpCapture?
PointerEventHandler<MediaTimeDisplay>
-
onPointerUp?
PointerEventHandler<MediaTimeDisplay>
-
onPointerMoveCapture?
PointerEventHandler<MediaTimeDisplay>
-
onPointerMove?
PointerEventHandler<MediaTimeDisplay>
-
onPointerDownCapture?
PointerEventHandler<MediaTimeDisplay>
-
onPointerDown?
PointerEventHandler<MediaTimeDisplay>
-
onTouchStartCapture?
TouchEventHandler<MediaTimeDisplay>
-
onTouchStart?
TouchEventHandler<MediaTimeDisplay>
-
onTouchMoveCapture?
TouchEventHandler<MediaTimeDisplay>
-
onTouchMove?
TouchEventHandler<MediaTimeDisplay>
-
onTouchEndCapture?
TouchEventHandler<MediaTimeDisplay>
-
onTouchEnd?
TouchEventHandler<MediaTimeDisplay>
-
onTouchCancelCapture?
TouchEventHandler<MediaTimeDisplay>
-
onTouchCancel?
TouchEventHandler<MediaTimeDisplay>
-
onSelectCapture?
ReactEventHandler<MediaTimeDisplay>
-
onSelect?
ReactEventHandler<MediaTimeDisplay>
-
onMouseUpCapture?
MouseEventHandler<MediaTimeDisplay>
-
onMouseUp?
MouseEventHandler<MediaTimeDisplay>
-
onMouseOverCapture?
MouseEventHandler<MediaTimeDisplay>
-
onMouseOver?
MouseEventHandler<MediaTimeDisplay>
-
onMouseOutCapture?
MouseEventHandler<MediaTimeDisplay>
-
onMouseOut?
MouseEventHandler<MediaTimeDisplay>
-
onMouseMoveCapture?
MouseEventHandler<MediaTimeDisplay>
-
onMouseMove?
MouseEventHandler<MediaTimeDisplay>
-
onMouseLeave?
MouseEventHandler<MediaTimeDisplay>
-
onMouseEnter?
MouseEventHandler<MediaTimeDisplay>
-
onMouseDownCapture?
MouseEventHandler<MediaTimeDisplay>
-
onMouseDown?
MouseEventHandler<MediaTimeDisplay>
-
onDropCapture?
DragEventHandler<MediaTimeDisplay>
-
onDrop?
DragEventHandler<MediaTimeDisplay>
-
onDragStartCapture?
DragEventHandler<MediaTimeDisplay>
-
onDragStart?
DragEventHandler<MediaTimeDisplay>
-
onDragOverCapture?
DragEventHandler<MediaTimeDisplay>
-
onDragOver?
DragEventHandler<MediaTimeDisplay>
-
onDragLeaveCapture?
DragEventHandler<MediaTimeDisplay>
-
onDragLeave?
DragEventHandler<MediaTimeDisplay>
-
onDragExitCapture?
DragEventHandler<MediaTimeDisplay>
-
onDragExit?
DragEventHandler<MediaTimeDisplay>
-
onDragEnterCapture?
DragEventHandler<MediaTimeDisplay>
-
onDragEnter?
DragEventHandler<MediaTimeDisplay>
-
onDragEndCapture?
DragEventHandler<MediaTimeDisplay>
-
onDragEnd?
DragEventHandler<MediaTimeDisplay>
-
onDragCapture?
DragEventHandler<MediaTimeDisplay>
-
onDrag?
DragEventHandler<MediaTimeDisplay>
-
onDoubleClickCapture?
MouseEventHandler<MediaTimeDisplay>
-
onDoubleClick?
MouseEventHandler<MediaTimeDisplay>
-
onContextMenuCapture?
MouseEventHandler<MediaTimeDisplay>
-
onContextMenu?
MouseEventHandler<MediaTimeDisplay>
-
onClickCapture?
MouseEventHandler<MediaTimeDisplay>
-
onClick?
MouseEventHandler<MediaTimeDisplay>
-
onAuxClickCapture?
MouseEventHandler<MediaTimeDisplay>
-
onAuxClick?
MouseEventHandler<MediaTimeDisplay>
-
onWaitingCapture?
ReactEventHandler<MediaTimeDisplay>
-
onWaiting?
ReactEventHandler<MediaTimeDisplay>
-
onVolumeChangeCapture?
ReactEventHandler<MediaTimeDisplay>
-
onVolumeChange?
ReactEventHandler<MediaTimeDisplay>
-
onTimeUpdateCapture?
ReactEventHandler<MediaTimeDisplay>
-
onTimeUpdate?
ReactEventHandler<MediaTimeDisplay>
-
onSuspendCapture?
ReactEventHandler<MediaTimeDisplay>
-
onSuspend?
ReactEventHandler<MediaTimeDisplay>
-
onStalledCapture?
ReactEventHandler<MediaTimeDisplay>
-
onStalled?
ReactEventHandler<MediaTimeDisplay>
-
onSeekingCapture?
ReactEventHandler<MediaTimeDisplay>
-
onSeeking?
ReactEventHandler<MediaTimeDisplay>
-
onSeekedCapture?
ReactEventHandler<MediaTimeDisplay>
-
onSeeked?
ReactEventHandler<MediaTimeDisplay>
-
onResizeCapture?
ReactEventHandler<MediaTimeDisplay>
-
onResize?
ReactEventHandler<MediaTimeDisplay>
-
onRateChangeCapture?
ReactEventHandler<MediaTimeDisplay>
-
onRateChange?
ReactEventHandler<MediaTimeDisplay>
-
onProgressCapture?
ReactEventHandler<MediaTimeDisplay>
-
onProgress?
ReactEventHandler<MediaTimeDisplay>
-
onPlayingCapture?
ReactEventHandler<MediaTimeDisplay>
-
onPlaying?
ReactEventHandler<MediaTimeDisplay>
-
onPlayCapture?
ReactEventHandler<MediaTimeDisplay>
-
onPlay?
ReactEventHandler<MediaTimeDisplay>
-
onPauseCapture?
ReactEventHandler<MediaTimeDisplay>
-
onPause?
ReactEventHandler<MediaTimeDisplay>
-
onLoadStartCapture?
ReactEventHandler<MediaTimeDisplay>
-
onLoadStart?
ReactEventHandler<MediaTimeDisplay>
-
onLoadedMetadataCapture?
ReactEventHandler<MediaTimeDisplay>
-
onLoadedMetadata?
ReactEventHandler<MediaTimeDisplay>
-
onLoadedDataCapture?
ReactEventHandler<MediaTimeDisplay>
-
onLoadedData?
ReactEventHandler<MediaTimeDisplay>
-
onEndedCapture?
ReactEventHandler<MediaTimeDisplay>
-
onEnded?
ReactEventHandler<MediaTimeDisplay>
-
onEncryptedCapture?
ReactEventHandler<MediaTimeDisplay>
-
onEncrypted?
ReactEventHandler<MediaTimeDisplay>
-
onEmptiedCapture?
ReactEventHandler<MediaTimeDisplay>
-
onEmptied?
ReactEventHandler<MediaTimeDisplay>
-
onDurationChangeCapture?
ReactEventHandler<MediaTimeDisplay>
-
onDurationChange?
ReactEventHandler<MediaTimeDisplay>
-
onCanPlayThroughCapture?
ReactEventHandler<MediaTimeDisplay>
-
onCanPlayThrough?
ReactEventHandler<MediaTimeDisplay>
-
onCanPlayCapture?
ReactEventHandler<MediaTimeDisplay>
-
onCanPlay?
ReactEventHandler<MediaTimeDisplay>
-
onAbortCapture?
ReactEventHandler<MediaTimeDisplay>
-
onAbort?
ReactEventHandler<MediaTimeDisplay>
-
onKeyUpCapture?
KeyboardEventHandler<MediaTimeDisplay>
-
onKeyUp?
KeyboardEventHandler<MediaTimeDisplay>
-
onKeyDownCapture?
KeyboardEventHandler<MediaTimeDisplay>
-
onKeyDown?
KeyboardEventHandler<MediaTimeDisplay>
-
onErrorCapture?
ReactEventHandler<MediaTimeDisplay>
-
onError?
ReactEventHandler<MediaTimeDisplay>
-
onLoadCapture?
ReactEventHandler<MediaTimeDisplay>
-
onLoad?
ReactEventHandler<MediaTimeDisplay>
-
onInvalidCapture?
FormEventHandler<MediaTimeDisplay>
-
onInvalid?
FormEventHandler<MediaTimeDisplay>
-
onSubmitCapture?
FormEventHandler<MediaTimeDisplay>
-
onSubmit?
FormEventHandler<MediaTimeDisplay>
-
onResetCapture?
FormEventHandler<MediaTimeDisplay>
-
onReset?
FormEventHandler<MediaTimeDisplay>
-
onInputCapture?
FormEventHandler<MediaTimeDisplay>
-
onInput?
FormEventHandler<MediaTimeDisplay>
-
onBeforeInputCapture?
FormEventHandler<MediaTimeDisplay>
-
onBeforeInput?
FormEventHandler<MediaTimeDisplay>
-
onChangeCapture?
FormEventHandler<MediaTimeDisplay>
-
onChange?
FormEventHandler<MediaTimeDisplay>
-
onBlurCapture?
FocusEventHandler<MediaTimeDisplay>
-
onBlur?
FocusEventHandler<MediaTimeDisplay>
-
onFocusCapture?
FocusEventHandler<MediaTimeDisplay>
-
onFocus?
FocusEventHandler<MediaTimeDisplay>
-
onCompositionUpdateCapture?
CompositionEventHandler<MediaTimeDisplay>
-
onCompositionUpdate?
CompositionEventHandler<MediaTimeDisplay>
-
onCompositionStartCapture?
CompositionEventHandler<MediaTimeDisplay>
-
onCompositionStart?
CompositionEventHandler<MediaTimeDisplay>
-
onCompositionEndCapture?
CompositionEventHandler<MediaTimeDisplay>
-
onCompositionEnd?
CompositionEventHandler<MediaTimeDisplay>
-
onPasteCapture?
ClipboardEventHandler<MediaTimeDisplay>
-
onPaste?
ClipboardEventHandler<MediaTimeDisplay>
-
onCutCapture?
ClipboardEventHandler<MediaTimeDisplay>
-
onCut?
ClipboardEventHandler<MediaTimeDisplay>
-
onCopyCapture?
ClipboardEventHandler<MediaTimeDisplay>
-
onCopy?
ClipboardEventHandler<MediaTimeDisplay>
-
dangerouslySetInnerHTML?
{ __html: string | TrustedHTML; }
-
aria-valuetext?
string
-
aria-valuenow?
number
-
aria-valuemin?
number
-
aria-valuemax?
number
-
aria-sort?
"none" | "ascending" | "descending" | "other"
-
aria-setsize?
number
-
aria-selected?
Booleanish
-
aria-rowspan?
number
-
aria-rowindextext?
string
-
aria-rowindex?
number
-
aria-rowcount?
number
-
aria-roledescription?
string
-
aria-required?
Booleanish
-
aria-relevant?
"text" | "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals"
-
aria-readonly?
Booleanish
-
aria-pressed?
boolean | "true" | "false" | "mixed"
-
aria-posinset?
number
-
aria-placeholder?
string
-
aria-owns?
string
-
aria-orientation?
"horizontal" | "vertical"
-
aria-multiselectable?
Booleanish
-
aria-multiline?
Booleanish
-
aria-modal?
Booleanish
-
aria-live?
"off" | "assertive" | "polite"
-
aria-level?
number
-
aria-labelledby?
string
-
aria-label?
string
-
aria-keyshortcuts?
string
-
aria-invalid?
boolean | "true" | "false" | "grammar" | "spelling"
-
aria-hidden?
Booleanish
-
aria-haspopup?
boolean | "true" | "false" | "dialog" | "grid" | "listbox" | "menu" | "tree"
-
aria-flowto?
string
-
aria-expanded?
Booleanish
-
aria-errormessage?
string
-
aria-disabled?
Booleanish
-
aria-details?
string
-
aria-description?
string
-
aria-describedby?
string
-
aria-current?
boolean | "true" | "false" | "page" | "step" | "location" | "date" | "time"
-
aria-controls?
string
-
aria-colspan?
number
-
aria-colindextext?
string
-
aria-colindex?
number
-
aria-colcount?
number
-
aria-checked?
boolean | "true" | "false" | "mixed"
-
aria-busy?
Booleanish
-
aria-brailleroledescription?
string
-
aria-braillelabel?
string
-
aria-autocomplete?
"list" | "none" | "inline" | "both"
-
aria-atomic?
Booleanish
-
aria-activedescendant?
string
-
exportparts?
string
-
is?
string
-
popoverTarget?
string
-
popoverTargetAction?
"toggle" | "show" | "hide"
-
unselectable?
"off" | "on"
-
security?
string
-
results?
number
-
itemRef?
string
-
itemID?
string
-
itemType?
string
-
itemScope?
boolean
-
itemProp?
string
-
color?
string
-
autoSave?
string
-
autoCorrect?
string
-
vocab?
string
-
typeof?
string
-
rev?
string
-
resource?
string
-
rel?
string
-
property?
string
-
inlist?
any
-
datatype?
string
-
content?
string
-
about?
string
-
radioGroup?
string
-
spellCheck?
Booleanish
-
contextMenu?
string
-
autoFocus?
boolean
-
autoCapitalize?
"none" | (string & {}) | "off" | "on" | "sentences" | "words" | "characters"
-
suppressHydrationWarning?
boolean
-
suppressContentEditableWarning?
boolean
-
defaultValue?
string | number | readonly string[]
-
defaultChecked?
boolean
-
tabIndex?
number
-
nonce?
string
-
inputMode?
"none" | "search" | "text" | "tel" | "url" | "email" | "numeric" | "decimal"
-
enterKeyHint?
"search" | "enter" | "done" | "go" | "next" | "previous" | "send"
-
contentEditable?
Booleanish | "inherit" | "plaintext-only"
-
style?
CSSProperties
-
children?
ReactNode
-
role?
AriaRole
-
slot?
string
-
prefix?
string
-
part?
string
-
id?
string
-
className?
string
-
translate?
"yes" | "no"
-
title?
string
-
popover?
"" | "auto" | "manual"
-
lang?
string
-
inert?
boolean
-
hidden?
boolean
-
draggable?
Booleanish
-
dir?
string
-
accessKey?
string
-
aria-dropeffect?
"link" | "none" | "copy" | "execute" | "move" | "popup"
-
aria-grabbed?
Booleanish
-
onKeyPress?
KeyboardEventHandler<MediaTimeDisplay>
-
onKeyPressCapture?
KeyboardEventHandler<MediaTimeDisplay>
-

VideoPlayerTimeRange

The VideoPlayerTimeRange component is used to control the time of the video player.

PropTypeDefault
key?
Key | null
-
ref?
Ref<MediaTimeRange>
-
keysUsed?
string[]
-
dragging?
boolean
-
getPointerRatio?
((evt: any) => number)
-
updateSegments?
((segments: any) => void)
-
updatePointerBar?
((evt: any) => void)
-
appearance?
HTMLElement
-
range?
HTMLInputElement
-
container?
HTMLElement
-
handleEvent?
((evt: Event | MouseEvent) => void)
-
updateCurrentBox?
(() => void)
-
updateBufferedBar?
(() => void)
-
updateBar?
(() => void)
-
mediaEnded?
boolean
-
mediaPreviewTime?
number
-
mediaPreviewImage?
string
-
mediaSeekableStart?
number
-
mediaSeekableEnd?
number
-
mediaSeekable?
number[]
-
mediaBuffered?
number[][]
-
mediaPlaybackRate?
number
-
mediaCurrentTime?
number
-
mediaDuration?
number
-
mediaLoading?
boolean
-
mediaPaused?
boolean
-
mediaChaptersCues?
any[]
-
onTransitionStartCapture?
TransitionEventHandler<MediaTimeRange>
-
onTransitionStart?
TransitionEventHandler<MediaTimeRange>
-
onTransitionRunCapture?
TransitionEventHandler<MediaTimeRange>
-
onTransitionRun?
TransitionEventHandler<MediaTimeRange>
-
onTransitionEndCapture?
TransitionEventHandler<MediaTimeRange>
-
onTransitionEnd?
TransitionEventHandler<MediaTimeRange>
-
onTransitionCancelCapture?
TransitionEventHandler<MediaTimeRange>
-
onTransitionCancel?
TransitionEventHandler<MediaTimeRange>
-
onBeforeToggle?
ToggleEventHandler<MediaTimeRange>
-
onToggle?
ToggleEventHandler<MediaTimeRange>
-
onAnimationIterationCapture?
AnimationEventHandler<MediaTimeRange>
-
onAnimationIteration?
AnimationEventHandler<MediaTimeRange>
-
onAnimationEndCapture?
AnimationEventHandler<MediaTimeRange>
-
onAnimationEnd?
AnimationEventHandler<MediaTimeRange>
-
onAnimationStartCapture?
AnimationEventHandler<MediaTimeRange>
-
onAnimationStart?
AnimationEventHandler<MediaTimeRange>
-
onWheelCapture?
WheelEventHandler<MediaTimeRange>
-
onWheel?
WheelEventHandler<MediaTimeRange>
-
onScrollEndCapture?
UIEventHandler<MediaTimeRange>
-
onScrollEnd?
UIEventHandler<MediaTimeRange>
-
onScrollCapture?
UIEventHandler<MediaTimeRange>
-
onScroll?
UIEventHandler<MediaTimeRange>
-
onLostPointerCaptureCapture?
PointerEventHandler<MediaTimeRange>
-
onLostPointerCapture?
PointerEventHandler<MediaTimeRange>
-
onGotPointerCaptureCapture?
PointerEventHandler<MediaTimeRange>
-
onGotPointerCapture?
PointerEventHandler<MediaTimeRange>
-
onPointerOutCapture?
PointerEventHandler<MediaTimeRange>
-
onPointerOut?
PointerEventHandler<MediaTimeRange>
-
onPointerOverCapture?
PointerEventHandler<MediaTimeRange>
-
onPointerOver?
PointerEventHandler<MediaTimeRange>
-
onPointerLeave?
PointerEventHandler<MediaTimeRange>
-
onPointerEnter?
PointerEventHandler<MediaTimeRange>
-
onPointerCancelCapture?
PointerEventHandler<MediaTimeRange>
-
onPointerCancel?
PointerEventHandler<MediaTimeRange>
-
onPointerUpCapture?
PointerEventHandler<MediaTimeRange>
-
onPointerUp?
PointerEventHandler<MediaTimeRange>
-
onPointerMoveCapture?
PointerEventHandler<MediaTimeRange>
-
onPointerMove?
PointerEventHandler<MediaTimeRange>
-
onPointerDownCapture?
PointerEventHandler<MediaTimeRange>
-
onPointerDown?
PointerEventHandler<MediaTimeRange>
-
onTouchStartCapture?
TouchEventHandler<MediaTimeRange>
-
onTouchStart?
TouchEventHandler<MediaTimeRange>
-
onTouchMoveCapture?
TouchEventHandler<MediaTimeRange>
-
onTouchMove?
TouchEventHandler<MediaTimeRange>
-
onTouchEndCapture?
TouchEventHandler<MediaTimeRange>
-
onTouchEnd?
TouchEventHandler<MediaTimeRange>
-
onTouchCancelCapture?
TouchEventHandler<MediaTimeRange>
-
onTouchCancel?
TouchEventHandler<MediaTimeRange>
-
onSelectCapture?
ReactEventHandler<MediaTimeRange>
-
onSelect?
ReactEventHandler<MediaTimeRange>
-
onMouseUpCapture?
MouseEventHandler<MediaTimeRange>
-
onMouseUp?
MouseEventHandler<MediaTimeRange>
-
onMouseOverCapture?
MouseEventHandler<MediaTimeRange>
-
onMouseOver?
MouseEventHandler<MediaTimeRange>
-
onMouseOutCapture?
MouseEventHandler<MediaTimeRange>
-
onMouseOut?
MouseEventHandler<MediaTimeRange>
-
onMouseMoveCapture?
MouseEventHandler<MediaTimeRange>
-
onMouseMove?
MouseEventHandler<MediaTimeRange>
-
onMouseLeave?
MouseEventHandler<MediaTimeRange>
-
onMouseEnter?
MouseEventHandler<MediaTimeRange>
-
onMouseDownCapture?
MouseEventHandler<MediaTimeRange>
-
onMouseDown?
MouseEventHandler<MediaTimeRange>
-
onDropCapture?
DragEventHandler<MediaTimeRange>
-
onDrop?
DragEventHandler<MediaTimeRange>
-
onDragStartCapture?
DragEventHandler<MediaTimeRange>
-
onDragStart?
DragEventHandler<MediaTimeRange>
-
onDragOverCapture?
DragEventHandler<MediaTimeRange>
-
onDragOver?
DragEventHandler<MediaTimeRange>
-
onDragLeaveCapture?
DragEventHandler<MediaTimeRange>
-
onDragLeave?
DragEventHandler<MediaTimeRange>
-
onDragExitCapture?
DragEventHandler<MediaTimeRange>
-
onDragExit?
DragEventHandler<MediaTimeRange>
-
onDragEnterCapture?
DragEventHandler<MediaTimeRange>
-
onDragEnter?
DragEventHandler<MediaTimeRange>
-
onDragEndCapture?
DragEventHandler<MediaTimeRange>
-
onDragEnd?
DragEventHandler<MediaTimeRange>
-
onDragCapture?
DragEventHandler<MediaTimeRange>
-
onDrag?
DragEventHandler<MediaTimeRange>
-
onDoubleClickCapture?
MouseEventHandler<MediaTimeRange>
-
onDoubleClick?
MouseEventHandler<MediaTimeRange>
-
onContextMenuCapture?
MouseEventHandler<MediaTimeRange>
-
onContextMenu?
MouseEventHandler<MediaTimeRange>
-
onClickCapture?
MouseEventHandler<MediaTimeRange>
-
onClick?
MouseEventHandler<MediaTimeRange>
-
onAuxClickCapture?
MouseEventHandler<MediaTimeRange>
-
onAuxClick?
MouseEventHandler<MediaTimeRange>
-
onWaitingCapture?
ReactEventHandler<MediaTimeRange>
-
onWaiting?
ReactEventHandler<MediaTimeRange>
-
onVolumeChangeCapture?
ReactEventHandler<MediaTimeRange>
-
onVolumeChange?
ReactEventHandler<MediaTimeRange>
-
onTimeUpdateCapture?
ReactEventHandler<MediaTimeRange>
-
onTimeUpdate?
ReactEventHandler<MediaTimeRange>
-
onSuspendCapture?
ReactEventHandler<MediaTimeRange>
-
onSuspend?
ReactEventHandler<MediaTimeRange>
-
onStalledCapture?
ReactEventHandler<MediaTimeRange>
-
onStalled?
ReactEventHandler<MediaTimeRange>
-
onSeekingCapture?
ReactEventHandler<MediaTimeRange>
-
onSeeking?
ReactEventHandler<MediaTimeRange>
-
onSeekedCapture?
ReactEventHandler<MediaTimeRange>
-
onSeeked?
ReactEventHandler<MediaTimeRange>
-
onResizeCapture?
ReactEventHandler<MediaTimeRange>
-
onResize?
ReactEventHandler<MediaTimeRange>
-
onRateChangeCapture?
ReactEventHandler<MediaTimeRange>
-
onRateChange?
ReactEventHandler<MediaTimeRange>
-
onProgressCapture?
ReactEventHandler<MediaTimeRange>
-
onProgress?
ReactEventHandler<MediaTimeRange>
-
onPlayingCapture?
ReactEventHandler<MediaTimeRange>
-
onPlaying?
ReactEventHandler<MediaTimeRange>
-
onPlayCapture?
ReactEventHandler<MediaTimeRange>
-
onPlay?
ReactEventHandler<MediaTimeRange>
-
onPauseCapture?
ReactEventHandler<MediaTimeRange>
-
onPause?
ReactEventHandler<MediaTimeRange>
-
onLoadStartCapture?
ReactEventHandler<MediaTimeRange>
-
onLoadStart?
ReactEventHandler<MediaTimeRange>
-
onLoadedMetadataCapture?
ReactEventHandler<MediaTimeRange>
-
onLoadedMetadata?
ReactEventHandler<MediaTimeRange>
-
onLoadedDataCapture?
ReactEventHandler<MediaTimeRange>
-
onLoadedData?
ReactEventHandler<MediaTimeRange>
-
onEndedCapture?
ReactEventHandler<MediaTimeRange>
-
onEnded?
ReactEventHandler<MediaTimeRange>
-
onEncryptedCapture?
ReactEventHandler<MediaTimeRange>
-
onEncrypted?
ReactEventHandler<MediaTimeRange>
-
onEmptiedCapture?
ReactEventHandler<MediaTimeRange>
-
onEmptied?
ReactEventHandler<MediaTimeRange>
-
onDurationChangeCapture?
ReactEventHandler<MediaTimeRange>
-
onDurationChange?
ReactEventHandler<MediaTimeRange>
-
onCanPlayThroughCapture?
ReactEventHandler<MediaTimeRange>
-
onCanPlayThrough?
ReactEventHandler<MediaTimeRange>
-
onCanPlayCapture?
ReactEventHandler<MediaTimeRange>
-
onCanPlay?
ReactEventHandler<MediaTimeRange>
-
onAbortCapture?
ReactEventHandler<MediaTimeRange>
-
onAbort?
ReactEventHandler<MediaTimeRange>
-
onKeyUpCapture?
KeyboardEventHandler<MediaTimeRange>
-
onKeyUp?
KeyboardEventHandler<MediaTimeRange>
-
onKeyDownCapture?
KeyboardEventHandler<MediaTimeRange>
-
onKeyDown?
KeyboardEventHandler<MediaTimeRange>
-
onErrorCapture?
ReactEventHandler<MediaTimeRange>
-
onError?
ReactEventHandler<MediaTimeRange>
-
onLoadCapture?
ReactEventHandler<MediaTimeRange>
-
onLoad?
ReactEventHandler<MediaTimeRange>
-
onInvalidCapture?
FormEventHandler<MediaTimeRange>
-
onInvalid?
FormEventHandler<MediaTimeRange>
-
onSubmitCapture?
FormEventHandler<MediaTimeRange>
-
onSubmit?
FormEventHandler<MediaTimeRange>
-
onResetCapture?
FormEventHandler<MediaTimeRange>
-
onReset?
FormEventHandler<MediaTimeRange>
-
onInputCapture?
FormEventHandler<MediaTimeRange>
-
onInput?
FormEventHandler<MediaTimeRange>
-
onBeforeInputCapture?
FormEventHandler<MediaTimeRange>
-
onBeforeInput?
FormEventHandler<MediaTimeRange>
-
onChangeCapture?
FormEventHandler<MediaTimeRange>
-
onChange?
FormEventHandler<MediaTimeRange>
-
onBlurCapture?
FocusEventHandler<MediaTimeRange>
-
onBlur?
FocusEventHandler<MediaTimeRange>
-
onFocusCapture?
FocusEventHandler<MediaTimeRange>
-
onFocus?
FocusEventHandler<MediaTimeRange>
-
onCompositionUpdateCapture?
CompositionEventHandler<MediaTimeRange>
-
onCompositionUpdate?
CompositionEventHandler<MediaTimeRange>
-
onCompositionStartCapture?
CompositionEventHandler<MediaTimeRange>
-
onCompositionStart?
CompositionEventHandler<MediaTimeRange>
-
onCompositionEndCapture?
CompositionEventHandler<MediaTimeRange>
-
onCompositionEnd?
CompositionEventHandler<MediaTimeRange>
-
onPasteCapture?
ClipboardEventHandler<MediaTimeRange>
-
onPaste?
ClipboardEventHandler<MediaTimeRange>
-
onCutCapture?
ClipboardEventHandler<MediaTimeRange>
-
onCut?
ClipboardEventHandler<MediaTimeRange>
-
onCopyCapture?
ClipboardEventHandler<MediaTimeRange>
-
onCopy?
ClipboardEventHandler<MediaTimeRange>
-
dangerouslySetInnerHTML?
{ __html: string | TrustedHTML; }
-
aria-valuetext?
string
-
aria-valuenow?
number
-
aria-valuemin?
number
-
aria-valuemax?
number
-
aria-sort?
"none" | "ascending" | "descending" | "other"
-
aria-setsize?
number
-
aria-selected?
Booleanish
-
aria-rowspan?
number
-
aria-rowindextext?
string
-
aria-rowindex?
number
-
aria-rowcount?
number
-
aria-roledescription?
string
-
aria-required?
Booleanish
-
aria-relevant?
"text" | "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals"
-
aria-readonly?
Booleanish
-
aria-pressed?
boolean | "true" | "false" | "mixed"
-
aria-posinset?
number
-
aria-placeholder?
string
-
aria-owns?
string
-
aria-orientation?
"horizontal" | "vertical"
-
aria-multiselectable?
Booleanish
-
aria-multiline?
Booleanish
-
aria-modal?
Booleanish
-
aria-live?
"off" | "assertive" | "polite"
-
aria-level?
number
-
aria-labelledby?
string
-
aria-label?
string
-
aria-keyshortcuts?
string
-
aria-invalid?
boolean | "true" | "false" | "grammar" | "spelling"
-
aria-hidden?
Booleanish
-
aria-haspopup?
boolean | "true" | "false" | "dialog" | "grid" | "listbox" | "menu" | "tree"
-
aria-flowto?
string
-
aria-expanded?
Booleanish
-
aria-errormessage?
string
-
aria-disabled?
Booleanish
-
aria-details?
string
-
aria-description?
string
-
aria-describedby?
string
-
aria-current?
boolean | "true" | "false" | "page" | "step" | "location" | "date" | "time"
-
aria-controls?
string
-
aria-colspan?
number
-
aria-colindextext?
string
-
aria-colindex?
number
-
aria-colcount?
number
-
aria-checked?
boolean | "true" | "false" | "mixed"
-
aria-busy?
Booleanish
-
aria-brailleroledescription?
string
-
aria-braillelabel?
string
-
aria-autocomplete?
"list" | "none" | "inline" | "both"
-
aria-atomic?
Booleanish
-
aria-activedescendant?
string
-
exportparts?
string
-
is?
string
-
popoverTarget?
string
-
popoverTargetAction?
"toggle" | "show" | "hide"
-
unselectable?
"off" | "on"
-
security?
string
-
results?
number
-
itemRef?
string
-
itemID?
string
-
itemType?
string
-
itemScope?
boolean
-
itemProp?
string
-
color?
string
-
autoSave?
string
-
autoCorrect?
string
-
vocab?
string
-
typeof?
string
-
rev?
string
-
resource?
string
-
rel?
string
-
property?
string
-
inlist?
any
-
datatype?
string
-
content?
string
-
about?
string
-
radioGroup?
string
-
spellCheck?
Booleanish
-
contextMenu?
string
-
autoFocus?
boolean
-
autoCapitalize?
"none" | (string & {}) | "off" | "on" | "sentences" | "words" | "characters"
-
suppressHydrationWarning?
boolean
-
suppressContentEditableWarning?
boolean
-
defaultValue?
string | number | readonly string[]
-
defaultChecked?
boolean
-
tabIndex?
number
-
nonce?
string
-
inputMode?
"none" | "search" | "text" | "tel" | "url" | "email" | "numeric" | "decimal"
-
enterKeyHint?
"search" | "enter" | "done" | "go" | "next" | "previous" | "send"
-
contentEditable?
Booleanish | "inherit" | "plaintext-only"
-
style?
CSSProperties
-
children?
ReactNode
-
role?
AriaRole
-
slot?
string
-
prefix?
string
-
part?
string
-
id?
string
-
className?
string
-
translate?
"yes" | "no"
-
title?
string
-
popover?
"" | "auto" | "manual"
-
lang?
string
-
inert?
boolean
-
hidden?
boolean
-
draggable?
Booleanish
-
dir?
string
-
accessKey?
string
-
aria-dropeffect?
"link" | "none" | "copy" | "execute" | "move" | "popup"
-
aria-grabbed?
Booleanish
-
onKeyPress?
KeyboardEventHandler<MediaTimeRange>
-
onKeyPressCapture?
KeyboardEventHandler<MediaTimeRange>
-

VideoPlayerVolumeRange

The VideoPlayerVolumeRange component is used to control the volume of the video player.

PropTypeDefault
key?
Key | null
-
ref?
Ref<MediaVolumeRange>
-
keysUsed?
string[]
-
handleEvent?
((evt: any) => void)
-
dragging?
boolean
-
getPointerRatio?
((evt: any) => number)
-
updateSegments?
((segments: any) => void)
-
updateBar?
(() => void)
-
updatePointerBar?
((evt: any) => void)
-
appearance?
HTMLElement
-
range?
HTMLInputElement
-
container?
HTMLElement
-
mediaVolumeUnavailable?
string
-
mediaMuted?
boolean
-
mediaVolume?
number
-
onTransitionStartCapture?
TransitionEventHandler<MediaVolumeRange>
-
onTransitionStart?
TransitionEventHandler<MediaVolumeRange>
-
onTransitionRunCapture?
TransitionEventHandler<MediaVolumeRange>
-
onTransitionRun?
TransitionEventHandler<MediaVolumeRange>
-
onTransitionEndCapture?
TransitionEventHandler<MediaVolumeRange>
-
onTransitionEnd?
TransitionEventHandler<MediaVolumeRange>
-
onTransitionCancelCapture?
TransitionEventHandler<MediaVolumeRange>
-
onTransitionCancel?
TransitionEventHandler<MediaVolumeRange>
-
onBeforeToggle?
ToggleEventHandler<MediaVolumeRange>
-
onToggle?
ToggleEventHandler<MediaVolumeRange>
-
onAnimationIterationCapture?
AnimationEventHandler<MediaVolumeRange>
-
onAnimationIteration?
AnimationEventHandler<MediaVolumeRange>
-
onAnimationEndCapture?
AnimationEventHandler<MediaVolumeRange>
-
onAnimationEnd?
AnimationEventHandler<MediaVolumeRange>
-
onAnimationStartCapture?
AnimationEventHandler<MediaVolumeRange>
-
onAnimationStart?
AnimationEventHandler<MediaVolumeRange>
-
onWheelCapture?
WheelEventHandler<MediaVolumeRange>
-
onWheel?
WheelEventHandler<MediaVolumeRange>
-
onScrollEndCapture?
UIEventHandler<MediaVolumeRange>
-
onScrollEnd?
UIEventHandler<MediaVolumeRange>
-
onScrollCapture?
UIEventHandler<MediaVolumeRange>
-
onScroll?
UIEventHandler<MediaVolumeRange>
-
onLostPointerCaptureCapture?
PointerEventHandler<MediaVolumeRange>
-
onLostPointerCapture?
PointerEventHandler<MediaVolumeRange>
-
onGotPointerCaptureCapture?
PointerEventHandler<MediaVolumeRange>
-
onGotPointerCapture?
PointerEventHandler<MediaVolumeRange>
-
onPointerOutCapture?
PointerEventHandler<MediaVolumeRange>
-
onPointerOut?
PointerEventHandler<MediaVolumeRange>
-
onPointerOverCapture?
PointerEventHandler<MediaVolumeRange>
-
onPointerOver?
PointerEventHandler<MediaVolumeRange>
-
onPointerLeave?
PointerEventHandler<MediaVolumeRange>
-
onPointerEnter?
PointerEventHandler<MediaVolumeRange>
-
onPointerCancelCapture?
PointerEventHandler<MediaVolumeRange>
-
onPointerCancel?
PointerEventHandler<MediaVolumeRange>
-
onPointerUpCapture?
PointerEventHandler<MediaVolumeRange>
-
onPointerUp?
PointerEventHandler<MediaVolumeRange>
-
onPointerMoveCapture?
PointerEventHandler<MediaVolumeRange>
-
onPointerMove?
PointerEventHandler<MediaVolumeRange>
-
onPointerDownCapture?
PointerEventHandler<MediaVolumeRange>
-
onPointerDown?
PointerEventHandler<MediaVolumeRange>
-
onTouchStartCapture?
TouchEventHandler<MediaVolumeRange>
-
onTouchStart?
TouchEventHandler<MediaVolumeRange>
-
onTouchMoveCapture?
TouchEventHandler<MediaVolumeRange>
-
onTouchMove?
TouchEventHandler<MediaVolumeRange>
-
onTouchEndCapture?
TouchEventHandler<MediaVolumeRange>
-
onTouchEnd?
TouchEventHandler<MediaVolumeRange>
-
onTouchCancelCapture?
TouchEventHandler<MediaVolumeRange>
-
onTouchCancel?
TouchEventHandler<MediaVolumeRange>
-
onSelectCapture?
ReactEventHandler<MediaVolumeRange>
-
onSelect?
ReactEventHandler<MediaVolumeRange>
-
onMouseUpCapture?
MouseEventHandler<MediaVolumeRange>
-
onMouseUp?
MouseEventHandler<MediaVolumeRange>
-
onMouseOverCapture?
MouseEventHandler<MediaVolumeRange>
-
onMouseOver?
MouseEventHandler<MediaVolumeRange>
-
onMouseOutCapture?
MouseEventHandler<MediaVolumeRange>
-
onMouseOut?
MouseEventHandler<MediaVolumeRange>
-
onMouseMoveCapture?
MouseEventHandler<MediaVolumeRange>
-
onMouseMove?
MouseEventHandler<MediaVolumeRange>
-
onMouseLeave?
MouseEventHandler<MediaVolumeRange>
-
onMouseEnter?
MouseEventHandler<MediaVolumeRange>
-
onMouseDownCapture?
MouseEventHandler<MediaVolumeRange>
-
onMouseDown?
MouseEventHandler<MediaVolumeRange>
-
onDropCapture?
DragEventHandler<MediaVolumeRange>
-
onDrop?
DragEventHandler<MediaVolumeRange>
-
onDragStartCapture?
DragEventHandler<MediaVolumeRange>
-
onDragStart?
DragEventHandler<MediaVolumeRange>
-
onDragOverCapture?
DragEventHandler<MediaVolumeRange>
-
onDragOver?
DragEventHandler<MediaVolumeRange>
-
onDragLeaveCapture?
DragEventHandler<MediaVolumeRange>
-
onDragLeave?
DragEventHandler<MediaVolumeRange>
-
onDragExitCapture?
DragEventHandler<MediaVolumeRange>
-
onDragExit?
DragEventHandler<MediaVolumeRange>
-
onDragEnterCapture?
DragEventHandler<MediaVolumeRange>
-
onDragEnter?
DragEventHandler<MediaVolumeRange>
-
onDragEndCapture?
DragEventHandler<MediaVolumeRange>
-
onDragEnd?
DragEventHandler<MediaVolumeRange>
-
onDragCapture?
DragEventHandler<MediaVolumeRange>
-
onDrag?
DragEventHandler<MediaVolumeRange>
-
onDoubleClickCapture?
MouseEventHandler<MediaVolumeRange>
-
onDoubleClick?
MouseEventHandler<MediaVolumeRange>
-
onContextMenuCapture?
MouseEventHandler<MediaVolumeRange>
-
onContextMenu?
MouseEventHandler<MediaVolumeRange>
-
onClickCapture?
MouseEventHandler<MediaVolumeRange>
-
onClick?
MouseEventHandler<MediaVolumeRange>
-
onAuxClickCapture?
MouseEventHandler<MediaVolumeRange>
-
onAuxClick?
MouseEventHandler<MediaVolumeRange>
-
onWaitingCapture?
ReactEventHandler<MediaVolumeRange>
-
onWaiting?
ReactEventHandler<MediaVolumeRange>
-
onVolumeChangeCapture?
ReactEventHandler<MediaVolumeRange>
-
onVolumeChange?
ReactEventHandler<MediaVolumeRange>
-
onTimeUpdateCapture?
ReactEventHandler<MediaVolumeRange>
-
onTimeUpdate?
ReactEventHandler<MediaVolumeRange>
-
onSuspendCapture?
ReactEventHandler<MediaVolumeRange>
-
onSuspend?
ReactEventHandler<MediaVolumeRange>
-
onStalledCapture?
ReactEventHandler<MediaVolumeRange>
-
onStalled?
ReactEventHandler<MediaVolumeRange>
-
onSeekingCapture?
ReactEventHandler<MediaVolumeRange>
-
onSeeking?
ReactEventHandler<MediaVolumeRange>
-
onSeekedCapture?
ReactEventHandler<MediaVolumeRange>
-
onSeeked?
ReactEventHandler<MediaVolumeRange>
-
onResizeCapture?
ReactEventHandler<MediaVolumeRange>
-
onResize?
ReactEventHandler<MediaVolumeRange>
-
onRateChangeCapture?
ReactEventHandler<MediaVolumeRange>
-
onRateChange?
ReactEventHandler<MediaVolumeRange>
-
onProgressCapture?
ReactEventHandler<MediaVolumeRange>
-
onProgress?
ReactEventHandler<MediaVolumeRange>
-
onPlayingCapture?
ReactEventHandler<MediaVolumeRange>
-
onPlaying?
ReactEventHandler<MediaVolumeRange>
-
onPlayCapture?
ReactEventHandler<MediaVolumeRange>
-
onPlay?
ReactEventHandler<MediaVolumeRange>
-
onPauseCapture?
ReactEventHandler<MediaVolumeRange>
-
onPause?
ReactEventHandler<MediaVolumeRange>
-
onLoadStartCapture?
ReactEventHandler<MediaVolumeRange>
-
onLoadStart?
ReactEventHandler<MediaVolumeRange>
-
onLoadedMetadataCapture?
ReactEventHandler<MediaVolumeRange>
-
onLoadedMetadata?
ReactEventHandler<MediaVolumeRange>
-
onLoadedDataCapture?
ReactEventHandler<MediaVolumeRange>
-
onLoadedData?
ReactEventHandler<MediaVolumeRange>
-
onEndedCapture?
ReactEventHandler<MediaVolumeRange>
-
onEnded?
ReactEventHandler<MediaVolumeRange>
-
onEncryptedCapture?
ReactEventHandler<MediaVolumeRange>
-
onEncrypted?
ReactEventHandler<MediaVolumeRange>
-
onEmptiedCapture?
ReactEventHandler<MediaVolumeRange>
-
onEmptied?
ReactEventHandler<MediaVolumeRange>
-
onDurationChangeCapture?
ReactEventHandler<MediaVolumeRange>
-
onDurationChange?
ReactEventHandler<MediaVolumeRange>
-
onCanPlayThroughCapture?
ReactEventHandler<MediaVolumeRange>
-
onCanPlayThrough?
ReactEventHandler<MediaVolumeRange>
-
onCanPlayCapture?
ReactEventHandler<MediaVolumeRange>
-
onCanPlay?
ReactEventHandler<MediaVolumeRange>
-
onAbortCapture?
ReactEventHandler<MediaVolumeRange>
-
onAbort?
ReactEventHandler<MediaVolumeRange>
-
onKeyUpCapture?
KeyboardEventHandler<MediaVolumeRange>
-
onKeyUp?
KeyboardEventHandler<MediaVolumeRange>
-
onKeyDownCapture?
KeyboardEventHandler<MediaVolumeRange>
-
onKeyDown?
KeyboardEventHandler<MediaVolumeRange>
-
onErrorCapture?
ReactEventHandler<MediaVolumeRange>
-
onError?
ReactEventHandler<MediaVolumeRange>
-
onLoadCapture?
ReactEventHandler<MediaVolumeRange>
-
onLoad?
ReactEventHandler<MediaVolumeRange>
-
onInvalidCapture?
FormEventHandler<MediaVolumeRange>
-
onInvalid?
FormEventHandler<MediaVolumeRange>
-
onSubmitCapture?
FormEventHandler<MediaVolumeRange>
-
onSubmit?
FormEventHandler<MediaVolumeRange>
-
onResetCapture?
FormEventHandler<MediaVolumeRange>
-
onReset?
FormEventHandler<MediaVolumeRange>
-
onInputCapture?
FormEventHandler<MediaVolumeRange>
-
onInput?
FormEventHandler<MediaVolumeRange>
-
onBeforeInputCapture?
FormEventHandler<MediaVolumeRange>
-
onBeforeInput?
FormEventHandler<MediaVolumeRange>
-
onChangeCapture?
FormEventHandler<MediaVolumeRange>
-
onChange?
FormEventHandler<MediaVolumeRange>
-
onBlurCapture?
FocusEventHandler<MediaVolumeRange>
-
onBlur?
FocusEventHandler<MediaVolumeRange>
-
onFocusCapture?
FocusEventHandler<MediaVolumeRange>
-
onFocus?
FocusEventHandler<MediaVolumeRange>
-
onCompositionUpdateCapture?
CompositionEventHandler<MediaVolumeRange>
-
onCompositionUpdate?
CompositionEventHandler<MediaVolumeRange>
-
onCompositionStartCapture?
CompositionEventHandler<MediaVolumeRange>
-
onCompositionStart?
CompositionEventHandler<MediaVolumeRange>
-
onCompositionEndCapture?
CompositionEventHandler<MediaVolumeRange>
-
onCompositionEnd?
CompositionEventHandler<MediaVolumeRange>
-
onPasteCapture?
ClipboardEventHandler<MediaVolumeRange>
-
onPaste?
ClipboardEventHandler<MediaVolumeRange>
-
onCutCapture?
ClipboardEventHandler<MediaVolumeRange>
-
onCut?
ClipboardEventHandler<MediaVolumeRange>
-
onCopyCapture?
ClipboardEventHandler<MediaVolumeRange>
-
onCopy?
ClipboardEventHandler<MediaVolumeRange>
-
dangerouslySetInnerHTML?
{ __html: string | TrustedHTML; }
-
aria-valuetext?
string
-
aria-valuenow?
number
-
aria-valuemin?
number
-
aria-valuemax?
number
-
aria-sort?
"none" | "ascending" | "descending" | "other"
-
aria-setsize?
number
-
aria-selected?
Booleanish
-
aria-rowspan?
number
-
aria-rowindextext?
string
-
aria-rowindex?
number
-
aria-rowcount?
number
-
aria-roledescription?
string
-
aria-required?
Booleanish
-
aria-relevant?
"text" | "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals"
-
aria-readonly?
Booleanish
-
aria-pressed?
boolean | "true" | "false" | "mixed"
-
aria-posinset?
number
-
aria-placeholder?
string
-
aria-owns?
string
-
aria-orientation?
"horizontal" | "vertical"
-
aria-multiselectable?
Booleanish
-
aria-multiline?
Booleanish
-
aria-modal?
Booleanish
-
aria-live?
"off" | "assertive" | "polite"
-
aria-level?
number
-
aria-labelledby?
string
-
aria-label?
string
-
aria-keyshortcuts?
string
-
aria-invalid?
boolean | "true" | "false" | "grammar" | "spelling"
-
aria-hidden?
Booleanish
-
aria-haspopup?
boolean | "true" | "false" | "dialog" | "grid" | "listbox" | "menu" | "tree"
-
aria-flowto?
string
-
aria-expanded?
Booleanish
-
aria-errormessage?
string
-
aria-disabled?
Booleanish
-
aria-details?
string
-
aria-description?
string
-
aria-describedby?
string
-
aria-current?
boolean | "true" | "false" | "page" | "step" | "location" | "date" | "time"
-
aria-controls?
string
-
aria-colspan?
number
-
aria-colindextext?
string
-
aria-colindex?
number
-
aria-colcount?
number
-
aria-checked?
boolean | "true" | "false" | "mixed"
-
aria-busy?
Booleanish
-
aria-brailleroledescription?
string
-
aria-braillelabel?
string
-
aria-autocomplete?
"list" | "none" | "inline" | "both"
-
aria-atomic?
Booleanish
-
aria-activedescendant?
string
-
exportparts?
string
-
is?
string
-
popoverTarget?
string
-
popoverTargetAction?
"toggle" | "show" | "hide"
-
unselectable?
"off" | "on"
-
security?
string
-
results?
number
-
itemRef?
string
-
itemID?
string
-
itemType?
string
-
itemScope?
boolean
-
itemProp?
string
-
color?
string
-
autoSave?
string
-
autoCorrect?
string
-
vocab?
string
-
typeof?
string
-
rev?
string
-
resource?
string
-
rel?
string
-
property?
string
-
inlist?
any
-
datatype?
string
-
content?
string
-
about?
string
-
radioGroup?
string
-
spellCheck?
Booleanish
-
contextMenu?
string
-
autoFocus?
boolean
-
autoCapitalize?
"none" | (string & {}) | "off" | "on" | "sentences" | "words" | "characters"
-
suppressHydrationWarning?
boolean
-
suppressContentEditableWarning?
boolean
-
defaultValue?
string | number | readonly string[]
-
defaultChecked?
boolean
-
tabIndex?
number
-
nonce?
string
-
inputMode?
"none" | "search" | "text" | "tel" | "url" | "email" | "numeric" | "decimal"
-
enterKeyHint?
"search" | "enter" | "done" | "go" | "next" | "previous" | "send"
-
contentEditable?
Booleanish | "inherit" | "plaintext-only"
-
style?
CSSProperties
-
children?
ReactNode
-
role?
AriaRole
-
slot?
string
-
prefix?
string
-
part?
string
-
id?
string
-
className?
string
-
translate?
"yes" | "no"
-
title?
string
-
popover?
"" | "auto" | "manual"
-
lang?
string
-
inert?
boolean
-
hidden?
boolean
-
draggable?
Booleanish
-
dir?
string
-
accessKey?
string
-
aria-dropeffect?
"link" | "none" | "copy" | "execute" | "move" | "popup"
-
aria-grabbed?
Booleanish
-
onKeyPress?
KeyboardEventHandler<MediaVolumeRange>
-
onKeyPressCapture?
KeyboardEventHandler<MediaVolumeRange>
-

On this page