UNPKG

koval-ui

Version:

React components collection with minimalistic design. Supports theming, layout, and input validation.

3 lines (2 loc) 3.78 kB
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("react"),t=require("classnames"),J=require("css-vars-hook");;/* empty css */const K=require("../../internal/Icons/IconPlay.cjs"),Q=require("../../internal/Icons/IconPause.cjs"),U=require("../../internal/Icons/IconVolume.cjs"),X=require("../../internal/Icons/IconVolumeOff.cjs"),Y=require("../../internal/Icons/IconDownloadVideo.cjs"),Z=require("../../internal/Icons/IconAudio.cjs"),ee=require("../../internal/hooks/useInternalRef.cjs"),h=require("../../internal/MediaEmbeds/types.cjs"),ae=require("../../internal/MediaEmbeds/usePlay.cjs"),x=require("../../internal/MediaEmbeds/getFileName.cjs"),se=require("../../internal/MediaEmbeds/useLoadingState.cjs"),g=require("../../internal/MediaEmbeds/getFormattedTime.cjs"),ne=require("../../internal/MediaEmbeds/useTime.cjs"),te=require("../../internal/MediaEmbeds/useSound.cjs"),N=require("../../internal/MediaEmbeds/RangeInput.module.css.cjs"),a=require("./Audio.module.css.cjs"),oe=require("../Picture/Picture.cjs"),j=r.forwardRef(({children:y,className:P,onReady:q=()=>{},onPlay:p=()=>{},onPause:I=()=>{},onError:v=()=>{},src:S,poster:n,title:T,sources:C=[],...M},R)=>{var d,i,m;const s=ee.useInternalRef(R),[u,V]=r.useState(0),{handleLoadedMetaData:w,handleError:b,handleCanPlay:A,readyToPlay:F}=se.useLoadingState({embedRef:s,onError:v,onReady:q,setDuration:V}),{handlePlay:L,handleTogglePlay:k,handlePause:D,playMode:o}=ae.usePlay({embedRef:s,onPlay:p,onPause:I}),{handleSetTime:O,currentTime:c}=ne.useTime({embedRef:s,playMode:o}),{volume:E,handleSetVolume:_,muted:l,handleToggleMuted:B}=te.useSound({embedRef:s,mutedProp:!1}),{LocalRoot:H}=J.useLocalTheme(),W=r.useMemo(()=>({background:`url(${n})`}),[n]),$=o===h.PlayModes.pause||o===h.PlayModes.pristine?K.IconPlay:Q.IconPause;return e.jsxs(H,{...M,theme:W,className:t(a.default.wrapper,P),children:[e.jsxs("div",{className:a.default.title,children:[e.jsx(Z.IconAudio,{className:a.default.icon}),e.jsx("span",{className:a.default.text,children:T||x.getFileName((d=s.current)==null?void 0:d.currentSrc)}),e.jsx("a",{className:a.default.download,href:(i=s.current)==null?void 0:i.currentSrc,download:x.getFileName((m=s.current)==null?void 0:m.currentSrc),children:e.jsx(Y.IconDownloadVideo,{})})]}),e.jsxs("div",{className:t(a.default.audio,{[a.default.noPoster]:!n}),children:[n&&e.jsx(oe.Picture,{className:a.default.poster,src:n,height:111,width:111}),e.jsx("div",{className:a.default.playWrapper,children:e.jsx("button",{onClick:k,className:t(a.default.playControl,{[a.default.loading]:!F}),children:e.jsx($,{className:a.default.icon})})}),e.jsxs("div",{className:a.default.rangeControls,children:[e.jsxs("div",{className:a.default.control,children:[e.jsxs("div",{className:a.default.time,children:[g.getFormattedTime(c),"/",g.getFormattedTime(u)]}),e.jsxs("div",{className:a.default.volumeControl,children:[e.jsx("button",{className:a.default.mutedButton,onClick:B,children:l?e.jsx(X.IconVolumeOff,{className:a.default.volumeIcon}):e.jsx(U.IconVolume,{className:a.default.volumeIcon})}),e.jsx("input",{min:0,max:1,step:.01,type:"range",value:l?0:E,onChange:_,className:t(N.default.range,a.default.volumeInput)})]})]}),e.jsx("div",{className:a.default.control,children:e.jsx("input",{onChange:O,value:c,type:"range",className:t(N.default.range,a.default.navigationInput),name:"seek",min:0,max:u,step:1})})]}),e.jsx("audio",{className:a.default.nativePlayer,ref:s,src:S,onPlay:L,onPause:D,onLoadedMetadata:w,onCanPlay:A,onError:b,muted:l,children:C.map(({src:f,type:z,mediaCondition:G})=>e.jsx("source",{src:f,type:z,media:G},f))}),y]})]})});j.displayName="Audio";exports.Audio=j; //# sourceMappingURL=Audio.cjs.map