@vkontakte/videoplayer 1.0.9 → 1.0.95-dev.e4134bc49.0

package/types/components/Menus/subMenuTabs/types.d.ts

@@ -0,0 +1,151 @@
+import type { UIType, VideoPlaybackRate, VideoQualityForRender, VideoQualityUI, VideoSubtitle } from "../../../types";
+import type { IAudioStream, PlaybackRate, VideoQuality } from "@vkontakte/videoplayer-core";
+import type { QualitySettingsAppliesTo } from "../../../utils/userSettings";
+import type { TmpComponentType } from "../../../types/tmp";
+export declare enum SharedSubMenuItemId {
+	QUALITY_OTHER = "quality-other-settings",
+	QUALITY_AUTO = "quality-auto",
+	QUALITY_APPLIANCE = "quality-appliance-settings",
+	QUALITY_HIGH = "quality-high",
+	QUALITY_TRAFFIC_SAVING = "quality-traffic-saving"
+}
+export declare enum SubMenuId {
+	PLAYBACK_RATE = "playback-rate",
+	QUALITY_SETTINGS = "quality-settings",
+	QUALITY_OTHER_SETTINGS = "quality-other-settings",
+	QUALITY_APPLIANCE = "quality-appliance",
+	AUDIO_TRACKS = "audio-tracks",
+	SUBTITLES = "subtitles"
+}
+export declare enum RootMenuId {
+	QUALITY_SETTINGS = "quality-settings",
+	TRAFFIC_SAVING_SWITCH = "traffic-saving-switch",
+	AUDIO_TRACKS = "audio-tracks-settings",
+	PLAYBACK_RATE = "playback-rate-settings",
+	SUBTITLES = "subtitles-settings",
+	DOWNLOAD = "download",
+	SHOW_SUPPORT = "show-support",
+	COPY_DATA = "copy-data",
+	DEBUG_INFO = "debug-info"
+}
+export type Context = {
+	closeSettingsMenu: () => void;
+	isMobile: boolean;
+	/**
+	* Скорость.
+	*/
+	availablePlaybackRates: VideoPlaybackRate[];
+	selectPlaybackRate: (playbackRate: PlaybackRate) => void;
+	/**
+	* Качество.
+	*/
+	selectQuality: (quality: VideoQualityUI, appliesTo: QualitySettingsAppliesTo) => void;
+	isAutoQualityEnabled: boolean;
+	isAutoQualityAvailable: boolean;
+	highQualityEnabled: boolean;
+	toggleHighQuality: (value: boolean, appliesTo: QualitySettingsAppliesTo) => void;
+	trafficSavingEnabled: boolean;
+	toggleTrafficSaving: (value: boolean, appliesTo: QualitySettingsAppliesTo) => void;
+	currentQuality: VideoQuality;
+	availableQualities: VideoQualityForRender[];
+	/**
+	* Звуковые дорожки.
+	*/
+	availableAudioStreams: IAudioStream[];
+	selectAudioLanguage: (stream: IAudioStream) => void;
+	currentAudioStream: IAudioStream | undefined;
+	/**
+	* Субтитры
+	*/
+	availableSubtitlesList: VideoSubtitle[];
+	selectSubtitle: (subtitle: VideoSubtitle) => void;
+	isAudioChannelConfiguration: boolean;
+};
+export type SubMenuData = (context: Context) => {
+	title: string;
+	closeSettingsMenu?: () => void;
+	items: SubMenuItem[];
+	id: SubMenuId;
+	minWidth?: number;
+};
+export type SubMenuItem = SubMenuItemOpenSubMenu | SubMenuItemSelect;
+type BaseSubMenuItem<U = any> = {
+	selected?: boolean;
+	valueComponent?: TmpComponentType;
+	valueComponentParams?: {
+		[key: string]: U;
+	};
+	bottomBordered?: boolean;
+	label?: string;
+	sublabel?: string;
+	ariaLabel?: string;
+	dataTestid?: string;
+};
+export type SubMenuItemOpenSubMenu = {
+	type: SubMenuItemType.OPEN_SUB_MENU;
+	children: SubMenuId;
+	id: SharedSubMenuItemId;
+} & BaseSubMenuItem;
+export type SubMenuItemSelect<T = any> = {
+	type: SubMenuItemType.SELECT_VALUE;
+	value: T;
+	dataValue?: T | keyof T;
+	selectItem: (value: T) => void;
+} & BaseSubMenuItem;
+interface BaseMenuItem<Id> {
+	id: Id;
+	weight: number;
+	ariaLabel?: string;
+	label: string;
+}
+export type IconPropsType = {
+	[key: string]: any;
+};
+interface BaseSettingsMenuItem extends BaseMenuItem<RootMenuId> {
+	icon: TmpComponentType;
+	iconProps?: IconPropsType;
+	isHiddenFor?: UIType[];
+}
+export declare enum MenuItemType {
+	OPEN_SUB_MENU = "OPEN_SUB_MENU",
+	CLICK = "CLICK",
+	SWITCH = "SWITCH"
+}
+export declare enum SubMenuItemType {
+	OPEN_SUB_MENU = "OPEN_SUB_MENU",
+	SELECT_VALUE = "SELECT_VALUE"
+}
+export interface OpenSubMenuSettingsMenuItem extends BaseSettingsMenuItem {
+	type: MenuItemType.OPEN_SUB_MENU;
+	value: string;
+	valueComponent?: TmpComponentType;
+	children: SubMenuId;
+}
+export interface ClickSettingsMenuItem extends BaseSettingsMenuItem {
+	type: MenuItemType.CLICK;
+	onClick: () => void;
+}
+export interface SwitchSettingsMenuItem extends BaseSettingsMenuItem {
+	type: MenuItemType.SWITCH;
+	onClick: (enabled: boolean) => void;
+	enabled: boolean;
+	tooltipText?: string;
+	maxTooltipWidth?: number;
+}
+export type AdditionalSwitchSettingsMenuItem = Omit<SwitchSettingsMenuItem, "icon" | "onClick"> & {
+	icon: string;
+	onChangeEnabled: (enabled: boolean) => void;
+};
+export type AdditionalClickSettingsMenuItem = Omit<SwitchSettingsMenuItem, "icon"> & {
+	icon: string;
+};
+export type SettingsMenuItem = OpenSubMenuSettingsMenuItem | ClickSettingsMenuItem | SwitchSettingsMenuItem;
+export type AdditionalSettingsMenuItem = AdditionalSwitchSettingsMenuItem | AdditionalClickSettingsMenuItem;
+export interface ContextMenuItem extends BaseMenuItem<string> {
+	onClick: () => void;
+}
+export type AdditionalContextMenuItem = ContextMenuItem;
+export type MenuRefs = {
+	[key: string]: HTMLUListElement;
+};
+export {};

