@zuude-ui/video 0.1.3 → 0.1.4

package/dist/new/index.cjs

@@ -1,2 +1,2 @@
-"use strict";"use client";var O=Object.create;var m=Object.defineProperty;var M=Object.getOwnPropertyDescriptor;var H=Object.getOwnPropertyNames;var S=Object.getPrototypeOf,j=Object.prototype.hasOwnProperty;var B=(e,t)=>{for(var o in t)m(e,o,{get:t[o],enumerable:!0})},h=(e,t,o,i)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of H(t))!j.call(e,r)&&r!==o&&m(e,r,{get:()=>t[r],enumerable:!(i=M(t,r))||i.enumerable});return e};var b=(e,t,o)=>(o=e!=null?O(S(e)):{},h(t||!e||!e.__esModule?m(o,"default",{value:e,enumerable:!0}):o,e)),F=e=>h(m({},"__esModule",{value:!0}),e);var G={};B(G,{Loading:()=>z,Pause:()=>q,Play:()=>I,Video:()=>v,VideoProvider:()=>w,useVideoState:()=>D});module.exports=F(G);var l=require("react"),P=require("react/jsx-runtime"),k=(0,l.createContext)(void 0),w=({children:e,config:t,onError:o,...i})=>{let[r,n]=(0,l.useState)(null),[c,d]=(0,l.useState)(null);return(0,l.useEffect)(()=>{o==null||o(c)},[c]),(0,P.jsx)(k.Provider,{value:{videoRef:r,setVideoRef:n,config:{clickToPlay:!0,...t},error:c,setError:d},children:(0,P.jsx)("div",{...i,children:e})})},f=()=>{let e=(0,l.useContext)(k);if(!e)throw new Error("useVideo must be used within a VideoProvider");return e};var s=require("react");var L=b(require("react"),1),T=(e,t,o)=>{L.default.useEffect(()=>{if(!(e!=null&&e.current)||!t)return;(async()=>{var r;try{await((r=e.current)==null?void 0:r.play())}catch(n){if(n instanceof Error&&n.name==="NotAllowedError"){if(o==null||o("NotAllowedError"),console.error("NotAllowedError"),e!=null&&e.current){e.current.muted=!0;try{await e.current.play()}catch(c){console.error(c)}}}else console.error(n)}})()},[t,e==null?void 0:e.current])};var u=require("react/jsx-runtime"),v=(0,s.forwardRef)(({src:e,autoPlay:t,muteFallback:o,...i},r)=>{let{videoRef:n,setVideoRef:c,config:d,setError:E,error:A}=f(),x=(0,s.useRef)(null);(0,s.useEffect)(()=>{let a=x.current,p=r;p?c(p):a&&c({current:a})},[e]),T(n,t==="force"&&i.muted===void 0,E);let N=()=>{var a,p,g;(a=n==null?void 0:n.current)!=null&&a.paused?(p=n.current)==null||p.play():(g=n==null?void 0:n.current)==null||g.pause()};return(0,u.jsxs)(u.Fragment,{children:[(0,u.jsx)("video",{ref:r||x,src:e,...i,onClick:d!=null&&d.clickToPlay?N:void 0}),A==="NotAllowedError"&&typeof o=="function"&&o(()=>{n!=null&&n.current&&(n.current.muted=!n.current.muted),E(null)})]})});v.displayName="Video";var R=b(require("react"),1),C=require("@radix-ui/react-slot");var V=require("react/jsx-runtime"),I=R.default.memo(({children:e,asChild:t,...o})=>{let i=t?C.Slot:"button",{videoRef:r}=f();return(0,V.jsx)(i,{...o,onClick:()=>{var c,d;(c=r==null?void 0:r.current)!=null&&c.paused&&((d=r.current)==null||d.play())},children:e})}),q=R.default.memo(({children:e,asChild:t,...o})=>{let i=t?C.Slot:"button",{videoRef:r}=f();return(0,V.jsx)(i,{...o,onClick:()=>{var c;r!=null&&r.current&&((c=r.current)==null||c.pause())},children:e})}),z=()=>(0,V.jsx)("div",{children:"Loading"});var y=require("react"),D=e=>{let[t,o]=(0,y.useState)(!1);return(0,y.useEffect)(()=>{let i=e.current;if(i)return i.addEventListener("play",()=>o(!0)),i.addEventListener("pause",()=>o(!1)),()=>{i.removeEventListener("play",()=>o(!0)),i.removeEventListener("pause",()=>o(!1))}},[e]),{isPlaying:t}};0&&(module.exports={Loading,Pause,Play,Video,VideoProvider,useVideoState});
+"use strict";"use client";var S=Object.create;var h=Object.defineProperty;var O=Object.getOwnPropertyDescriptor;var j=Object.getOwnPropertyNames;var R=Object.getPrototypeOf,q=Object.prototype.hasOwnProperty;var B=(e,r)=>{for(var n in r)h(e,n,{get:r[n],enumerable:!0})},v=(e,r,n,c)=>{if(r&&typeof r=="object"||typeof r=="function")for(let t of j(r))!q.call(e,t)&&t!==n&&h(e,t,{get:()=>r[t],enumerable:!(c=O(r,t))||c.enumerable});return e};var g=(e,r,n)=>(n=e!=null?S(R(e)):{},v(r||!e||!e.__esModule?h(n,"default",{value:e,enumerable:!0}):n,e)),z=e=>v(h({},"__esModule",{value:!0}),e);var _={};B(_,{Controls:()=>U,ExitFullscreen:()=>Y,Fullscreen:()=>X,Loading:()=>Z,Mute:()=>J,Pause:()=>G,Play:()=>D,SeekBackward:()=>W,SeekForward:()=>Q,Unmute:()=>K,Video:()=>b,VideoProvider:()=>T,useFullscreen:()=>y,useVideoState:()=>I});module.exports=z(_);var d=require("react"),k=require("react/jsx-runtime"),w=(0,d.createContext)(void 0),T=({children:e,config:r,onError:n,...c})=>{let[t,o]=(0,d.useState)(null),[s,l]=(0,d.useState)(null);return(0,d.useEffect)(()=>{n==null||n(s)},[s]),(0,k.jsx)(w.Provider,{value:{videoRef:t,setVideoRef:o,config:{clickToPlay:!0,...r},error:s,setError:l},children:(0,k.jsx)("div",{"data-zuude-video-wrapper":!0,...c,children:e})})},u=()=>{let e=(0,d.useContext)(w);if(!e)throw new Error("useVideo must be used within a VideoProvider");return e};var f=require("react");var M=g(require("react"),1),A=(e,r,n)=>{M.default.useEffect(()=>{if(!(e!=null&&e.current)||!r)return;(async()=>{var t;try{await((t=e.current)==null?void 0:t.play())}catch(o){if(o instanceof Error&&o.name==="NotAllowedError"){if(n==null||n("NotAllowedError"),console.error("NotAllowedError"),e!=null&&e.current){e.current.muted=!0;try{await e.current.play()}catch(s){console.error(s)}}}else console.error(o)}})()},[r,e==null?void 0:e.current])};var E=require("react/jsx-runtime"),b=(0,f.forwardRef)(({src:e,autoPlay:r,muteFallback:n,...c},t)=>{let{videoRef:o,setVideoRef:s,config:l,setError:C,error:N}=u(),x=(0,f.useRef)(null);(0,f.useEffect)(()=>{let V=x.current,P=t;P?s(P):V&&s({current:V})},[e]),A(o,r==="force"&&c.muted===void 0,C);let H=()=>{var V,P,L;(V=o==null?void 0:o.current)!=null&&V.paused?(P=o.current)==null||P.play():(L=o==null?void 0:o.current)==null||L.pause()};return(0,E.jsxs)(E.Fragment,{children:[(0,E.jsx)("video",{ref:t||x,src:e,onClick:l!=null&&l.clickToPlay?H:void 0,autoPlay:r==="force"?!0:r,...c}),N==="NotAllowedError"&&typeof n=="function"&&n(()=>{o!=null&&o.current&&(o.current.muted=!o.current.muted),C(null)})]})});b.displayName="Video";var a=g(require("react"),1),m=require("@radix-ui/react-slot");var p=require("react"),F=g(require("react"),1),I=e=>{let[r,n]=(0,p.useState)(!1),[c,t]=(0,p.useState)(!1),[o,s]=(0,p.useState)(!1);return(0,p.useEffect)(()=>{let l=e.current;if(l)return l.addEventListener("play",()=>n(!0)),l.addEventListener("pause",()=>n(!1)),()=>{l.removeEventListener("play",()=>n(!0)),l.removeEventListener("pause",()=>n(!1))}},[e]),(0,p.useEffect)(()=>{if(!(e!=null&&e.current))return;t(e.current.muted);let l=()=>{e.current&&t(e.current.muted)};return e.current.addEventListener("volumechange",l),()=>{var C;(C=e.current)==null||C.removeEventListener("volumechange",l)}},[e]),(0,p.useEffect)(()=>{if(!(e!=null&&e.current))return;let l=()=>{s(!!document.fullscreenElement)};return document.addEventListener("fullscreenchange",l),()=>document.removeEventListener("fullscreenchange",l)},[e]),{isPlaying:r,isMuted:c,isFullscreen:o}},y=e=>{let[r,n]=F.default.useState(!1);F.default.useEffect(()=>{let t=()=>{n==null||n(!!document.fullscreenElement),c()};return document.addEventListener("fullscreenchange",t),()=>document.removeEventListener("fullscreenchange",t)},[r]);let c=()=>{console.log("toggleFullscreen");let t=/^((?!chrome|android).)*safari/i.test(navigator.userAgent),o=e;if(o&&t){if(o.webkitEnterFullscreen){o.webkitEnterFullscreen();return}else if(o.requestFullscreen){o.requestFullscreen();return}}let s=o==null?void 0:o.closest("[data-zuude-video-wrapper]");s&&(r?(document.exitFullscreen(),o&&(o.style.objectFit="cover")):(s.requestFullscreen(),o&&(o.style.objectFit="contain")))};return{isFullscreen:r!=null?r:!1,toggleFullscreen:c}};var i=require("react/jsx-runtime"),U=a.default.memo(({children:e,asChild:r,...n})=>(0,i.jsx)("div",{...n,children:e})),D=a.default.memo(({children:e,asChild:r,...n})=>{let c=r?m.Slot:"button",{videoRef:t}=u();return(0,i.jsx)(c,{...n,onClick:()=>{var s,l;(s=t==null?void 0:t.current)!=null&&s.paused&&((l=t.current)==null||l.play())},children:e})}),G=a.default.memo(({children:e,asChild:r,...n})=>{let c=r?m.Slot:"button",{videoRef:t}=u();return(0,i.jsx)(c,{...n,onClick:()=>{var s;t!=null&&t.current&&((s=t.current)==null||s.pause())},children:e})}),J=a.default.memo(({children:e,asChild:r,...n})=>{let c=r?m.Slot:"button",{videoRef:t}=u();return(0,i.jsx)(c,{...n,onClick:()=>{t!=null&&t.current&&(t.current.muted=!0)},children:e})}),K=a.default.memo(({children:e,asChild:r,...n})=>{let c=r?m.Slot:"button",{videoRef:t}=u();return(0,i.jsx)(c,{...n,onClick:()=>{t!=null&&t.current&&(t.current.muted=!1)},children:e})}),Q=a.default.memo(({children:e,asChild:r,...n})=>{let c=r?m.Slot:"button",{videoRef:t}=u();return(0,i.jsx)(c,{...n,onClick:()=>{t!=null&&t.current&&(t.current.currentTime+=10)},children:e})}),W=a.default.memo(({children:e,asChild:r,...n})=>{let c=r?m.Slot:"button",{videoRef:t}=u();return(0,i.jsx)(c,{...n,onClick:()=>{t!=null&&t.current&&(t.current.currentTime-=10)},children:e})}),X=a.default.memo(({children:e,asChild:r,...n})=>{let c=r?m.Slot:"button",{videoRef:t}=u(),{toggleFullscreen:o}=y(t==null?void 0:t.current);return(0,i.jsx)(c,{...n,onClick:o,children:e})}),Y=a.default.memo(({children:e,asChild:r,...n})=>{let c=r?m.Slot:"button",{videoRef:t}=u(),{toggleFullscreen:o}=y(t==null?void 0:t.current);return(0,i.jsx)(c,{...n,onClick:o,children:e})}),Z=()=>(0,i.jsx)("div",{children:"Loading"});0&&(module.exports={Controls,ExitFullscreen,Fullscreen,Loading,Mute,Pause,Play,SeekBackward,SeekForward,Unmute,Video,VideoProvider,useFullscreen,useVideoState});
 //# sourceMappingURL=index.cjs.map

