@hanifhan1f/vidstack-react 1.12.13 → 1.12.15

package/src/hooks/use-state.ts

@@ -1,47 +0,0 @@
-import * as React from 'react';
-
-import type { AnyRecord, Component, State } from 'maverick.js';
-import { useSignal, useSignalRecord } from 'maverick.js/react';
-
-/**
- * This hook is used to subscribe to specific state on a component instance.
- *
- * @docs {@link https://www.vidstack.io/docs/player/api/hooks/use-state}
- */
-export function useState<T extends AnyRecord, R extends keyof T>(
-  ctor: { state: State<T> },
-  prop: R,
-  ref: React.RefObject<Component<any, T, any, any> | null>,
-): T[R] {
-  const initialValue = React.useMemo(() => ctor.state.record[prop], [ctor, prop]);
-  return useSignal(ref.current ? ref.current.$state[prop] : initialValue);
-}
-
-const storesCache = new Map<any, any>();
-
-/**
- * This hook is used to subscribe to multiple states on a component instance.
- *
- * @docs {@link https://www.vidstack.io/docs/player/api/hooks/use-store}
- */
-export function useStore<T extends AnyRecord>(
-  ctor: { state: State<T> },
-  ref: React.RefObject<Component<any, T, any, any> | null>,
-): T {
-  const initialStore = React.useMemo<any>(() => {
-    let store = storesCache.get(ctor);
-
-    // Share the same initial store proxy across constructors.
-    if (!store) {
-      store = new Proxy(ctor.state.record, {
-        get: (_, prop: any) => () => ctor.state.record[prop],
-      });
-
-      storesCache.set(ctor, store);
-    }
-
-    return store;
-  }, [ctor]);
-
-  return useSignalRecord(ref.current ? ref.current.$state : initialStore);
-}

package/src/hooks/use-text-cues.ts

@@ -1,33 +0,0 @@
-import * as React from 'react';
-
-import { EventsController } from 'maverick.js/std';
-import type { VTTCue } from 'media-captions';
-import type { TextTrack } from 'vidstack';
-
-/**
- * @docs {@link https://www.vidstack.io/docs/player/api/hooks/use-text-cues}
- */
-export function useTextCues(track: TextTrack | null): VTTCue[] {
-  const [cues, setCues] = React.useState<VTTCue[]>([]);
-
-  React.useEffect(() => {
-    if (!track) return;
-
-    function onCuesChange() {
-      if (track) setCues([...track.cues]);
-    }
-
-    const events = new EventsController(track)
-      .add('add-cue', onCuesChange)
-      .add('remove-cue', onCuesChange);
-
-    onCuesChange();
-
-    return () => {
-      setCues([]);
-      events.abort();
-    };
-  }, [track]);
-
-  return cues;
-}

package/src/hooks/use-thumbnails.ts

@@ -1,69 +0,0 @@
-import * as React from 'react';
-
-import { useReactScope, useSignal } from 'maverick.js/react';
-import {
-  ThumbnailsLoader,
-  type MediaCrossOrigin,
-  type ThumbnailImage,
-  type ThumbnailSrc,
-} from 'vidstack';
-
-import { createSignal, useScoped } from './use-signals';
-
-/**
- * The function will return the resolved thumbnail images given a thumbnail resource. It's safe to
- * call this hook in multiple places with the same `src` argument as work is de-duped and cached
- * internally.
- *
- * @docs {@link https://www.vidstack.io/docs/player/api/hooks/use-thumbnails}
- */
-export function useThumbnails(
-  src: ThumbnailSrc,
-  crossOrigin: MediaCrossOrigin | null = null,
-): ThumbnailImage[] {
-  const scope = useReactScope(),
-    $src = createSignal(src),
-    $crossOrigin = createSignal(crossOrigin),
-    loader = useScoped(() => ThumbnailsLoader.create($src, $crossOrigin));
-
-  if (__DEV__ && !scope) {
-    console.warn(
-      `[vidstack] \`useThumbnails\` must be called inside a child component of \`<MediaPlayer>\``,
-    );
-  }
-
-  React.useEffect(() => {
-    $src.set(src);
-  }, [src]);
-
-  React.useEffect(() => {
-    $crossOrigin.set(crossOrigin);
-  }, [crossOrigin]);
-
-  return useSignal(loader.$images);
-}
-
-/**
- * Returns the active thumbnail image based on the given time.
- *
- * @param thumbnails - thumbnail images.
- * @param time - the current time to determine which thumbnail is active.
- */
-export function useActiveThumbnail(
-  thumbnails: ThumbnailImage[],
-  time: number,
-): ThumbnailImage | null {
-  return React.useMemo(() => {
-    let activeIndex = -1;
-
-    for (let i = thumbnails.length - 1; i >= 0; i--) {
-      const image = thumbnails[i];
-      if (time >= image.startTime && (!image.endTime || time < image.endTime)) {
-        activeIndex = i;
-        break;
-      }
-    }
-
-    return thumbnails[activeIndex] || null;
-  }, [thumbnails, time]);
-}

package/src/icon.ts

@@ -1,37 +0,0 @@
-import * as React from 'react';
-
-export interface IconProps
-  extends React.PropsWithoutRef<React.SVGProps<SVGSVGElement>>,
-    React.RefAttributes<SVGElement | SVGSVGElement> {
-  /**
-   * The horizontal (width) and vertical (height) length of the underlying `<svg>` element.
-   *
-   * @see {@link https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/width}
-   * @see {@link https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/height}
-   */
-  size?: number;
-  part?: string;
-  /** @internal */
-  paths?: string;
-}
-
-export interface IconComponent extends React.ForwardRefExoticComponent<IconProps> {}
-
-const Icon: IconComponent = /* #__PURE__*/ React.forwardRef((props, ref) => {
-  const { width, height, size = null, paths, ...restProps } = props;
-  return React.createElement('svg', {
-    viewBox: '0 0 32 32',
-    ...restProps,
-    width: width ?? size,
-    height: height ?? size,
-    fill: 'none',
-    'aria-hidden': 'true',
-    focusable: 'false',
-    xmlns: 'http://www.w3.org/2000/svg',
-    ref,
-    dangerouslySetInnerHTML: { __html: paths },
-  });
-});
-
-Icon.displayName = 'VidstackIcon';
-export { Icon };