@nethesis/phone-island 0.7.50 → 0.7.52
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.
- package/dist/components/Island.js +1 -1
- package/dist/components/Island.js.map +1 -1
- package/dist/index.css +1 -1
- package/dist/models/index.d.ts +2 -0
- package/dist/models/index.js +1 -1
- package/dist/models/index.js.map +1 -1
- package/dist/models/island.d.ts +21 -0
- package/dist/models/island.js +2 -0
- package/dist/models/island.js.map +1 -0
- package/dist/node_modules/@nethesis/nethesis-light-svg-icons/index.mjs.js +2 -0
- package/dist/node_modules/@nethesis/nethesis-light-svg-icons/index.mjs.js.map +1 -0
- package/dist/static/icons/PhoneKeyboardLight.d.ts +3 -0
- package/dist/static/icons/PhoneKeyboardLight.js +2 -0
- package/dist/static/icons/PhoneKeyboardLight.js.map +1 -0
- package/dist/static/icons/PhoneKeyboardSolid.d.ts +3 -0
- package/dist/static/icons/PhoneKeyboardSolid.js +2 -0
- package/dist/static/icons/PhoneKeyboardSolid.js.map +1 -0
- package/package.json +3 -2
- package/dist/node_modules/@nethesis/nethesis-regular-svg-icons/index.mjs.js +0 -2
- package/dist/node_modules/@nethesis/nethesis-regular-svg-icons/index.mjs.js.map +0 -1
|
@@ -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-
|
|
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-light-svg-icons/index.mjs.js"),p=require("../static/icons/PhoneKeyboardLight.js"),g=require("../static/icons/PhoneKeyboardSolid.js"),h=require("../_virtual/framer-motion.js"),v=require("../node_modules/react-redux/es/hooks/useSelector.js"),x=require("../node_modules/react-redux/es/hooks/useDispatch.js");function y(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var E=y(t),w=h.framerMotion.exports.motion(n.StyledPhoneIsland),j=h.framerMotion.exports.motion(n.StyledAvatar),b=h.framerMotion.exports.motion(n.StyledDetails),S=h.framerMotion.exports.motion(n.StyledName),q=0,C=0,N=function(y){var N=y.always,P=t.useState(!0),A=P[0],I=P[1],M=v.useSelector((function(e){return e.currentCall})),R=M.incoming,_=M.accepted,k=M.outgoing,z=M.displayName,L=M.number,B=M.startTime,D=M.muted,F=M.paused,T=v.useSelector((function(e){return e.player}));T.localAudio;var O=T.remoteAudio,W=v.useSelector((function(e){return e.island})).view,V=h.framerMotion.exports.useDragControls(),H=u.useLocalStorage("phone-island",null),K=H[0],X=H[1],G=t.useRef(null),J=t.useRef(null),Q=t.useState(K&&K.position?K.position:null),U=Q[0],Y=Q[1],Z=t.useState(!1),$=Z[0],ee=Z[1],te=x.useDispatch();function ne(){return!k&&!_}var ae=o.useLongPress((function(){console.log("long press trigger")}),(function(){I(!A)}),$,(function(){ee(!1)}),{shouldPreventDefault:!0,delay:250}),re={open:{width:"48px",height:"48px",borderRadius:"12px"},closed:{width:"24px",height:"24px",borderRadius:"6px"}},oe=t.useState(null),ie=oe[0],le=oe[1];t.useEffect((function(){function e(){null==O||O.addEventListener("play",(function(){navigator.userAgent.indexOf("Firefox")>-1?le(O.mozCaptureStream()):le(O.captureStream())}))}return e(),function(){null==O||O.removeEventListener("play",e)}}),[O]);var ue=t.useRef(null),se=t.useRef(null),ce=t.useRef(null),de=t.useRef(null);l.useIsomorphicLayoutEffect((function(){te.player.updatePlayer({localAudio:ue.current,localVideo:ce.current,remoteVideo:de.current,remoteAudio:se.current})}),[]);var me=t.useState(0),fe=me[0],pe=me[1];t.useEffect((function(){if(B){var e=(new Date).getTime()/1e3-Number(B);e<0&&pe(e)}}),[B]);var ge=function(){return E.default.createElement(n.StyledTimer,{isOpen:A},_&&B&&fe?E.default.createElement(i.default,{date:Number(B)+fe||(new Date).getTime()/1e3,interval:1e3,format:"h:mm:ss",trim:!1,unix:!0,durationFromNow:!0}):E.default.createElement(E.default.Fragment,null,L&&"<unknown>"!==L&&L))},he=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)})),E.default.createElement(S,{ref:i,className:"whitespace-nowrap overflow-hidden"},E.default.createElement("div",{className:"w-fit relative inline-block ".concat(r&&"animate-animated-text"),ref:l},n&&"<unknown>"===n?"PBX":n&&n))};return E.default.createElement("div",{ref:J,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"},(R||k||_||N)&&E.default.createElement(w,e.__assign({className:"font-sans absolute pointer-events-auto overflow-hidden",incoming:R,accepted:_,outgoing:k,isOpen:A,animate:A&&(R||k)&&!_?"openIncoming":A&&_?"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){V.start(e)},onDragStart:function(){ee(!0)},dragTransition:{power:0},initial:{x:(null==U?void 0:U.x)||q,y:(null==U?void 0:U.y)||C},style:{padding:A?"24px":"8px 16px"},dragControls:V,dragConstraints:J,onDragEnd:function(){var e=s.getTranslateValues(G.current),t=e.x,n=e.y;t=function(e){var t=J.current.offsetWidth/2-G.current.offsetWidth/2;return e>0&&e>t?t:e<0&&e<-t?-t:e}(Math.round(t)),n=function(e){var t=J.current.offsetHeight/2-G.current.offsetHeight/2;return e>0&&e>t?t:e<0&&e<-t?-t:e}(Math.round(n)),X({position:{x:t,y:n}}),Y({x:t,y:n})},ref:G},ae),E.default.createElement(n.StyledTopContent,{isOpen:A,incoming:R,accepted:_,outgoing:k},E.default.createElement(h.framerMotion.exports.motion.div,{className:"relative",animate:A?"open":"closed",variants:re},(R||k&&!_)&&E.default.createElement(h.framerMotion.exports.motion.div,{style:{animation:"ping 2s cubic-bezier(0, 0, 0.2, 1) infinite",borderRadius:"4px"},animate:A?"open":"closed",variants:re,className:"rounded-xl bg-white absolute opacity-60 -z-10 top-0 left-0 animate-ping h-12 w-12"}),E.default.createElement(j,{className:"z-10 h-12 w-12 bg-gray-300 rounded-sm",animate:A?"open":"closed",variants:re})),A&&E.default.createElement(b,null,E.default.createElement(he,{displayName:z}),E.default.createElement(ge,null)),!A&&!_&&E.default.createElement(he,{displayName:z}),!A&&_&&E.default.createElement(ge,null),_&&E.default.createElement(h.framerMotion.exports.motion.div,{initial:{opacity:0},animate:{opacity:1}},E.default.createElement(c.AudioBars,{audioStream:ie,size:A?"large":"small"}))),A&&E.default.createElement(h.framerMotion.exports.motion.div,{className:"grid gap-y-5",initial:{opacity:0},animate:{opacity:1}},_&&E.default.createElement("div",{className:"grid grid-cols-4 auto-cols-max gap-y-5 justify-items-center place-items-center justify-center"},E.default.createElement(d.Button,{variant:"default",active:!!F,onClick:function(){return F?m.unpauseCurrentCall():m.pauseCurrentCall()}},F?E.default.createElement(a.FontAwesomeIcon,{size:"xl",icon:r.faPlay}):E.default.createElement(a.FontAwesomeIcon,{size:"xl",icon:f.faPause})),E.default.createElement(d.Button,{variant:"default",active:!!D,onClick:function(){return D?m.unmuteCurrentCall():m.muteCurrentCall()}},D?E.default.createElement(a.FontAwesomeIcon,{size:"xl",icon:r.faMicrophoneSlash}):E.default.createElement(a.FontAwesomeIcon,{size:"xl",icon:f.faMicrophone})),E.default.createElement(d.Button,{variant:"default"},E.default.createElement(a.FontAwesomeIcon,{size:"xl",icon:f.faRightLeft})),E.default.createElement(d.Button,{variant:"default",onClick:function(){te.island.updateIsland({view:"keyboard"!==W?"keyboard":"call"})}},"keyboard"===W?E.default.createElement(g.default,null):E.default.createElement(p.default,null))),E.default.createElement(h.framerMotion.exports.motion.div,{className:"grid ".concat(ne()?"grid-cols-2":_?"grid-cols-1 justify-items-center":"grid-cols-1 justify-items-end"," gap-3.5"),animate:{opacity:1}},E.default.createElement(d.Button,{onClick:function(e){e.stopPropagation(),m.hangupCurrentCall()},variant:"red"},E.default.createElement(a.FontAwesomeIcon,{className:"rotate-135 w-6 h-6",icon:r.faPhone})),ne()&&E.default.createElement(d.Button,{onClick:function(e){m.answerIncomingCall()},variant:"green"},E.default.createElement(a.FontAwesomeIcon,{className:"w-6 h-6",icon:r.faPhone}))))),E.default.createElement("div",{className:"hidden"},E.default.createElement("audio",{autoPlay:!0,ref:ue}),E.default.createElement("audio",{autoPlay:!0,ref:se}),E.default.createElement("video",{muted:!0,autoPlay:!0,ref:ce}),E.default.createElement("video",{autoPlay:!0,ref:de})))};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, Dispatch } 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} from '@nethesis/nethesis-light-svg-icons'\n\nimport PhoneKeyboardLight from '../static/icons/PhoneKeyboardLight'\nimport PhoneKeyboardSolid from '../static/icons/PhoneKeyboardSolid'\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\n const { view } = useSelector((state: RootState) => state.island)\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<Dispatch>()\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 function openKeyboard() {\n dispatch.island.updateIsland({\n view: view !== 'keyboard' ? 'keyboard' : 'call',\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='default' onClick={openKeyboard}>\n {view === 'keyboard' ? <PhoneKeyboardSolid /> : <PhoneKeyboardLight />}\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","view","island","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","updateIsland","PhoneKeyboardSolid","PhoneKeyboardLight","stopPropagation","hangupCurrentCall","faPhone","answerIncomingCall","autoPlay"],"mappings":"4sCA2CMA,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,gBAI1CC,EAASd,eAAY,SAACC,GAAqB,OAAAA,EAAMc,eAEnDC,EAAWC,EAAAA,aAAAA,QAAAA,kBAEXC,EACJC,EAAAA,gBAAgD,eAAgB,MAD3DC,EAAkBF,EAAA,GAAEG,OAGrBC,EAAYC,SAAY,MAExBC,EAAqBD,SAAY,MAEjCE,EAA0B7B,EAAAA,SAC9BwB,GAAsBA,EAAmBM,SAAWN,EAAmBM,SAAW,MAD7EA,EAAQD,EAAA,GAAEE,EAAWF,EAAA,GAItBG,EAAoBhC,EAAAA,UAAkB,GAArCiC,EAAKD,EAAA,GAAEE,GAAQF,EAAA,GAEhBG,GAAWC,EAAAA,cAEjB,SAASC,KACP,OAAQ5B,IAAaD,CACtB,CA+ED,IAAM8B,GAAiBC,EAAAA,cAhEH,WAClBC,QAAQC,IAAI,qBACd,IAEoB,WAClBvC,GAAWD,EACb,GA0D8DgC,GAR9D,WACEC,IAAS,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,GAAgClD,EAAAA,SAA6B,MAA5DmD,GAAWD,GAAA,GAAEE,GAAcF,GAAA,GAElCG,EAAAA,WAAU,WACR,SAASC,IACPrC,SAAAA,EAAkBsC,iBAAiB,QAAQ,WACrCC,UAAUC,UAAUC,QAAQ,YAAc,EAE5CN,GAAenC,EAAiB0C,oBAGhCP,GAAenC,EAAiB2C,gBAEpC,GACD,CAED,OADAN,IACO,WACLrC,SAAAA,EAAkB4C,oBAAoB,OAAQP,EAChD,CACF,GAAG,CAACrC,IAEJ,IAAM6C,GAAanC,SAAyB,MACtCoC,GAAcpC,SAAyB,MACvCqC,GAAarC,SAAyB,MACtCsC,GAActC,SAAyB,MAE7CuC,EAAAA,2BAA0B,WACxB/B,GAASnB,OAAOmD,aAAa,CAC3BL,WAAYA,GAAWM,QACvBJ,WAAYA,GAAWI,QACvBH,YAAaA,GAAYG,QACzBL,YAAaA,GAAYK,SAE5B,GAAE,IAGG,IAAAC,GAAwDrE,EAAAA,SAAiB,GAAxEsE,GAAuBD,GAAA,GAAEE,GAA0BF,GAAA,GAE1DhB,EAAAA,WAAU,WAER,GAAIzC,EAAW,CACb,IAAM4D,GAAa,IAAIC,MAAOC,UAAY,IAAOC,OAAO/D,GACpD4D,EAAa,GACfD,GAA2BC,EAE9B,CACH,GAAG,CAAC5D,IAEJ,IAAMgE,GAAoB,WAAM,OAC9BC,EAAAA,sBAACC,cAAW,CAAC7E,OAAQA,GAClBO,GAAYI,GAAa0D,GACxBO,EAAAA,QAACE,cAAAC,UACC,CAAAC,KAAMN,OAAO/D,GAAa0D,KAA2B,IAAIG,MAAOC,UAAY,IAC5EQ,SAAU,IACVC,OAAO,UACPC,MAAM,EACNC,QACAC,iBAAe,IAGjBT,EAAG,QAAAE,cAAAF,EAAAA,QAAAU,SAAA,KAAA5E,GAAqB,cAAXA,GAA0BA,GAG5C,EAMK6E,GAAoC,SAAC3F,GAAE,IAAAa,EAAWb,EAAAa,YAChDX,EAAgCC,EAAAA,UAAkB,GAAjDyF,EAAW1F,EAAA,GAAE2F,EAAc3F,EAAA,GAC5B4F,EAAgBhE,SAA8B,MAC9CiE,EAAWjE,SAA8B,MAY/C,OAVAkE,EAAAA,iBAAgB,WAEZF,EAAcvB,SACdwB,EAASxB,SACTwB,EAASxB,QAAQ0B,YAAcH,EAAcvB,QAAQ0B,YAAc,GAEnEJ,GAAe,EAEnB,IAGEb,EAAAA,QAACE,cAAAtF,EAAW,CAAAsG,IAAKJ,EAAeK,UAAU,sCACxCnB,UAAAE,cAAA,MAAA,CACEiB,UAAW,+BAA+BC,OAAAR,GAAe,yBACzDM,IAAKH,GAEJlF,GAA+B,cAAhBA,EAA8B,MAAQA,GAAeA,GAI7E,EAQA,OACEmE,EAAAA,6BACEkB,IAAKnE,EACLoE,UAAU,kKAERzF,GAAYE,GAAYD,GAAYV,IACpC+E,wBAAC3F,EAAiBgH,EAAAA,SAAA,CAChBF,UAAU,yDACVzF,SAAUA,EACVC,SAAUA,EACVC,SAAUA,EACVR,OAAQA,EACRkG,QACElG,IAAWM,GAAYE,KAAcD,EACjC,eACAP,GAAUO,EACV,eACA,SAEN4F,SAvJS,CACfC,aAAc,CACZvD,MAAO,QACPC,OAAQ,OACRC,aAAc,QAEhBsD,aAAc,CACZxD,MAAO,QACPC,OAAQ,QACRC,aAAc,QAEhBC,OAAQ,CACNH,MAAO,QACPC,OAAQ,OACRC,aAAc,SA0IVuD,MAAI,EACJC,cA3OR,SAAmBC,GACjBrF,EAASsF,MAAMD,EAChB,EA0OOE,YAnKR,WACEzE,IAAS,EACV,EAkKO0E,eAAgB,CACdC,MAAO,GAETC,QAAS,CACPC,GAAGjF,aAAQ,EAARA,EAAUiF,IAAKpH,EAClBqH,GAAGlF,aAAQ,EAARA,EAAUkF,IAAKrH,GAEpBsH,MAAO,CACLC,QAASjH,EAAS,OAAS,YAE7BkH,aAAc/F,EACdgG,gBAAiBxF,EACjByF,UA1MU,WAEZ,IAAAxH,EAAgByH,EAAAA,mBAAmB5F,EAAU0C,SAA3C2C,EAAClH,EAAAkH,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,EAuLQjB,IAAKrE,GACDY,IAEJuC,EAAAA,QAAAE,cAACgD,mBACC,CAAA9H,OAAQA,EACRM,SAAUA,EACVC,SAAUA,EACVC,SAAUA,GAEVoE,EAAAA,QAACE,cAAA5F,EAAAA,aAAAA,QAAAA,OAAO6I,IAAG,CACThC,UAAU,WACVG,QAASlG,EAAS,OAAS,SAC3BmG,SAAUxD,KAERrC,GAAaE,IAAaD,IAE1BqE,EAAAA,QAAAE,cAAC5F,EAAAA,aAAAA,QAAAA,OAAO6I,IAAG,CACTf,MAAO,CACLgB,UAAW,8CACXjF,aAAc,OAEhBmD,QAASlG,EAAS,OAAS,SAC3BmG,SAAUxD,GACVoD,UAAW,sFAGfnB,EAAAA,QAACE,cAAA1F,GACC2G,UAAU,wCACVG,QAASlG,EAAS,OAAS,SAC3BmG,SAAUxD,MAGb3C,GACC4E,EAAA,QAAAE,cAACxF,EAAa,KACZsF,EAAAA,QAAAE,cAACS,GAAW,CAAC9E,YAAaA,IAE1BmE,EAAAA,QAACE,cAAAH,GAAgB,QAInB3E,IAAWO,GAAYqE,EAAC,QAAAE,cAAAS,GAAY,CAAA9E,YAAaA,KAEjDT,GAAUO,GAAYqE,EAAAA,QAAAE,cAACH,GAAgB,MACxCpE,GACCqE,EAAAA,QAACE,cAAA5F,EAAAA,aAAAA,QAAAA,OAAO6I,IAAG,CAAClB,QAAS,CAAEoB,QAAS,GAAK/B,QAAS,CAAE+B,QAAS,IACvDrD,EAAAA,QAACE,cAAAoD,aAAUhF,YAAaA,GAAaiF,KAAMnI,EAAS,QAAU,YAInEA,GACC4E,EAAA,QAAAE,cAAC5F,EAAMkJ,aAAAC,QAAAnJ,OAAC6I,IAAI,CAAAhC,UAAU,eAAec,QAAS,CAAEoB,QAAS,GAAK/B,QAAS,CAAE+B,QAAS,IAC/E1H,GACCqE,EAAK,QAAAE,cAAA,MAAA,CAAAiB,UAAU,iGACbnB,EAAA,QAAAE,cAACwD,SAAM,CACLC,QAAQ,UACRC,SAAQ3H,EACR4H,QAAS,WAAM,OAAC5H,EAAS6H,EAAAA,qBAAuBC,EAAAA,qBAE/C9H,EACC+D,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,SAAQ5H,EACR6H,QAAS,WAAM,OAAC7H,EAAQoI,EAAAA,oBAAsBC,EAAAA,oBAE7CrI,EACCgE,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,UAACE,cAAAwD,EAAAA,OAAO,CAAAC,QAAQ,UAAUE,QAxH1C,WACEvG,GAAShB,OAAOoI,aAAa,CAC3BrI,KAAe,aAATA,EAAsB,WAAa,QAE5C,GAqH2B,aAATA,EAAsB2D,EAAAA,QAAAE,cAACyE,UAAkB,MAAM3E,EAAAA,QAAAE,cAAC0E,EAAkB,QAAA,QAIzE5E,UAACE,cAAA5F,EAAAA,aAAAA,QAAAA,OAAO6I,IAAG,CACThC,UAAW,QAAAC,OACT5D,KACI,cACA7B,EACA,mCACA,gCAA+B,YAErC2F,QAAS,CAAE+B,QAAS,IAEpBrD,EAAC,QAAAE,cAAAwD,UAAOG,QA/UtB,SAAsBjC,GACpBA,EAAMiD,kBACNC,EAAAA,mBACD,EA4U4CnB,QAAQ,OACrC3D,UAACE,cAAA8D,EAAAA,gBAAgB,CAAA7C,UAAU,qBAAqB8C,KAAMc,EAAOA,WAE9DvH,MACCwC,EAAA,QAAAE,cAACwD,EAAAA,OAAM,CAACG,QAvVxB,SAAsBjC,GACpBoD,EAAAA,oBACD,EAqV8CrB,QAAQ,SACrC3D,EAAAA,QAAAE,cAAC8D,kBAAgB,CAAA7C,UAAU,UAAU8C,KAAMc,EAAAA,cAQzD/E,EAAAA,QAAKE,cAAA,MAAA,CAAAiB,UAAU,UACbnB,EAAA,QAAAE,cAAA,QAAA,CAAO+E,UAAQ,EAAC/D,IAAKjC,KACrBe,EAAA,QAAAE,cAAA,QAAA,CAAO+E,UAAQ,EAAC/D,IAAKhC,KACrBc,UAAOE,cAAA,QAAA,CAAAlE,OAAO,EAAMiJ,UAAS,EAAA/D,IAAK/B,KAClCa,UAAOE,cAAA,QAAA,CAAA+E,YAAS/D,IAAK9B,MAI7B,EAEArE,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}
|
package/dist/models/index.d.ts
CHANGED
|
@@ -4,11 +4,13 @@ import { webrtc } from './webrtc';
|
|
|
4
4
|
import { currentCall } from './currentCall';
|
|
5
5
|
import { currentUser } from './currentUser';
|
|
6
6
|
import { fetchDefaults } from './fetchDefaults';
|
|
7
|
+
import { island } from './island';
|
|
7
8
|
export interface RootModel extends Models<RootModel> {
|
|
8
9
|
player: typeof player;
|
|
9
10
|
webrtc: typeof webrtc;
|
|
10
11
|
currentCall: typeof currentCall;
|
|
11
12
|
currentUser: typeof currentUser;
|
|
12
13
|
fetchDefaults: typeof fetchDefaults;
|
|
14
|
+
island: typeof island;
|
|
13
15
|
}
|
|
14
16
|
export declare const models: RootModel;
|
package/dist/models/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./player.js"),r=require("./webrtc.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./player.js"),r=require("./webrtc.js"),s=require("./currentCall.js"),t=require("./currentUser.js"),l=require("./fetchDefaults.js"),u=require("./island.js"),a={player:e.player,webrtc:r.webrtc,currentCall:s.currentCall,currentUser:t.currentUser,fetchDefaults:l.fetchDefaults,island:u.island};exports.models=a;
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
package/dist/models/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../src/models/index.ts"],"sourcesContent":["import { Models } from '@rematch/core'\nimport { player } from './player'\nimport { webrtc } from './webrtc'\nimport { currentCall } from './currentCall'\nimport { currentUser } from './currentUser'\nimport { fetchDefaults } from './fetchDefaults'\n\nexport interface RootModel extends Models<RootModel> {\n player: typeof player\n webrtc: typeof webrtc\n currentCall: typeof currentCall\n currentUser: typeof currentUser\n fetchDefaults: typeof fetchDefaults\n}\n\nexport const models: RootModel = {\n player,\n webrtc,\n currentCall,\n currentUser,\n fetchDefaults\n}\n"],"names":["models","player","webrtc","currentCall","currentUser","fetchDefaults"],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../src/models/index.ts"],"sourcesContent":["import { Models } from '@rematch/core'\nimport { player } from './player'\nimport { webrtc } from './webrtc'\nimport { currentCall } from './currentCall'\nimport { currentUser } from './currentUser'\nimport { fetchDefaults } from './fetchDefaults'\nimport { island } from './island'\n\nexport interface RootModel extends Models<RootModel> {\n player: typeof player\n webrtc: typeof webrtc\n currentCall: typeof currentCall\n currentUser: typeof currentUser\n fetchDefaults: typeof fetchDefaults\n island: typeof island\n}\n\nexport const models: RootModel = {\n player,\n webrtc,\n currentCall,\n currentUser,\n fetchDefaults,\n island\n}\n"],"names":["models","player","webrtc","currentCall","currentUser","fetchDefaults","island"],"mappings":"+OAiBaA,EAAoB,CAC/BC,OAAMA,EAAAA,OACNC,OAAMA,EAAAA,OACNC,YAAWA,EAAAA,YACXC,YAAWA,EAAAA,YACXC,cAAaA,EAAAA,cACbC,OAAMA,EAAAA"}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import type { RootModel } from '.';
|
|
2
|
+
interface IslandTypes {
|
|
3
|
+
view?: 'call' | 'keyboard' | 'player';
|
|
4
|
+
}
|
|
5
|
+
export declare const island: {
|
|
6
|
+
name?: string | undefined;
|
|
7
|
+
state: IslandTypes;
|
|
8
|
+
} & ({} | {
|
|
9
|
+
effects: import("@rematch/core").ModelEffects<RootModel>;
|
|
10
|
+
} | {
|
|
11
|
+
effects: import("@rematch/core").ModelEffectsCreator<RootModel>;
|
|
12
|
+
}) & {
|
|
13
|
+
reducers: {
|
|
14
|
+
updateIsland: (state: IslandTypes, payload: IslandTypes) => {
|
|
15
|
+
view?: "player" | "call" | "keyboard" | undefined;
|
|
16
|
+
};
|
|
17
|
+
};
|
|
18
|
+
} & ({} | {
|
|
19
|
+
baseReducer: import("redux").Reducer<IslandTypes, import("redux").AnyAction>;
|
|
20
|
+
});
|
|
21
|
+
export {};
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../node_modules/tslib/tslib.es6.js"),s=require("../node_modules/@rematch/core/dist/core.esm.js").createModel()({state:{},reducers:{updateIsland:function(s,r){return e.__assign(e.__assign({},s),r)}}});exports.island=s;
|
|
2
|
+
//# sourceMappingURL=island.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"island.js","sources":["../../src/models/island.ts"],"sourcesContent":["// Copyright (C) 2022 Nethesis S.r.l.\n// SPDX-License-Identifier: AGPL-3.0-or-later\n\nimport { createModel } from '@rematch/core'\nimport type { RootModel } from '.'\n\ninterface IslandTypes {\n view?: 'call' | 'keyboard' | 'player'\n}\n\nconst defaultState: IslandTypes = {}\n\nexport const island = createModel<RootModel>()({\n state: defaultState,\n reducers: {\n updateIsland: (state, payload: IslandTypes) => {\n return {\n ...state,\n ...payload,\n }\n },\n },\n})\n"],"names":["island","createModel","state","reducers","updateIsland","payload","__assign"],"mappings":"wHAYaA,4DAAoBC,aAAXA,CAAyB,CAC7CC,MAHgC,CAAA,EAIhCC,SAAU,CACRC,aAAc,SAACF,EAAOG,GACpB,OACKC,EAAAA,SAAAA,EAAAA,SAAA,CAAA,EAAAJ,GACAG,EAEN"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});exports.faMicrophone={prefix:"fal",iconName:"microphone",icon:[384,512,[],"f130","M336 192C327.2 192 320 199.2 320 208V256c0 73.5-62.25 132.6-136.8 127.8C115.3 379.1 64 319.6 64 251.5V208C64 199.2 56.8 192 48 192S32 199.2 32 208v42.38c0 83.38 61.63 156.1 144 164.4V480h-64C103.2 480 96 487.2 96 496C96 504.8 103.2 512 112 512h160c8.801 0 16-7.201 16-16c0-8.801-7.199-16-16-16h-64v-65C288.8 406.9 352 338.8 352 256V208C352 199.2 344.8 192 336 192zM192 352c53 0 96-43 96-96v-160c0-52.1-43-96-96-96s-96 43-96 96v160C96 309 139 352 192 352zM128 96c0-35.25 28.75-64 64-64s64 28.75 64 64v160c0 35.25-28.75 64-64 64S128 291.3 128 256V96z"]},exports.faPause={prefix:"fal",iconName:"pause",icon:[320,512,[9208],"f04c","M48 63.1C39.16 63.1 32 71.16 32 80v352C32 440.8 39.16 448 48 448S64 440.8 64 432v-352C64 71.16 56.84 63.1 48 63.1zM272 63.1c-8.836 0-16 7.162-16 16v352c0 8.836 7.164 16 16 16s16-7.164 16-16v-352C288 71.16 280.8 63.1 272 63.1z"]},exports.faRightLeft={prefix:"fal",iconName:"right-left",icon:[512,512,["exchange-alt"],"f362","M16 144H352l-.0264 88c0 9.547 5.66 18.19 14.41 22c8.75 3.812 18.94 2.078 25.93-4.406l112-104C509.4 140.8 512 134.4 512 127.1s-2.559-12.83-7.674-17.58l-112-104c-6.984-6.484-17.18-8.221-25.93-4.408s-14.41 12.46-14.41 22L352 112H16C7.156 112 0 119.2 0 127.1S7.156 144 16 144zM384 42.34l92.25 85.66L384 213.7V42.34zM496 367.1H160l.0264-87.1c0-9.547-5.66-18.19-14.41-22S126.7 255.9 119.7 262.4l-112 104C2.559 371.2 0 377.6 0 383.1s2.559 12.85 7.674 17.6l112 104c6.984 6.484 17.18 8.218 25.93 4.406C154.4 506.2 160 497.5 160 488L160 399.1h336c8.844 0 16-7.156 16-15.1S504.8 367.1 496 367.1zM128 469.7L35.75 384L128 298.3V469.7z"]};
|
|
2
|
+
//# sourceMappingURL=index.mjs.js.map
|