@reacttv/embed-kit 0.4.6

package/dist/elements/youtube/player.js

@@ -0,0 +1,213 @@
+import { loadScript, EmbedVideoElement } from "../_base/index.js";
+import { REGEX_WATCH, REGEX_SHORT, REGEX_EMBED } from "./constants.js";
+import { parseYouTubeUrl } from "./helpers/parseYouTubeUrl.js";
+import { YT_PLAYER_STATE, } from "./player.types.js";
+const YT_SCRIPT = "https://www.youtube.com/iframe_api";
+function loadYTScript() {
+    return loadScript(YT_SCRIPT, {
+        isLoaded: () => !!window.YT?.Player,
+        ready: () => new Promise((resolve) => {
+            const prev = window.onYouTubeIframeAPIReady;
+            window.onYouTubeIframeAPIReady = () => {
+                prev?.();
+                resolve();
+            };
+        }),
+        errorMessage: "Failed to load YouTube iframe API",
+    });
+}
+/**
+ * YouTube embed player as a subclass of EmbedVideoElement.
+ */
+class YouTubeEmbedPlayer extends EmbedVideoElement {
+    ytPlayerState = { progressIntervalId: undefined, destroyed: false };
+    api = null;
+    player = null;
+    load() {
+        if (this.api) {
+            this.player?.destroy();
+            this.player = null;
+        }
+        void loadYTScript().then(() => {
+            if (this.ytPlayerState.destroyed)
+                return;
+            const YT = window.YT;
+            const attributes = this.getAttributes();
+            const { videoId } = parseYouTubeUrl(attributes.src);
+            if (!videoId)
+                return;
+            this.api = new YT.Player(this.getEmbedContainer(), {
+                videoId,
+                playerVars: {
+                    autoplay: this.options.autoplay ? 1 : 0,
+                    controls: this.options.controls ? 1 : 0,
+                    cc_load_policy: this.options.captions ? 1 : 0,
+                    iv_load_policy: this.options.annotations ? 1 : 3,
+                    rel: this.options.relatedVideos ? 1 : 0,
+                    origin: window.location.origin,
+                },
+                events: {
+                    onReady: ({ target }) => {
+                        this.player = target;
+                        this.dispatchReadyEvent();
+                        this.setInitialPlayerState();
+                    },
+                    onError: (error) => {
+                        this.playerState.error = {
+                            code: error.data,
+                            message: "YouTube playback error",
+                        };
+                        this.dispatchErrorEvent(this.playerState.error);
+                    },
+                    onApiChange: () => {
+                        // console.log("onApiChange");
+                    },
+                },
+            });
+            this.createListeners();
+        });
+    }
+    setInitialPlayerState() {
+        const attributes = this.getAttributes();
+        if (attributes.volume) {
+            this.volume = parseFloat(attributes.volume);
+        }
+        if (attributes.muted) {
+            this.muted = attributes.muted === "true";
+        }
+        if (attributes.playing) {
+            this.playing = attributes.playing === "true";
+        }
+    }
+    createListeners() {
+        this.api?.addEventListener("onStateChange", ({ data }) => {
+            if (data === YT_PLAYER_STATE.PAUSED) {
+                this.playerState.isPaused = true;
+                this.dispatchPauseEvent();
+            }
+            else if (data === YT_PLAYER_STATE.PLAYING) {
+                this.playerState.isPaused = false;
+                this.dispatchPlayEvent();
+            }
+            else if (data === YT_PLAYER_STATE.BUFFERING) {
+                this.dispatchBufferingEvent();
+            }
+            else if (data === YT_PLAYER_STATE.ENDED) {
+                this.dispatchEndedEvent();
+            }
+            else if (data === YT_PLAYER_STATE.CUED) {
+                this.dispatchCuedEvent();
+            }
+        });
+        this.api?.addEventListener("onVolumeChange", ({ data: { volume, muted } }) => {
+            if (volume !== this.playerState.volume) {
+                this.playerState.volume = volume;
+                this.dispatchVolumeChangeEvent(volume);
+            }
+            if (muted !== this.playerState.muted) {
+                this.playerState.muted = muted;
+                this.dispatchMuteChangeEvent(muted);
+            }
+        });
+        this.api?.addEventListener("onPlaybackRateChange", (event) => {
+            if (event.data !== this.playerState.playbackRate) {
+                this.playerState.playbackRate = event.data;
+                this.dispatchPlaybackRateChangeEvent(event.data);
+            }
+        });
+        this.api?.addEventListener("onVideoProgress", (event) => {
+            this.dispatchProgressEvent(event.data);
+        });
+        this.api?.addEventListener("onPlaybackQualityChange", (event) => {
+            if (event.data !== this.playerState.playbackQuality) {
+                this.playerState.playbackQuality = event.data;
+                this.dispatchPlaybackQualityChangeEvent(event.data);
+            }
+        });
+    }
+    connectedCallback() {
+        this.loadInitialOptions();
+        const src = this.getAttribute("src");
+        if (!src)
+            return;
+        const videoId = src.match(REGEX_WATCH)?.[1] ?? src.match(REGEX_SHORT)?.[1] ?? src.match(REGEX_EMBED)?.[1];
+        if (!videoId)
+            return;
+        this.load();
+    }
+    play() {
+        this.player?.playVideo();
+        return Promise.resolve();
+    }
+    pause() {
+        this.player?.pauseVideo();
+        return Promise.resolve();
+    }
+    destroy() {
+        this.ytPlayerState.destroyed = true;
+        if (this.ytPlayerState.progressIntervalId)
+            clearInterval(this.ytPlayerState.progressIntervalId);
+        // this.player?.destroy();
+    }
+    get playing() {
+        return !this.paused;
+    }
+    set playing(value) {
+        if (value) {
+            this.play();
+        }
+        else {
+            this.pause();
+        }
+    }
+    set captions(value) {
+        this.options.captions = value;
+        if (value) {
+            this.player?.loadModule("captions");
+        }
+        else {
+            this.player?.unloadModule("captions");
+        }
+    }
+    set controls(value) {
+        this.options.controls = value;
+        this.load();
+    }
+    get currentTime() {
+        return this.player?.getCurrentTime() ?? 0;
+    }
+    set currentTime(seconds) {
+        this.player?.seekTo(seconds, true);
+    }
+    get duration() {
+        return this.player?.getDuration() ?? 0;
+    }
+    get error() {
+        return this.playerState.error;
+    }
+    get muted() {
+        return this.player?.isMuted() ?? false;
+    }
+    set muted(value) {
+        if (value) {
+            this.player?.mute?.();
+        }
+        else {
+            this.player?.unMute?.();
+        }
+    }
+    get paused() {
+        return this.player?.getPlayerState() === YT_PLAYER_STATE.PAUSED;
+    }
+    get volume() {
+        return this.player?.getVolume() ?? 0;
+    }
+    set volume(vol) {
+        const v = Math.max(0, Math.min(100, vol));
+        this.player?.setVolume(v);
+    }
+}
+if (globalThis.customElements && !globalThis.customElements.get("youtube-video")) {
+    globalThis.customElements.define("youtube-video", YouTubeEmbedPlayer);
+}
+//# sourceMappingURL=player.js.map