package/dist/new/index.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/new/index.ts","../../src/new/wrapper.tsx","../../src/new/video.tsx","../../src/hooks/use-autoplay-by-force.tsx","../../src/new/components.tsx","../../src/new/hook.tsx"],"sourcesContent":["\"use client\";\n\nexport { VideoProvider } from \"./wrapper\";\nexport { Video } from \"./video\";\nexport * from \"./components\";\nexport * from \"./hook\";\n","import {\n  createContext,\n  RefObject,\n  useContext,\n  useEffect,\n  useState,\n} from \"react\";\nimport { VideoRef } from \"./types\";\n\ninterface VideoConfig {\n  config?: Partial<{\n    clickToPlay: boolean;\n  }>;\n}\n\ninterface VideoContextType extends VideoConfig {\n  videoRef: VideoRef | null;\n  setVideoRef: (video: VideoRef | null) => void;\n  error: string | null;\n  setError: (error: string | null) => void;\n}\n\nexport const VideoContext = createContext<VideoContextType | undefined>(\n  undefined\n);\n\ntype VideoProviderProps = React.ComponentProps<\"div\"> &\n  VideoConfig & {\n    children: React.ReactNode;\n    onError?: (error: string | null) => void;\n  };\n\nexport const VideoProvider = ({\n  children,\n  config,\n  onError,\n  ...props\n}: VideoProviderProps) => {\n  const [videoRef, setVideoRef] = useState<VideoRef | null>(null);\n  const [error, setError] = useState<string | null>(null);\n\n  // Sending error to user if it exists\n  useEffect(() => {\n    onError?.(error);\n  }, [error]);\n\n  return (\n    <VideoContext.Provider\n      value={{\n        videoRef,\n        setVideoRef,\n        config: { clickToPlay: true, ...config },\n        error,\n        setError,\n      }}\n    >\n      <div {...props}>{children}</div>\n    </VideoContext.Provider>\n  );\n};\n\nexport const useVideo = () => {\n  const context = useContext(VideoContext);\n  if (!context) {\n    throw new Error(\"useVideo must be used within a VideoProvider\");\n  }\n  return context;\n};\n","import React, { forwardRef, RefObject, useEffect, useRef } from \"react\";\nimport { useVideo } from \"./wrapper\";\nimport { VideoAutoplay } from \"./types\";\nimport { useAutoplayByForce } from \"../hooks/use-autoplay-by-force\";\n\ninterface Props extends Omit<React.ComponentProps<\"video\">, \"autoPlay\"> {\n  src: string;\n  autoPlay?: VideoAutoplay;\n  muteFallback?: (onMute: () => void) => React.ReactNode;\n}\n\nexport const Video = forwardRef<HTMLVideoElement, Props>(\n  ({ src, autoPlay, muteFallback, ...props }, ref) => {\n    const { videoRef, setVideoRef, config, setError, error } = useVideo();\n\n    const refVideo = useRef<HTMLVideoElement>(null);\n\n    useEffect(() => {\n      const video = refVideo.current;\n      const thirdPartyRef = ref;\n\n      if (thirdPartyRef) {\n        setVideoRef(thirdPartyRef as RefObject<HTMLVideoElement>);\n      } else {\n        if (video) {\n          setVideoRef({ current: video });\n        }\n      }\n    }, [src]);\n\n    useAutoplayByForce(\n      videoRef,\n      autoPlay === \"force\" && props.muted === undefined,\n      setError\n    );\n\n    const onPlay = () => {\n      if (videoRef?.current?.paused) {\n        videoRef.current?.play();\n      } else {\n        videoRef?.current?.pause();\n      }\n    };\n\n    return (\n      <>\n        <video\n          ref={ref || refVideo}\n          src={src}\n          {...props}\n          onClick={config?.clickToPlay ? onPlay : undefined}\n        />\n\n        {error === \"NotAllowedError\" &&\n          typeof muteFallback === \"function\" &&\n          muteFallback(() => {\n            if (videoRef?.current) {\n              videoRef.current.muted = !videoRef.current.muted;\n            }\n            setError(null);\n          })}\n      </>\n    );\n  }\n);\n\nVideo.displayName = \"Video\";\n","import React from \"react\";\nimport { VideoRef } from \"../types.js\";\n\nexport const useAutoplayByForce = (\n  ref: VideoRef | null,\n  enabled: boolean,\n  setError?: (error: string | null) => void\n) => {\n  React.useEffect(() => {\n    if (!ref?.current || !enabled) return;\n\n    const playVideo = async () => {\n      try {\n        await ref.current?.play();\n      } catch (error) {\n        // If autoplay fails, try muting and playing again\n        if (error instanceof Error && error.name === \"NotAllowedError\") {\n          setError?.(\"NotAllowedError\");\n          console.error(\"NotAllowedError\");\n          if (ref?.current) {\n            ref.current.muted = true;\n            try {\n              await ref.current.play();\n            } catch (retryError) {\n              console.error(retryError);\n            }\n          }\n        } else {\n          console.error(error);\n        }\n      }\n    };\n\n    playVideo();\n  }, [enabled, ref?.current]);\n};\n","import React from \"react\";\n\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { useVideo } from \"./wrapper\";\n\ninterface Props extends React.ComponentProps<\"button\"> {\n  children: React.ReactNode;\n  asChild?: boolean;\n}\n\nconst Play = React.memo(({ children, asChild, ...props }: Props) => {\n  const Element = asChild ? Slot : \"button\";\n  const { videoRef } = useVideo();\n\n  const handleClick = () => {\n    if (videoRef?.current?.paused) {\n      videoRef.current?.play();\n    }\n  };\n\n  return (\n    <Element {...props} onClick={handleClick}>\n      {children}\n    </Element>\n  );\n});\n\nconst Pause = React.memo(({ children, asChild, ...props }: Props) => {\n  const Element = asChild ? Slot : \"button\";\n  const { videoRef } = useVideo();\n\n  const handleClick = () => {\n    if (videoRef?.current) {\n      videoRef.current?.pause();\n    }\n  };\n\n  return (\n    <Element {...props} onClick={handleClick}>\n      {children}\n    </Element>\n  );\n});\n\nconst Loading = () => {\n  return <div>Loading</div>;\n};\n\nexport { Play, Pause, Loading };\n","import { RefObject, useEffect, useState } from \"react\";\n\nconst useVideoState = (videoRef: RefObject<HTMLVideoElement | null>) => {\n  const [isPlaying, setIsPlaying] = useState(false);\n\n  useEffect(() => {\n    const video = videoRef.current;\n\n    if (video) {\n      video.addEventListener(\"play\", () => setIsPlaying(true));\n      video.addEventListener(\"pause\", () => setIsPlaying(false));\n\n      return () => {\n        video.removeEventListener(\"play\", () => setIsPlaying(true));\n        video.removeEventListener(\"pause\", () => setIsPlaying(false));\n      };\n    }\n  }, [videoRef]);\n\n  return { isPlaying };\n};\n\nexport { useVideoState };\n"],"mappings":"ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,EAAA,UAAAC,EAAA,SAAAC,EAAA,UAAAC,EAAA,kBAAAC,EAAA,kBAAAC,IAAA,eAAAC,EAAAR,GCAA,IAAAS,EAMO,iBAkDDC,EAAA,6BAlCOC,KAAe,iBAC1B,MACF,EAQaC,EAAgB,CAAC,CAC5B,SAAAC,EACA,OAAAC,EACA,QAAAC,EACA,GAAGC,CACL,IAA0B,CACxB,GAAM,CAACC,EAAUC,CAAW,KAAI,YAA0B,IAAI,EACxD,CAACC,EAAOC,CAAQ,KAAI,YAAwB,IAAI,EAGtD,sBAAU,IAAM,CACdL,GAAA,MAAAA,EAAUI,EACZ,EAAG,CAACA,CAAK,CAAC,KAGR,OAACR,EAAa,SAAb,CACC,MAAO,CACL,SAAAM,EACA,YAAAC,EACA,OAAQ,CAAE,YAAa,GAAM,GAAGJ,CAAO,EACvC,MAAAK,EACA,SAAAC,CACF,EAEA,mBAAC,OAAK,GAAGJ,EAAQ,SAAAH,EAAS,EAC5B,CAEJ,EAEaQ,EAAW,IAAM,CAC5B,IAAMC,KAAU,cAAWX,CAAY,EACvC,GAAI,CAACW,EACH,MAAM,IAAI,MAAM,8CAA8C,EAEhE,OAAOA,CACT,ECnEA,IAAAC,EAAgE,iBCAhE,IAAAC,EAAkB,sBAGLC,EAAqB,CAChCC,EACAC,EACAC,IACG,CACH,EAAAC,QAAM,UAAU,IAAM,CACpB,GAAI,EAACH,GAAA,MAAAA,EAAK,UAAW,CAACC,EAAS,QAEb,SAAY,CAXlC,IAAAG,EAYM,GAAI,CACF,OAAMA,EAAAJ,EAAI,UAAJ,YAAAI,EAAa,OACrB,OAASC,EAAO,CAEd,GAAIA,aAAiB,OAASA,EAAM,OAAS,mBAG3C,GAFAH,GAAA,MAAAA,EAAW,mBACX,QAAQ,MAAM,iBAAiB,EAC3BF,GAAA,MAAAA,EAAK,QAAS,CAChBA,EAAI,QAAQ,MAAQ,GACpB,GAAI,CACF,MAAMA,EAAI,QAAQ,KAAK,CACzB,OAASM,EAAY,CACnB,QAAQ,MAAMA,CAAU,CAC1B,CACF,OAEA,QAAQ,MAAMD,CAAK,CAEvB,CACF,GAEU,CACZ,EAAG,CAACJ,EAASD,GAAA,YAAAA,EAAK,OAAO,CAAC,CAC5B,EDUM,IAAAO,EAAA,6BAlCOC,KAAQ,cACnB,CAAC,CAAE,IAAAC,EAAK,SAAAC,EAAU,aAAAC,EAAc,GAAGC,CAAM,EAAGC,IAAQ,CAClD,GAAM,CAAE,SAAAC,EAAU,YAAAC,EAAa,OAAAC,EAAQ,SAAAC,EAAU,MAAAC,CAAM,EAAIC,EAAS,EAE9DC,KAAW,UAAyB,IAAI,KAE9C,aAAU,IAAM,CACd,IAAMC,EAAQD,EAAS,QACjBE,EAAgBT,EAElBS,EACFP,EAAYO,CAA4C,EAEpDD,GACFN,EAAY,CAAE,QAASM,CAAM,CAAC,CAGpC,EAAG,CAACZ,CAAG,CAAC,EAERc,EACET,EACAJ,IAAa,SAAWE,EAAM,QAAU,OACxCK,CACF,EAEA,IAAMO,EAAS,IAAM,CApCzB,IAAAC,EAAAC,EAAAC,GAqCUF,EAAAX,GAAA,YAAAA,EAAU,UAAV,MAAAW,EAAmB,QACrBC,EAAAZ,EAAS,UAAT,MAAAY,EAAkB,QAElBC,EAAAb,GAAA,YAAAA,EAAU,UAAV,MAAAa,EAAmB,OAEvB,EAEA,SACE,oBACE,oBAAC,SACC,IAAKd,GAAOO,EACZ,IAAKX,EACJ,GAAGG,EACJ,QAASI,GAAA,MAAAA,EAAQ,YAAcQ,EAAS,OAC1C,EAECN,IAAU,mBACT,OAAOP,GAAiB,YACxBA,EAAa,IAAM,CACbG,GAAA,MAAAA,EAAU,UACZA,EAAS,QAAQ,MAAQ,CAACA,EAAS,QAAQ,OAE7CG,EAAS,IAAI,CACf,CAAC,GACL,CAEJ,CACF,EAEAT,EAAM,YAAc,QElEpB,IAAAoB,EAAkB,sBAElBC,EAAqB,gCAmBjB,IAAAC,EAAA,6BAXEC,EAAO,EAAAC,QAAM,KAAK,CAAC,CAAE,SAAAC,EAAU,QAAAC,EAAS,GAAGC,CAAM,IAAa,CAClE,IAAMC,EAAUF,EAAU,OAAO,SAC3B,CAAE,SAAAG,CAAS,EAAIC,EAAS,EAQ9B,SACE,OAACF,EAAA,CAAS,GAAGD,EAAO,QAPF,IAAM,CAd5B,IAAAI,EAAAC,GAeQD,EAAAF,GAAA,YAAAA,EAAU,UAAV,MAAAE,EAAmB,UACrBC,EAAAH,EAAS,UAAT,MAAAG,EAAkB,OAEtB,EAIK,SAAAP,EACH,CAEJ,CAAC,EAEKQ,EAAQ,EAAAT,QAAM,KAAK,CAAC,CAAE,SAAAC,EAAU,QAAAC,EAAS,GAAGC,CAAM,IAAa,CACnE,IAAMC,EAAUF,EAAU,OAAO,SAC3B,CAAE,SAAAG,CAAS,EAAIC,EAAS,EAQ9B,SACE,OAACF,EAAA,CAAS,GAAGD,EAAO,QAPF,IAAM,CA/B5B,IAAAI,EAgCQF,GAAA,MAAAA,EAAU,WACZE,EAAAF,EAAS,UAAT,MAAAE,EAAkB,QAEtB,EAIK,SAAAN,EACH,CAEJ,CAAC,EAEKS,EAAU,OACP,OAAC,OAAI,mBAAO,EC7CrB,IAAAC,EAA+C,iBAEzCC,EAAiBC,GAAiD,CACtE,GAAM,CAACC,EAAWC,CAAY,KAAI,YAAS,EAAK,EAEhD,sBAAU,IAAM,CACd,IAAMC,EAAQH,EAAS,QAEvB,GAAIG,EACF,OAAAA,EAAM,iBAAiB,OAAQ,IAAMD,EAAa,EAAI,CAAC,EACvDC,EAAM,iBAAiB,QAAS,IAAMD,EAAa,EAAK,CAAC,EAElD,IAAM,CACXC,EAAM,oBAAoB,OAAQ,IAAMD,EAAa,EAAI,CAAC,EAC1DC,EAAM,oBAAoB,QAAS,IAAMD,EAAa,EAAK,CAAC,CAC9D,CAEJ,EAAG,CAACF,CAAQ,CAAC,EAEN,CAAE,UAAAC,CAAU,CACrB","names":["new_exports","__export","Loading","Pause","Play","Video","VideoProvider","useVideoState","__toCommonJS","import_react","import_jsx_runtime","VideoContext","VideoProvider","children","config","onError","props","videoRef","setVideoRef","error","setError","useVideo","context","import_react","import_react","useAutoplayByForce","ref","enabled","setError","React","_a","error","retryError","import_jsx_runtime","Video","src","autoPlay","muteFallback","props","ref","videoRef","setVideoRef","config","setError","error","useVideo","refVideo","video","thirdPartyRef","useAutoplayByForce","onPlay","_a","_b","_c","import_react","import_react_slot","import_jsx_runtime","Play","React","children","asChild","props","Element","videoRef","useVideo","_a","_b","Pause","Loading","import_react","useVideoState","videoRef","isPlaying","setIsPlaying","video"]}
+{"version":3,"sources":["../../src/new/index.ts","../../src/new/wrapper.tsx","../../src/new/video.tsx","../../src/hooks/use-autoplay-by-force.tsx","../../src/new/components.tsx","../../src/new/hook.tsx"],"sourcesContent":["\"use client\";\n\nexport { VideoProvider } from \"./wrapper\";\nexport { Video } from \"./video\";\nexport * from \"./components\";\nexport * from \"./hook\";\n","import {\n  createContext,\n  RefObject,\n  useContext,\n  useEffect,\n  useState,\n} from \"react\";\nimport { VideoRef } from \"./types\";\n\ninterface VideoConfig {\n  config?: Partial<{\n    clickToPlay: boolean;\n  }>;\n}\n\ninterface VideoContextType extends VideoConfig {\n  videoRef: VideoRef | null;\n  setVideoRef: (video: VideoRef | null) => void;\n  error: string | null;\n  setError: (error: string | null) => void;\n}\n\nexport const VideoContext = createContext<VideoContextType | undefined>(\n  undefined\n);\n\ntype VideoProviderProps = React.ComponentProps<\"div\"> &\n  VideoConfig & {\n    children: React.ReactNode;\n    onError?: (error: string | null) => void;\n  };\n\nexport const VideoProvider = ({\n  children,\n  config,\n  onError,\n  ...props\n}: VideoProviderProps) => {\n  const [videoRef, setVideoRef] = useState<VideoRef | null>(null);\n  const [error, setError] = useState<string | null>(null);\n\n  // Sending error to user if it exists\n  useEffect(() => {\n    onError?.(error);\n  }, [error]);\n\n  return (\n    <VideoContext.Provider\n      value={{\n        videoRef,\n        setVideoRef,\n        config: { clickToPlay: true, ...config },\n        error,\n        setError,\n      }}\n    >\n      <div data-zuude-video-wrapper {...props}>\n        {children}\n      </div>\n    </VideoContext.Provider>\n  );\n};\n\nexport const useVideo = () => {\n  const context = useContext(VideoContext);\n  if (!context) {\n    throw new Error(\"useVideo must be used within a VideoProvider\");\n  }\n  return context;\n};\n","import React, { forwardRef, RefObject, useEffect, useRef } from \"react\";\nimport { useVideo } from \"./wrapper\";\nimport { VideoAutoplay } from \"./types\";\nimport { useAutoplayByForce } from \"../hooks/use-autoplay-by-force\";\n\ninterface Props extends Omit<React.ComponentProps<\"video\">, \"autoPlay\"> {\n  src: string;\n  autoPlay?: VideoAutoplay;\n  muteFallback?: (onMute: () => void) => React.ReactNode;\n}\n\nexport const Video = forwardRef<HTMLVideoElement, Props>(\n  ({ src, autoPlay, muteFallback, ...props }, ref) => {\n    const { videoRef, setVideoRef, config, setError, error } = useVideo();\n\n    const refVideo = useRef<HTMLVideoElement>(null);\n\n    useEffect(() => {\n      const video = refVideo.current;\n      const thirdPartyRef = ref;\n\n      if (thirdPartyRef) {\n        setVideoRef(thirdPartyRef as RefObject<HTMLVideoElement>);\n      } else {\n        if (video) {\n          setVideoRef({ current: video });\n        }\n      }\n    }, [src]);\n\n    useAutoplayByForce(\n      videoRef,\n      autoPlay === \"force\" && props.muted === undefined,\n      setError\n    );\n\n    const onPlay = () => {\n      if (videoRef?.current?.paused) {\n        videoRef.current?.play();\n      } else {\n        videoRef?.current?.pause();\n      }\n    };\n\n    return (\n      <>\n        <video\n          ref={ref || refVideo}\n          src={src}\n          onClick={config?.clickToPlay ? onPlay : undefined}\n          autoPlay={autoPlay === \"force\" ? true : autoPlay}\n          {...props}\n        />\n\n        {error === \"NotAllowedError\" &&\n          typeof muteFallback === \"function\" &&\n          muteFallback(() => {\n            if (videoRef?.current) {\n              videoRef.current.muted = !videoRef.current.muted;\n            }\n            setError(null);\n          })}\n      </>\n    );\n  }\n);\n\nVideo.displayName = \"Video\";\n","import React from \"react\";\nimport { VideoRef } from \"../types.js\";\n\nexport const useAutoplayByForce = (\n  ref: VideoRef | null,\n  enabled: boolean,\n  setError?: (error: string | null) => void\n) => {\n  React.useEffect(() => {\n    if (!ref?.current || !enabled) return;\n\n    const playVideo = async () => {\n      try {\n        await ref.current?.play();\n      } catch (error) {\n        // If autoplay fails, try muting and playing again\n        if (error instanceof Error && error.name === \"NotAllowedError\") {\n          setError?.(\"NotAllowedError\");\n          console.error(\"NotAllowedError\");\n          if (ref?.current) {\n            ref.current.muted = true;\n            try {\n              await ref.current.play();\n            } catch (retryError) {\n              console.error(retryError);\n            }\n          }\n        } else {\n          console.error(error);\n        }\n      }\n    };\n\n    playVideo();\n  }, [enabled, ref?.current]);\n};\n","import React from \"react\";\n\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { useVideo } from \"./wrapper\";\nimport { useFullscreen } from \"./hook\";\n\ninterface ControlsProps extends React.ComponentProps<\"div\"> {\n  children: React.ReactNode;\n  asChild?: boolean;\n}\n\nconst Controls = React.memo(\n  ({ children, asChild, ...props }: ControlsProps) => {\n    return <div {...props}>{children}</div>;\n  }\n);\n\ninterface Props extends React.ComponentProps<\"button\"> {\n  children: React.ReactNode;\n  asChild?: boolean;\n}\n\nconst Play = React.memo(({ children, asChild, ...props }: Props) => {\n  const Element = asChild ? Slot : \"button\";\n  const { videoRef } = useVideo();\n\n  const handleClick = () => {\n    if (videoRef?.current?.paused) {\n      videoRef.current?.play();\n    }\n  };\n\n  return (\n    <Element {...props} onClick={handleClick}>\n      {children}\n    </Element>\n  );\n});\n\nconst Pause = React.memo(({ children, asChild, ...props }: Props) => {\n  const Element = asChild ? Slot : \"button\";\n  const { videoRef } = useVideo();\n\n  const handleClick = () => {\n    if (videoRef?.current) {\n      videoRef.current?.pause();\n    }\n  };\n\n  return (\n    <Element {...props} onClick={handleClick}>\n      {children}\n    </Element>\n  );\n});\n\nconst Mute = React.memo(({ children, asChild, ...props }: Props) => {\n  const Element = asChild ? Slot : \"button\";\n  const { videoRef } = useVideo();\n\n  const handleClick = () => {\n    if (videoRef?.current) {\n      videoRef.current.muted = true;\n    }\n  };\n\n  return (\n    <Element {...props} onClick={handleClick}>\n      {children}\n    </Element>\n  );\n});\n\nconst Unmute = React.memo(({ children, asChild, ...props }: Props) => {\n  const Element = asChild ? Slot : \"button\";\n  const { videoRef } = useVideo();\n\n  const handleClick = () => {\n    if (videoRef?.current) {\n      videoRef.current.muted = false;\n    }\n  };\n\n  return (\n    <Element {...props} onClick={handleClick}>\n      {children}\n    </Element>\n  );\n});\n\nconst SeekForward = React.memo(({ children, asChild, ...props }: Props) => {\n  const Element = asChild ? Slot : \"button\";\n  const { videoRef } = useVideo();\n\n  const handleClick = () => {\n    if (videoRef?.current) {\n      videoRef.current.currentTime += 10;\n    }\n  };\n\n  return (\n    <Element {...props} onClick={handleClick}>\n      {children}\n    </Element>\n  );\n});\n\nconst SeekBackward = React.memo(({ children, asChild, ...props }: Props) => {\n  const Element = asChild ? Slot : \"button\";\n  const { videoRef } = useVideo();\n\n  const handleClick = () => {\n    if (videoRef?.current) {\n      videoRef.current.currentTime -= 10;\n    }\n  };\n\n  return (\n    <Element {...props} onClick={handleClick}>\n      {children}\n    </Element>\n  );\n});\n\nconst Fullscreen = React.memo(({ children, asChild, ...props }: Props) => {\n  const Element = asChild ? Slot : \"button\";\n  const { videoRef } = useVideo();\n\n  const { toggleFullscreen } = useFullscreen(\n    videoRef?.current as HTMLVideoElement | null\n  );\n\n  return (\n    <Element {...props} onClick={toggleFullscreen}>\n      {children}\n    </Element>\n  );\n});\n\nconst ExitFullscreen = React.memo(({ children, asChild, ...props }: Props) => {\n  const Element = asChild ? Slot : \"button\";\n  const { videoRef } = useVideo();\n\n  const { toggleFullscreen } = useFullscreen(\n    videoRef?.current as HTMLVideoElement | null\n  );\n\n  return (\n    <Element {...props} onClick={toggleFullscreen}>\n      {children}\n    </Element>\n  );\n});\n\nconst Loading = () => {\n  return <div>Loading</div>;\n};\n\nexport {\n  Controls,\n  Play,\n  Pause,\n  Mute,\n  Unmute,\n  SeekForward,\n  SeekBackward,\n  Fullscreen,\n  ExitFullscreen,\n  Loading,\n};\n","import { RefObject, useEffect, useState } from \"react\";\n\nconst useVideoState = (videoRef: RefObject<HTMLVideoElement | null>) => {\n  const [isPlaying, setIsPlaying] = useState(false);\n  const [isMuted, setIsMuted] = useState(false);\n  const [isFullscreen, setIsFullscreen] = useState(false);\n\n  useEffect(() => {\n    const video = videoRef.current;\n\n    if (video) {\n      video.addEventListener(\"play\", () => setIsPlaying(true));\n      video.addEventListener(\"pause\", () => setIsPlaying(false));\n\n      return () => {\n        video.removeEventListener(\"play\", () => setIsPlaying(true));\n        video.removeEventListener(\"pause\", () => setIsPlaying(false));\n      };\n    }\n  }, [videoRef]);\n\n  useEffect(() => {\n    if (!videoRef?.current) return;\n\n    // Set the initial state\n    setIsMuted(videoRef.current.muted);\n\n    const handleVolumeChange = () => {\n      if (videoRef.current) {\n        setIsMuted(videoRef.current.muted);\n      }\n    };\n\n    videoRef.current.addEventListener(\"volumechange\", handleVolumeChange);\n\n    return () => {\n      videoRef.current?.removeEventListener(\"volumechange\", handleVolumeChange);\n    };\n  }, [videoRef]);\n\n  useEffect(() => {\n    if (!videoRef?.current) return;\n\n    const handleFullscreenChange = () => {\n      setIsFullscreen(!!document.fullscreenElement);\n    };\n\n    document.addEventListener(\"fullscreenchange\", handleFullscreenChange);\n    return () =>\n      document.removeEventListener(\"fullscreenchange\", handleFullscreenChange);\n  }, [videoRef]);\n\n  return { isPlaying, isMuted, isFullscreen };\n};\n\nimport React from \"react\";\n\nconst useFullscreen = (videoRef: HTMLVideoElement | null) => {\n  const [isFullscreen, setIsFullscreen] = React.useState(false);\n\n  React.useEffect(() => {\n    const handleFullscreenChange = () => {\n      setIsFullscreen?.(!!document.fullscreenElement);\n      toggleFullscreen();\n    };\n\n    document.addEventListener(\"fullscreenchange\", handleFullscreenChange);\n    return () =>\n      document.removeEventListener(\"fullscreenchange\", handleFullscreenChange);\n  }, [isFullscreen]);\n\n  const toggleFullscreen = () => {\n    console.log(\"toggleFullscreen\");\n    const isSafari = /^((?!chrome|android).)*safari/i.test(navigator.userAgent);\n    const video = videoRef;\n\n    if (video && isSafari) {\n      if ((video as any).webkitEnterFullscreen) {\n        (video as any).webkitEnterFullscreen();\n        return;\n      } else if (video.requestFullscreen) {\n        video.requestFullscreen();\n        return;\n      }\n    }\n\n    const videoContainer = video?.closest(\n      \"[data-zuude-video-wrapper]\"\n    ) as HTMLElement;\n\n    if (videoContainer) {\n      if (!isFullscreen) {\n        videoContainer.requestFullscreen();\n        if (video) {\n          video.style.objectFit = \"contain\";\n        }\n      } else {\n        document.exitFullscreen();\n        if (video) {\n          video.style.objectFit = \"cover\";\n        }\n      }\n    }\n  };\n\n  return { isFullscreen: isFullscreen ?? false, toggleFullscreen };\n};\n\nexport { useVideoState, useFullscreen };\n"],"mappings":"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","names":["new_exports","__export","Controls","ExitFullscreen","Fullscreen","Loading","Mute","Pause","Play","SeekBackward","SeekForward","Unmute","Video","VideoProvider","useFullscreen","useVideoState","__toCommonJS","import_react","import_jsx_runtime","VideoContext","VideoProvider","children","config","onError","props","videoRef","setVideoRef","error","setError","useVideo","context","import_react","import_react","useAutoplayByForce","ref","enabled","setError","React","_a","error","retryError","import_jsx_runtime","Video","src","autoPlay","muteFallback","props","ref","videoRef","setVideoRef","config","setError","error","useVideo","refVideo","video","thirdPartyRef","useAutoplayByForce","onPlay","_a","_b","_c","import_react","import_react_slot","import_react","useVideoState","videoRef","isPlaying","setIsPlaying","isMuted","setIsMuted","isFullscreen","setIsFullscreen","video","handleVolumeChange","_a","handleFullscreenChange","useFullscreen","React","toggleFullscreen","isSafari","videoContainer","import_jsx_runtime","Controls","React","children","asChild","props","Play","Element","videoRef","useVideo","_a","_b","Pause","Mute","Unmute","SeekForward","SeekBackward","Fullscreen","toggleFullscreen","useFullscreen","ExitFullscreen","Loading"]}