package/types/components/Menus/subMenuTabs/utils.d.ts

@@ -0,0 +1,3 @@
+import { type QualitySettingsAppliesTo } from "../../../utils/userSettings";
+export declare const getEnrichWithQualityAppliesTo: (appliesTo: QualitySettingsAppliesTo) => (<T>(fn: (value: T, appliesTo: QualitySettingsAppliesTo) => void) => (value: T) => void);
+export declare function isDefined<T>(x: T | undefined): x is T;

package/types/components/Menus/types.d.ts

@@ -0,0 +1,96 @@
+import type { UIType } from "../../types";
+import type { SubMenuIds } from "./constants/subMenuIds";
+import type { TmpComponentType } from "../../types/tmp";
+interface BaseMenuItem {
+	id: string;
+	weight: number;
+	ariaLabel?: string;
+	label: string;
+}
+interface BaseSettingsMenuItem extends BaseMenuItem {
+	icon: TmpComponentType | string;
+	isHiddenFor?: UIType[];
+}
+export declare enum MenuItemType {
+	OPEN_SUB_MENU = "OPEN_SUB_MENU",
+	CLICK = "CLICK",
+	SWITCH = "SWITCH"
+}
+export declare enum SubMenuItemType {
+	OPEN_SUB_MENU = "OPEN_SUB_MENU",
+	SELECT_VALUE = "SELECT_VALUE"
+}
+export interface OpenSubMenuSettingsMenuItem extends BaseSettingsMenuItem {
+	type: MenuItemType.OPEN_SUB_MENU;
+	subMenuId: SubMenuIds;
+	value: string;
+	valueComponent?: any;
+	getSubItemForFocus: () => HTMLLIElement;
+}
+export interface ClickSettingsMenuItem extends BaseSettingsMenuItem {
+	type: MenuItemType.CLICK;
+	onClick: () => void;
+}
+export interface SwitchSettingsMenuItem extends BaseSettingsMenuItem {
+	type: MenuItemType.SWITCH;
+	onClick: (enabled: boolean) => void;
+	enabled: boolean;
+	tooltipText?: string;
+	maxTooltipWidth?: number;
+}
+export type AdditionalSwitchSettingsMenuItem = Omit<SwitchSettingsMenuItem, "icon" | "onClick"> & {
+	icon: string;
+	onChangeEnabled: (enabled: boolean) => void;
+};
+export type AdditionalClickSettingsMenuItem = Omit<SwitchSettingsMenuItem, "icon"> & {
+	icon: string;
+};
+export type SettingsMenuItem = OpenSubMenuSettingsMenuItem | ClickSettingsMenuItem | SwitchSettingsMenuItem;
+export type AdditionalSettingsMenuItem = AdditionalSwitchSettingsMenuItem | AdditionalClickSettingsMenuItem;
+interface SubMenuItemBase<U = any> {
+	selected?: boolean;
+	valueComponent?: TmpComponentType;
+	valueComponentParams?: {
+		[key: string]: U;
+	};
+	bottomBordered?: boolean;
+	label?: string;
+	sublabel?: string;
+	ariaLabel?: string;
+	onClick?: () => void;
+}
+export interface SelectValueSubMenuItem<
+	T = any,
+	U = any
+> extends SubMenuItemBase<U> {
+	type: SubMenuItemType.SELECT_VALUE;
+	value: T;
+	dataValue?: T | keyof T;
+	selectItem: (value: T) => void;
+}
+export interface OpenSubMenuSubMenuItem extends SubMenuItemBase {
+	type: SubMenuItemType.OPEN_SUB_MENU;
+	id: string;
+	subMenuId: SubMenuIds;
+	getSubItemForFocus?: () => HTMLLIElement;
+}
+export type SubMenuItem = SelectValueSubMenuItem | OpenSubMenuSubMenuItem;
+export interface SubMenuList {
+	id: SubMenuIds;
+	parentItemId?: string;
+	items: SubMenuItem[];
+	returnFromSubMenu?: () => void;
+	ariaLabelReturnFromSubMenu?: string;
+	title: string;
+	closeSettingsMenu: () => void;
+	minWidth?: number;
+	onMount?: () => void;
+}
+export interface ContextMenuItem extends BaseMenuItem {
+	onClick: () => void;
+}
+export type AdditionalContextMenuItem = ContextMenuItem;
+export type MenuRefs = {
+	[key: string]: HTMLUListElement;
+};
+export {};