package/dist/elements/youtube/player.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"player.js","sourceRoot":"","sources":["../../../src/elements/youtube/player.ts"],"names":[],"mappings":"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"}

package/dist/elements/youtube/player.types.d.ts

@@ -0,0 +1,79 @@
+export declare const YT_PLAYER_STATE: {
+    readonly ENDED: 0;
+    readonly PLAYING: 1;
+    readonly PAUSED: 2;
+    readonly BUFFERING: 3;
+    readonly CUED: 5;
+};
+declare global {
+    interface Window {
+        YT?: {
+            Player: new (el: string | HTMLElement, opts: YTOptions) => YTPlayer;
+            PlayerState: typeof YT_PLAYER_STATE;
+        };
+        onYouTubeIframeAPIReady?: () => void;
+    }
+}
+export interface YTOptions {
+    videoId: string;
+    width?: number;
+    height?: number;
+    playerVars?: Record<string, number | string>;
+    events?: {
+        onReady?: (ev: {
+            target: YTPlayer;
+        }) => void;
+        onStateChange?: (ev: {
+            data: number;
+        }) => void;
+        onError?: (ev: {
+            data: number;
+        }) => void;
+        onPlaybackQualityChange?: (ev: {
+            data: string;
+        }) => void;
+        onPlaybackRateChange?: (ev: {
+            data: number;
+        }) => void;
+        onAutoplayBlocked?: () => void;
+        onApiChange?: () => void;
+    };
+}
+export interface YTPlayer {
+    addEventListener: (event: string, callback: (data: any) => void) => void;
+    playVideo: () => void;
+    pauseVideo: () => void;
+    getPlayerState: () => number;
+    getCurrentTime: () => number;
+    getDuration: () => number;
+    loadModule: (module: "captions") => void;
+    unloadModule: (module: "captions") => void;
+    seekTo: (seconds: number, allowSeekAhead: boolean) => void;
+    mute: () => void;
+    unMute: () => void;
+    isMuted: () => boolean;
+    getVolume: () => number;
+    setVolume: (volume: number) => void;
+    destroy: () => void;
+}
+export interface IYTVolumeChangeEvent {
+    target: YTPlayer;
+    data: {
+        volume: number;
+        muted: boolean;
+        unstorable: boolean;
+    };
+}
+export interface IYTPlaybackRateChangeEvent {
+    target: YTPlayer;
+    data: number;
+}
+export interface IYTPlaybackQualityChangeEvent {
+    target: YTPlayer;
+    data: string;
+}
+export interface IVideoProgressEvent {
+    target: YTPlayer;
+    data: number;
+}
+//# sourceMappingURL=player.types.d.ts.map