package/dist/new/index.d.cts

@@ -21,16 +21,33 @@ interface Props$1 extends Omit<React$1.ComponentProps<"video">, "autoPlay"> {
 }
 declare const Video: React$1.ForwardRefExoticComponent<Omit<Props$1, "ref"> & React$1.RefAttributes<HTMLVideoElement>>;
 
+interface ControlsProps extends React$1.ComponentProps<"div"> {
+    children: React$1.ReactNode;
+    asChild?: boolean;
+}
+declare const Controls: React$1.MemoExoticComponent<({ children, asChild, ...props }: ControlsProps) => react_jsx_runtime.JSX.Element>;
 interface Props extends React$1.ComponentProps<"button"> {
     children: React$1.ReactNode;
     asChild?: boolean;
 }
 declare const Play: React$1.MemoExoticComponent<({ children, asChild, ...props }: Props) => react_jsx_runtime.JSX.Element>;
 declare const Pause: React$1.MemoExoticComponent<({ children, asChild, ...props }: Props) => react_jsx_runtime.JSX.Element>;
+declare const Mute: React$1.MemoExoticComponent<({ children, asChild, ...props }: Props) => react_jsx_runtime.JSX.Element>;
+declare const Unmute: React$1.MemoExoticComponent<({ children, asChild, ...props }: Props) => react_jsx_runtime.JSX.Element>;
+declare const SeekForward: React$1.MemoExoticComponent<({ children, asChild, ...props }: Props) => react_jsx_runtime.JSX.Element>;
+declare const SeekBackward: React$1.MemoExoticComponent<({ children, asChild, ...props }: Props) => react_jsx_runtime.JSX.Element>;
+declare const Fullscreen: React$1.MemoExoticComponent<({ children, asChild, ...props }: Props) => react_jsx_runtime.JSX.Element>;
+declare const ExitFullscreen: React$1.MemoExoticComponent<({ children, asChild, ...props }: Props) => react_jsx_runtime.JSX.Element>;
 declare const Loading: () => react_jsx_runtime.JSX.Element;
 
 declare const useVideoState: (videoRef: RefObject<HTMLVideoElement | null>) => {
     isPlaying: boolean;
+    isMuted: boolean;
+    isFullscreen: boolean;
+};
+declare const useFullscreen: (videoRef: HTMLVideoElement | null) => {
+    isFullscreen: boolean;
+    toggleFullscreen: () => void;
 };
 
