@nethesis/phone-island 0.7.49 → 0.7.51
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../node_modules/tslib/tslib.es6.js"),t=require("react"),n=require("../styles/Island.styles.js");require("../node_modules/react-redux/es/index.js");var a=require("../node_modules/@fortawesome/react-fontawesome/index.es.js"),r=require("../node_modules/@nethesis/nethesis-solid-svg-icons/index.mjs.js");require("../node_modules/framer-motion/dist/framer-motion.js");var o=require("../utils/useLongPress.js"),i=require("../node_modules/react-moment/dist/index.js"),l=require("../utils/useIsomorphicLayoutEffect.js");require("../store/index.js");var u=require("../utils/useLocalStorage.js"),s=require("../utils/getTranslate.js"),c=require("./AudioBars.js"),d=require("./Button.js"),m=require("../lib/phone/call.js"),f=require("../node_modules/@nethesis/nethesis-regular-svg-icons/index.mjs.js"),p=require("../_virtual/framer-motion.js"),g=require("../node_modules/react-redux/es/hooks/useSelector.js"),v=require("../node_modules/react-redux/es/hooks/useDispatch.js");function h(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var x=h(t),y=p.framerMotion.exports.motion(n.StyledPhoneIsland),E=p.framerMotion.exports.motion(n.StyledAvatar),w=p.framerMotion.exports.motion(n.StyledDetails),j=p.framerMotion.exports.motion(n.StyledName),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../node_modules/tslib/tslib.es6.js"),t=require("react"),n=require("../styles/Island.styles.js");require("../node_modules/react-redux/es/index.js");var a=require("../node_modules/@fortawesome/react-fontawesome/index.es.js"),r=require("../node_modules/@nethesis/nethesis-solid-svg-icons/index.mjs.js");require("../node_modules/framer-motion/dist/framer-motion.js");var o=require("../utils/useLongPress.js"),i=require("../node_modules/react-moment/dist/index.js"),l=require("../utils/useIsomorphicLayoutEffect.js");require("../store/index.js");var u=require("../utils/useLocalStorage.js"),s=require("../utils/getTranslate.js"),c=require("./AudioBars.js"),d=require("./Button.js"),m=require("../lib/phone/call.js"),f=require("../node_modules/@nethesis/nethesis-regular-svg-icons/index.mjs.js"),p=require("../_virtual/framer-motion.js"),g=require("../node_modules/react-redux/es/hooks/useSelector.js"),v=require("../node_modules/react-redux/es/hooks/useDispatch.js");function h(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var x=h(t),y=p.framerMotion.exports.motion(n.StyledPhoneIsland),E=p.framerMotion.exports.motion(n.StyledAvatar),w=p.framerMotion.exports.motion(n.StyledDetails),j=p.framerMotion.exports.motion(n.StyledName),b=0,C=0,N=function(h){var N=h.always,S=t.useState(!0),q=S[0],A=S[1],I=g.useSelector((function(e){return e.currentCall})),P=I.incoming,M=I.accepted,R=I.outgoing,_=I.displayName,z=I.number,D=I.startTime,F=I.muted,B=I.paused,L=g.useSelector((function(e){return e.player}));L.localAudio;var k=L.remoteAudio,T=p.framerMotion.exports.useDragControls(),O=u.useLocalStorage("phone-island",null),W=O[0],V=O[1],H=t.useRef(null),X=t.useRef(null),G=t.useState(W&&W.position?W.position:null),J=G[0],K=G[1],Q=t.useState(!1),U=Q[0],Y=Q[1],Z=v.useDispatch();function $(){return!R&&!M}var ee=o.useLongPress((function(){console.log("long press trigger")}),(function(){A(!q)}),U,(function(){Y(!1)}),{shouldPreventDefault:!0,delay:250}),te={open:{width:"48px",height:"48px",borderRadius:"12px"},closed:{width:"24px",height:"24px",borderRadius:"6px"}},ne=t.useState(null),ae=ne[0],re=ne[1];t.useEffect((function(){function e(){null==k||k.addEventListener("play",(function(){navigator.userAgent.indexOf("Firefox")>-1?re(k.mozCaptureStream()):re(k.captureStream())}))}return e(),function(){null==k||k.removeEventListener("play",e)}}),[k]);var oe=t.useRef(null),ie=t.useRef(null),le=t.useRef(null),ue=t.useRef(null);l.useIsomorphicLayoutEffect((function(){Z.player.updatePlayer({localAudio:oe.current,localVideo:le.current,remoteVideo:ue.current,remoteAudio:ie.current})}),[]);var se=t.useState(0),ce=se[0],de=se[1];t.useEffect((function(){if(D){var e=(new Date).getTime()/1e3-Number(D);e<0&&de(e)}}),[D]);var me=function(){return x.default.createElement(n.StyledTimer,{isOpen:q},M&&D&&ce?x.default.createElement(i.default,{date:Number(D)+ce||(new Date).getTime()/1e3,interval:1e3,format:"h:mm:ss",trim:!1,unix:!0,durationFromNow:!0}):x.default.createElement(x.default.Fragment,null,z&&"<unknown>"!==z&&z))},fe=function(e){var n=e.displayName,a=t.useState(!1),r=a[0],o=a[1],i=t.useRef(null),l=t.useRef(null);return t.useLayoutEffect((function(){i.current&&l.current&&l.current.clientWidth-i.current.clientWidth>5&&o(!0)})),x.default.createElement(j,{ref:i,className:"whitespace-nowrap overflow-hidden"},x.default.createElement("div",{className:"w-fit relative inline-block ".concat(r&&"animate-animated-text"),ref:l},n&&"<unknown>"===n?"PBX":n&&n))};return x.default.createElement("div",{ref:X,className:"absolute min-w-full min-h-full left-0 top-0 overflow-hidden pointer-events-none flex items-center justify-center content-center phone-island-container z-1000"},(P||R||M||N)&&x.default.createElement(y,e.__assign({className:"font-sans absolute pointer-events-auto overflow-hidden",incoming:P,accepted:M,outgoing:R,isOpen:q,animate:q&&(P||R)&&!M?"openIncoming":q&&M?"openAccepted":"closed",variants:{openIncoming:{width:"418px",height:"96px",borderRadius:"20px"},openAccepted:{width:"348px",height:"236px",borderRadius:"20px"},closed:{width:"168px",height:"40px",borderRadius:"99px"}},drag:!0,onPointerDown:function(e){T.start(e)},onDragStart:function(){Y(!0)},dragTransition:{power:0},initial:{x:(null==J?void 0:J.x)||b,y:(null==J?void 0:J.y)||C},style:{padding:q?"24px":"8px 16px"},dragControls:T,dragConstraints:X,onDragEnd:function(){var e=s.getTranslateValues(H.current),t=e.x,n=e.y;t=function(e){var t=X.current.offsetWidth/2-H.current.offsetWidth/2;return e>0&&e>t?t:e<0&&e<-t?-t:e}(Math.round(t)),n=function(e){var t=X.current.offsetHeight/2-H.current.offsetHeight/2;return e>0&&e>t?t:e<0&&e<-t?-t:e}(Math.round(n)),V({position:{x:t,y:n}}),K({x:t,y:n})},ref:H},ee),x.default.createElement(n.StyledTopContent,{isOpen:q,incoming:P,accepted:M,outgoing:R},x.default.createElement(p.framerMotion.exports.motion.div,{className:"relative",animate:q?"open":"closed",variants:te},(P||R&&!M)&&x.default.createElement(p.framerMotion.exports.motion.div,{style:{animation:"ping 2s cubic-bezier(0, 0, 0.2, 1) infinite",borderRadius:"4px"},animate:q?"open":"closed",variants:te,className:"rounded-xl bg-white absolute opacity-60 -z-10 top-0 left-0 animate-ping h-12 w-12"}),x.default.createElement(E,{className:"z-10 h-12 w-12 bg-gray-300 rounded-sm",animate:q?"open":"closed",variants:te})),q&&x.default.createElement(w,null,x.default.createElement(fe,{displayName:_}),x.default.createElement(me,null)),!q&&!M&&x.default.createElement(fe,{displayName:_}),!q&&M&&x.default.createElement(me,null),M&&x.default.createElement(p.framerMotion.exports.motion.div,{initial:{opacity:0},animate:{opacity:1}},x.default.createElement(c.AudioBars,{audioStream:ae,size:q?"large":"small"}))),q&&x.default.createElement(p.framerMotion.exports.motion.div,{className:"grid gap-y-5",initial:{opacity:0},animate:{opacity:1}},M&&x.default.createElement("div",{className:"grid grid-cols-4 auto-cols-max gap-y-5 justify-items-center place-items-center justify-center"},x.default.createElement(d.Button,{variant:"default",active:!!B,onClick:function(){return B?m.unpauseCurrentCall():m.pauseCurrentCall()}},B?x.default.createElement(a.FontAwesomeIcon,{size:"xl",icon:r.faPlay}):x.default.createElement(a.FontAwesomeIcon,{size:"xl",icon:f.faPause})),x.default.createElement(d.Button,{variant:"default",active:!!F,onClick:function(){return F?m.unmuteCurrentCall():m.muteCurrentCall()}},F?x.default.createElement(a.FontAwesomeIcon,{size:"xl",icon:r.faMicrophoneSlash}):x.default.createElement(a.FontAwesomeIcon,{size:"xl",icon:f.faMicrophone})),x.default.createElement(d.Button,{variant:"default"},x.default.createElement(a.FontAwesomeIcon,{size:"xl",icon:f.faRightLeft})),x.default.createElement(d.Button,{variant:"neutral"},x.default.createElement(a.FontAwesomeIcon,{size:"xl",icon:f.faChevronDown}))),x.default.createElement(p.framerMotion.exports.motion.div,{className:"grid ".concat($()?"grid-cols-2":M?"grid-cols-1 justify-items-center":"grid-cols-1 justify-items-end"," gap-3.5"),animate:{opacity:1}},x.default.createElement(d.Button,{onClick:function(e){e.stopPropagation(),m.hangupCurrentCall()},variant:"red"},x.default.createElement(a.FontAwesomeIcon,{className:"rotate-135 w-6 h-6",icon:r.faPhone})),$()&&x.default.createElement(d.Button,{onClick:function(e){m.answerIncomingCall()},variant:"green"},x.default.createElement(a.FontAwesomeIcon,{className:"w-6 h-6",icon:r.faPhone}))))),x.default.createElement("div",{className:"hidden"},x.default.createElement("audio",{autoPlay:!0,ref:oe}),x.default.createElement("audio",{autoPlay:!0,ref:ie}),x.default.createElement("video",{muted:!0,autoPlay:!0,ref:le}),x.default.createElement("video",{autoPlay:!0,ref:ue})))};N.displayName="Island",exports.Island=N;
|
|
2
2
|
//# sourceMappingURL=Island.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Island.js","sources":["../../src/components/Island.tsx"],"sourcesContent":["// Copyright (C) 2022 Nethesis S.r.l.\n// SPDX-License-Identifier: AGPL-3.0-or-later\n\nimport React, { useState, useRef, useEffect, useLayoutEffect, type FC } from 'react'\nimport {\n StyledAvatar,\n StyledDetails,\n StyledTimer,\n StyledPhoneIsland,\n StyledTopContent,\n StyledName,\n} from '../styles/Island.styles'\n\nimport { useSelector, useDispatch } from 'react-redux'\nimport { RootState } from '../store'\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome'\nimport { faPhone, faMicrophoneSlash, faPlay } from '@nethesis/nethesis-solid-svg-icons'\n\nimport { motion, useDragControls } from 'framer-motion/dist/framer-motion'\nimport { useLongPress } from '../utils/useLongPress'\nimport Moment from 'react-moment'\nimport { useLocalStorage, getTranslateValues } from '../utils'\nimport { AudioBars } from './AudioBars'\nimport { Button } from './Button'\n\nimport {\n hangupCurrentCall,\n answerIncomingCall,\n muteCurrentCall,\n unmuteCurrentCall,\n pauseCurrentCall,\n unpauseCurrentCall,\n} from '../lib/phone/call'\n\nimport {\n faPause as faPauseRegular,\n faMicrophone as faMicrophoneRegular,\n faRightLeft as faRightLeftRegualar,\n faChevronDown as faChevronDownRegular,\n} from '@nethesis/nethesis-regular-svg-icons'\n\nconst PhoneIslandMotion = motion(StyledPhoneIsland)\nconst AvatarMotion = motion(StyledAvatar)\nconst DetailsMotion = motion(StyledDetails)\nconst NameMotion = motion(StyledName)\n\nimport { useIsomorphicLayoutEffect } from '../utils'\n\ninterface IslandProps {\n always?: boolean\n}\n\ninterface PositionTypes {\n x: number\n y: number\n}\n\ninterface PhoneIslandStorageTypes {\n position: PositionTypes\n}\n\nconst ISLAND_STARTING_POSITION = {\n x: 0,\n y: 0,\n}\n\nexport const Island = ({ always }: IslandProps) => {\n const [isOpen, setIsOpen] = useState(true)\n // Get the currentCall info\n const { incoming, accepted, outgoing, displayName, number, startTime, muted, paused } =\n useSelector((state: RootState) => state.currentCall)\n\n const { localAudio: storeLocalAudio, remoteAudio: storeRemoteAudio } = useSelector(\n (state: RootState) => state.player,\n )\n const controls = useDragControls()\n\n const [phoneIslandStorage, setPhoneIslandStorage] =\n useLocalStorage<PhoneIslandStorageTypes | null>('phone-island', null)\n\n const islandRef = useRef<any>(null)\n\n const islandContainerRef = useRef<any>(null)\n\n const [position, setPosition] = useState<PositionTypes | null>(\n phoneIslandStorage && phoneIslandStorage.position ? phoneIslandStorage.position : null,\n )\n\n const [moved, setMoved] = useState<boolean>(false)\n\n const dispatch = useDispatch()\n\n function isAnswerVisible() {\n return !outgoing && !accepted\n }\n\n function startDrag(event) {\n controls.start(event)\n }\n\n function handleAnswer(event) {\n answerIncomingCall()\n }\n\n function handleHangup(event) {\n event.stopPropagation()\n hangupCurrentCall()\n }\n\n const onLongPress = () => {\n console.log('long press trigger')\n }\n\n const islandClick = () => {\n setIsOpen(!isOpen)\n }\n\n function innerXPosition(x) {\n // Get horizontal constraints\n const xConstraintPosition =\n islandContainerRef.current.offsetWidth / 2 - islandRef.current.offsetWidth / 2\n\n // Return the X position inside the constraints\n return x > 0 && x > xConstraintPosition\n ? xConstraintPosition\n : x < 0 && x < -xConstraintPosition\n ? -xConstraintPosition\n : x\n }\n\n function innerYPosition(y) {\n // Get vertical constraints\n const yConstraintPosition =\n islandContainerRef.current.offsetHeight / 2 - islandRef.current.offsetHeight / 2\n\n // Return the Y position inside the constraints\n return y > 0 && y > yConstraintPosition\n ? yConstraintPosition\n : y < 0 && y < -yConstraintPosition\n ? -yConstraintPosition\n : y\n }\n\n const onDragEnd = () => {\n // Get initial translation values\n let { x, y }: any = getTranslateValues(islandRef.current)\n\n // Round position\n x = innerXPosition(Math.round(x))\n y = innerYPosition(Math.round(y))\n\n // Save the new position to localstorage\n setPhoneIslandStorage({\n position: {\n x,\n y,\n },\n })\n // Set position to variable\n setPosition({\n x,\n y,\n })\n }\n\n function resetMoved() {\n setMoved(false)\n }\n\n function dragStarted() {\n setMoved(true)\n }\n\n const longPressEvent = useLongPress(onLongPress, islandClick, moved, resetMoved, {\n shouldPreventDefault: true,\n delay: 250,\n })\n\n const variants = {\n openIncoming: {\n width: '418px',\n height: '96px',\n borderRadius: '20px',\n },\n openAccepted: {\n width: '348px',\n height: '236px',\n borderRadius: '20px',\n },\n closed: {\n width: '168px',\n height: '40px',\n borderRadius: '99px',\n },\n }\n\n const iconVariants = {\n open: {\n width: '48px',\n height: '48px',\n borderRadius: '12px',\n },\n closed: {\n width: '24px',\n height: '24px',\n borderRadius: '6px',\n },\n }\n\n const [audioStream, setAudioStream] = useState<MediaStream | null>(null)\n\n useEffect(() => {\n function audioStreamListener() {\n storeRemoteAudio?.addEventListener('play', () => {\n if (navigator.userAgent.indexOf('Firefox') > -1) {\n // @ts-ignore\n setAudioStream(storeRemoteAudio.mozCaptureStream())\n } else {\n // @ts-ignore\n setAudioStream(storeRemoteAudio.captureStream())\n }\n })\n }\n audioStreamListener()\n return () => {\n storeRemoteAudio?.removeEventListener('play', audioStreamListener)\n }\n }, [storeRemoteAudio])\n\n const localAudio = useRef<HTMLAudioElement>(null)\n const remoteAudio = useRef<HTMLAudioElement>(null)\n const localVideo = useRef<HTMLVideoElement>(null)\n const remoteVideo = useRef<HTMLVideoElement>(null)\n\n useIsomorphicLayoutEffect(() => {\n dispatch.player.updatePlayer({\n localAudio: localAudio.current,\n localVideo: localVideo.current,\n remoteVideo: remoteVideo.current,\n remoteAudio: remoteAudio.current,\n })\n }, [])\n\n // Set timer negative differences\n const [timerNegativeDifference, setTimerNegativeDifference] = useState<number>(0)\n\n useEffect(() => {\n // Handle\n if (startTime) {\n const difference = new Date().getTime() / 1000 - Number(startTime)\n if (difference < 0) {\n setTimerNegativeDifference(difference)\n }\n }\n }, [startTime])\n\n const NumberToTimer: FC = () => (\n <StyledTimer isOpen={isOpen}>\n {accepted && startTime && timerNegativeDifference ? (\n <Moment\n date={Number(startTime) + timerNegativeDifference || new Date().getTime() / 1000}\n interval={1000}\n format='h:mm:ss'\n trim={false}\n unix\n durationFromNow\n />\n ) : (\n <>{number && number !== '<unknown>' && number}</>\n )}\n </StyledTimer>\n )\n\n interface DisplayNameProps {\n displayName: string\n }\n\n const DisplayName: FC<DisplayNameProps> = ({ displayName }) => {\n const [animateText, setAnimateText] = useState<boolean>(false)\n const nameContainer = useRef<null | HTMLDivElement>(null)\n const nameText = useRef<null | HTMLDivElement>(null)\n\n useLayoutEffect(() => {\n if (\n nameContainer.current &&\n nameText.current &&\n nameText.current.clientWidth > nameContainer.current.clientWidth\n ) {\n setAnimateText(true)\n }\n })\n\n return (\n <NameMotion\n ref={nameContainer}\n className={`whitespace-nowrap overflow-hidden ${animateText && 'animated-text'}`}\n >\n <div className='w-fit' ref={nameText}>\n {displayName && displayName === '<unknown>' ? 'PBX' : displayName && displayName}\n </div>\n </NameMotion>\n )\n }\n\n return (\n <div\n ref={islandContainerRef}\n className='absolute min-w-full min-h-full left-0 top-0 overflow-hidden pointer-events-none flex items-center justify-center content-center phone-island-container z-1000'\n >\n {(incoming || outgoing || accepted || always) && (\n <PhoneIslandMotion\n className='font-sans absolute pointer-events-auto overflow-hidden'\n incoming={incoming}\n accepted={accepted}\n outgoing={outgoing}\n isOpen={isOpen}\n animate={\n isOpen && (incoming || outgoing) && !accepted\n ? 'openIncoming'\n : isOpen && accepted\n ? 'openAccepted'\n : 'closed'\n }\n variants={variants}\n drag\n onPointerDown={startDrag}\n onDragStart={dragStarted}\n dragTransition={{\n power: 0,\n }}\n initial={{\n x: position?.x || ISLAND_STARTING_POSITION.x,\n y: position?.y || ISLAND_STARTING_POSITION.y,\n }}\n style={{\n padding: isOpen ? '24px' : '8px 16px',\n }}\n dragControls={controls}\n dragConstraints={islandContainerRef}\n onDragEnd={onDragEnd}\n ref={islandRef}\n {...longPressEvent}\n >\n <StyledTopContent\n isOpen={isOpen}\n incoming={incoming}\n accepted={accepted}\n outgoing={outgoing}\n >\n <motion.div\n className='relative'\n animate={isOpen ? 'open' : 'closed'}\n variants={iconVariants}\n >\n {(incoming || (outgoing && !accepted)) && (\n // The background pulse effect\n <motion.div\n style={{\n animation: 'ping 2s cubic-bezier(0, 0, 0.2, 1) infinite',\n borderRadius: '4px',\n }}\n animate={isOpen ? 'open' : 'closed'}\n variants={iconVariants}\n className={`rounded-xl bg-white absolute opacity-60 -z-10 top-0 left-0 animate-ping h-12 w-12`}\n ></motion.div>\n )}\n <AvatarMotion\n className='z-10 h-12 w-12 bg-gray-300 rounded-sm'\n animate={isOpen ? 'open' : 'closed'}\n variants={iconVariants}\n />\n </motion.div>\n {isOpen && (\n <DetailsMotion>\n <DisplayName displayName={displayName} />\n {/* The timer when expanded */}\n <NumberToTimer />\n </DetailsMotion>\n )}\n {/* The display name when collepsed */}\n {!isOpen && !accepted && <DisplayName displayName={displayName} />}\n {/* The timer when collapsed */}\n {!isOpen && accepted && <NumberToTimer />}\n {accepted && (\n <motion.div initial={{ opacity: 0 }} animate={{ opacity: 1 }}>\n <AudioBars audioStream={audioStream} size={isOpen ? 'large' : 'small'} />\n </motion.div>\n )}\n </StyledTopContent>\n {isOpen && (\n <motion.div className='grid gap-y-5' initial={{ opacity: 0 }} animate={{ opacity: 1 }}>\n {accepted && (\n <div className='grid grid-cols-4 auto-cols-max gap-y-5 justify-items-center place-items-center justify-center'>\n <Button\n variant='default'\n active={paused ? true : false}\n onClick={() => (paused ? unpauseCurrentCall() : pauseCurrentCall())}\n >\n {paused ? (\n <FontAwesomeIcon size='xl' icon={faPlay} />\n ) : (\n <FontAwesomeIcon size='xl' icon={faPauseRegular} />\n )}\n </Button>\n <Button\n variant='default'\n active={muted ? true : false}\n onClick={() => (muted ? unmuteCurrentCall() : muteCurrentCall())}\n >\n {muted ? (\n <FontAwesomeIcon size='xl' icon={faMicrophoneSlash} />\n ) : (\n <FontAwesomeIcon size='xl' icon={faMicrophoneRegular} />\n )}\n </Button>\n <Button variant='default'>\n <FontAwesomeIcon size='xl' icon={faRightLeftRegualar} />\n </Button>\n <Button variant='neutral'>\n <FontAwesomeIcon size='xl' icon={faChevronDownRegular} />\n </Button>\n </div>\n )}\n <motion.div\n className={`grid ${\n isAnswerVisible()\n ? 'grid-cols-2'\n : accepted\n ? 'grid-cols-1 justify-items-center'\n : 'grid-cols-1 justify-items-end'\n } gap-3.5`}\n animate={{ opacity: 1 }}\n >\n <Button onClick={handleHangup} variant='red'>\n <FontAwesomeIcon className='rotate-135 w-6 h-6' icon={faPhone} />\n </Button>\n {isAnswerVisible() && (\n <Button onClick={handleAnswer} variant='green'>\n <FontAwesomeIcon className='w-6 h-6' icon={faPhone} />\n </Button>\n )}\n </motion.div>\n </motion.div>\n )}\n </PhoneIslandMotion>\n )}\n <div className='hidden'>\n <audio autoPlay ref={localAudio}></audio>\n <audio autoPlay ref={remoteAudio}></audio>\n <video muted={true} autoPlay ref={localVideo}></video>\n <video autoPlay ref={remoteVideo}></video>\n </div>\n </div>\n )\n}\n\nIsland.displayName = 'Island'\n"],"names":["PhoneIslandMotion","motion","StyledPhoneIsland","AvatarMotion","StyledAvatar","DetailsMotion","StyledDetails","NameMotion","StyledName","ISLAND_STARTING_POSITION","Island","_a","always","_b","useState","isOpen","setIsOpen","_c","useSelector","state","currentCall","incoming","accepted","outgoing","displayName","number","startTime","muted","paused","_d","player","storeRemoteAudio","controls","useDragControls","_e","useLocalStorage","phoneIslandStorage","setPhoneIslandStorage","islandRef","useRef","islandContainerRef","_f","position","setPosition","_g","moved","setMoved","dispatch","useDispatch","isAnswerVisible","longPressEvent","useLongPress","console","log","shouldPreventDefault","delay","iconVariants","open","width","height","borderRadius","closed","_h","audioStream","setAudioStream","useEffect","audioStreamListener","addEventListener","navigator","userAgent","indexOf","mozCaptureStream","captureStream","removeEventListener","localAudio","remoteAudio","localVideo","remoteVideo","useIsomorphicLayoutEffect","updatePlayer","current","_j","timerNegativeDifference","setTimerNegativeDifference","difference","Date","getTime","Number","NumberToTimer","React","StyledTimer","createElement","Moment","date","interval","format","trim","unix","durationFromNow","Fragment","DisplayName","animateText","setAnimateText","nameContainer","nameText","useLayoutEffect","clientWidth","ref","className","concat","__assign","animate","variants","openIncoming","openAccepted","drag","onPointerDown","event","start","onDragStart","dragTransition","power","initial","x","y","style","padding","dragControls","dragConstraints","onDragEnd","getTranslateValues","xConstraintPosition","offsetWidth","innerXPosition","Math","round","yConstraintPosition","offsetHeight","innerYPosition","StyledTopContent","div","animation","opacity","AudioBars","size","framerMotion","exports","Button","variant","active","onClick","unpauseCurrentCall","pauseCurrentCall","FontAwesomeIcon","icon","faPlay","faPauseRegular","unmuteCurrentCall","muteCurrentCall","faMicrophoneSlash","faMicrophoneRegular","faRightLeftRegualar","faRightLeft","faChevronDownRegular","stopPropagation","hangupCurrentCall","faPhone","answerIncomingCall","autoPlay"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Island.js","sources":["../../src/components/Island.tsx"],"sourcesContent":["// Copyright (C) 2022 Nethesis S.r.l.\n// SPDX-License-Identifier: AGPL-3.0-or-later\n\nimport React, { useState, useRef, useEffect, useLayoutEffect, type FC } from 'react'\nimport {\n StyledAvatar,\n StyledDetails,\n StyledTimer,\n StyledPhoneIsland,\n StyledTopContent,\n StyledName,\n} from '../styles/Island.styles'\n\nimport { useSelector, useDispatch } from 'react-redux'\nimport { RootState } from '../store'\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome'\nimport { faPhone, faMicrophoneSlash, faPlay } from '@nethesis/nethesis-solid-svg-icons'\n\nimport { motion, useDragControls } from 'framer-motion/dist/framer-motion'\nimport { useLongPress } from '../utils/useLongPress'\nimport Moment from 'react-moment'\nimport { useLocalStorage, getTranslateValues } from '../utils'\nimport { AudioBars } from './AudioBars'\nimport { Button } from './Button'\n\nimport {\n hangupCurrentCall,\n answerIncomingCall,\n muteCurrentCall,\n unmuteCurrentCall,\n pauseCurrentCall,\n unpauseCurrentCall,\n} from '../lib/phone/call'\n\nimport {\n faPause as faPauseRegular,\n faMicrophone as faMicrophoneRegular,\n faRightLeft as faRightLeftRegualar,\n faChevronDown as faChevronDownRegular,\n} from '@nethesis/nethesis-regular-svg-icons'\n\nconst PhoneIslandMotion = motion(StyledPhoneIsland)\nconst AvatarMotion = motion(StyledAvatar)\nconst DetailsMotion = motion(StyledDetails)\nconst NameMotion = motion(StyledName)\n\nimport { useIsomorphicLayoutEffect } from '../utils'\n\ninterface IslandProps {\n always?: boolean\n}\n\ninterface PositionTypes {\n x: number\n y: number\n}\n\ninterface PhoneIslandStorageTypes {\n position: PositionTypes\n}\n\nconst ISLAND_STARTING_POSITION = {\n x: 0,\n y: 0,\n}\n\nexport const Island = ({ always }: IslandProps) => {\n const [isOpen, setIsOpen] = useState(true)\n // Get the currentCall info\n const { incoming, accepted, outgoing, displayName, number, startTime, muted, paused } =\n useSelector((state: RootState) => state.currentCall)\n\n const { localAudio: storeLocalAudio, remoteAudio: storeRemoteAudio } = useSelector(\n (state: RootState) => state.player,\n )\n const controls = useDragControls()\n\n const [phoneIslandStorage, setPhoneIslandStorage] =\n useLocalStorage<PhoneIslandStorageTypes | null>('phone-island', null)\n\n const islandRef = useRef<any>(null)\n\n const islandContainerRef = useRef<any>(null)\n\n const [position, setPosition] = useState<PositionTypes | null>(\n phoneIslandStorage && phoneIslandStorage.position ? phoneIslandStorage.position : null,\n )\n\n const [moved, setMoved] = useState<boolean>(false)\n\n const dispatch = useDispatch()\n\n function isAnswerVisible() {\n return !outgoing && !accepted\n }\n\n function startDrag(event) {\n controls.start(event)\n }\n\n function handleAnswer(event) {\n answerIncomingCall()\n }\n\n function handleHangup(event) {\n event.stopPropagation()\n hangupCurrentCall()\n }\n\n const onLongPress = () => {\n console.log('long press trigger')\n }\n\n const islandClick = () => {\n setIsOpen(!isOpen)\n }\n\n function innerXPosition(x) {\n // Get horizontal constraints\n const xConstraintPosition =\n islandContainerRef.current.offsetWidth / 2 - islandRef.current.offsetWidth / 2\n\n // Return the X position inside the constraints\n return x > 0 && x > xConstraintPosition\n ? xConstraintPosition\n : x < 0 && x < -xConstraintPosition\n ? -xConstraintPosition\n : x\n }\n\n function innerYPosition(y) {\n // Get vertical constraints\n const yConstraintPosition =\n islandContainerRef.current.offsetHeight / 2 - islandRef.current.offsetHeight / 2\n\n // Return the Y position inside the constraints\n return y > 0 && y > yConstraintPosition\n ? yConstraintPosition\n : y < 0 && y < -yConstraintPosition\n ? -yConstraintPosition\n : y\n }\n\n const onDragEnd = () => {\n // Get initial translation values\n let { x, y }: any = getTranslateValues(islandRef.current)\n\n // Round position\n x = innerXPosition(Math.round(x))\n y = innerYPosition(Math.round(y))\n\n // Save the new position to localstorage\n setPhoneIslandStorage({\n position: {\n x,\n y,\n },\n })\n // Set position to variable\n setPosition({\n x,\n y,\n })\n }\n\n function resetMoved() {\n setMoved(false)\n }\n\n function dragStarted() {\n setMoved(true)\n }\n\n const longPressEvent = useLongPress(onLongPress, islandClick, moved, resetMoved, {\n shouldPreventDefault: true,\n delay: 250,\n })\n\n const variants = {\n openIncoming: {\n width: '418px',\n height: '96px',\n borderRadius: '20px',\n },\n openAccepted: {\n width: '348px',\n height: '236px',\n borderRadius: '20px',\n },\n closed: {\n width: '168px',\n height: '40px',\n borderRadius: '99px',\n },\n }\n\n const iconVariants = {\n open: {\n width: '48px',\n height: '48px',\n borderRadius: '12px',\n },\n closed: {\n width: '24px',\n height: '24px',\n borderRadius: '6px',\n },\n }\n\n const [audioStream, setAudioStream] = useState<MediaStream | null>(null)\n\n useEffect(() => {\n function audioStreamListener() {\n storeRemoteAudio?.addEventListener('play', () => {\n if (navigator.userAgent.indexOf('Firefox') > -1) {\n // @ts-ignore\n setAudioStream(storeRemoteAudio.mozCaptureStream())\n } else {\n // @ts-ignore\n setAudioStream(storeRemoteAudio.captureStream())\n }\n })\n }\n audioStreamListener()\n return () => {\n storeRemoteAudio?.removeEventListener('play', audioStreamListener)\n }\n }, [storeRemoteAudio])\n\n const localAudio = useRef<HTMLAudioElement>(null)\n const remoteAudio = useRef<HTMLAudioElement>(null)\n const localVideo = useRef<HTMLVideoElement>(null)\n const remoteVideo = useRef<HTMLVideoElement>(null)\n\n useIsomorphicLayoutEffect(() => {\n dispatch.player.updatePlayer({\n localAudio: localAudio.current,\n localVideo: localVideo.current,\n remoteVideo: remoteVideo.current,\n remoteAudio: remoteAudio.current,\n })\n }, [])\n\n // Set timer negative differences\n const [timerNegativeDifference, setTimerNegativeDifference] = useState<number>(0)\n\n useEffect(() => {\n // Handle\n if (startTime) {\n const difference = new Date().getTime() / 1000 - Number(startTime)\n if (difference < 0) {\n setTimerNegativeDifference(difference)\n }\n }\n }, [startTime])\n\n const NumberToTimer: FC = () => (\n <StyledTimer isOpen={isOpen}>\n {accepted && startTime && timerNegativeDifference ? (\n <Moment\n date={Number(startTime) + timerNegativeDifference || new Date().getTime() / 1000}\n interval={1000}\n format='h:mm:ss'\n trim={false}\n unix\n durationFromNow\n />\n ) : (\n <>{number && number !== '<unknown>' && number}</>\n )}\n </StyledTimer>\n )\n\n interface DisplayNameProps {\n displayName: string\n }\n\n const DisplayName: FC<DisplayNameProps> = ({ displayName }) => {\n const [animateText, setAnimateText] = useState<boolean>(false)\n const nameContainer = useRef<null | HTMLDivElement>(null)\n const nameText = useRef<null | HTMLDivElement>(null)\n\n useLayoutEffect(() => {\n if (\n nameContainer.current &&\n nameText.current &&\n (nameText.current.clientWidth - nameContainer.current.clientWidth) > 5\n ) {\n setAnimateText(true)\n }\n })\n\n return (\n <NameMotion ref={nameContainer} className='whitespace-nowrap overflow-hidden'>\n <div\n className={`w-fit relative inline-block ${animateText && 'animate-animated-text'}`}\n ref={nameText}\n >\n {displayName && displayName === '<unknown>' ? 'PBX' : displayName && displayName}\n </div>\n </NameMotion>\n )\n }\n\n return (\n <div\n ref={islandContainerRef}\n className='absolute min-w-full min-h-full left-0 top-0 overflow-hidden pointer-events-none flex items-center justify-center content-center phone-island-container z-1000'\n >\n {(incoming || outgoing || accepted || always) && (\n <PhoneIslandMotion\n className='font-sans absolute pointer-events-auto overflow-hidden'\n incoming={incoming}\n accepted={accepted}\n outgoing={outgoing}\n isOpen={isOpen}\n animate={\n isOpen && (incoming || outgoing) && !accepted\n ? 'openIncoming'\n : isOpen && accepted\n ? 'openAccepted'\n : 'closed'\n }\n variants={variants}\n drag\n onPointerDown={startDrag}\n onDragStart={dragStarted}\n dragTransition={{\n power: 0,\n }}\n initial={{\n x: position?.x || ISLAND_STARTING_POSITION.x,\n y: position?.y || ISLAND_STARTING_POSITION.y,\n }}\n style={{\n padding: isOpen ? '24px' : '8px 16px',\n }}\n dragControls={controls}\n dragConstraints={islandContainerRef}\n onDragEnd={onDragEnd}\n ref={islandRef}\n {...longPressEvent}\n >\n <StyledTopContent\n isOpen={isOpen}\n incoming={incoming}\n accepted={accepted}\n outgoing={outgoing}\n >\n <motion.div\n className='relative'\n animate={isOpen ? 'open' : 'closed'}\n variants={iconVariants}\n >\n {(incoming || (outgoing && !accepted)) && (\n // The background pulse effect\n <motion.div\n style={{\n animation: 'ping 2s cubic-bezier(0, 0, 0.2, 1) infinite',\n borderRadius: '4px',\n }}\n animate={isOpen ? 'open' : 'closed'}\n variants={iconVariants}\n className={`rounded-xl bg-white absolute opacity-60 -z-10 top-0 left-0 animate-ping h-12 w-12`}\n ></motion.div>\n )}\n <AvatarMotion\n className='z-10 h-12 w-12 bg-gray-300 rounded-sm'\n animate={isOpen ? 'open' : 'closed'}\n variants={iconVariants}\n />\n </motion.div>\n {isOpen && (\n <DetailsMotion>\n <DisplayName displayName={displayName} />\n {/* The timer when expanded */}\n <NumberToTimer />\n </DetailsMotion>\n )}\n {/* The display name when collepsed */}\n {!isOpen && !accepted && <DisplayName displayName={displayName} />}\n {/* The timer when collapsed */}\n {!isOpen && accepted && <NumberToTimer />}\n {accepted && (\n <motion.div initial={{ opacity: 0 }} animate={{ opacity: 1 }}>\n <AudioBars audioStream={audioStream} size={isOpen ? 'large' : 'small'} />\n </motion.div>\n )}\n </StyledTopContent>\n {isOpen && (\n <motion.div className='grid gap-y-5' initial={{ opacity: 0 }} animate={{ opacity: 1 }}>\n {accepted && (\n <div className='grid grid-cols-4 auto-cols-max gap-y-5 justify-items-center place-items-center justify-center'>\n <Button\n variant='default'\n active={paused ? true : false}\n onClick={() => (paused ? unpauseCurrentCall() : pauseCurrentCall())}\n >\n {paused ? (\n <FontAwesomeIcon size='xl' icon={faPlay} />\n ) : (\n <FontAwesomeIcon size='xl' icon={faPauseRegular} />\n )}\n </Button>\n <Button\n variant='default'\n active={muted ? true : false}\n onClick={() => (muted ? unmuteCurrentCall() : muteCurrentCall())}\n >\n {muted ? (\n <FontAwesomeIcon size='xl' icon={faMicrophoneSlash} />\n ) : (\n <FontAwesomeIcon size='xl' icon={faMicrophoneRegular} />\n )}\n </Button>\n <Button variant='default'>\n <FontAwesomeIcon size='xl' icon={faRightLeftRegualar} />\n </Button>\n <Button variant='neutral'>\n <FontAwesomeIcon size='xl' icon={faChevronDownRegular} />\n </Button>\n </div>\n )}\n <motion.div\n className={`grid ${\n isAnswerVisible()\n ? 'grid-cols-2'\n : accepted\n ? 'grid-cols-1 justify-items-center'\n : 'grid-cols-1 justify-items-end'\n } gap-3.5`}\n animate={{ opacity: 1 }}\n >\n <Button onClick={handleHangup} variant='red'>\n <FontAwesomeIcon className='rotate-135 w-6 h-6' icon={faPhone} />\n </Button>\n {isAnswerVisible() && (\n <Button onClick={handleAnswer} variant='green'>\n <FontAwesomeIcon className='w-6 h-6' icon={faPhone} />\n </Button>\n )}\n </motion.div>\n </motion.div>\n )}\n </PhoneIslandMotion>\n )}\n <div className='hidden'>\n <audio autoPlay ref={localAudio}></audio>\n <audio autoPlay ref={remoteAudio}></audio>\n <video muted={true} autoPlay ref={localVideo}></video>\n <video autoPlay ref={remoteVideo}></video>\n </div>\n </div>\n )\n}\n\nIsland.displayName = 'Island'\n"],"names":["PhoneIslandMotion","motion","StyledPhoneIsland","AvatarMotion","StyledAvatar","DetailsMotion","StyledDetails","NameMotion","StyledName","ISLAND_STARTING_POSITION","Island","_a","always","_b","useState","isOpen","setIsOpen","_c","useSelector","state","currentCall","incoming","accepted","outgoing","displayName","number","startTime","muted","paused","_d","player","storeRemoteAudio","controls","useDragControls","_e","useLocalStorage","phoneIslandStorage","setPhoneIslandStorage","islandRef","useRef","islandContainerRef","_f","position","setPosition","_g","moved","setMoved","dispatch","useDispatch","isAnswerVisible","longPressEvent","useLongPress","console","log","shouldPreventDefault","delay","iconVariants","open","width","height","borderRadius","closed","_h","audioStream","setAudioStream","useEffect","audioStreamListener","addEventListener","navigator","userAgent","indexOf","mozCaptureStream","captureStream","removeEventListener","localAudio","remoteAudio","localVideo","remoteVideo","useIsomorphicLayoutEffect","updatePlayer","current","_j","timerNegativeDifference","setTimerNegativeDifference","difference","Date","getTime","Number","NumberToTimer","React","StyledTimer","createElement","Moment","date","interval","format","trim","unix","durationFromNow","Fragment","DisplayName","animateText","setAnimateText","nameContainer","nameText","useLayoutEffect","clientWidth","ref","className","concat","__assign","animate","variants","openIncoming","openAccepted","drag","onPointerDown","event","start","onDragStart","dragTransition","power","initial","x","y","style","padding","dragControls","dragConstraints","onDragEnd","getTranslateValues","xConstraintPosition","offsetWidth","innerXPosition","Math","round","yConstraintPosition","offsetHeight","innerYPosition","StyledTopContent","div","animation","opacity","AudioBars","size","framerMotion","exports","Button","variant","active","onClick","unpauseCurrentCall","pauseCurrentCall","FontAwesomeIcon","icon","faPlay","faPauseRegular","unmuteCurrentCall","muteCurrentCall","faMicrophoneSlash","faMicrophoneRegular","faRightLeftRegualar","faRightLeft","faChevronDownRegular","stopPropagation","hangupCurrentCall","faPhone","answerIncomingCall","autoPlay"],"mappings":"wmCAyCMA,EAAoBC,EAAAA,aAAAA,QAAAA,OAAOC,EAAAA,mBAC3BC,EAAeF,EAAAA,aAAAA,QAAAA,OAAOG,EAAAA,cACtBC,EAAgBJ,EAAAA,aAAAA,QAAAA,OAAOK,EAAAA,eACvBC,EAAaN,EAAAA,aAAAA,QAAAA,OAAOO,EAAAA,YAiBpBC,EACD,EADCA,EAED,EAGQC,EAAS,SAACC,GAAE,IAAAC,EAAMD,EAAAC,OACvBC,EAAsBC,EAAAA,UAAS,GAA9BC,EAAMF,EAAA,GAAEG,EAASH,EAAA,GAElBI,EACJC,EAAAA,aAAY,SAACC,GAAqB,OAAAA,EAAMC,eADlCC,aAAUC,EAAQL,EAAAK,SAAEC,EAAQN,EAAAM,SAAEC,EAAWP,EAAAO,YAAEC,EAAMR,EAAAQ,OAAEC,cAAWC,UAAOC,WAGvEC,EAAiEX,EAAWA,aAChF,SAACC,GAAqB,OAAAA,EAAMW,MAAN,iBAD0B,IAAAC,gBAG5CC,EAAWC,EAAAA,aAAAA,QAAAA,kBAEXC,EACJC,EAAAA,gBAAgD,eAAgB,MAD3DC,EAAkBF,EAAA,GAAEG,OAGrBC,EAAYC,SAAY,MAExBC,EAAqBD,SAAY,MAEjCE,EAA0B3B,EAAAA,SAC9BsB,GAAsBA,EAAmBM,SAAWN,EAAmBM,SAAW,MAD7EA,EAAQD,EAAA,GAAEE,EAAWF,EAAA,GAItBG,EAAoB9B,EAAAA,UAAkB,GAArC+B,EAAKD,EAAA,GAAEE,EAAQF,EAAA,GAEhBG,EAAWC,EAAAA,cAEjB,SAASC,IACP,OAAQ1B,IAAaD,CACtB,CA+ED,IAAM4B,GAAiBC,EAAAA,cAhEH,WAClBC,QAAQC,IAAI,qBACd,IAEoB,WAClBrC,GAAWD,EACb,GA0D8D8B,GAR9D,WACEC,GAAS,EACV,GAMgF,CAC/EQ,sBAAsB,EACtBC,MAAO,MAqBHC,GAAe,CACnBC,KAAM,CACJC,MAAO,OACPC,OAAQ,OACRC,aAAc,QAEhBC,OAAQ,CACNH,MAAO,OACPC,OAAQ,OACRC,aAAc,QAIZE,GAAgChD,EAAAA,SAA6B,MAA5DiD,GAAWD,GAAA,GAAEE,GAAcF,GAAA,GAElCG,EAAAA,WAAU,WACR,SAASC,IACPnC,SAAAA,EAAkBoC,iBAAiB,QAAQ,WACrCC,UAAUC,UAAUC,QAAQ,YAAc,EAE5CN,GAAejC,EAAiBwC,oBAGhCP,GAAejC,EAAiByC,gBAEpC,GACD,CAED,OADAN,IACO,WACLnC,SAAAA,EAAkB0C,oBAAoB,OAAQP,EAChD,CACF,GAAG,CAACnC,IAEJ,IAAM2C,GAAanC,SAAyB,MACtCoC,GAAcpC,SAAyB,MACvCqC,GAAarC,SAAyB,MACtCsC,GAActC,SAAyB,MAE7CuC,EAAAA,2BAA0B,WACxB/B,EAASjB,OAAOiD,aAAa,CAC3BL,WAAYA,GAAWM,QACvBJ,WAAYA,GAAWI,QACvBH,YAAaA,GAAYG,QACzBL,YAAaA,GAAYK,SAE5B,GAAE,IAGG,IAAAC,GAAwDnE,EAAAA,SAAiB,GAAxEoE,GAAuBD,GAAA,GAAEE,GAA0BF,GAAA,GAE1DhB,EAAAA,WAAU,WAER,GAAIvC,EAAW,CACb,IAAM0D,GAAa,IAAIC,MAAOC,UAAY,IAAOC,OAAO7D,GACpD0D,EAAa,GACfD,GAA2BC,EAE9B,CACH,GAAG,CAAC1D,IAEJ,IAAM8D,GAAoB,WAAM,OAC9BC,EAAAA,sBAACC,cAAW,CAAC3E,OAAQA,GAClBO,GAAYI,GAAawD,GACxBO,EAAAA,QAACE,cAAAC,UACC,CAAAC,KAAMN,OAAO7D,GAAawD,KAA2B,IAAIG,MAAOC,UAAY,IAC5EQ,SAAU,IACVC,OAAO,UACPC,MAAM,EACNC,QACAC,iBAAe,IAGjBT,EAAG,QAAAE,cAAAF,EAAAA,QAAAU,SAAA,KAAA1E,GAAqB,cAAXA,GAA0BA,GAG5C,EAMK2E,GAAoC,SAACzF,GAAE,IAAAa,EAAWb,EAAAa,YAChDX,EAAgCC,EAAAA,UAAkB,GAAjDuF,EAAWxF,EAAA,GAAEyF,EAAczF,EAAA,GAC5B0F,EAAgBhE,SAA8B,MAC9CiE,EAAWjE,SAA8B,MAY/C,OAVAkE,EAAAA,iBAAgB,WAEZF,EAAcvB,SACdwB,EAASxB,SACRwB,EAASxB,QAAQ0B,YAAcH,EAAcvB,QAAQ0B,YAAe,GAErEJ,GAAe,EAEnB,IAGEb,EAAAA,QAACE,cAAApF,EAAW,CAAAoG,IAAKJ,EAAeK,UAAU,sCACxCnB,UAAAE,cAAA,MAAA,CACEiB,UAAW,+BAA+BC,OAAAR,GAAe,yBACzDM,IAAKH,GAEJhF,GAA+B,cAAhBA,EAA8B,MAAQA,GAAeA,GAI7E,EAEA,OACEiE,EAAAA,6BACEkB,IAAKnE,EACLoE,UAAU,kKAERvF,GAAYE,GAAYD,GAAYV,IACpC6E,wBAACzF,EAAiB8G,EAAAA,SAAA,CAChBF,UAAU,yDACVvF,SAAUA,EACVC,SAAUA,EACVC,SAAUA,EACVR,OAAQA,EACRgG,QACEhG,IAAWM,GAAYE,KAAcD,EACjC,eACAP,GAAUO,EACV,eACA,SAEN0F,SAjJS,CACfC,aAAc,CACZvD,MAAO,QACPC,OAAQ,OACRC,aAAc,QAEhBsD,aAAc,CACZxD,MAAO,QACPC,OAAQ,QACRC,aAAc,QAEhBC,OAAQ,CACNH,MAAO,QACPC,OAAQ,OACRC,aAAc,SAoIVuD,MAAI,EACJC,cArOR,SAAmBC,GACjBrF,EAASsF,MAAMD,EAChB,EAoOOE,YA7JR,WACEzE,GAAS,EACV,EA4JO0E,eAAgB,CACdC,MAAO,GAETC,QAAS,CACPC,GAAGjF,aAAQ,EAARA,EAAUiF,IAAKlH,EAClBmH,GAAGlF,aAAQ,EAARA,EAAUkF,IAAKnH,GAEpBoH,MAAO,CACLC,QAAS/G,EAAS,OAAS,YAE7BgH,aAAc/F,EACdgG,gBAAiBxF,EACjByF,UApMU,WAEZ,IAAAtH,EAAgBuH,EAAAA,mBAAmB5F,EAAU0C,SAA3C2C,EAAChH,EAAAgH,EAAEC,MAGTD,EA/BF,SAAwBA,GAEtB,IAAMQ,EACJ3F,EAAmBwC,QAAQoD,YAAc,EAAI9F,EAAU0C,QAAQoD,YAAc,EAG/E,OAAOT,EAAI,GAAKA,EAAIQ,EAChBA,EACAR,EAAI,GAAKA,GAAKQ,GACbA,EACDR,CACL,CAoBKU,CAAeC,KAAKC,MAAMZ,IAC9BC,EAnBF,SAAwBA,GAEtB,IAAMY,EACJhG,EAAmBwC,QAAQyD,aAAe,EAAInG,EAAU0C,QAAQyD,aAAe,EAGjF,OAAOb,EAAI,GAAKA,EAAIY,EAChBA,EACAZ,EAAI,GAAKA,GAAKY,GACbA,EACDZ,CACL,CAQKc,CAAeJ,KAAKC,MAAMX,IAG9BvF,EAAsB,CACpBK,SAAU,CACRiF,EAACA,EACDC,EAACA,KAILjF,EAAY,CACVgF,EAACA,EACDC,EAACA,GAEL,EAiLQjB,IAAKrE,GACDY,IAEJuC,EAAAA,QAAAE,cAACgD,mBACC,CAAA5H,OAAQA,EACRM,SAAUA,EACVC,SAAUA,EACVC,SAAUA,GAEVkE,EAAAA,QAACE,cAAA1F,EAAAA,aAAAA,QAAAA,OAAO2I,IAAG,CACThC,UAAU,WACVG,QAAShG,EAAS,OAAS,SAC3BiG,SAAUxD,KAERnC,GAAaE,IAAaD,IAE1BmE,EAAAA,QAAAE,cAAC1F,EAAAA,aAAAA,QAAAA,OAAO2I,IAAG,CACTf,MAAO,CACLgB,UAAW,8CACXjF,aAAc,OAEhBmD,QAAShG,EAAS,OAAS,SAC3BiG,SAAUxD,GACVoD,UAAW,sFAGfnB,EAAAA,QAACE,cAAAxF,GACCyG,UAAU,wCACVG,QAAShG,EAAS,OAAS,SAC3BiG,SAAUxD,MAGbzC,GACC0E,EAAA,QAAAE,cAACtF,EAAa,KACZoF,EAAAA,QAAAE,cAACS,GAAW,CAAC5E,YAAaA,IAE1BiE,EAAAA,QAACE,cAAAH,GAAgB,QAInBzE,IAAWO,GAAYmE,EAAC,QAAAE,cAAAS,GAAY,CAAA5E,YAAaA,KAEjDT,GAAUO,GAAYmE,EAAAA,QAAAE,cAACH,GAAgB,MACxClE,GACCmE,EAAAA,QAACE,cAAA1F,EAAAA,aAAAA,QAAAA,OAAO2I,IAAG,CAAClB,QAAS,CAAEoB,QAAS,GAAK/B,QAAS,CAAE+B,QAAS,IACvDrD,EAAAA,QAACE,cAAAoD,aAAUhF,YAAaA,GAAaiF,KAAMjI,EAAS,QAAU,YAInEA,GACC0E,EAAA,QAAAE,cAAC1F,EAAMgJ,aAAAC,QAAAjJ,OAAC2I,IAAI,CAAAhC,UAAU,eAAec,QAAS,CAAEoB,QAAS,GAAK/B,QAAS,CAAE+B,QAAS,IAC/ExH,GACCmE,EAAK,QAAAE,cAAA,MAAA,CAAAiB,UAAU,iGACbnB,EAAA,QAAAE,cAACwD,SAAM,CACLC,QAAQ,UACRC,SAAQzH,EACR0H,QAAS,WAAM,OAAC1H,EAAS2H,EAAAA,qBAAuBC,EAAAA,qBAE/C5H,EACC6D,EAAA,QAAAE,cAAC8D,kBAAe,CAACT,KAAK,KAAKU,KAAMC,EAAAA,SAEjClE,EAAA,QAAAE,cAAC8D,EAAeA,gBAAC,CAAAT,KAAK,KAAKU,KAAME,EAAAA,WAGrCnE,EAAA,QAAAE,cAACwD,SAAM,CACLC,QAAQ,UACRC,SAAQ1H,EACR2H,QAAS,WAAM,OAAC3H,EAAQkI,EAAAA,oBAAsBC,EAAAA,oBAE7CnI,EACC8D,EAAA,QAAAE,cAAC8D,kBAAe,CAACT,KAAK,KAAKU,KAAMK,EAAAA,oBAEjCtE,EAAA,QAAAE,cAAC8D,EAAeA,gBAAC,CAAAT,KAAK,KAAKU,KAAMM,EAAAA,gBAGrCvE,EAAAA,QAAAE,cAACwD,EAAAA,OAAM,CAACC,QAAQ,WACd3D,UAACE,cAAA8D,EAAAA,gBAAgB,CAAAT,KAAK,KAAKU,KAAMO,EAAmBC,eAEtDzE,EAAAA,QAAAE,cAACwD,EAAAA,OAAM,CAACC,QAAQ,WACd3D,UAAAE,cAAC8D,EAAeA,gBAAA,CAACT,KAAK,KAAKU,KAAMS,EAAAA,kBAIvC1E,UAACE,cAAA1F,EAAAA,aAAAA,QAAAA,OAAO2I,IAAG,CACThC,UAAW,QAAAC,OACT5D,IACI,cACA3B,EACA,mCACA,gCAA+B,YAErCyF,QAAS,CAAE+B,QAAS,IAEpBrD,EAAC,QAAAE,cAAAwD,UAAOG,QAzUtB,SAAsBjC,GACpBA,EAAM+C,kBACNC,EAAAA,mBACD,EAsU4CjB,QAAQ,OACrC3D,UAACE,cAAA8D,EAAAA,gBAAgB,CAAA7C,UAAU,qBAAqB8C,KAAMY,EAAOA,WAE9DrH,KACCwC,EAAA,QAAAE,cAACwD,EAAAA,OAAM,CAACG,QAjVxB,SAAsBjC,GACpBkD,EAAAA,oBACD,EA+U8CnB,QAAQ,SACrC3D,EAAAA,QAAAE,cAAC8D,kBAAgB,CAAA7C,UAAU,UAAU8C,KAAMY,EAAAA,cAQzD7E,EAAAA,QAAKE,cAAA,MAAA,CAAAiB,UAAU,UACbnB,EAAA,QAAAE,cAAA,QAAA,CAAO6E,UAAQ,EAAC7D,IAAKjC,KACrBe,EAAA,QAAAE,cAAA,QAAA,CAAO6E,UAAQ,EAAC7D,IAAKhC,KACrBc,UAAOE,cAAA,QAAA,CAAAhE,OAAO,EAAM6I,UAAS,EAAA7D,IAAK/B,KAClCa,UAAOE,cAAA,QAAA,CAAA6E,YAAS7D,IAAK9B,MAI7B,EAEAnE,EAAOc,YAAc"}
|
package/dist/index.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }::-webkit-backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}.pointer-events-none{pointer-events:none}.pointer-events-auto{pointer-events:auto}.absolute{position:absolute}.relative{position:relative}.left-0{left:0}.top-0{top:0}.z-1000{z-index:1000}.-z-10{z-index:-10}.z-10{z-index:10}.col-start-auto{grid-column-start:auto}.flex{display:flex}.grid{display:grid}.hidden{display:none}.h-6{height:1.5rem}.h-12{height:3rem}.h-8{height:2rem}.min-h-full{min-height:100%}.w-6{width:1.5rem}.w-12{width:3rem}.w-fit{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.w-0\.5{width:.125rem}.w-0{width:0}.min-w-full{min-width:100%}.rotate-135{--tw-rotate:135deg}.rotate-135,.transform{-webkit-transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}@-webkit-keyframes ping{75%,to{opacity:0;-webkit-transform:scale(2);transform:scale(2)}}@keyframes ping{75%,to{opacity:0;-webkit-transform:scale(2);transform:scale(2)}}.animate-ping{-webkit-animation:ping 1s cubic-bezier(0,0,.2,1) infinite;animation:ping 1s cubic-bezier(0,0,.2,1) infinite}.auto-cols-max{grid-auto-columns:-webkit-max-content;grid-auto-columns:max-content}.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.place-items-center{place-items:center}.content-center{align-content:center}.items-center{align-items:center}.justify-center{justify-content:center}.justify-items-end{justify-items:end}.justify-items-center{justify-items:center}.gap-1{gap:.25rem}.gap-3\.5{gap:.875rem}.gap-3{gap:.75rem}.gap-y-5{row-gap:1.25rem}.overflow-hidden{overflow:hidden}.whitespace-nowrap{white-space:nowrap}.rounded-sm{border-radius:.125rem}.rounded-full{border-radius:9999px}.rounded-xl{border-radius:.75rem}.rounded-md{border-radius:.375rem}.rounded{border-radius:.25rem}.border{border-width:1px}.border-transparent{border-color:transparent}.border-gray-700{--tw-border-opacity:1;border-color:rgb(55 65 81/var(--tw-border-opacity))}.bg-emerald-600{--tw-bg-opacity:1;background-color:rgb(5 150 105/var(--tw-bg-opacity))}.bg-red-600{--tw-bg-opacity:1;background-color:rgb(220 38 38/var(--tw-bg-opacity))}.bg-green-600{--tw-bg-opacity:1;background-color:rgb(22 163 74/var(--tw-bg-opacity))}.bg-transparent{background-color:initial}.bg-gray-700{--tw-bg-opacity:1;background-color:rgb(55 65 81/var(--tw-bg-opacity))}.bg-gray-500{--tw-bg-opacity:1;background-color:rgb(107 114 128/var(--tw-bg-opacity))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity))}.bg-gray-300{--tw-bg-opacity:1;background-color:rgb(209 213 219/var(--tw-bg-opacity))}.bg-sky-600{--tw-bg-opacity:1;background-color:rgb(2 132 199/var(--tw-bg-opacity))}.px-3{padding-left:.75rem;padding-right:.75rem}.py-2{padding-bottom:.5rem;padding-top:.5rem}.font-sans{font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji}.text-sm{font-size:.875rem;line-height:1.25rem}.font-medium{font-weight:500}.leading-4{line-height:1rem}.tracking-wide{letter-spacing:.025em}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity))}.opacity-60{opacity:.6}.filter{-webkit-filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.transition-colors{transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-200{transition-duration:.2s}.hover\:border-gray-500:hover{--tw-border-opacity:1;border-color:rgb(107 114 128/var(--tw-border-opacity))}.hover\:bg-red-700:hover{--tw-bg-opacity:1;background-color:rgb(185 28 28/var(--tw-bg-opacity))}.hover\:bg-green-700:hover{--tw-bg-opacity:1;background-color:rgb(21 128 61/var(--tw-bg-opacity))}.hover\:bg-gray-500:hover{--tw-bg-opacity:1;background-color:rgb(107 114 128/var(--tw-bg-opacity))}.hover\:bg-sky-700:hover{--tw-bg-opacity:1;background-color:rgb(3 105 161/var(--tw-bg-opacity))}.focus\:z-20:focus{z-index:20}.focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.focus\:ring-2:focus{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color)}.focus\:ring-0:focus,.focus\:ring-2:focus{box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.focus\:ring-0:focus{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(var(--tw-ring-offset-width)) var(--tw-ring-color)}.focus\:ring-red-500:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(239 68 68/var(--tw-ring-opacity))}.focus\:ring-green-500:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(34 197 94/var(--tw-ring-opacity))}.focus\:ring-gray-500:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(107 114 128/var(--tw-ring-opacity))}.focus\:ring-sky-500:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(14 165 233/var(--tw-ring-opacity))}.focus\:ring-offset-2:focus{--tw-ring-offset-width:2px}.focus\:ring-offset-black:focus{--tw-ring-offset-color:#000}.focus\:ring-offset-white:focus{--tw-ring-offset-color:#fff}.disabled\:opacity-75:disabled{opacity:.75}
|
|
1
|
+
*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }::-webkit-backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}.pointer-events-none{pointer-events:none}.pointer-events-auto{pointer-events:auto}.absolute{position:absolute}.relative{position:relative}.left-0{left:0}.top-0{top:0}.z-1000{z-index:1000}.-z-10{z-index:-10}.z-10{z-index:10}.col-start-auto{grid-column-start:auto}.inline-block{display:inline-block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.h-6{height:1.5rem}.h-12{height:3rem}.h-8{height:2rem}.min-h-full{min-height:100%}.w-6{width:1.5rem}.w-12{width:3rem}.w-fit{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.w-0\.5{width:.125rem}.w-0{width:0}.min-w-full{min-width:100%}.rotate-135{--tw-rotate:135deg}.rotate-135,.transform{-webkit-transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}@-webkit-keyframes move{0%,25%{left:0;-webkit-transform:translateX(0);transform:translateX(0)}75%,to{left:100%;-webkit-transform:translateX(-100%);transform:translateX(-100%)}}@keyframes move{0%,25%{left:0;-webkit-transform:translateX(0);transform:translateX(0)}75%,to{left:100%;-webkit-transform:translateX(-100%);transform:translateX(-100%)}}.animate-animated-text{-webkit-animation:move 3s linear 0s infinite alternate;animation:move 3s linear 0s infinite alternate}@-webkit-keyframes ping{75%,to{opacity:0;-webkit-transform:scale(2);transform:scale(2)}}@keyframes ping{75%,to{opacity:0;-webkit-transform:scale(2);transform:scale(2)}}.animate-ping{-webkit-animation:ping 1s cubic-bezier(0,0,.2,1) infinite;animation:ping 1s cubic-bezier(0,0,.2,1) infinite}.auto-cols-max{grid-auto-columns:-webkit-max-content;grid-auto-columns:max-content}.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.place-items-center{place-items:center}.content-center{align-content:center}.items-center{align-items:center}.justify-center{justify-content:center}.justify-items-end{justify-items:end}.justify-items-center{justify-items:center}.gap-1{gap:.25rem}.gap-3\.5{gap:.875rem}.gap-3{gap:.75rem}.gap-y-5{row-gap:1.25rem}.overflow-hidden{overflow:hidden}.whitespace-nowrap{white-space:nowrap}.rounded-sm{border-radius:.125rem}.rounded-full{border-radius:9999px}.rounded-xl{border-radius:.75rem}.rounded-md{border-radius:.375rem}.rounded{border-radius:.25rem}.border{border-width:1px}.border-transparent{border-color:transparent}.border-gray-700{--tw-border-opacity:1;border-color:rgb(55 65 81/var(--tw-border-opacity))}.bg-emerald-600{--tw-bg-opacity:1;background-color:rgb(5 150 105/var(--tw-bg-opacity))}.bg-red-600{--tw-bg-opacity:1;background-color:rgb(220 38 38/var(--tw-bg-opacity))}.bg-green-600{--tw-bg-opacity:1;background-color:rgb(22 163 74/var(--tw-bg-opacity))}.bg-transparent{background-color:initial}.bg-gray-700{--tw-bg-opacity:1;background-color:rgb(55 65 81/var(--tw-bg-opacity))}.bg-gray-500{--tw-bg-opacity:1;background-color:rgb(107 114 128/var(--tw-bg-opacity))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity))}.bg-gray-300{--tw-bg-opacity:1;background-color:rgb(209 213 219/var(--tw-bg-opacity))}.bg-sky-600{--tw-bg-opacity:1;background-color:rgb(2 132 199/var(--tw-bg-opacity))}.px-3{padding-left:.75rem;padding-right:.75rem}.py-2{padding-bottom:.5rem;padding-top:.5rem}.font-sans{font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji}.text-sm{font-size:.875rem;line-height:1.25rem}.font-medium{font-weight:500}.leading-4{line-height:1rem}.tracking-wide{letter-spacing:.025em}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity))}.opacity-60{opacity:.6}.filter{-webkit-filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.transition-colors{transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-200{transition-duration:.2s}.hover\:border-gray-500:hover{--tw-border-opacity:1;border-color:rgb(107 114 128/var(--tw-border-opacity))}.hover\:bg-red-700:hover{--tw-bg-opacity:1;background-color:rgb(185 28 28/var(--tw-bg-opacity))}.hover\:bg-green-700:hover{--tw-bg-opacity:1;background-color:rgb(21 128 61/var(--tw-bg-opacity))}.hover\:bg-gray-500:hover{--tw-bg-opacity:1;background-color:rgb(107 114 128/var(--tw-bg-opacity))}.hover\:bg-sky-700:hover{--tw-bg-opacity:1;background-color:rgb(3 105 161/var(--tw-bg-opacity))}.focus\:z-20:focus{z-index:20}.focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.focus\:ring-2:focus{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color)}.focus\:ring-0:focus,.focus\:ring-2:focus{box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.focus\:ring-0:focus{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(var(--tw-ring-offset-width)) var(--tw-ring-color)}.focus\:ring-red-500:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(239 68 68/var(--tw-ring-opacity))}.focus\:ring-green-500:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(34 197 94/var(--tw-ring-opacity))}.focus\:ring-gray-500:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(107 114 128/var(--tw-ring-opacity))}.focus\:ring-sky-500:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(14 165 233/var(--tw-ring-opacity))}.focus\:ring-offset-2:focus{--tw-ring-offset-width:2px}.focus\:ring-offset-black:focus{--tw-ring-offset-color:#000}.focus\:ring-offset-white:focus{--tw-ring-offset-color:#fff}.disabled\:opacity-75:disabled{opacity:.75}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),require("../../node_modules/mic-check/lib/index.js");var e=require("../webrtc/janus.js"),i=require("../../_virtual/index8.js"),r=e.default;exports.checkMediaPermissions=function(){i.__exports.requestMediaPermissions().then((function(){})).catch((function(e){var a=e.type;e.name,e.message,a===i.__exports.MediaPermissionsErrorType.SystemPermissionDenied?r.error&&r.error("WebRTC: browser does not have permission to access camera or microphone"):a===i.__exports.MediaPermissionsErrorType.UserPermissionDenied?r.error&&r.error("WebRTC: user didn't allow app to access camera or microphone"):a===i.__exports.MediaPermissionsErrorType.CouldNotStartVideoSource?r.error&&r.error("WebRTC: camera is in use by another application (Zoom, Skype) or browser tab (Google Meet, Messenger Video)"):r.error&&r.error("WebRTC: can't access audio or camere on this device. unknown error")}))},exports.getSupportedDevices=function(e){navigator.mediaDevices.getUserMedia({video:!0,audio:!0}),navigator.mediaDevices&&navigator.mediaDevices.enumerateDevices&&(navigator.enumerateDevices=function(e){navigator.mediaDevices.enumerateDevices().then(e)});var i=[],r="https:"===location.protocol,a=!1;("undefined"!=typeof MediaStreamTrack&&"getSources"in MediaStreamTrack||navigator.mediaDevices&&navigator.mediaDevices.enumerateDevices)&&(a=!0);var o,n=!1,t=!1;o=function(){e()},a&&(!navigator.enumerateDevices&&window.MediaStreamTrack&&window.MediaStreamTrack.getSources&&(navigator.enumerateDevices=window.MediaStreamTrack.getSources.bind(window.MediaStreamTrack)),!navigator.enumerateDevices&&navigator.enumerateDevices&&(navigator.enumerateDevices=navigator.enumerateDevices.bind(navigator)),navigator.enumerateDevices?(i=[],navigator.enumerateDevices((function(e){e.forEach((function(e){var a,o={};for(var s in e)o[s]=e[s];"audio"===o.kind&&(o.kind="audioinput"),"video"===o.kind&&(o.kind="videoinput"),i.forEach((function(e){e.id===o.id&&e.kind===o.kind&&(a=!0)})),a||(o.deviceId||(o.deviceId=o.id),o.id||(o.id=o.deviceId),o.label?("videoinput"!==o.kind||t||(t=!0),"audioinput"!==o.kind||n||(n=!0)):(o.label="Please invoke getUserMedia once.",r||(o.label="HTTPs is required to get label of this "+o.kind+" device.")),o.kind,o.kind,o.kind,i.push(o))})),o&&o()}))):o&&o())};
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),require("../../node_modules/mic-check/lib/index.js");var e=require("../webrtc/janus.js"),i=require("../../_virtual/index8.js"),r=e.default;exports.checkMediaPermissions=function(){i.__exports.requestMediaPermissions({audio:!0,video:!1}).then((function(){})).catch((function(e){var a=e.type;e.name,e.message,a===i.__exports.MediaPermissionsErrorType.SystemPermissionDenied?r.error&&r.error("WebRTC: browser does not have permission to access camera or microphone"):a===i.__exports.MediaPermissionsErrorType.UserPermissionDenied?r.error&&r.error("WebRTC: user didn't allow app to access camera or microphone"):a===i.__exports.MediaPermissionsErrorType.CouldNotStartVideoSource?r.error&&r.error("WebRTC: camera is in use by another application (Zoom, Skype) or browser tab (Google Meet, Messenger Video)"):r.error&&r.error("WebRTC: can't access audio or camere on this device. unknown error")}))},exports.getSupportedDevices=function(e){navigator.mediaDevices.getUserMedia({video:!0,audio:!0}),navigator.mediaDevices&&navigator.mediaDevices.enumerateDevices&&(navigator.enumerateDevices=function(e){navigator.mediaDevices.enumerateDevices().then(e)});var i=[],r="https:"===location.protocol,a=!1;("undefined"!=typeof MediaStreamTrack&&"getSources"in MediaStreamTrack||navigator.mediaDevices&&navigator.mediaDevices.enumerateDevices)&&(a=!0);var o,n=!1,t=!1;o=function(){e()},a&&(!navigator.enumerateDevices&&window.MediaStreamTrack&&window.MediaStreamTrack.getSources&&(navigator.enumerateDevices=window.MediaStreamTrack.getSources.bind(window.MediaStreamTrack)),!navigator.enumerateDevices&&navigator.enumerateDevices&&(navigator.enumerateDevices=navigator.enumerateDevices.bind(navigator)),navigator.enumerateDevices?(i=[],navigator.enumerateDevices((function(e){e.forEach((function(e){var a,o={};for(var s in e)o[s]=e[s];"audio"===o.kind&&(o.kind="audioinput"),"video"===o.kind&&(o.kind="videoinput"),i.forEach((function(e){e.id===o.id&&e.kind===o.kind&&(a=!0)})),a||(o.deviceId||(o.deviceId=o.id),o.id||(o.id=o.deviceId),o.label?("videoinput"!==o.kind||t||(t=!0),"audioinput"!==o.kind||n||(n=!0)):(o.label="Please invoke getUserMedia once.",r||(o.label="HTTPs is required to get label of this "+o.kind+" device.")),o.kind,o.kind,o.kind,i.push(o))})),o&&o()}))):o&&o())};
|
|
2
2
|
//# sourceMappingURL=devices.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"devices.js","sources":["../../../src/lib/devices/devices.ts"],"sourcesContent":["// Copyright (C) 2022 Nethesis S.r.l.\n// SPDX-License-Identifier: AGPL-3.0-or-later\n\nimport {\n MediaPermissionsError,\n MediaPermissionsErrorType,\n requestMediaPermissions,\n} from 'mic-check'\nimport JanusLib from '../webrtc/janus'\nimport { JanusTypes } from '../webrtc/types'\n\nconst Janus: JanusTypes = JanusLib\n\nexport const getSupportedDevices = function (origCallback) {\n let supportedDevices = null\n\n navigator.mediaDevices.getUserMedia({\n video: true,\n audio: true,\n })\n\n if (navigator.mediaDevices && navigator.mediaDevices.enumerateDevices) {\n // Firefox 38+ seems having support of enumerateDevicesx\n // @ts-ignore\n navigator.enumerateDevices = function (callback) {\n navigator.mediaDevices.enumerateDevices().then(callback)\n }\n }\n\n var MediaDevices = []\n var isHTTPs = location.protocol === 'https:'\n var canEnumerate = false\n\n if (typeof MediaStreamTrack !== 'undefined' && 'getSources' in MediaStreamTrack) {\n canEnumerate = true\n } else if (navigator.mediaDevices && !!navigator.mediaDevices.enumerateDevices) {\n canEnumerate = true\n }\n\n var hasMicrophone = false\n var hasSpeakers = false\n var hasWebcam = false\n\n var isMicrophoneAlreadyCaptured = false\n var isWebcamAlreadyCaptured = false\n\n function checkDeviceSupport(callback) {\n if (!canEnumerate) {\n return\n }\n\n if (\n // @ts-ignore\n !navigator.enumerateDevices &&\n window.MediaStreamTrack &&\n // @ts-ignore\n window.MediaStreamTrack.getSources\n ) {\n // @ts-ignore\n navigator.enumerateDevices = window.MediaStreamTrack.getSources.bind(window.MediaStreamTrack)\n }\n // @ts-ignore\n if (!navigator.enumerateDevices && navigator.enumerateDevices) {\n // @ts-ignore\n navigator.enumerateDevices = navigator.enumerateDevices.bind(navigator)\n }\n // @ts-ignore\n if (!navigator.enumerateDevices) {\n if (callback) {\n callback()\n }\n return\n }\n\n MediaDevices = []\n // @ts-ignore\n navigator.enumerateDevices(function (devices) {\n devices.forEach(function (_device) {\n var device = {}\n for (var d in _device) {\n device[d] = _device[d]\n }\n // @ts-ignore\n if (device.kind === 'audio') {\n // @ts-ignore\n device.kind = 'audioinput'\n }\n // @ts-ignore\n if (device.kind === 'video') {\n // @ts-ignore\n device.kind = 'videoinput'\n }\n\n var skip\n MediaDevices.forEach(function (d) {\n // @ts-ignore\n if (d.id === device.id && d.kind === device.kind) {\n skip = true\n }\n })\n\n if (skip) {\n return\n }\n // @ts-ignore\n if (!device.deviceId) {\n // @ts-ignore\n device.deviceId = device.id\n }\n // @ts-ignore\n if (!device.id) {\n // @ts-ignore\n device.id = device.deviceId\n }\n // @ts-ignore\n if (!device.label) {\n // @ts-ignore\n device.label = 'Please invoke getUserMedia once.'\n if (!isHTTPs) {\n // @ts-ignore\n device.label = 'HTTPs is required to get label of this ' + device.kind + ' device.'\n }\n } else {\n // @ts-ignore\n if (device.kind === 'videoinput' && !isWebcamAlreadyCaptured) {\n isWebcamAlreadyCaptured = true\n }\n // @ts-ignore\n if (device.kind === 'audioinput' && !isMicrophoneAlreadyCaptured) {\n isMicrophoneAlreadyCaptured = true\n }\n }\n // @ts-ignore\n if (device.kind === 'audioinput') {\n hasMicrophone = true\n }\n // @ts-ignore\n if (device.kind === 'audiooutput') {\n hasSpeakers = true\n }\n // @ts-ignore\n if (device.kind === 'videoinput') {\n hasWebcam = true\n }\n\n // there is no 'videoouput' in the spec.\n // @ts-ignore\n MediaDevices.push(device)\n })\n\n if (callback) {\n callback()\n }\n })\n }\n\n // check for microphone/camera support!\n checkDeviceSupport(function () {\n // @ts-ignore\n supportedDevices = {\n audio: hasMicrophone,\n audioCap: isMicrophoneAlreadyCaptured,\n video: hasWebcam,\n videoCap: isWebcamAlreadyCaptured,\n }\n // @ts-ignore\n // janus.log('supportedDevices=', supportedDevices)\n origCallback()\n })\n}\n\nexport const checkMediaPermissions = function () {\n requestMediaPermissions()\n .then(() => {\n // can successfully access camera and microphone streams\n // save permissions state on rematch to get access globally on the app\n })\n .catch((err: MediaPermissionsError) => {\n const { type, name, message } = err\n if (type === MediaPermissionsErrorType.SystemPermissionDenied) {\n // browser does not have permission to access camera or microphone\n if (Janus.error)\n Janus.error('WebRTC: browser does not have permission to access camera or microphone')\n } else if (type === MediaPermissionsErrorType.UserPermissionDenied) {\n // user didn't allow app to access camera or microphone\n if (Janus.error) Janus.error(\"WebRTC: user didn't allow app to access camera or microphone\")\n } else if (type === MediaPermissionsErrorType.CouldNotStartVideoSource) {\n // camera is in use by another application (Zoom, Skype) or browser tab (Google Meet, Messenger Video)\n // (mostly Windows specific problem)\n if (Janus.error)\n Janus.error(\n 'WebRTC: camera is in use by another application (Zoom, Skype) or browser tab (Google Meet, Messenger Video)',\n )\n } else {\n if (Janus.error)\n // not all error types are handled by this library\n Janus.error(\"WebRTC: can't access audio or camere on this device. unknown error\")\n }\n })\n}\n"],"names":["Janus","JanusLib","requestMediaPermissions","then","catch","err","type","name","MediaPermissionsErrorType","__exports","SystemPermissionDenied","error","UserPermissionDenied","CouldNotStartVideoSource","origCallback","navigator","mediaDevices","getUserMedia","
|
|
1
|
+
{"version":3,"file":"devices.js","sources":["../../../src/lib/devices/devices.ts"],"sourcesContent":["// Copyright (C) 2022 Nethesis S.r.l.\n// SPDX-License-Identifier: AGPL-3.0-or-later\n\nimport {\n MediaPermissionsError,\n MediaPermissionsErrorType,\n requestMediaPermissions,\n} from 'mic-check'\nimport JanusLib from '../webrtc/janus'\nimport { JanusTypes } from '../webrtc/types'\n\nconst Janus: JanusTypes = JanusLib\n\nexport const getSupportedDevices = function (origCallback) {\n let supportedDevices = null\n\n navigator.mediaDevices.getUserMedia({\n video: true,\n audio: true,\n })\n\n if (navigator.mediaDevices && navigator.mediaDevices.enumerateDevices) {\n // Firefox 38+ seems having support of enumerateDevicesx\n // @ts-ignore\n navigator.enumerateDevices = function (callback) {\n navigator.mediaDevices.enumerateDevices().then(callback)\n }\n }\n\n var MediaDevices = []\n var isHTTPs = location.protocol === 'https:'\n var canEnumerate = false\n\n if (typeof MediaStreamTrack !== 'undefined' && 'getSources' in MediaStreamTrack) {\n canEnumerate = true\n } else if (navigator.mediaDevices && !!navigator.mediaDevices.enumerateDevices) {\n canEnumerate = true\n }\n\n var hasMicrophone = false\n var hasSpeakers = false\n var hasWebcam = false\n\n var isMicrophoneAlreadyCaptured = false\n var isWebcamAlreadyCaptured = false\n\n function checkDeviceSupport(callback) {\n if (!canEnumerate) {\n return\n }\n\n if (\n // @ts-ignore\n !navigator.enumerateDevices &&\n window.MediaStreamTrack &&\n // @ts-ignore\n window.MediaStreamTrack.getSources\n ) {\n // @ts-ignore\n navigator.enumerateDevices = window.MediaStreamTrack.getSources.bind(window.MediaStreamTrack)\n }\n // @ts-ignore\n if (!navigator.enumerateDevices && navigator.enumerateDevices) {\n // @ts-ignore\n navigator.enumerateDevices = navigator.enumerateDevices.bind(navigator)\n }\n // @ts-ignore\n if (!navigator.enumerateDevices) {\n if (callback) {\n callback()\n }\n return\n }\n\n MediaDevices = []\n // @ts-ignore\n navigator.enumerateDevices(function (devices) {\n devices.forEach(function (_device) {\n var device = {}\n for (var d in _device) {\n device[d] = _device[d]\n }\n // @ts-ignore\n if (device.kind === 'audio') {\n // @ts-ignore\n device.kind = 'audioinput'\n }\n // @ts-ignore\n if (device.kind === 'video') {\n // @ts-ignore\n device.kind = 'videoinput'\n }\n\n var skip\n MediaDevices.forEach(function (d) {\n // @ts-ignore\n if (d.id === device.id && d.kind === device.kind) {\n skip = true\n }\n })\n\n if (skip) {\n return\n }\n // @ts-ignore\n if (!device.deviceId) {\n // @ts-ignore\n device.deviceId = device.id\n }\n // @ts-ignore\n if (!device.id) {\n // @ts-ignore\n device.id = device.deviceId\n }\n // @ts-ignore\n if (!device.label) {\n // @ts-ignore\n device.label = 'Please invoke getUserMedia once.'\n if (!isHTTPs) {\n // @ts-ignore\n device.label = 'HTTPs is required to get label of this ' + device.kind + ' device.'\n }\n } else {\n // @ts-ignore\n if (device.kind === 'videoinput' && !isWebcamAlreadyCaptured) {\n isWebcamAlreadyCaptured = true\n }\n // @ts-ignore\n if (device.kind === 'audioinput' && !isMicrophoneAlreadyCaptured) {\n isMicrophoneAlreadyCaptured = true\n }\n }\n // @ts-ignore\n if (device.kind === 'audioinput') {\n hasMicrophone = true\n }\n // @ts-ignore\n if (device.kind === 'audiooutput') {\n hasSpeakers = true\n }\n // @ts-ignore\n if (device.kind === 'videoinput') {\n hasWebcam = true\n }\n\n // there is no 'videoouput' in the spec.\n // @ts-ignore\n MediaDevices.push(device)\n })\n\n if (callback) {\n callback()\n }\n })\n }\n\n // check for microphone/camera support!\n checkDeviceSupport(function () {\n // @ts-ignore\n supportedDevices = {\n audio: hasMicrophone,\n audioCap: isMicrophoneAlreadyCaptured,\n video: hasWebcam,\n videoCap: isWebcamAlreadyCaptured,\n }\n // @ts-ignore\n // janus.log('supportedDevices=', supportedDevices)\n origCallback()\n })\n}\n\nexport const checkMediaPermissions = function () {\n requestMediaPermissions({audio: true, video: false})\n .then(() => {\n // can successfully access camera and microphone streams\n // save permissions state on rematch to get access globally on the app\n })\n .catch((err: MediaPermissionsError) => {\n const { type, name, message } = err\n if (type === MediaPermissionsErrorType.SystemPermissionDenied) {\n // browser does not have permission to access camera or microphone\n if (Janus.error)\n Janus.error('WebRTC: browser does not have permission to access camera or microphone')\n } else if (type === MediaPermissionsErrorType.UserPermissionDenied) {\n // user didn't allow app to access camera or microphone\n if (Janus.error) Janus.error(\"WebRTC: user didn't allow app to access camera or microphone\")\n } else if (type === MediaPermissionsErrorType.CouldNotStartVideoSource) {\n // camera is in use by another application (Zoom, Skype) or browser tab (Google Meet, Messenger Video)\n // (mostly Windows specific problem)\n if (Janus.error)\n Janus.error(\n 'WebRTC: camera is in use by another application (Zoom, Skype) or browser tab (Google Meet, Messenger Video)',\n )\n } else {\n if (Janus.error)\n // not all error types are handled by this library\n Janus.error(\"WebRTC: can't access audio or camere on this device. unknown error\")\n }\n })\n}\n"],"names":["Janus","JanusLib","requestMediaPermissions","audio","video","then","catch","err","type","name","MediaPermissionsErrorType","__exports","SystemPermissionDenied","error","UserPermissionDenied","CouldNotStartVideoSource","origCallback","navigator","mediaDevices","getUserMedia","enumerateDevices","callback","MediaDevices","isHTTPs","location","protocol","canEnumerate","MediaStreamTrack","isMicrophoneAlreadyCaptured","isWebcamAlreadyCaptured","window","getSources","bind","devices","forEach","_device","skip","device","d","kind","id","deviceId","label","push"],"mappings":"mMAWMA,EAAoBC,EAAAA,sCAgKW,WACnCC,EAAAA,UAAAA,wBAAwB,CAACC,OAAO,EAAMC,OAAO,IAC1CC,MAAK,WAGN,IACCC,OAAM,SAACC,GACE,IAAAC,EAAwBD,EAAGC,KAAHD,EAAGE,KAAHF,UAC5BC,IAASE,EAAyBC,UAAAD,0BAACE,uBAEjCZ,EAAMa,OACRb,EAAMa,MAAM,2EACLL,IAASE,EAAyBC,UAAAD,0BAACI,qBAExCd,EAAMa,OAAOb,EAAMa,MAAM,gEACpBL,IAASE,EAAyBC,UAAAD,0BAACK,yBAGxCf,EAAMa,OACRb,EAAMa,MACJ,+GAGAb,EAAMa,OAERb,EAAMa,MAAM,qEAElB,GACJ,8BA1LmC,SAAUG,GAG3CC,UAAUC,aAAaC,aAAa,CAClCf,OAAO,EACPD,OAAO,IAGLc,UAAUC,cAAgBD,UAAUC,aAAaE,mBAGnDH,UAAUG,iBAAmB,SAAUC,GACrCJ,UAAUC,aAAaE,mBAAmBf,KAAKgB,EACjD,GAGF,IAAIC,EAAe,GACfC,EAAgC,WAAtBC,SAASC,SACnBC,GAAe,GAEa,oBAArBC,kBAAoC,eAAgBA,kBAEpDV,UAAUC,cAAkBD,UAAUC,aAAaE,oBAD5DM,GAAe,GASjB,IAG4BL,EAHxBO,GAA8B,EAC9BC,GAA0B,EAEFR,EA+GT,WAUjBL,GACF,EAzHOU,KAMFT,UAAUG,kBACXU,OAAOH,kBAEPG,OAAOH,iBAAiBI,aAGxBd,UAAUG,iBAAmBU,OAAOH,iBAAiBI,WAAWC,KAAKF,OAAOH,oBAGzEV,UAAUG,kBAAoBH,UAAUG,mBAE3CH,UAAUG,iBAAmBH,UAAUG,iBAAiBY,KAAKf,YAG1DA,UAAUG,kBAOfE,EAAe,GAEfL,UAAUG,kBAAiB,SAAUa,GACnCA,EAAQC,SAAQ,SAAUC,GACxB,IAeIC,EAfAC,EAAS,CAAA,EACb,IAAK,IAAIC,KAAKH,EACZE,EAAOC,GAAKH,EAAQG,GAGF,UAAhBD,EAAOE,OAETF,EAAOE,KAAO,cAGI,UAAhBF,EAAOE,OAETF,EAAOE,KAAO,cAIhBjB,EAAaY,SAAQ,SAAUI,GAEzBA,EAAEE,KAAOH,EAAOG,IAAMF,EAAEC,OAASF,EAAOE,OAC1CH,GAAO,EAEX,IAEIA,IAICC,EAAOI,WAEVJ,EAAOI,SAAWJ,EAAOG,IAGtBH,EAAOG,KAEVH,EAAOG,GAAKH,EAAOI,UAGhBJ,EAAOK,OASU,eAAhBL,EAAOE,MAA0BV,IACnCA,GAA0B,GAGR,eAAhBQ,EAAOE,MAA0BX,IACnCA,GAA8B,KAZhCS,EAAOK,MAAQ,mCACVnB,IAEHc,EAAOK,MAAQ,0CAA4CL,EAAOE,KAAO,aAazEF,EAAOE,KAIPF,EAAOE,KAIPF,EAAOE,KAMXjB,EAAaqB,KAAKN,GACpB,IAEIhB,GACFA,GAEJ,KArFMA,GACFA,IAoGR"}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@nethesis/phone-island",
|
|
3
3
|
"author": "Nethesis",
|
|
4
|
-
"version": "0.7.
|
|
4
|
+
"version": "0.7.51",
|
|
5
5
|
"description": "NethVoice CTI Phone Island",
|
|
6
6
|
"keywords": [
|
|
7
7
|
"nethserver",
|
|
@@ -62,7 +62,8 @@
|
|
|
62
62
|
"start": "react-scripts start",
|
|
63
63
|
"dev": "start-storybook -p 6006 -s public",
|
|
64
64
|
"test": "react-scripts test",
|
|
65
|
-
"watch": "
|
|
65
|
+
"watch": "rollup -w -c",
|
|
66
|
+
"watch:css": "npx tailwindcss -o ./dist/index.css --watch",
|
|
66
67
|
"build": "rm -rf ./dist && npm run build:css && rollup -c",
|
|
67
68
|
"build:css": "NODE_ENV=production npx tailwindcss -o ./dist/index.css --minify",
|
|
68
69
|
"build:widget": "parcel build ./src/index.widget.tsx --no-source-maps",
|