package/dist/elements/youtube/player.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"player.types.d.ts","sourceRoot":"","sources":["../../../src/elements/youtube/player.types.ts"],"names":[],"mappings":"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"}

package/dist/elements/youtube/player.types.js

@@ -0,0 +1,8 @@
+export const YT_PLAYER_STATE = {
+    ENDED: 0,
+    PLAYING: 1,
+    PAUSED: 2,
+    BUFFERING: 3,
+    CUED: 5,
+};
+//# sourceMappingURL=player.types.js.map

package/dist/elements/youtube/player.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"player.types.js","sourceRoot":"","sources":["../../../src/elements/youtube/player.types.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,eAAe,GAAG;IAC7B,KAAK,EAAE,CAAC;IACR,OAAO,EAAE,CAAC;IACV,MAAM,EAAE,CAAC;IACT,SAAS,EAAE,CAAC;IACZ,IAAI,EAAE,CAAC;CACC,CAAC"}

package/dist/react-embed-kit/HtmlPlayer.d.ts

@@ -0,0 +1,23 @@
+import React, { MediaHTMLAttributes } from "react";
+import type { ReactEmbedKitProps } from "./ReactEmbedKit.js";
+interface VideoHTMLAttributes<T> extends MediaHTMLAttributes<T> {
+    height?: number | string | undefined;
+    playsInline?: boolean | undefined;
+    poster?: string | undefined;
+    width?: number | string | undefined;
+    disablePictureInPicture?: boolean | undefined;
+    disableRemotePlayback?: boolean | undefined;
+    onEnterPictureInPicture?: ((this: HTMLVideoElement, ev: Event) => void) | undefined;
+    onLeavePictureInPicture?: ((this: HTMLVideoElement, ev: Event) => void) | undefined;
+}
+export interface VideoElementProps extends React.DetailedHTMLProps<VideoHTMLAttributes<HTMLVideoElement>, HTMLVideoElement> {
+    playbackRate?: number;
+    volume?: number;
+    config?: Record<string, number | string | undefined>;
+}
+type HtmlPlayerProps = ReactEmbedKitProps & {
+    ref?: React.Ref<HTMLVideoElement>;
+};
+declare function HtmlPlayer({ ref, playing, volume, muted, ...props }: HtmlPlayerProps): import("react/jsx-runtime").JSX.Element;
+export default HtmlPlayer;
+//# sourceMappingURL=HtmlPlayer.d.ts.map

