fix(player): layout props missing in analysis

packages/react/src/components/layouts/default/media-layout.tsx

@@ -3,9 +3,10 @@ import * as React from 'react';
 import { useSignal } from 'maverick.js/react';
 import { isBoolean } from 'maverick.js/std';
 import {
-  type DefaultLayoutProps as BaseLayoutProps,
+  type DefaultLayoutTranslations,
   type MediaPlayerQuery,
   type MediaStreamType,
+  type ThumbnailSrc,
 } from 'vidstack';
 
 import { useMediaContext } from '../../../hooks/use-media-context';
@@ -19,9 +20,7 @@ import type { DefaultLayoutIcons } from './icons';
  * DefaultMediaLayout
  * -----------------------------------------------------------------------------------------------*/
 
-export interface DefaultLayoutProps<Slots = unknown>
-  extends PrimitivePropsWithRef<'div'>,
-    Omit<Partial<BaseLayoutProps>, 'when' | 'smallWhen' | 'customIcons'> {
+export interface DefaultLayoutProps<Slots = unknown> extends PrimitivePropsWithRef<'div'> {
   children?: React.ReactNode;
   /**
    * The icons to be rendered and displayed inside the layout.
@@ -52,6 +51,48 @@ export interface DefaultLayoutProps<Slots = unknown>
    * @defaultValue `({ width, height }) => width < 576 || height < 380`
    */
   smallLayoutWhen?: boolean | MediaPlayerQuery;
+  /**
+   * The thumbnails resource.
+   *
+   * @see {@link https://www.vidstack.io/docs/wc/player/core-concepts/loading#thumbnails}
+   */
+  thumbnails?: ThumbnailSrc;
+  /**
+   * Translation map from english to your desired language for words used throughout the layout.
+   */
+  translations?: Partial<DefaultLayoutTranslations> | null;
+  /**
+   * Specifies whether menu buttons should be placed in the top or bottom controls group. This
+   * only applies to the large video layout.
+   */
+  menuGroup?: 'top' | 'bottom';
+  /**
+   * Whether modal menus should be disabled when the small layout is active. A modal menu is
+   * a floating panel that floats up from the bottom of the screen (outside of the player). It's
+   * enabled by default as it provides a better user experience for touch devices.
+   */
+  noModal?: boolean;
+  /**
+   * The minimum width of the slider to start displaying slider chapters when available.
+   */
+  sliderChaptersMinWidth?: number;
+  /**
+   * Whether the time slider should be disabled.
+   */
+  disableTimeSlider?: boolean;
+  /**
+   * Whether all gestures such as press to play or seek should not be active.
+   */
+  noGestures?: boolean;
+  /**
+   * Whether keyboard actions should not be displayed.
+   */
+  noKeyboardActionDisplay?: boolean;
+  /**
+   * The number of seconds to seek forward or backward when pressing the seek button or using
+   * keyboard shortcuts.
+   */
+  seekStep?: number;
   /**
    * Provide additional content to be inserted in specific positions.
    */

packages/react/src/components/layouts/plyr/props.ts

@@ -1,7 +1,7 @@
-import type { PlyrLayoutProps as BaseProps } from 'vidstack';
+import type { PlyrControl, PlyrLayoutTranslations, PlyrMarker, ThumbnailSrc } from 'vidstack';
 
-import type { PlyrLayoutSlots } from '.';
 import type { PlyrLayoutIcons } from './icons';
+import type { PlyrLayoutSlots } from './slots';
 
 export const defaultPlyrLayoutProps: Omit<PlyrLayoutProps, 'icons' | 'slots' | 'posterFrame'> = {
   clickToPlay: true,
@@ -29,18 +29,70 @@ export const defaultPlyrLayoutProps: Omit<PlyrLayoutProps, 'icons' | 'slots' | '
   speed: [0.5, 0.75, 1, 1.25, 1.5, 1.75, 2, 4],
 };
 
-export interface PlyrLayoutProps extends Omit<Partial<BaseProps>, 'customIcons'> {
+export interface PlyrLayoutProps {
   /**
    * The icons to be rendered and displayed inside the layout.
    */
   icons: PlyrLayoutIcons;
-  /**
-   * Provide additional content to be inserted in specific positions.
-   */
-  slots?: PlyrLayoutSlots;
   /**
    * The frame of the video to use as the poster. This only works with Remotion sources at the
    * moment.
    */
   posterFrame?: number;
+  /**
+   * Press the video container to toggle play/pause.
+   */
+  clickToPlay?: boolean;
+  /**
+   * Double-press the video container to toggle fullscreen.
+   */
+  clickToFullscreen?: boolean;
+  /**
+   * The controls to be included in the layout and their order specified by the position in the
+   * array.
+   */
+  controls?: PlyrControl[];
+  /**
+   * Whether the duration should be displayed. This is ignored if `toggleTime` is `true`.
+   */
+  displayDuration?: boolean;
+  /**
+   * Sets the download URL and filename for the download button. The download button must be
+   * included in the `controls` prop for this to take effect.
+   */
+  download?: string | { url: string; filename: string } | null;
+  /**
+   * Points on the time slider which should be visually marked for the user.
+   */
+  markers?: PlyrMarker[] | null;
+  /**
+   * Display the current time as a countdown rather than an incremental counter.
+   */
+  invertTime?: boolean;
+  /**
+   * The thumbnails resource.
+   *
+   * @see {@link https://www.vidstack.io/docs/wc/player/core-concepts/loading#thumbnails}
+   */
+  thumbnails?: ThumbnailSrc;
+  /**
+   * Allow users to press to toggle the inverted time.
+   */
+  toggleTime?: boolean;
+  /**
+   * Translation map from english to your desired language for words used throughout the layout.
+   */
+  translations?: Partial<PlyrLayoutTranslations> | null;
+  /**
+   * The time, in seconds, to seek when a user hits fast forward or rewind.
+   */
+  seekTime?: number;
+  /**
+   * The speed options to display in the UI.
+   */
+  speed?: (string | number)[];
+  /**
+   * Provide additional content to be inserted in specific positions.
+   */
+  slots?: PlyrLayoutSlots;
 }