-export { Loading, Pause, Play, Video, VideoProvider, useVideoState };
+export { Controls, ExitFullscreen, Fullscreen, Loading, Mute, Pause, Play, SeekBackward, SeekForward, Unmute, Video, VideoProvider, useFullscreen, useVideoState };

package/dist/new/index.d.ts

@@ -21,16 +21,33 @@ interface Props$1 extends Omit<React$1.ComponentProps<"video">, "autoPlay"> {
 }
 declare const Video: React$1.ForwardRefExoticComponent<Omit<Props$1, "ref"> & React$1.RefAttributes<HTMLVideoElement>>;
 
+interface ControlsProps extends React$1.ComponentProps<"div"> {
+    children: React$1.ReactNode;
+    asChild?: boolean;
+}
+declare const Controls: React$1.MemoExoticComponent<({ children, asChild, ...props }: ControlsProps) => react_jsx_runtime.JSX.Element>;
 interface Props extends React$1.ComponentProps<"button"> {
     children: React$1.ReactNode;
     asChild?: boolean;
 }
 declare const Play: React$1.MemoExoticComponent<({ children, asChild, ...props }: Props) => react_jsx_runtime.JSX.Element>;
 declare const Pause: React$1.MemoExoticComponent<({ children, asChild, ...props }: Props) => react_jsx_runtime.JSX.Element>;