package/dist/react-embed-kit/HtmlPlayer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"HtmlPlayer.d.ts","sourceRoot":"","sources":["../../src/react-embed-kit/HtmlPlayer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,mBAAmB,EAAkC,MAAM,OAAO,CAAC;AAEnF,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AAE7D,UAAU,mBAAmB,CAAC,CAAC,CAAE,SAAQ,mBAAmB,CAAC,CAAC,CAAC;IAC7D,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC;IACrC,WAAW,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAClC,MAAM,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC5B,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC;IACpC,uBAAuB,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC9C,qBAAqB,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC5C,uBAAuB,CAAC,EAAE,CAAC,CAAC,IAAI,EAAE,gBAAgB,EAAE,EAAE,EAAE,KAAK,KAAK,IAAI,CAAC,GAAG,SAAS,CAAC;IACpF,uBAAuB,CAAC,EAAE,CAAC,CAAC,IAAI,EAAE,gBAAgB,EAAE,EAAE,EAAE,KAAK,KAAK,IAAI,CAAC,GAAG,SAAS,CAAC;CACrF;AAED,MAAM,WAAW,iBAAkB,SAAQ,KAAK,CAAC,iBAAiB,CAChE,mBAAmB,CAAC,gBAAgB,CAAC,EACrC,gBAAgB,CACjB;IACC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC,CAAC;CACtD;AAED,KAAK,eAAe,GAAG,kBAAkB,GAAG;IAAE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAA;CAAE,CAAC;AAElF,iBAAS,UAAU,CAAC,EAAE,GAAG,EAAE,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,eAAe,2CAwE7E;AAED,eAAe,UAAU,CAAC"}

package/dist/react-embed-kit/HtmlPlayer.js

@@ -0,0 +1,61 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useCallback, useEffect, useRef } from "react";
+import { AUDIO_EXTENSIONS } from "./constants.js";
+function HtmlPlayer({ ref, playing, volume, muted, ...props }) {
+    const Media = AUDIO_EXTENSIONS.test(`${props.src}`) ? "audio" : "video";
+    const internalRef = useRef(null);
+    const setRef = useCallback((el) => {
+        internalRef.current = el;
+        if (typeof ref === "function")
+            ref(el);
+        else if (ref && typeof ref === "object" && "current" in ref) {
+            const refObj = ref;
+            refObj.current = el;
+        }
+    }, [ref]);
+    useEffect(() => {
+        if (playing) {
+            internalRef.current?.play();
+        }
+        else {
+            internalRef.current?.pause();
+        }
+    }, [playing]);
+    useEffect(() => {
+        const el = internalRef.current;
+        if (!el)
+            return;
+        if (volume != null) {
+            const v = Math.max(0, Math.min(1, volume / 100));
+            el.volume = v;
+        }
+        el.muted = !!muted;
+    }, [volume, muted]);
+    return (_jsx(Media, { ...props, ref: setRef, onVolumeChange: props.onVolumeChange
+            ? (e) => {
+                const currentVolume = e.currentTarget?.volume;
+                if (currentVolume !== undefined)
+                    props.onVolumeChange?.(currentVolume * 100);
+            }
+            : undefined, onProgress: props.onProgress
+            ? (e) => {
+                const progress = e.currentTarget?.currentTime;
+                if (progress)
+                    props.onProgress?.(progress);
+            }
+            : undefined, onDurationChange: props.onDurationChange
+            ? (e) => {
+                const duration = e.currentTarget?.duration;
+                if (duration)
+                    props.onDurationChange?.(duration);
+            }
+            : undefined, onError: props.onError
+            ? (e) => {
+                const err = e.currentTarget?.error;
+                if (err)
+                    props.onError?.(err);
+            }
+            : undefined }));
+}
+export default HtmlPlayer;
+//# sourceMappingURL=HtmlPlayer.js.map

package/dist/react-embed-kit/HtmlPlayer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HtmlPlayer.js","sourceRoot":"","sources":["../../src/react-embed-kit/HtmlPlayer.tsx"],"names":[],"mappings":"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"}

package/dist/react-embed-kit/ReactEmbedKit.d.ts