package/types/components/Menus/utils/constants.d.ts

@@ -0,0 +1 @@
+export declare const FOCUS_HIDDEN_CLASS = "focus-hidden";

package/types/components/Menus/utils/getCurrentQualityDisplayValue.d.ts

@@ -0,0 +1,21 @@
+import { VideoQuality } from "@vkontakte/videoplayer-core";
+import { type VideoQualityForRender } from "../../../types";
+type Params = {
+	quality: VideoQuality;
+	availableQualities: VideoQualityForRender[];
+};
+export declare const getQualityDisplayValue: ({ quality, availableQualities }: Params) => string;
+type CurrentQualityParams = {
+	isAutoQualityEnabled: boolean | undefined;
+	quality: VideoQuality | undefined;
+	availableQualities: VideoQualityForRender[];
+};
+export declare const getCurrentQualityDisplayValue: ({ quality, availableQualities, isAutoQualityEnabled }: CurrentQualityParams) => string;
+type QualityWithPrefixParams = {
+	quality: VideoQuality | undefined;
+	availableQualities: VideoQualityForRender[];
+	prefix: string;
+	onlyPrefix: boolean;
+};
+export declare const getQualityWithPrefix: ({ quality, availableQualities, prefix, onlyPrefix }: QualityWithPrefixParams) => string;
+export {};