+declare const Mute: React$1.MemoExoticComponent<({ children, asChild, ...props }: Props) => react_jsx_runtime.JSX.Element>;
+declare const Unmute: React$1.MemoExoticComponent<({ children, asChild, ...props }: Props) => react_jsx_runtime.JSX.Element>;
+declare const SeekForward: React$1.MemoExoticComponent<({ children, asChild, ...props }: Props) => react_jsx_runtime.JSX.Element>;
+declare const SeekBackward: React$1.MemoExoticComponent<({ children, asChild, ...props }: Props) => react_jsx_runtime.JSX.Element>;
+declare const Fullscreen: React$1.MemoExoticComponent<({ children, asChild, ...props }: Props) => react_jsx_runtime.JSX.Element>;
+declare const ExitFullscreen: React$1.MemoExoticComponent<({ children, asChild, ...props }: Props) => react_jsx_runtime.JSX.Element>;
 declare const Loading: () => react_jsx_runtime.JSX.Element;
 
 declare const useVideoState: (videoRef: RefObject<HTMLVideoElement | null>) => {
     isPlaying: boolean;
+    isMuted: boolean;
+    isFullscreen: boolean;
+};
+declare const useFullscreen: (videoRef: HTMLVideoElement | null) => {
+    isFullscreen: boolean;
+    toggleFullscreen: () => void;
 };
 
-export { Loading, Pause, Play, Video, VideoProvider, useVideoState };
+export { Controls, ExitFullscreen, Fullscreen, Loading, Mute, Pause, Play, SeekBackward, SeekForward, Unmute, Video, VideoProvider, useFullscreen, useVideoState };

package/dist/new/index.js