@@ -0,0 +1,28 @@
+import React from "react";
+import "./embed-elements.js";
+import type { EmbedPlayerRef, IDispatchedEventCallbacks } from "../elements/_base/player.types.js";
+export type ReactEmbedKitProps = IDispatchedEventCallbacks & {
+    src: string;
+    width?: number;
+    height?: number;
+    className?: string;
+    style?: React.CSSProperties;
+    autoplay?: boolean;
+    playing?: boolean;
+    pip?: boolean;
+    muted?: boolean;
+    volume?: number;
+    seekTo?: number | null;
+    progressInterval?: number;
+    controls?: boolean;
+    captions?: boolean;
+    annotations?: boolean;
+    config?: {
+        youtube?: Record<string, number | string | undefined>;
+        vimeo?: Record<string, number | string | undefined>;
+    };
+    playerRef?: React.Ref<EmbedPlayerRef>;
+    onUnsupportedUrl?: (url: string) => void;
+};
+export declare function ReactEmbedKit(props: ReactEmbedKitProps): React.ReactElement;
+//# sourceMappingURL=ReactEmbedKit.d.ts.map

package/dist/react-embed-kit/ReactEmbedKit.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ReactEmbedKit.d.ts","sourceRoot":"","sources":["../../src/react-embed-kit/ReactEmbedKit.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoE,MAAM,OAAO,CAAC;AAEzF,OAAO,qBAAqB,CAAC;AAE7B,OAAO,KAAK,EACV,cAAc,EAEd,yBAAyB,EAC1B,MAAM,mCAAmC,CAAC;AAK3C,MAAM,MAAM,kBAAkB,GAAG,yBAAyB,GAAG;IAC3D,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,GAAG,CAAC,EAAE,OAAO,CAAC;IACd,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,MAAM,CAAC,EAAE;QACP,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC,CAAC;QACtD,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC,CAAC;KACrD,CAAC;IACF,SAAS,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IACtC,gBAAgB,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;CAC1C,CAAC;AAEF,wBAAgB,aAAa,CAAC,KAAK,EAAE,kBAAkB,GAAG,KAAK,CAAC,YAAY,CAyI3E"}

package/dist/react-embed-kit/ReactEmbedKit.js