package/types/components/Menus/utils/getQualityIcon.d.ts

@@ -0,0 +1,3 @@
+import type { VideoQualityUI } from "../../../types";
+import type { TmpComponentType } from "../../../types/tmp";
+export declare const getQualityIcon: (quality?: VideoQualityUI) => TmpComponentType | undefined;

package/types/components/Menus/utils/getSubMenusStack.svelte.d.ts

@@ -0,0 +1,10 @@
+import type { SubMenuId } from "../subMenuTabs/types";
+/**
+* Представляем цепочку открытия подменюшек стеком, таким образом можем открывать хоть сколько.
+*/
+export declare const getSubMenusStack: () => {
+	readonly current: SubMenuId | null;
+	pushSubMenu: (subMenuId: SubMenuId) => void;
+	popSubMenu: () => void;
+	popAllSubMenus: () => void;
+};

package/types/components/Menus/utils/menuNavigation.d.ts

@@ -0,0 +1,20 @@
+import { ProcessedKeysCodes } from "../../../constans";
+import { type Writable } from "svelte/store";
+import type { Position } from "../../../types";
+export declare const eventStop: (event: Event) => void;
+export declare const clearFocusHiddenClass: (target: HTMLElement) => void;
+export declare const isChoseItemCase: (event: KeyboardEvent, extraKeys?: ProcessedKeysCodes[]) => boolean;
+export declare const isKeyboardHandleCase: (event?: MouseEvent | PointerEvent) => boolean;
+export declare const handleFocusReturnToBtn: (ref: HTMLButtonElement, menuVisible: boolean, openedByKeyboard$: Writable<boolean>) => Promise<void>;
+export declare const handleFocusReturnToElem: (ref: HTMLButtonElement, menuVisible: boolean, openedByKeyboard$: Writable<boolean>) => Promise<void>;
+export declare const handleFocusOnMenu: (ref: HTMLUListElement, menuVisible: boolean, isOpenedByKeyboard: boolean, isMobile?: boolean) => Promise<void>;
+export declare const returnFocusToMenuItem: (refMenuItems: {
+	[key: string]: HTMLLIElement;
+}, id: string) => Promise<void>;
+export declare const handleKeyDownMainMenu: (event: KeyboardEvent, closeCallback: () => void) => void;
+export declare const handleKeyDownOpenSubMenuItem: (event: KeyboardEvent, openSubmenuFn: () => void) => Promise<void>;
+export declare const handleKeyDownSubMenu: (event: KeyboardEvent, returnFromSubMenu: () => void, closeSettingsMenuFn: () => void) => Promise<void>;
+export declare const handleChoseMenuItem: (event: KeyboardEvent, selectFn: () => void) => void;
+export declare const handleSwitchMenuItem: (event: KeyboardEvent, enabled: boolean, selectFn: (value: boolean) => void) => void;
+export declare const getContextMenuPositionByButton: (btnRef: HTMLButtonElement) => Position;
+export declare const getContextMenuPositionByHotKey: (overlayRef: HTMLDivElement | undefined) => Position;

package/types/components/Qoe/constants.d.ts

@@ -0,0 +1,9 @@
+/**
+* Отступ снизу для контейнера опроса от нижнего края плеера.
+* Включает высоту контролов и дополнительный отступ.
+*/
+export declare const QOE_POLL_BOTTOM_OFFSET: number;
+/**
+* Верхний отступ для расчёта максимальной высоты опроса.
+*/
+export declare const QOE_POLL_TOP_OFFSET: number;

package/types/components/Qoe/utils.d.ts

@@ -0,0 +1 @@
+export declare const stopPropagation: (e: MouseEvent | KeyboardEvent) => void;

package/types/components/Root/types.d.ts