@@ -1,2 +1,2 @@
-"use client";import{a as V}from"../chunk-WLYC6MHJ.js";import{createContext as b,useContext as h,useEffect as k,useState as P}from"react";import{jsx as y}from"react/jsx-runtime";var v=b(void 0),L=({children:t,config:d,onError:o,...r})=>{let[n,e]=P(null),[i,s]=P(null);return k(()=>{o==null||o(i)},[i]),y(v.Provider,{value:{videoRef:n,setVideoRef:e,config:{clickToPlay:!0,...d},error:i,setError:s},children:y("div",{...r,children:t})})},u=()=>{let t=h(v);if(!t)throw new Error("useVideo must be used within a VideoProvider");return t};import{forwardRef as T,useEffect as O,useRef as w}from"react";import{Fragment as N,jsx as M,jsxs as A}from"react/jsx-runtime";var C=T(({src:t,autoPlay:d,muteFallback:o,...r},n)=>{let{videoRef:e,setVideoRef:i,config:s,setError:f,error:E}=u(),p=w(null);O(()=>{let c=p.current,l=n;l?i(l):c&&i({current:c})},[t]),V(e,d==="force"&&r.muted===void 0,f);let g=()=>{var c,l,m;(c=e==null?void 0:e.current)!=null&&c.paused?(l=e.current)==null||l.play():(m=e==null?void 0:e.current)==null||m.pause()};return A(N,{children:[M("video",{ref:n||p,src:t,...r,onClick:s!=null&&s.clickToPlay?g:void 0}),E==="NotAllowedError"&&typeof o=="function"&&o(()=>{e!=null&&e.current&&(e.current.muted=!e.current.muted),f(null)})]})});C.displayName="Video";import R from"react";import{Slot as x}from"@radix-ui/react-slot";import{jsx as a}from"react/jsx-runtime";var Y=R.memo(({children:t,asChild:d,...o})=>{let r=d?x:"button",{videoRef:n}=u();return a(r,{...o,onClick:()=>{var i,s;(i=n==null?void 0:n.current)!=null&&i.paused&&((s=n.current)==null||s.play())},children:t})}),Z=R.memo(({children:t,asChild:d,...o})=>{let r=d?x:"button",{videoRef:n}=u();return a(r,{...o,onClick:()=>{var i;n!=null&&n.current&&((i=n.current)==null||i.pause())},children:t})}),_=()=>a("div",{children:"Loading"});import{useEffect as H,useState as S}from"react";var re=t=>{let[d,o]=S(!1);return H(()=>{let r=t.current;if(r)return r.addEventListener("play",()=>o(!0)),r.addEventListener("pause",()=>o(!1)),()=>{r.removeEventListener("play",()=>o(!0)),r.removeEventListener("pause",()=>o(!1))}},[t]),{isPlaying:d}};export{_ as Loading,Z as Pause,Y as Play,C as Video,L as VideoProvider,re as useVideoState};
+"use client";import{a as g}from"../chunk-WLYC6MHJ.js";import{createContext as T,useContext as M,useEffect as w,useState as k}from"react";import{jsx as y}from"react/jsx-runtime";var b=T(void 0),H=({children:t,config:o,onError:r,...c})=>{let[e,n]=k(null),[s,l]=k(null);return w(()=>{r==null||r(s)},[s]),y(b.Provider,{value:{videoRef:e,setVideoRef:n,config:{clickToPlay:!0,...o},error:s,setError:l},children:y("div",{"data-zuude-video-wrapper":!0,...c,children:t})})},u=()=>{let t=M(b);if(!t)throw new Error("useVideo must be used within a VideoProvider");return t};import{forwardRef as S,useEffect as N,useRef as O}from"react";import{Fragment as j,jsx as A,jsxs as q}from"react/jsx-runtime";var F=S(({src:t,autoPlay:o,muteFallback:r,...c},e)=>{let{videoRef:n,setVideoRef:s,config:l,setError:m,error:L}=u(),P=O(null);N(()=>{let f=P.current,p=e;p?s(p):f&&s({current:f})},[t]),g(n,o==="force"&&c.muted===void 0,m);let v=()=>{var f,p,h;(f=n==null?void 0:n.current)!=null&&f.paused?(p=n.current)==null||p.play():(h=n==null?void 0:n.current)==null||h.pause()};return q(j,{children:[A("video",{ref:e||P,src:t,onClick:l!=null&&l.clickToPlay?v:void 0,autoPlay:o==="force"?!0:o,...c}),L==="NotAllowedError"&&typeof r=="function"&&r(()=>{n!=null&&n.current&&(n.current.muted=!n.current.muted),m(null)})]})});F.displayName="Video";import a from"react";import{Slot as d}from"@radix-ui/react-slot";import{useEffect as E,useState as C}from"react";import x from"react";var Z=t=>{let[o,r]=C(!1),[c,e]=C(!1),[n,s]=C(!1);return E(()=>{let l=t.current;if(l)return l.addEventListener("play",()=>r(!0)),l.addEventListener("pause",()=>r(!1)),()=>{l.removeEventListener("play",()=>r(!0)),l.removeEventListener("pause",()=>r(!1))}},[t]),E(()=>{if(!(t!=null&&t.current))return;e(t.current.muted);let l=()=>{t.current&&e(t.current.muted)};return t.current.addEventListener("volumechange",l),()=>{var m;(m=t.current)==null||m.removeEventListener("volumechange",l)}},[t]),E(()=>{if(!(t!=null&&t.current))return;let l=()=>{s(!!document.fullscreenElement)};return document.addEventListener("fullscreenchange",l),()=>document.removeEventListener("fullscreenchange",l)},[t]),{isPlaying:o,isMuted:c,isFullscreen:n}},V=t=>{let[o,r]=x.useState(!1);x.useEffect(()=>{let e=()=>{r==null||r(!!document.fullscreenElement),c()};return document.addEventListener("fullscreenchange",e),()=>document.removeEventListener("fullscreenchange",e)},[o]);let c=()=>{console.log("toggleFullscreen");let e=/^((?!chrome|android).)*safari/i.test(navigator.userAgent),n=t;if(n&&e){if(n.webkitEnterFullscreen){n.webkitEnterFullscreen();return}else if(n.requestFullscreen){n.requestFullscreen();return}}let s=n==null?void 0:n.closest("[data-zuude-video-wrapper]");s&&(o?(document.exitFullscreen(),n&&(n.style.objectFit="cover")):(s.requestFullscreen(),n&&(n.style.objectFit="contain")))};return{isFullscreen:o!=null?o:!1,toggleFullscreen:c}};import{jsx as i}from"react/jsx-runtime";var oe=a.memo(({children:t,asChild:o,...r})=>i("div",{...r,children:t})),ce=a.memo(({children:t,asChild:o,...r})=>{let c=o?d:"button",{videoRef:e}=u();return i(c,{...r,onClick:()=>{var s,l;(s=e==null?void 0:e.current)!=null&&s.paused&&((l=e.current)==null||l.play())},children:t})}),le=a.memo(({children:t,asChild:o,...r})=>{let c=o?d:"button",{videoRef:e}=u();return i(c,{...r,onClick:()=>{var s;e!=null&&e.current&&((s=e.current)==null||s.pause())},children:t})}),se=a.memo(({children:t,asChild:o,...r})=>{let c=o?d:"button",{videoRef:e}=u();return i(c,{...r,onClick:()=>{e!=null&&e.current&&(e.current.muted=!0)},children:t})}),ue=a.memo(({children:t,asChild:o,...r})=>{let c=o?d:"button",{videoRef:e}=u();return i(c,{...r,onClick:()=>{e!=null&&e.current&&(e.current.muted=!1)},children:t})}),ie=a.memo(({children:t,asChild:o,...r})=>{let c=o?d:"button",{videoRef:e}=u();return i(c,{...r,onClick:()=>{e!=null&&e.current&&(e.current.currentTime+=10)},children:t})}),ae=a.memo(({children:t,asChild:o,...r})=>{let c=o?d:"button",{videoRef:e}=u();return i(c,{...r,onClick:()=>{e!=null&&e.current&&(e.current.currentTime-=10)},children:t})}),de=a.memo(({children:t,asChild:o,...r})=>{let c=o?d:"button",{videoRef:e}=u(),{toggleFullscreen:n}=V(e==null?void 0:e.current);return i(c,{...r,onClick:n,children:t})}),me=a.memo(({children:t,asChild:o,...r})=>{let c=o?d:"button",{videoRef:e}=u(),{toggleFullscreen:n}=V(e==null?void 0:e.current);return i(c,{...r,onClick:n,children:t})}),fe=()=>i("div",{children:"Loading"});export{oe as Controls,me as ExitFullscreen,de as Fullscreen,fe as Loading,se as Mute,le as Pause,ce as Play,ae as SeekBackward,ie as SeekForward,ue as Unmute,F as Video,H as VideoProvider,V as useFullscreen,Z as useVideoState};
 //# sourceMappingURL=index.js.map