@@ -0,0 +1,114 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import React, { useRef, useEffect, useLayoutEffect, useState, useCallback } from "react";
+import { mergeRefs } from "react-merge-refs";
+import "./embed-elements.js";
+import { getProviderForUrl, EMBED_TAG } from "./providers.js";
+import { AUDIO_EXTENSIONS, VIDEO_EXTENSIONS } from "./constants.js";
+import HtmlPlayer from "./HtmlPlayer.js";
+export function ReactEmbedKit(props) {
+    const { muted, src, width, height, controls = true, captions, annotations, playing, onReady, onPlay, onPause, onBuffering, onEnded, onProgress, onDurationChange, onVolumeChange, onMuteChange, playerRef, volume, } = props;
+    const elementRef = useRef(null);
+    const [isClient, setIsClient] = useState(false);
+    const [tagReady, setTagReady] = useState(false);
+    const resolved = getProviderForUrl(src) ?? {
+        tagName: EMBED_TAG.YOUTUBE,
+        url: src,
+    };
+    useEffect(() => {
+        setIsClient(true);
+    }, []);
+    useEffect(() => {
+        if (!isClient)
+            return;
+        setTagReady(false);
+        import("./registerEmbedElements.js")
+            .then(() => setTagReady(true))
+            .catch((err) => {
+            // eslint-disable-next-line no-console -- surface load failure for debugging
+            console.error("[ReactEmbedKit] Failed to load embed player modules:", err);
+        });
+    }, [isClient]);
+    // Wire ready + other events from the custom element
+    useEffect(() => {
+        const el = elementRef.current;
+        if (!el)
+            return;
+        const handlers = {
+            onReady: () => onReady?.(),
+            onPlay: () => onPlay?.(),
+            onPause: () => onPause?.(),
+            onBuffering: () => onBuffering?.(),
+            onEnded: () => onEnded?.(),
+            onProgress: (event) => {
+                onProgress?.(event.detail);
+            },
+            onDurationChange: (event) => {
+                onDurationChange?.(event.detail);
+            },
+            onVolumeChange: (event) => {
+                onVolumeChange?.(event.detail);
+            },
+            onMuteChange: (event) => {
+                onMuteChange?.(event.detail);
+            },
+        };
+        Object.entries(handlers).forEach(([event, handler]) => {
+            el.addEventListener(event, handler);
+        });
+        return () => {
+            Object.entries(handlers).forEach(([event, handler]) => {
+                el.removeEventListener(event, handler);
+            });
+        };
+    }, [
+        onReady,
+        onPlay,
+        onPause,
+        onBuffering,
+        onEnded,
+        onProgress,
+        onDurationChange,
+        onVolumeChange,
+        onMuteChange,
+    ]);
+    const applyAttributesAndLoad = useCallback((el) => {
+        if (!el || !(el instanceof HTMLElement))
+            return;
+        const setIfChanged = (name, value) => {
+            if (el.getAttribute(name) !== value)
+                el.setAttribute(name, value);
+        };
+        setIfChanged("src", resolved.url);
+        setIfChanged("muted", String(!!muted));
+        setIfChanged("playing", String(!!playing));
+        setIfChanged("controls", String(controls));
+        setIfChanged("captions", String(!!captions));
+        setIfChanged("annotations", String(!!annotations));
+        if (volume != null)
+            setIfChanged("volume", String(volume));
+        if (width != null)
+            setIfChanged("width", String(width));
+        if (height != null)
+            setIfChanged("height", String(height));
+    }, [resolved.url, muted, playing, controls, captions, annotations, volume, width, height]);
+    // React doesn't reliably forward ref to custom elements from createElement; use a callback ref
+    // so we get the element when it's attached, then set attributes and load.
+    const setEmbedRef = useCallback((el) => {
+        elementRef.current = el;
+        applyAttributesAndLoad(el);
+    }, [applyAttributesAndLoad]);
+    // When props change, update the element (elementRef is set by the callback ref above).
+    useLayoutEffect(() => {
+        applyAttributesAndLoad(elementRef.current);
+    }, [applyAttributesAndLoad]);
+    if (!isClient || !tagReady) {
+        return _jsx("div", {});
+    }
+    if (resolved.url.match(AUDIO_EXTENSIONS) || resolved.url.match(VIDEO_EXTENSIONS)) {
+        return _jsx(HtmlPlayer, { ...props, ref: mergeRefs([setEmbedRef, playerRef]) });
+    }
+    return React.createElement(resolved.tagName, {
+        ref: mergeRefs([setEmbedRef, playerRef]),
+    });
+}
+//# sourceMappingURL=ReactEmbedKit.js.map

package/dist/react-embed-kit/ReactEmbedKit.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ReactEmbedKit.js","sourceRoot":"","sources":["../../src/react-embed-kit/ReactEmbedKit.tsx"],"names":[],"mappings":"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"}

package/dist/react-embed-kit/constants.d.ts

@@ -0,0 +1,3 @@
+export declare const AUDIO_EXTENSIONS: RegExp;
+export declare const VIDEO_EXTENSIONS: RegExp;
+//# sourceMappingURL=constants.d.ts.map

package/dist/react-embed-kit/constants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../src/react-embed-kit/constants.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,gBAAgB,QAC6C,CAAC;AAC3E,eAAO,MAAM,gBAAgB,QAAoD,CAAC"}

package/dist/react-embed-kit/constants.js

@@ -0,0 +1,3 @@
+export const AUDIO_EXTENSIONS = /\.(m4a|m4b|mp4a|mpga|mp2|mp2a|mp3|m2a|m3a|wav|weba|aac|oga|spx)($|\?)/i;
+export const VIDEO_EXTENSIONS = /\.(mp4|og[gv]|webm|mov|m4v)(#t=[,\d+]+)?($|\?)/i;
+//# sourceMappingURL=constants.js.map

package/dist/react-embed-kit/constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.js","sourceRoot":"","sources":["../../src/react-embed-kit/constants.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,gBAAgB,GAC3B,wEAAwE,CAAC;AAC3E,MAAM,CAAC,MAAM,gBAAgB,GAAG,iDAAiD,CAAC"}