@@ -0,0 +1,47 @@
+import type { EnrichedStore } from "../../store";
+import type { AdmanInitParams, IVideoData, IVKVideoPlayerConfig } from "../../types";
+import type { IUIConfig } from "../../config";
+import type { Interactives } from "@vkontakte/videoplayer-interactive";
+import type KeyboardControls from "../KeyboardControls.svelte";
+import type { AdmanWrapper } from "../Ads/admanWrapper";
+export interface RootProps {
+	videoData: IVideoData;
+	store: EnrichedStore;
+	admanWrapper: AdmanWrapper;
+	videoConfig: IVKVideoPlayerConfig;
+	uiConfig: IUIConfig;
+	interactiveContainer: HTMLElement | undefined;
+	interactiveController: Interactives | undefined;
+	autoplay: boolean;
+	adsParams?: AdmanInitParams["params"];
+	isMobile: boolean;
+	showNextPrevButtons?: boolean;
+	nextButtonActive?: boolean;
+	prevButtonActive?: boolean;
+	endScreenVideoTitle?: string | undefined;
+	endScreenVideoThumb?: string | undefined;
+	isOneVideoPlaylist?: boolean;
+	shadowRootContainer: HTMLElement;
+	outerContainerRef: HTMLElement;
+	fullScreenTarget?: HTMLElement | undefined;
+	seekToInteractive?: () => void;
+	playPrevChapter?: () => void;
+	keyboardControls?: KeyboardControls | undefined;
+	needToRepeatPlaylist?: boolean;
+	getVideoDeeplink?: (timestamp: number) => string;
+	firstStart: (external?: boolean) => void;
+	seekTime: (Seconds: number) => void;
+	onDomReady: VoidFunction;
+	showEndScreen?: boolean;
+}
+export interface RootExports {
+	setPlayerStarted: (value: boolean) => void;
+	videoContainer?: HTMLElement;
+	keyboardControls?: {
+		focus: () => void;
+		handleExternalKeyboardEvent: (event: KeyboardEvent) => boolean;
+	};
+}
+export interface PersistentLayerExports {
+	startVideoChangedAnimation: (prev: boolean) => void;
+}

package/types/components/Root/utils.d.ts

@@ -0,0 +1,2 @@
+import type { IUIConfig } from "../../config";
+export declare function mapConfigStyle(options: IUIConfig["view"]): string | undefined;

package/types/components/Timeline/PreviewTrack/useTransitionToPreviewTrack.svelte.d.ts

@@ -0,0 +1,21 @@
+type Params = {
+	onPreviewTrackOpened: () => void;
+	getTimelineRef: () => HTMLElement | undefined;
+	isHorizontal: boolean;
+};
+/**
+* Координирует анимацию показа превью трека.
+* Поднимает прогресс бар, опускает контролы, проявляет превью трек.
+* Все строится вокруг progressToOpenTrack.
+*
+*/
+export declare const useTransitionToPreviewTrack: ({ onPreviewTrackOpened, getTimelineRef, isHorizontal }: Params) => {
+	progressBarY: () => number;
+	controlsY: () => number;
+	calculatedHeight: () => number;
+	onPointerDown: (e: PointerEvent) => void;
+	onPointerMove: (e: PointerEvent) => void;
+	onPointerUp: () => void;
+	closePreviewTrack: () => void;
+};
+export {};

package/types/components/Timeline/consts.d.ts

@@ -0,0 +1,4 @@
+/**
+* Сколько картинок показываем слева и справа от картинки, на которую указывает каретка с учетом картинки на которой находится каретка.
+*/
+export declare const PREVIEW_IMAGE_BUFFER = 3;

package/types/components/Tooltips/TimelinePreview.utils.d.ts

@@ -0,0 +1 @@
+export declare const isVerticallyAligned: (angle: number) => boolean;

package/types/components/shared/interpolateUtils.d.ts

@@ -0,0 +1,7 @@
+type AllowedHTML = Record<string, boolean>;
+/**
+* В дальнейшем можно по надобности указывать возможные атрибуты.
+*/
+export declare const DEFAULT_ALLOWED_HTML: AllowedHTML;
+export declare const interpolateMessage: (message?: string, customAllowedHTML?: AllowedHTML) => string | undefined;
+export {};