package/dist/new/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/new/wrapper.tsx","../../src/new/video.tsx","../../src/new/components.tsx","../../src/new/hook.tsx"],"sourcesContent":["import {\n  createContext,\n  RefObject,\n  useContext,\n  useEffect,\n  useState,\n} from \"react\";\nimport { VideoRef } from \"./types\";\n\ninterface VideoConfig {\n  config?: Partial<{\n    clickToPlay: boolean;\n  }>;\n}\n\ninterface VideoContextType extends VideoConfig {\n  videoRef: VideoRef | null;\n  setVideoRef: (video: VideoRef | null) => void;\n  error: string | null;\n  setError: (error: string | null) => void;\n}\n\nexport const VideoContext = createContext<VideoContextType | undefined>(\n  undefined\n);\n\ntype VideoProviderProps = React.ComponentProps<\"div\"> &\n  VideoConfig & {\n    children: React.ReactNode;\n    onError?: (error: string | null) => void;\n  };\n\nexport const VideoProvider = ({\n  children,\n  config,\n  onError,\n  ...props\n}: VideoProviderProps) => {\n  const [videoRef, setVideoRef] = useState<VideoRef | null>(null);\n  const [error, setError] = useState<string | null>(null);\n\n  // Sending error to user if it exists\n  useEffect(() => {\n    onError?.(error);\n  }, [error]);\n\n  return (\n    <VideoContext.Provider\n      value={{\n        videoRef,\n        setVideoRef,\n        config: { clickToPlay: true, ...config },\n        error,\n        setError,\n      }}\n    >\n      <div {...props}>{children}</div>\n    </VideoContext.Provider>\n  );\n};\n\nexport const useVideo = () => {\n  const context = useContext(VideoContext);\n  if (!context) {\n    throw new Error(\"useVideo must be used within a VideoProvider\");\n  }\n  return context;\n};\n","import React, { forwardRef, RefObject, useEffect, useRef } from \"react\";\nimport { useVideo } from \"./wrapper\";\nimport { VideoAutoplay } from \"./types\";\nimport { useAutoplayByForce } from \"../hooks/use-autoplay-by-force\";\n\ninterface Props extends Omit<React.ComponentProps<\"video\">, \"autoPlay\"> {\n  src: string;\n  autoPlay?: VideoAutoplay;\n  muteFallback?: (onMute: () => void) => React.ReactNode;\n}\n\nexport const Video = forwardRef<HTMLVideoElement, Props>(\n  ({ src, autoPlay, muteFallback, ...props }, ref) => {\n    const { videoRef, setVideoRef, config, setError, error } = useVideo();\n\n    const refVideo = useRef<HTMLVideoElement>(null);\n\n    useEffect(() => {\n      const video = refVideo.current;\n      const thirdPartyRef = ref;\n\n      if (thirdPartyRef) {\n        setVideoRef(thirdPartyRef as RefObject<HTMLVideoElement>);\n      } else {\n        if (video) {\n          setVideoRef({ current: video });\n        }\n      }\n    }, [src]);\n\n    useAutoplayByForce(\n      videoRef,\n      autoPlay === \"force\" && props.muted === undefined,\n      setError\n    );\n\n    const onPlay = () => {\n      if (videoRef?.current?.paused) {\n        videoRef.current?.play();\n      } else {\n        videoRef?.current?.pause();\n      }\n    };\n\n    return (\n      <>\n        <video\n          ref={ref || refVideo}\n          src={src}\n          {...props}\n          onClick={config?.clickToPlay ? onPlay : undefined}\n        />\n\n        {error === \"NotAllowedError\" &&\n          typeof muteFallback === \"function\" &&\n          muteFallback(() => {\n            if (videoRef?.current) {\n              videoRef.current.muted = !videoRef.current.muted;\n            }\n            setError(null);\n          })}\n      </>\n    );\n  }\n);\n\nVideo.displayName = \"Video\";\n","import React from \"react\";\n\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { useVideo } from \"./wrapper\";\n\ninterface Props extends React.ComponentProps<\"button\"> {\n  children: React.ReactNode;\n  asChild?: boolean;\n}\n\nconst Play = React.memo(({ children, asChild, ...props }: Props) => {\n  const Element = asChild ? Slot : \"button\";\n  const { videoRef } = useVideo();\n\n  const handleClick = () => {\n    if (videoRef?.current?.paused) {\n      videoRef.current?.play();\n    }\n  };\n\n  return (\n    <Element {...props} onClick={handleClick}>\n      {children}\n    </Element>\n  );\n});\n\nconst Pause = React.memo(({ children, asChild, ...props }: Props) => {\n  const Element = asChild ? Slot : \"button\";\n  const { videoRef } = useVideo();\n\n  const handleClick = () => {\n    if (videoRef?.current) {\n      videoRef.current?.pause();\n    }\n  };\n\n  return (\n    <Element {...props} onClick={handleClick}>\n      {children}\n    </Element>\n  );\n});\n\nconst Loading = () => {\n  return <div>Loading</div>;\n};\n\nexport { Play, Pause, Loading };\n","import { RefObject, useEffect, useState } from \"react\";\n\nconst useVideoState = (videoRef: RefObject<HTMLVideoElement | null>) => {\n  const [isPlaying, setIsPlaying] = useState(false);\n\n  useEffect(() => {\n    const video = videoRef.current;\n\n    if (video) {\n      video.addEventListener(\"play\", () => setIsPlaying(true));\n      video.addEventListener(\"pause\", () => setIsPlaying(false));\n\n      return () => {\n        video.removeEventListener(\"play\", () => setIsPlaying(true));\n        video.removeEventListener(\"pause\", () => setIsPlaying(false));\n      };\n    }\n  }, [videoRef]);\n\n  return { isPlaying };\n};\n\nexport { useVideoState };\n"],"mappings":"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","names":["createContext","useContext","useEffect","useState","jsx","VideoContext","VideoProvider","children","config","onError","props","videoRef","setVideoRef","error","setError","useVideo","context","forwardRef","useEffect","useRef","Fragment","jsx","jsxs","Video","forwardRef","src","autoPlay","muteFallback","props","ref","videoRef","setVideoRef","config","setError","error","useVideo","refVideo","useRef","useEffect","video","thirdPartyRef","useAutoplayByForce","onPlay","_a","_b","_c","React","Slot","jsx","Play","React","children","asChild","props","Element","Slot","videoRef","useVideo","_a","_b","Pause","Loading","useEffect","useState","useVideoState","videoRef","isPlaying","setIsPlaying","video"]}
+{"version":3,"sources":["../../src/new/wrapper.tsx","../../src/new/video.tsx","../../src/new/components.tsx","../../src/new/hook.tsx"],"sourcesContent":["import {\n  createContext,\n  RefObject,\n  useContext,\n  useEffect,\n  useState,\n} from \"react\";\nimport { VideoRef } from \"./types\";\n\ninterface VideoConfig {\n  config?: Partial<{\n    clickToPlay: boolean;\n  }>;\n}\n\ninterface VideoContextType extends VideoConfig {\n  videoRef: VideoRef | null;\n  setVideoRef: (video: VideoRef | null) => void;\n  error: string | null;\n  setError: (error: string | null) => void;\n}\n\nexport const VideoContext = createContext<VideoContextType | undefined>(\n  undefined\n);\n\ntype VideoProviderProps = React.ComponentProps<\"div\"> &\n  VideoConfig & {\n    children: React.ReactNode;\n    onError?: (error: string | null) => void;\n  };\n\nexport const VideoProvider = ({\n  children,\n  config,\n  onError,\n  ...props\n}: VideoProviderProps) => {\n  const [videoRef, setVideoRef] = useState<VideoRef | null>(null);\n  const [error, setError] = useState<string | null>(null);\n\n  // Sending error to user if it exists\n  useEffect(() => {\n    onError?.(error);\n  }, [error]);\n\n  return (\n    <VideoContext.Provider\n      value={{\n        videoRef,\n        setVideoRef,\n        config: { clickToPlay: true, ...config },\n        error,\n        setError,\n      }}\n    >\n      <div data-zuude-video-wrapper {...props}>\n        {children}\n      </div>\n    </VideoContext.Provider>\n  );\n};\n\nexport const useVideo = () => {\n  const context = useContext(VideoContext);\n  if (!context) {\n    throw new Error(\"useVideo must be used within a VideoProvider\");\n  }\n  return context;\n};\n","import React, { forwardRef, RefObject, useEffect, useRef } from \"react\";\nimport { useVideo } from \"./wrapper\";\nimport { VideoAutoplay } from \"./types\";\nimport { useAutoplayByForce } from \"../hooks/use-autoplay-by-force\";\n\ninterface Props extends Omit<React.ComponentProps<\"video\">, \"autoPlay\"> {\n  src: string;\n  autoPlay?: VideoAutoplay;\n  muteFallback?: (onMute: () => void) => React.ReactNode;\n}\n\nexport const Video = forwardRef<HTMLVideoElement, Props>(\n  ({ src, autoPlay, muteFallback, ...props }, ref) => {\n    const { videoRef, setVideoRef, config, setError, error } = useVideo();\n\n    const refVideo = useRef<HTMLVideoElement>(null);\n\n    useEffect(() => {\n      const video = refVideo.current;\n      const thirdPartyRef = ref;\n\n      if (thirdPartyRef) {\n        setVideoRef(thirdPartyRef as RefObject<HTMLVideoElement>);\n      } else {\n        if (video) {\n          setVideoRef({ current: video });\n        }\n      }\n    }, [src]);\n\n    useAutoplayByForce(\n      videoRef,\n      autoPlay === \"force\" && props.muted === undefined,\n      setError\n    );\n\n    const onPlay = () => {\n      if (videoRef?.current?.paused) {\n        videoRef.current?.play();\n      } else {\n        videoRef?.current?.pause();\n      }\n    };\n\n    return (\n      <>\n        <video\n          ref={ref || refVideo}\n          src={src}\n          onClick={config?.clickToPlay ? onPlay : undefined}\n          autoPlay={autoPlay === \"force\" ? true : autoPlay}\n          {...props}\n        />\n\n        {error === \"NotAllowedError\" &&\n          typeof muteFallback === \"function\" &&\n          muteFallback(() => {\n            if (videoRef?.current) {\n              videoRef.current.muted = !videoRef.current.muted;\n            }\n            setError(null);\n          })}\n      </>\n    );\n  }\n);\n\nVideo.displayName = \"Video\";\n","import React from \"react\";\n\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { useVideo } from \"./wrapper\";\nimport { useFullscreen } from \"./hook\";\n\ninterface ControlsProps extends React.ComponentProps<\"div\"> {\n  children: React.ReactNode;\n  asChild?: boolean;\n}\n\nconst Controls = React.memo(\n  ({ children, asChild, ...props }: ControlsProps) => {\n    return <div {...props}>{children}</div>;\n  }\n);\n\ninterface Props extends React.ComponentProps<\"button\"> {\n  children: React.ReactNode;\n  asChild?: boolean;\n}\n\nconst Play = React.memo(({ children, asChild, ...props }: Props) => {\n  const Element = asChild ? Slot : \"button\";\n  const { videoRef } = useVideo();\n\n  const handleClick = () => {\n    if (videoRef?.current?.paused) {\n      videoRef.current?.play();\n    }\n  };\n\n  return (\n    <Element {...props} onClick={handleClick}>\n      {children}\n    </Element>\n  );\n});\n\nconst Pause = React.memo(({ children, asChild, ...props }: Props) => {\n  const Element = asChild ? Slot : \"button\";\n  const { videoRef } = useVideo();\n\n  const handleClick = () => {\n    if (videoRef?.current) {\n      videoRef.current?.pause();\n    }\n  };\n\n  return (\n    <Element {...props} onClick={handleClick}>\n      {children}\n    </Element>\n  );\n});\n\nconst Mute = React.memo(({ children, asChild, ...props }: Props) => {\n  const Element = asChild ? Slot : \"button\";\n  const { videoRef } = useVideo();\n\n  const handleClick = () => {\n    if (videoRef?.current) {\n      videoRef.current.muted = true;\n    }\n  };\n\n  return (\n    <Element {...props} onClick={handleClick}>\n      {children}\n    </Element>\n  );\n});\n\nconst Unmute = React.memo(({ children, asChild, ...props }: Props) => {\n  const Element = asChild ? Slot : \"button\";\n  const { videoRef } = useVideo();\n\n  const handleClick = () => {\n    if (videoRef?.current) {\n      videoRef.current.muted = false;\n    }\n  };\n\n  return (\n    <Element {...props} onClick={handleClick}>\n      {children}\n    </Element>\n  );\n});\n\nconst SeekForward = React.memo(({ children, asChild, ...props }: Props) => {\n  const Element = asChild ? Slot : \"button\";\n  const { videoRef } = useVideo();\n\n  const handleClick = () => {\n    if (videoRef?.current) {\n      videoRef.current.currentTime += 10;\n    }\n  };\n\n  return (\n    <Element {...props} onClick={handleClick}>\n      {children}\n    </Element>\n  );\n});\n\nconst SeekBackward = React.memo(({ children, asChild, ...props }: Props) => {\n  const Element = asChild ? Slot : \"button\";\n  const { videoRef } = useVideo();\n\n  const handleClick = () => {\n    if (videoRef?.current) {\n      videoRef.current.currentTime -= 10;\n    }\n  };\n\n  return (\n    <Element {...props} onClick={handleClick}>\n      {children}\n    </Element>\n  );\n});\n\nconst Fullscreen = React.memo(({ children, asChild, ...props }: Props) => {\n  const Element = asChild ? Slot : \"button\";\n  const { videoRef } = useVideo();\n\n  const { toggleFullscreen } = useFullscreen(\n    videoRef?.current as HTMLVideoElement | null\n  );\n\n  return (\n    <Element {...props} onClick={toggleFullscreen}>\n      {children}\n    </Element>\n  );\n});\n\nconst ExitFullscreen = React.memo(({ children, asChild, ...props }: Props) => {\n  const Element = asChild ? Slot : \"button\";\n  const { videoRef } = useVideo();\n\n  const { toggleFullscreen } = useFullscreen(\n    videoRef?.current as HTMLVideoElement | null\n  );\n\n  return (\n    <Element {...props} onClick={toggleFullscreen}>\n      {children}\n    </Element>\n  );\n});\n\nconst Loading = () => {\n  return <div>Loading</div>;\n};\n\nexport {\n  Controls,\n  Play,\n  Pause,\n  Mute,\n  Unmute,\n  SeekForward,\n  SeekBackward,\n  Fullscreen,\n  ExitFullscreen,\n  Loading,\n};\n","import { RefObject, useEffect, useState } from \"react\";\n\nconst useVideoState = (videoRef: RefObject<HTMLVideoElement | null>) => {\n  const [isPlaying, setIsPlaying] = useState(false);\n  const [isMuted, setIsMuted] = useState(false);\n  const [isFullscreen, setIsFullscreen] = useState(false);\n\n  useEffect(() => {\n    const video = videoRef.current;\n\n    if (video) {\n      video.addEventListener(\"play\", () => setIsPlaying(true));\n      video.addEventListener(\"pause\", () => setIsPlaying(false));\n\n      return () => {\n        video.removeEventListener(\"play\", () => setIsPlaying(true));\n        video.removeEventListener(\"pause\", () => setIsPlaying(false));\n      };\n    }\n  }, [videoRef]);\n\n  useEffect(() => {\n    if (!videoRef?.current) return;\n\n    // Set the initial state\n    setIsMuted(videoRef.current.muted);\n\n    const handleVolumeChange = () => {\n      if (videoRef.current) {\n        setIsMuted(videoRef.current.muted);\n      }\n    };\n\n    videoRef.current.addEventListener(\"volumechange\", handleVolumeChange);\n\n    return () => {\n      videoRef.current?.removeEventListener(\"volumechange\", handleVolumeChange);\n    };\n  }, [videoRef]);\n\n  useEffect(() => {\n    if (!videoRef?.current) return;\n\n    const handleFullscreenChange = () => {\n      setIsFullscreen(!!document.fullscreenElement);\n    };\n\n    document.addEventListener(\"fullscreenchange\", handleFullscreenChange);\n    return () =>\n      document.removeEventListener(\"fullscreenchange\", handleFullscreenChange);\n  }, [videoRef]);\n\n  return { isPlaying, isMuted, isFullscreen };\n};\n\nimport React from \"react\";\n\nconst useFullscreen = (videoRef: HTMLVideoElement | null) => {\n  const [isFullscreen, setIsFullscreen] = React.useState(false);\n\n  React.useEffect(() => {\n    const handleFullscreenChange = () => {\n      setIsFullscreen?.(!!document.fullscreenElement);\n      toggleFullscreen();\n    };\n\n    document.addEventListener(\"fullscreenchange\", handleFullscreenChange);\n    return () =>\n      document.removeEventListener(\"fullscreenchange\", handleFullscreenChange);\n  }, [isFullscreen]);\n\n  const toggleFullscreen = () => {\n    console.log(\"toggleFullscreen\");\n    const isSafari = /^((?!chrome|android).)*safari/i.test(navigator.userAgent);\n    const video = videoRef;\n\n    if (video && isSafari) {\n      if ((video as any).webkitEnterFullscreen) {\n        (video as any).webkitEnterFullscreen();\n        return;\n      } else if (video.requestFullscreen) {\n        video.requestFullscreen();\n        return;\n      }\n    }\n\n    const videoContainer = video?.closest(\n      \"[data-zuude-video-wrapper]\"\n    ) as HTMLElement;\n\n    if (videoContainer) {\n      if (!isFullscreen) {\n        videoContainer.requestFullscreen();\n        if (video) {\n          video.style.objectFit = \"contain\";\n        }\n      } else {\n        document.exitFullscreen();\n        if (video) {\n          video.style.objectFit = \"cover\";\n        }\n      }\n    }\n  };\n\n  return { isFullscreen: isFullscreen ?? false, toggleFullscreen };\n};\n\nexport { useVideoState, useFullscreen };\n"],"mappings":"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","names":["createContext","useContext","useEffect","useState","jsx","VideoContext","VideoProvider","children","config","onError","props","videoRef","setVideoRef","error","setError","useVideo","context","forwardRef","useEffect","useRef","Fragment","jsx","jsxs","Video","forwardRef","src","autoPlay","muteFallback","props","ref","videoRef","setVideoRef","config","setError","error","useVideo","refVideo","useRef","useEffect","video","thirdPartyRef","useAutoplayByForce","onPlay","_a","_b","_c","React","Slot","useEffect","useState","React","useVideoState","videoRef","isPlaying","setIsPlaying","isMuted","setIsMuted","isFullscreen","setIsFullscreen","video","handleVolumeChange","_a","handleFullscreenChange","useFullscreen","toggleFullscreen","isSafari","videoContainer","jsx","Controls","React","children","asChild","props","Play","Element","Slot","videoRef","useVideo","_a","_b","Pause","Mute","Unmute","SeekForward","SeekBackward","Fullscreen","toggleFullscreen","useFullscreen","ExitFullscreen","Loading"]}

package/package.json

@@ -3,7 +3,7 @@
   "publishConfig": {
     "access": "public"
   },
-  "version": "0.1.3",
+  "version": "0.1.4",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
   "types": "./dist/index.d.ts",
@@ -11,6 +11,18 @@
     "dist/**"
   ],
   "type": "module",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.cjs",
+      "require": "./dist/index.js"
+    },
+    "./new": {
+      "types": "./dist/new/index.d.ts",
+      "import": "./dist/new/index.cjs",
+      "require": "./dist/new/index.js"
+    }
+  },
   "scripts": {
     "build": "tsup",
     "lint": "tsc"
@@ -20,12 +32,12 @@
   "license": "ISC",
   "description": "",
   "dependencies": {
-    "@radix-ui/react-slot": "^1.1.2",
     "tsup": "^8.5.0",
     "typescript": "^5.8.3"
   },
   "peerDependencies": {
-    "react": "^19.0.0"
+    "react": "^19.0.0",
+    "@radix-ui/react-slot": "^1.1.2"
   },
   "devDependencies": {
     "@types/react": "^19.0.10"