@100mslive/roomkit-react 0.3.22-alpha.1 → 0.3.22-alpha.3

package/dist/chunk-QHQKY35W.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../src/Prebuilt/components/Footer/ParticipantList.tsx", "../src/Prebuilt/components/RemoveParticipant.tsx", "../src/Prebuilt/components/Footer/RoleAccordion.tsx", "../src/Prebuilt/components/Footer/RoleOptions.tsx", "../src/Prebuilt/components/hooks/useGroupOnStageActions.tsx", "../src/Prebuilt/components/hooks/usePeerOnStageActions.tsx"],
+  "sourcesContent": ["import React, { Fragment, useCallback, useState } from 'react';\nimport { useDebounce, useMedia } from 'react-use';\nimport {\n  HMSPeer,\n  HMSPeerType,\n  HMSRoleName,\n  selectAvailableRoleNames,\n  selectHandRaisedPeers,\n  selectHasPeerHandRaised,\n  selectIsLargeRoom,\n  selectIsPeerAudioEnabled,\n  selectLocalPeerID,\n  selectPeerCount,\n  selectPermissions,\n  useHMSStore,\n} from '@100mslive/react-sdk';\nimport {\n  AddIcon,\n  CallIcon,\n  ChangeRoleIcon,\n  CrossIcon,\n  HandIcon,\n  MicOffIcon,\n  PeopleIcon,\n  PersonSettingsIcon,\n  SearchIcon,\n  VerticalMenuIcon,\n} from '@100mslive/react-icons';\nimport { Accordion, Box, Button, config as cssConfig, Dropdown, Flex, Input, Text, textEllipsis } from '../../..';\n// @ts-ignore: No implicit Any\nimport IconButton from '../../IconButton';\nimport { ConnectionIndicator } from '../Connection/ConnectionIndicator';\nimport { RemoveParticipant } from '../RemoveParticipant';\nimport { RoleChangeModal } from '../RoleChangeModal';\nimport { RoleAccordion } from './RoleAccordion';\nimport { useRoomLayoutConferencingScreen } from '../../provider/roomLayoutProvider/hooks/useRoomLayoutScreen';\n// @ts-ignore: No implicit Any\nimport { useIsSidepaneTypeOpen, useSidepaneToggle } from '../AppData/useSidepane';\nimport { useSidepaneResetOnLayoutUpdate } from '../AppData/useSidepaneResetOnLayoutUpdate';\nimport { usePeerOnStageActions } from '../hooks/usePeerOnStageActions';\nimport { useParticipants } from '../../common/hooks';\n// @ts-ignore: No implicit Any\nimport { getFormattedCount } from '../../common/utils';\nimport { SIDE_PANE_OPTIONS } from '../../common/constants';\n\nexport const ParticipantList = ({\n  offStageRoles = [],\n  onActive,\n}: {\n  offStageRoles: HMSRoleName[];\n  onActive: (role: string) => void;\n}) => {\n  const [filter, setFilter] = useState<{ search?: string } | undefined>();\n  const { participants, isConnected, peerCount } = useParticipants(filter);\n  const isLargeRoom = useHMSStore(selectIsLargeRoom);\n  const peersOrderedByRoles: Record<string, HMSPeer[]> = {};\n\n  const handRaisedPeers = useHMSStore(selectHandRaisedPeers);\n\n  participants.forEach(participant => {\n    if (participant.roleName) {\n      if (peersOrderedByRoles[participant.roleName] === undefined) {\n        peersOrderedByRoles[participant.roleName] = [];\n      }\n      peersOrderedByRoles[participant.roleName].push(participant);\n    }\n  });\n\n  // prefill off_stage roles of large rooms to load more peers\n  if (isLargeRoom) {\n    offStageRoles.forEach(role => {\n      if (!peersOrderedByRoles[role]) {\n        peersOrderedByRoles[role] = [];\n      }\n    });\n  }\n\n  useSidepaneResetOnLayoutUpdate('participant_list', SIDE_PANE_OPTIONS.PARTICIPANTS);\n\n  const onSearch = useCallback((value: string) => {\n    setFilter(filterValue => {\n      if (!filterValue) {\n        filterValue = {};\n      }\n      filterValue.search = value.toLowerCase();\n      return { ...filterValue };\n    });\n  }, []);\n\n  if (peerCount === 0) {\n    return null;\n  }\n\n  return (\n    <Fragment>\n      <Flex\n        direction=\"column\"\n        css={{\n          size: '100%',\n          gap: '$4',\n        }}\n      >\n        {!filter?.search && participants.length === 0 ? null : <ParticipantSearch onSearch={onSearch} inSidePane />}\n        <VirtualizedParticipants\n          peersOrderedByRoles={peersOrderedByRoles}\n          handRaisedList={handRaisedPeers}\n          isConnected={!!isConnected}\n          filter={filter}\n          offStageRoles={offStageRoles}\n          isLargeRoom={isLargeRoom}\n          onActive={onActive}\n        >\n          {participants.length === 0 ? (\n            <Flex\n              align=\"center\"\n              justify=\"center\"\n              className=\"emptyParticipants\"\n              css={{ w: '100%', p: '$8 0', display: 'none' }}\n            >\n              <Text variant=\"sm\">{!filter ? 'No participants' : 'No matching participants'}</Text>\n            </Flex>\n          ) : null}\n        </VirtualizedParticipants>\n      </Flex>\n    </Fragment>\n  );\n};\n\nexport const ParticipantCount = () => {\n  const peerCount = useHMSStore(selectPeerCount);\n  const toggleSidepane = useSidepaneToggle(SIDE_PANE_OPTIONS.PARTICIPANTS);\n  const isPeerListOpen = useIsSidepaneTypeOpen(SIDE_PANE_OPTIONS.PARTICIPANTS);\n\n  if (peerCount === 0) {\n    return null;\n  }\n  return (\n    <IconButton\n      css={{\n        w: 'auto',\n        p: '$4',\n        h: 'auto',\n        bg: isPeerListOpen ? '$surface_brighter' : '',\n      }}\n      onClick={() => {\n        if (peerCount > 0) {\n          toggleSidepane();\n        }\n      }}\n      data-testid=\"participant_list\"\n    >\n      <PeopleIcon />\n      <Text variant=\"sm\" css={{ mx: '$4', c: 'inherit' }}>\n        {getFormattedCount(peerCount)}\n      </Text>\n    </IconButton>\n  );\n};\n\nexport const Participant = ({\n  peer,\n  isConnected,\n  isHandRaisedAccordion,\n  style,\n}: {\n  peer: HMSPeer;\n  isConnected: boolean;\n  isHandRaisedAccordion?: boolean;\n  style: React.CSSProperties;\n}) => {\n  const localPeerId = useHMSStore(selectLocalPeerID);\n  return (\n    <Flex\n      key={peer.id}\n      css={{\n        w: '100%',\n        p: '$4 $8',\n        pr: '$6',\n        h: '$16',\n        '&:hover .participant_item': { display: 'flex' },\n      }}\n      align=\"center\"\n      justify=\"between\"\n      data-testid={'participant_' + peer.name}\n      style={style}\n    >\n      <Text\n        variant=\"sm\"\n        css={{ ...textEllipsis('100%'), flex: '1 1 0', mr: '$8', fontWeight: '$semiBold', color: '$on_surface_high' }}\n      >\n        {peer.name} {localPeerId === peer.id ? '(You)' : ''}\n      </Text>\n      {isConnected && peer.roleName ? (\n        <ParticipantActions\n          peerId={peer.id}\n          peerType={peer.type}\n          role={peer.roleName}\n          isHandRaisedAccordion={isHandRaisedAccordion}\n        />\n      ) : null}\n    </Flex>\n  );\n};\n\nconst VirtualizedParticipants = ({\n  peersOrderedByRoles = {},\n  isConnected,\n  filter,\n  handRaisedList = [],\n  offStageRoles,\n  isLargeRoom,\n  onActive,\n  children,\n}: {\n  peersOrderedByRoles: Record<string, HMSPeer[]>;\n  isConnected: boolean;\n  filter: undefined | { search?: string };\n  handRaisedList: HMSPeer[];\n  offStageRoles: HMSRoleName[];\n  isLargeRoom: boolean;\n  onActive: (role: string) => void;\n  children: React.ReactNode;\n}) => {\n  return (\n    <Flex\n      direction=\"column\"\n      css={{\n        gap: '$8',\n        overflowY: 'auto',\n        overflowX: 'hidden',\n        pr: '$10',\n        mr: '-$10',\n        flex: '1 1 0',\n        '& > div:empty ~ .emptyParticipants': {\n          display: 'flex',\n        },\n      }}\n    >\n      <Accordion.Root type={isLargeRoom ? 'single' : 'multiple'} collapsible>\n        {handRaisedList.length > 0 ? (\n          <RoleAccordion\n            peerList={handRaisedList}\n            roleName=\"Hand Raised\"\n            filter={filter}\n            isConnected={isConnected}\n            isHandRaisedAccordion\n            offStageRoles={offStageRoles}\n          />\n        ) : null}\n        {Object.keys(peersOrderedByRoles).map(role => (\n          <RoleAccordion\n            key={role}\n            peerList={peersOrderedByRoles[role]}\n            roleName={role}\n            isConnected={isConnected}\n            filter={filter}\n            offStageRoles={offStageRoles}\n            onActive={onActive}\n          />\n        ))}\n      </Accordion.Root>\n      {children}\n    </Flex>\n  );\n};\n\n/**\n * shows settings to change for a participant like changing their role\n */\nconst ParticipantActions = React.memo(\n  ({\n    peerId,\n    peerType,\n    role,\n    isHandRaisedAccordion,\n  }: {\n    peerId: string;\n    role: string;\n    isHandRaisedAccordion?: boolean;\n    peerType: HMSPeerType;\n  }) => {\n    const isHandRaised = useHMSStore(selectHasPeerHandRaised(peerId));\n    const canChangeRole = useHMSStore(selectPermissions)?.changeRole;\n    const canRemoveOthers = useHMSStore(selectPermissions)?.removeOthers;\n    const { elements } = useRoomLayoutConferencingScreen();\n    const { on_stage_exp } = elements || {};\n    const shouldShowMoreActions = (on_stage_exp && canChangeRole) || canRemoveOthers;\n    const isAudioMuted = !useHMSStore(selectIsPeerAudioEnabled(peerId));\n\n    return (\n      <Flex\n        align=\"center\"\n        css={{\n          flexShrink: 0,\n          gap: '$8',\n        }}\n      >\n        {isHandRaisedAccordion ? (\n          <HandRaisedAccordionParticipantActions peerId={peerId} role={role} />\n        ) : (\n          <>\n            <ConnectionIndicator peerId={peerId} />\n            {peerType === HMSPeerType.SIP && (\n              <Flex\n                align=\"center\"\n                justify=\"center\"\n                css={{ p: '$1', c: '$on_surface_high', bg: '$surface_bright', borderRadius: '$round' }}\n              >\n                <CallIcon width={19} height={19} />\n              </Flex>\n            )}\n            {isHandRaised && (\n              <Flex\n                align=\"center\"\n                justify=\"center\"\n                css={{ p: '$1', c: '$on_surface_high', bg: '$surface_bright', borderRadius: '$round' }}\n              >\n                <HandIcon height={19} width={19} />\n              </Flex>\n            )}\n            {isAudioMuted ? (\n              <Flex\n                align=\"center\"\n                justify=\"center\"\n                css={{ p: '$2', c: '$on_surface_high', bg: '$surface_bright', borderRadius: '$round' }}\n              >\n                <MicOffIcon height={19} width={19} />\n              </Flex>\n            ) : null}\n\n            {shouldShowMoreActions ? <ParticipantMoreActions peerId={peerId} role={role} /> : null}\n          </>\n        )}\n      </Flex>\n    );\n  },\n);\n\nconst quickActionStyle = { p: '$1', borderRadius: '$round' };\nconst HandRaisedAccordionParticipantActions = ({ peerId, role }: { peerId: string; role: string }) => {\n  const { handleStageAction, lowerPeerHand, shouldShowStageRoleChange, isInStage } = usePeerOnStageActions({\n    peerId,\n    role,\n  });\n  if (!shouldShowStageRoleChange) {\n    return null;\n  }\n  return (\n    <>\n      <Button variant=\"standard\" css={quickActionStyle} onClick={lowerPeerHand}>\n        <CrossIcon height={18} width={18} />\n      </Button>\n      {!isInStage && (\n        <Button variant=\"primary\" onClick={handleStageAction} css={quickActionStyle}>\n          <AddIcon height={18} width={18} />\n        </Button>\n      )}\n    </>\n  );\n};\n\nconst ParticipantMoreActions = ({ peerId, role }: { peerId: string; role: string }) => {\n  const {\n    open,\n    setOpen,\n    bring_to_stage_label,\n    remove_from_stage_label,\n    handleStageAction,\n    isInStage,\n    shouldShowStageRoleChange,\n  } = usePeerOnStageActions({ peerId, role });\n  const canChangeRole = !!useHMSStore(selectPermissions)?.changeRole;\n  const [openRoleChangeModal, setOpenRoleChangeModal] = useState(false);\n  const roles = useHMSStore(selectAvailableRoleNames);\n\n  return (\n    <>\n      <Dropdown.Root open={open} onOpenChange={value => setOpen(value)} modal={false}>\n        <Dropdown.Trigger\n          asChild\n          data-testid=\"participant_more_actions\"\n          className=\"participant_item\"\n          css={{\n            p: '$1',\n            r: '$0',\n            c: '$on_surface_high',\n            display: open ? 'flex' : 'none',\n            '&:hover': {\n              bg: '$surface_bright',\n            },\n            '@md': {\n              display: 'flex',\n            },\n          }}\n          tabIndex={0}\n        >\n          <Box css={{ my: 'auto' }}>\n            <VerticalMenuIcon />\n          </Box>\n        </Dropdown.Trigger>\n        <Dropdown.Portal>\n          <Dropdown.Content align=\"end\" sideOffset={8} css={{ w: '$64', bg: '$surface_default' }}>\n            {shouldShowStageRoleChange ? (\n              <Dropdown.Item css={{ bg: '$surface_default' }} onClick={() => handleStageAction()}>\n                <ChangeRoleIcon />\n                <Text variant=\"sm\" css={{ ml: '$4', fontWeight: '$semiBold', c: '$on_surface_high' }}>\n                  {isInStage ? remove_from_stage_label : bring_to_stage_label}\n                </Text>\n              </Dropdown.Item>\n            ) : null}\n\n            {canChangeRole && roles.length > 1 ? (\n              <Dropdown.Item css={{ bg: '$surface_default' }} onClick={() => setOpenRoleChangeModal(true)}>\n                <PersonSettingsIcon />\n                <Text variant=\"sm\" css={{ ml: '$4', fontWeight: '$semiBold', c: '$on_surface_high' }}>\n                  Switch Role\n                </Text>\n              </Dropdown.Item>\n            ) : null}\n            <RemoveParticipant peerId={peerId} />\n          </Dropdown.Content>\n        </Dropdown.Portal>\n      </Dropdown.Root>\n      {openRoleChangeModal && <RoleChangeModal peerId={peerId} onOpenChange={setOpenRoleChangeModal} />}\n    </>\n  );\n};\n\nexport const ParticipantSearch = ({\n  onSearch,\n  placeholder = 'Search for participants',\n  inSidePane = false,\n}: {\n  inSidePane?: boolean;\n  placeholder?: string;\n  onSearch: (val: string) => void;\n}) => {\n  const [value, setValue] = React.useState('');\n  const isMobile = useMedia(cssConfig.media.md);\n\n  useDebounce(\n    () => {\n      onSearch(value);\n    },\n    300,\n    [value, onSearch],\n  );\n\n  return (\n    <Flex\n      align=\"center\"\n      css={{\n        p: isMobile ? '0' : '$2 0',\n        mb: '$2',\n        position: 'relative',\n        color: '$on_surface_medium',\n        mt: inSidePane ? '$4' : '',\n      }}\n      onClick={e => e.stopPropagation()}\n    >\n      <SearchIcon style={{ position: 'absolute', left: '0.5rem' }} />\n      <Input\n        type=\"text\"\n        placeholder={placeholder}\n        css={{ w: '100%', p: '$6', pl: '$14', bg: inSidePane ? '$surface_default' : '$surface_dim' }}\n        value={value}\n        onKeyDown={event => {\n          event.stopPropagation();\n        }}\n        onChange={event => {\n          setValue(event.currentTarget.value);\n        }}\n        autoComplete=\"off\"\n        aria-autocomplete=\"none\"\n      />\n    </Flex>\n  );\n};\n", "import React from 'react';\nimport { HMSPeerID, selectLocalPeerID, selectPermissions, useHMSActions, useHMSStore } from '@100mslive/react-sdk';\nimport { PeopleRemoveIcon } from '@100mslive/react-icons';\n// @ts-ignore: No implicit Any\nimport { ToastManager } from './Toast/ToastManager';\nimport { Dropdown } from '../../Dropdown';\nimport { Text } from '../../Text';\n\nexport const RemoveParticipant = ({ peerId }: { peerId: HMSPeerID }) => {\n  const canRemoveOthers = useHMSStore(selectPermissions)?.removeOthers;\n  const localPeerId = useHMSStore(selectLocalPeerID);\n  const actions = useHMSActions();\n\n  if (peerId === localPeerId || !canRemoveOthers) {\n    return null;\n  }\n  return (\n    <Dropdown.Item\n      css={{ color: '$alert_error_default', bg: '$surface_default' }}\n      onClick={async () => {\n        try {\n          await actions.removePeer(peerId, '');\n        } catch (error) {\n          const ex = error as Error;\n          ToastManager.addToast({ title: ex.message, variant: 'error' });\n        }\n      }}\n    >\n      <PeopleRemoveIcon />\n      <Text variant=\"sm\" css={{ ml: '$4', color: 'inherit', fontWeight: '$semiBold' }}>\n        Remove Participant\n      </Text>\n    </Dropdown.Item>\n  );\n};\n", "import React, { useEffect } from 'react';\nimport { useMeasure } from 'react-use';\nimport { FixedSizeList } from 'react-window';\nimport { HMSPeer, selectIsLargeRoom, useHMSStore, usePaginatedParticipants } from '@100mslive/react-sdk';\nimport { AddIcon, ChevronRightIcon, CrossIcon } from '@100mslive/react-icons';\nimport { Accordion } from '../../../Accordion';\nimport { Button } from '../../../Button';\nimport { HorizontalDivider } from '../../../Divider';\nimport { Flex } from '../../../Layout';\nimport { Text } from '../../../Text';\nimport { Participant } from './ParticipantList';\nimport { RoleOptions } from './RoleOptions';\nimport { useGroupOnStageActions } from '../hooks/useGroupOnStageActions';\n// @ts-ignore: No implicit Any\nimport { getFormattedCount } from '../../common/utils';\n\nexport const ROW_HEIGHT = 50;\nconst ITER_TIMER = 5000;\n\nexport interface ItemData {\n  peerList: HMSPeer[];\n  isHandRaisedAccordion?: boolean;\n  isConnected: boolean;\n}\n\nexport function itemKey(index: number, data: ItemData) {\n  return data.peerList[index]?.id;\n}\n\nexport const VirtualizedParticipantItem = React.memo(\n  ({ index, data, style }: { index: number; data: ItemData; style: React.CSSProperties }) => {\n    return (\n      <Participant\n        key={data.peerList[index].id}\n        peer={data.peerList[index]}\n        isHandRaisedAccordion={data.isHandRaisedAccordion}\n        isConnected={data.isConnected}\n        style={style}\n      />\n    );\n  },\n);\n\nexport const RoleAccordion = ({\n  peerList = [],\n  roleName,\n  isConnected,\n  filter,\n  isHandRaisedAccordion = false,\n  offStageRoles,\n  onActive,\n}: ItemData & {\n  roleName: string;\n  isHandRaisedAccordion?: boolean;\n  filter?: { search?: string };\n  offStageRoles: string[];\n  onActive?: (role: string) => void;\n}) => {\n  const [ref, { width }] = useMeasure<HTMLDivElement>();\n  const isLargeRoom = useHMSStore(selectIsLargeRoom);\n  const { peers, total, loadPeers } = usePaginatedParticipants({ role: roleName, limit: 10 });\n  const isOffStageRole = roleName && offStageRoles.includes(roleName);\n  let peersInAccordion = peerList;\n  // for large rooms, peer list would be empty\n  if (isOffStageRole && isLargeRoom) {\n    peersInAccordion = peers;\n    if (filter?.search) {\n      peersInAccordion = peersInAccordion.filter(peer => peer.name.toLowerCase().includes(filter.search || ''));\n    }\n  }\n  const { bringAllToStage, bring_to_stage_label, canBringToStage, lowerAllHands } = useGroupOnStageActions({\n    peers: peersInAccordion,\n  });\n\n  useEffect(() => {\n    if (!isOffStageRole || !isLargeRoom) {\n      return;\n    }\n    loadPeers();\n    const interval = setInterval(() => {\n      loadPeers();\n    }, ITER_TIMER);\n    return () => clearInterval(interval);\n  }, [isOffStageRole, isLargeRoom]); //eslint-disable-line\n\n  if (peersInAccordion.length === 0 || (isHandRaisedAccordion && filter?.search)) {\n    return null;\n  }\n\n  const height = ROW_HEIGHT * peersInAccordion.length;\n  const hasNext = total > peersInAccordion.length && !filter?.search;\n\n  return (\n    <Accordion.Item value={roleName} css={{ '&:hover .role_actions': { visibility: 'visible' }, mb: '$8' }} ref={ref}>\n      <Accordion.Header\n        chevronID={`role_accordion_btn_${roleName}`}\n        iconStyles={{ c: '$on_surface_high' }}\n        css={{\n          textTransform: 'capitalize',\n          p: '$6 $8',\n          fontSize: '$sm',\n          fontWeight: '$semiBold',\n          c: '$on_surface_medium',\n          borderRadius: '$1',\n          border: '1px solid $border_default',\n          '&[data-state=\"open\"]': {\n            borderBottomLeftRadius: 0,\n            borderBottomRightRadius: 0,\n          },\n        }}\n      >\n        <Flex justify=\"between\" align=\"center\" css={{ flexGrow: 1, pr: '$6' }}>\n          <Text\n            variant=\"sm\"\n            css={{ fontWeight: '$semiBold', textTransform: 'capitalize', color: '$on_surface_medium' }}\n          >\n            {roleName} {`(${getFormattedCount(isLargeRoom && isOffStageRole ? total : peerList.length)})`}\n          </Text>\n          <RoleOptions roleName={roleName} peerList={peersInAccordion} />\n        </Flex>\n      </Accordion.Header>\n      <Accordion.Content contentStyles={{ border: '1px solid $border_default', borderTop: 'none' }}>\n        <FixedSizeList\n          itemSize={ROW_HEIGHT}\n          itemData={{\n            peerList: isHandRaisedAccordion\n              ? peersInAccordion.sort((a, b) => {\n                  try {\n                    const aHandRaisedAt = JSON.parse(a.metadata || '{}').handRaisedAt;\n                    const bHandRaisedAt = JSON.parse(b.metadata || '{}').handRaisedAt;\n                    return aHandRaisedAt - bHandRaisedAt;\n                  } catch (err) {\n                    return 0;\n                  }\n                })\n              : peersInAccordion,\n            isConnected,\n            isHandRaisedAccordion,\n          }}\n          itemKey={itemKey}\n          itemCount={peersInAccordion.length}\n          width={width}\n          height={height}\n        >\n          {VirtualizedParticipantItem}\n        </FixedSizeList>\n        {offStageRoles?.includes(roleName) && hasNext ? (\n          <Flex\n            align=\"center\"\n            justify=\"end\"\n            css={{\n              gap: '$1',\n              cursor: 'pointer',\n              color: '$on_surface_high',\n              p: '$6',\n              borderTop: '1px solid $border_default',\n            }}\n            onClick={() => onActive?.(roleName)}\n          >\n            <Text variant=\"sm\" css={{ color: 'inherit' }}>\n              View All\n            </Text>\n            <ChevronRightIcon />\n          </Flex>\n        ) : null}\n        {isHandRaisedAccordion && canBringToStage && (\n          <>\n            <HorizontalDivider />\n            <Flex css={{ w: '100%', p: '$6', gap: '$4' }} justify=\"center\">\n              <Button variant=\"standard\" onClick={lowerAllHands} icon css={{ pl: '$2' }}>\n                <CrossIcon /> Lower all hands\n              </Button>\n\n              <Button onClick={bringAllToStage} icon css={{ pl: '$2' }}>\n                <AddIcon /> {bring_to_stage_label}\n              </Button>\n            </Flex>\n          </>\n        )}\n      </Accordion.Content>\n    </Accordion.Item>\n  );\n};\n", "import React, { useState } from 'react';\nimport { DefaultConferencingScreen_Elements } from '@100mslive/types-prebuilt';\nimport { match } from 'ts-pattern';\nimport {\n  HMSPeer,\n  selectPermissions,\n  selectRoleByRoleName,\n  selectTracksMap,\n  useHMSActions,\n  useHMSStore,\n} from '@100mslive/react-sdk';\nimport {\n  MicOffIcon,\n  MicOnIcon,\n  PersonRectangleIcon,\n  RemoveUserIcon,\n  VerticalMenuIcon,\n  VideoOffIcon,\n  VideoOnIcon,\n} from '@100mslive/react-icons';\nimport { Dropdown } from '../../../Dropdown';\nimport { Flex } from '../../../Layout';\nimport { Text } from '../../../Text';\nimport { useRoomLayoutConferencingScreen } from '../../provider/roomLayoutProvider/hooks/useRoomLayoutScreen';\n// @ts-ignore: No implicit Any\nimport { getMetadata } from '../../common/utils';\n\nconst dropdownItemCSS = { backgroundColor: '$surface_default', gap: '$4', p: '$8' };\nconst optionTextCSS = {\n  fontWeight: '$semiBold',\n  color: '$on_surface_high',\n  textTransform: 'none',\n  whiteSpace: 'nowrap',\n};\n\nconst DropdownWrapper = ({ children }: { children: React.ReactNode }) => {\n  const [openOptions, setOpenOptions] = useState(false);\n  if (React.Children.toArray(children).length === 0) {\n    return null;\n  }\n  return (\n    <Dropdown.Root open={openOptions} onOpenChange={setOpenOptions}>\n      <Dropdown.Trigger\n        data-testid=\"role_group_options\"\n        onClick={e => e.stopPropagation()}\n        className=\"role_actions\"\n        asChild\n        css={{\n          p: '$1',\n          r: '$0',\n          c: '$on_surface_high',\n          visibility: openOptions ? 'visible' : 'hidden',\n          '&:hover': {\n            c: '$on_surface_medium',\n          },\n          '@md': {\n            visibility: 'visible',\n          },\n        }}\n      >\n        <Flex>\n          <VerticalMenuIcon />\n        </Flex>\n      </Dropdown.Trigger>\n      <Dropdown.Content\n        onClick={e => e.stopPropagation()}\n        css={{ w: 'max-content', bg: '$surface_default', py: 0 }}\n        align=\"end\"\n      >\n        {children}\n      </Dropdown.Content>\n    </Dropdown.Root>\n  );\n};\n\nexport const RoleOptions = ({ roleName, peerList }: { roleName: string; peerList: HMSPeer[] }) => {\n  const permissions = useHMSStore(selectPermissions);\n  const hmsActions = useHMSActions();\n  const { elements } = useRoomLayoutConferencingScreen();\n  const { on_stage_role, off_stage_roles = [] } = (elements as DefaultConferencingScreen_Elements)?.on_stage_exp || {};\n  const canRemoveRoleFromStage = permissions?.changeRole && roleName === on_stage_role;\n  const role = useHMSStore(selectRoleByRoleName(roleName));\n  const tracks = useHMSStore(selectTracksMap);\n  if (!role) {\n    return null;\n  }\n  const canPublishAudio = role.publishParams.allowed.includes('audio');\n  const canPublishVideo = role.publishParams.allowed.includes('video');\n\n  let isVideoOnForSomePeers = false;\n  let isAudioOnForSomePeers = false;\n\n  peerList.forEach(peer => {\n    if (peer.isLocal) {\n      return;\n    }\n    const isAudioOn = !!peer.audioTrack && tracks[peer.audioTrack]?.enabled;\n    const isVideoOn = !!peer.videoTrack && tracks[peer.videoTrack]?.enabled;\n    isAudioOnForSomePeers = isAudioOnForSomePeers || isAudioOn;\n    isVideoOnForSomePeers = isVideoOnForSomePeers || isVideoOn;\n  });\n\n  const setTrackEnabled = async (type: 'audio' | 'video', enabled = false) => {\n    try {\n      await hmsActions.setRemoteTracksEnabled({ roles: [roleName], source: 'regular', type, enabled });\n    } catch (e) {\n      console.error(e);\n    }\n  };\n\n  // on stage and off stage roles\n  const canRemoveRoleFromRoom =\n    permissions?.removeOthers && (on_stage_role === roleName || off_stage_roles?.includes(roleName));\n\n  if (\n    peerList.length === 0 ||\n    // if only local peer is present no need to show any options\n    (peerList.length === 1 && peerList[0].isLocal) ||\n    !role\n  ) {\n    return null;\n  }\n\n  const removeAllFromStage = () => {\n    peerList.forEach(peer => {\n      const prevRole = getMetadata(peer.metadata).prevRole;\n      if (prevRole) {\n        hmsActions.changeRoleOfPeer(peer.id, prevRole, true);\n      }\n    });\n  };\n\n  const removePeersFromRoom = async () => {\n    try {\n      peerList.forEach(async peer => {\n        await hmsActions.removePeer(peer.id, '');\n      });\n    } catch (e) {\n      console.error(e);\n    }\n  };\n\n  return (\n    <DropdownWrapper>\n      {canRemoveRoleFromStage ? (\n        <Dropdown.Item\n          css={{ ...dropdownItemCSS, borderBottom: '1px solid $border_bright' }}\n          onClick={removeAllFromStage}\n        >\n          <PersonRectangleIcon />\n          <Text variant=\"sm\" css={optionTextCSS}>\n            Remove all from Stage\n          </Text>\n        </Dropdown.Item>\n      ) : null}\n\n      {match({ canPublishAudio, isAudioOnForSomePeers, canMute: permissions?.mute, canUnmute: permissions?.unmute })\n        .with({ canPublishAudio: true, isAudioOnForSomePeers: true, canMute: true }, () => {\n          return (\n            <Dropdown.Item css={dropdownItemCSS} onClick={() => setTrackEnabled('audio', false)}>\n              <MicOffIcon />\n              <Text variant=\"sm\" css={optionTextCSS}>\n                Mute Audio for All\n              </Text>\n            </Dropdown.Item>\n          );\n        })\n        .with({ canPublishAudio: true, isAudioOnForSomePeers: false, canUnmute: true }, () => {\n          return (\n            <Dropdown.Item css={dropdownItemCSS} onClick={() => setTrackEnabled('audio', true)}>\n              <MicOnIcon />\n              <Text variant=\"sm\" css={optionTextCSS}>\n                Request to Unmute Audio for All\n              </Text>\n            </Dropdown.Item>\n          );\n        })\n        .otherwise(() => null)}\n      {match({ canPublishVideo, isVideoOnForSomePeers, canMute: permissions?.mute, canUnmute: permissions?.unmute })\n        .with({ canPublishVideo: true, isVideoOnForSomePeers: true, canMute: true }, () => {\n          return (\n            <Dropdown.Item css={dropdownItemCSS} onClick={() => setTrackEnabled('video', false)}>\n              <VideoOffIcon />\n              <Text variant=\"sm\" css={optionTextCSS}>\n                Mute Video for All\n              </Text>\n            </Dropdown.Item>\n          );\n        })\n        .with({ canPublishVideo: true, isVideoOnForSomePeers: false, canUnmute: true }, () => {\n          return (\n            <Dropdown.Item css={dropdownItemCSS} onClick={() => setTrackEnabled('video', true)}>\n              <VideoOnIcon />\n              <Text variant=\"sm\" css={optionTextCSS}>\n                Request to Unmute Video for All\n              </Text>\n            </Dropdown.Item>\n          );\n        })\n        .otherwise(() => null)}\n\n      {canRemoveRoleFromRoom ? (\n        <Dropdown.Item\n          css={{ ...dropdownItemCSS, borderTop: '1px solid $border_bright', color: '$alert_error_default' }}\n          onClick={removePeersFromRoom}\n        >\n          <RemoveUserIcon />\n          <Text variant=\"sm\" css={{ ...optionTextCSS, color: 'inherit' }}>\n            Remove all from Room\n          </Text>\n        </Dropdown.Item>\n      ) : null}\n    </DropdownWrapper>\n  );\n};\n", "import { match, P } from 'ts-pattern';\nimport { HMSPeer, selectPermissions, useHMSActions, useHMSStore } from '@100mslive/react-sdk';\nimport { useRoomLayoutConferencingScreen } from '../../provider/roomLayoutProvider/hooks/useRoomLayoutScreen';\n\nexport const useGroupOnStageActions = ({ peers }: { peers: HMSPeer[] }) => {\n  const hmsActions = useHMSActions();\n  const { elements } = useRoomLayoutConferencingScreen();\n  const {\n    bring_to_stage_label,\n    remove_from_stage_label,\n    on_stage_role,\n    off_stage_roles = [],\n    skip_preview_for_role_change = false,\n  } = elements.on_stage_exp || {};\n  const canChangeRole = useHMSStore(selectPermissions)?.changeRole;\n\n  const offStageRolePeers = peers.filter(peer =>\n    match({ on_stage_role, bring_to_stage_label, roleName: peer.roleName })\n      .with(\n        {\n          on_stage_role: P.when(role => !!role),\n          bring_to_stage_label: P.when(label => !!label),\n          roleName: P.when(role => !!role && off_stage_roles.includes(role)),\n        },\n        () => true,\n      )\n      .otherwise(() => false),\n  );\n\n  const lowerAllHands = async () => {\n    return Promise.all(peers.map(peer => hmsActions.lowerRemotePeerHand(peer.id)));\n  };\n\n  const bringAllToStage = () => {\n    if (!canChangeRole || !on_stage_role) {\n      return;\n    }\n    return Promise.all(\n      offStageRolePeers.map(peer => {\n        return hmsActions.changeRoleOfPeer(peer.id, on_stage_role, skip_preview_for_role_change).then(() => {\n          return skip_preview_for_role_change ? hmsActions.lowerRemotePeerHand(peer.id) : null;\n        });\n      }),\n    );\n  };\n\n  return {\n    lowerAllHands,\n    bringAllToStage,\n    canBringToStage: canChangeRole && offStageRolePeers.length > 0,\n    bring_to_stage_label,\n    remove_from_stage_label,\n  };\n};\n", "import { useState } from 'react';\nimport { selectPeerMetadata, selectPermissions, useHMSActions, useHMSStore } from '@100mslive/react-sdk';\nimport { useRoomLayoutConferencingScreen } from '../../provider/roomLayoutProvider/hooks/useRoomLayoutScreen';\n\nexport const usePeerOnStageActions = ({ peerId, role }: { peerId: string; role: string }) => {\n  const hmsActions = useHMSActions();\n  const { elements } = useRoomLayoutConferencingScreen();\n  const {\n    bring_to_stage_label,\n    remove_from_stage_label,\n    on_stage_role,\n    off_stage_roles = [],\n    skip_preview_for_role_change = false,\n  } = elements.on_stage_exp || {};\n  const isInStage = role === on_stage_role;\n  const canChangeRole = useHMSStore(selectPermissions)?.changeRole;\n  const shouldShowStageRoleChange =\n    canChangeRole &&\n    ((isInStage && remove_from_stage_label) || (off_stage_roles?.includes(role) && bring_to_stage_label));\n  const prevRole = useHMSStore(selectPeerMetadata(peerId))?.prevRole;\n  const [open, setOpen] = useState(false);\n\n  const lowerPeerHand = async () => {\n    await hmsActions.lowerRemotePeerHand(peerId);\n  };\n\n  const handleStageAction = async () => {\n    if (isInStage) {\n      prevRole && hmsActions.changeRoleOfPeer(peerId, prevRole, true);\n    } else if (on_stage_role) {\n      await hmsActions.changeRoleOfPeer(peerId, on_stage_role, skip_preview_for_role_change);\n      if (skip_preview_for_role_change) {\n        await lowerPeerHand();\n      }\n    }\n    setOpen(false);\n  };\n\n  return {\n    open,\n    setOpen,\n    lowerPeerHand,\n    handleStageAction,\n    shouldShowStageRoleChange,\n    isInStage,\n    bring_to_stage_label,\n    remove_from_stage_label,\n  };\n};\n"],
+  "mappings": "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",
+  "names": ["React", "useState", "selectIsLargeRoom", "selectLocalPeerID", "selectPermissions", "useHMSStore", "AddIcon", "CrossIcon", "MicOffIcon", "VerticalMenuIcon", "React", "useHMSStore", "React", "selectPermissions", "useHMSActions", "useHMSStore", "React", "useHMSStore", "selectPermissions", "useHMSActions", "match", "selectPermissions", "useHMSActions", "useHMSStore", "useHMSActions", "useHMSStore", "selectPermissions", "match", "React", "useHMSStore", "useState", "selectPermissions", "useHMSActions", "useHMSStore", "useHMSActions", "useHMSStore", "selectPermissions", "useState", "useState", "useHMSStore", "selectIsLargeRoom", "React", "selectLocalPeerID", "selectPermissions", "MicOffIcon", "CrossIcon", "AddIcon", "VerticalMenuIcon"]
+}

package/dist/chunk-QKXHQ6DV.js

@@ -0,0 +1,254 @@
+import {
+  Button,
+  HorizontalDivider,
+  Loading,
+  Popover,
+  Sheet,
+  _s
+} from "./chunk-26D5FDBW.js";
+import {
+  Text
+} from "./chunk-JKWX7W4K.js";
+import {
+  ToastManager,
+  useRecordingHandler
+} from "./chunk-BQOT4DK7.js";
+import {
+  Box,
+  Flex
+} from "./chunk-7QZJMUHM.js";
+import {
+  Tooltip,
+  formatTime,
+  useRoomLayoutConferencingScreen
+} from "./chunk-ENHSO6YN.js";
+import {
+  __async,
+  config,
+  init_define_process_env
+} from "./chunk-TBXRX6MK.js";
+
+// src/Prebuilt/components/Header/StreamActions.tsx
+init_define_process_env();
+import React, { useCallback, useEffect, useRef, useState } from "react";
+import { useMedia } from "react-use";
+import {
+  HMSRoomState,
+  selectHLSState,
+  selectIsConnectedToRoom,
+  selectPermissions,
+  selectRecordingState,
+  selectRoomState,
+  useHMSActions,
+  useHMSStore,
+  useRecordingStreaming
+} from "@100mslive/react-sdk";
+import { AlertTriangleIcon, CrossIcon, PauseCircleIcon, RecordIcon } from "@100mslive/react-icons";
+var getRecordingText = ({
+  isBrowserRecordingOn,
+  isServerRecordingOn,
+  isHLSRecordingOn
+}, delimiter = ", ") => {
+  if (!isBrowserRecordingOn && !isServerRecordingOn && !isHLSRecordingOn) {
+    return "";
+  }
+  const title = [];
+  if (isBrowserRecordingOn) {
+    title.push("Browser");
+  }
+  if (isServerRecordingOn) {
+    title.push("Server");
+  }
+  if (isHLSRecordingOn) {
+    title.push("HLS");
+  }
+  return title.join(delimiter);
+};
+var LiveStatus = () => {
+  var _a;
+  const { isHLSRunning, isRTMPRunning } = useRecordingStreaming();
+  const hlsState = useHMSStore(selectHLSState);
+  const isMobile = useMedia(config.media.md);
+  const intervalRef = useRef(null);
+  const { screenType } = useRoomLayoutConferencingScreen();
+  const [liveTime, setLiveTime] = useState(0);
+  const startTimer = useCallback(() => {
+    intervalRef.current = setInterval(() => {
+      var _a2;
+      const timeStamp = (_a2 = hlsState == null ? void 0 : hlsState.variants[0]) == null ? void 0 : _a2[screenType === "hls_live_streaming" ? "startedAt" : "initialisedAt"];
+      if ((hlsState == null ? void 0 : hlsState.running) && timeStamp) {
+        setLiveTime(Date.now() - timeStamp.getTime());
+      }
+    }, 1e3);
+  }, [hlsState == null ? void 0 : hlsState.running, hlsState == null ? void 0 : hlsState.variants, screenType]);
+  useEffect(() => {
+    if (hlsState == null ? void 0 : hlsState.running) {
+      startTimer();
+    }
+    if (!(hlsState == null ? void 0 : hlsState.running) && intervalRef.current) {
+      clearInterval(intervalRef.current);
+    }
+    return () => {
+      if (intervalRef.current) {
+        clearInterval(intervalRef.current);
+      }
+    };
+  }, [hlsState.running, isMobile, startTimer]);
+  if (!isHLSRunning && !isRTMPRunning) {
+    return null;
+  }
+  return /* @__PURE__ */ React.createElement(
+    Flex,
+    {
+      align: "center",
+      gap: "1",
+      css: {
+        border: "1px solid $border_default",
+        padding: "$4 $6 $4 $6",
+        borderRadius: "$1"
+      }
+    },
+    /* @__PURE__ */ React.createElement(Box, { css: { w: "$4", h: "$4", r: "$round", bg: "$alert_error_default", mr: "$2" } }),
+    /* @__PURE__ */ React.createElement(Flex, { align: "center", gap: "2" }, /* @__PURE__ */ React.createElement(Text, { variant: !isMobile ? "button" : "body2" }, "LIVE"), /* @__PURE__ */ React.createElement(Text, { variant: "caption" }, ((_a = hlsState == null ? void 0 : hlsState.variants) == null ? void 0 : _a.length) > 0 && isHLSRunning ? formatTime(liveTime) : ""))
+  );
+};
+var RecordingStatus = () => {
+  const { isBrowserRecordingOn, isServerRecordingOn, isHLSRecordingOn, isRecordingOn } = useRecordingStreaming();
+  const permissions = useHMSStore(selectPermissions);
+  const isMobile = useMedia(config.media.md);
+  if (!isRecordingOn || // if only browser recording is enabled, stop recording is shown
+  // so no need to show this as it duplicates
+  [permissions == null ? void 0 : permissions.browserRecording, !isServerRecordingOn, !isHLSRecordingOn, isBrowserRecordingOn].every(
+    (value) => !!value
+  )) {
+    if (!(isMobile && isRecordingOn))
+      return null;
+  }
+  return /* @__PURE__ */ React.createElement(
+    Tooltip,
+    {
+      boxCss: { zIndex: 1 },
+      title: getRecordingText({
+        isBrowserRecordingOn,
+        isServerRecordingOn,
+        isHLSRecordingOn
+      })
+    },
+    /* @__PURE__ */ React.createElement(
+      Flex,
+      {
+        css: {
+          color: "$alert_error_default",
+          alignItems: "center"
+        }
+      },
+      /* @__PURE__ */ React.createElement(RecordIcon, { width: 24, height: 24 })
+    )
+  );
+};
+var RecordingPauseStatus = () => {
+  const recording = useHMSStore(selectRecordingState);
+  if (recording.hls && recording.hls.state === _s.PAUSED) {
+    return /* @__PURE__ */ React.createElement(
+      Tooltip,
+      {
+        boxCss: { zIndex: 1 },
+        title: getRecordingText({
+          isBrowserRecordingOn: false,
+          isServerRecordingOn: false,
+          isHLSRecordingOn: true
+        })
+      },
+      /* @__PURE__ */ React.createElement(
+        Flex,
+        {
+          css: {
+            color: "$on_surface_high",
+            alignItems: "center"
+          }
+        },
+        /* @__PURE__ */ React.createElement(PauseCircleIcon, { width: 24, height: 24 })
+      )
+    );
+  }
+  return null;
+};
+var StartRecording = () => {
+  const permissions = useHMSStore(selectPermissions);
+  const [open, setOpen] = useState(false);
+  const { startRecording, recordingStarted } = useRecordingHandler();
+  const { isBrowserRecordingOn, isStreamingOn, isHLSRunning } = useRecordingStreaming();
+  const hmsActions = useHMSActions();
+  if (!(permissions == null ? void 0 : permissions.browserRecording) || isHLSRunning) {
+    return null;
+  }
+  if (isBrowserRecordingOn) {
+    return /* @__PURE__ */ React.createElement(Popover.Root, { open, onOpenChange: setOpen }, /* @__PURE__ */ React.createElement(Popover.Trigger, { asChild: true }, /* @__PURE__ */ React.createElement(Button, { variant: "danger", "data-testid": "stop_recording", icon: true, outlined: true, onClick: () => setOpen(true) }, /* @__PURE__ */ React.createElement(RecordIcon, null), /* @__PURE__ */ React.createElement(Text, { as: "span", css: { "@md": { display: "none" }, color: "currentColor" } }, "Stop Recording"))), /* @__PURE__ */ React.createElement(Popover.Portal, null, /* @__PURE__ */ React.createElement(Popover.Content, { align: "end", sideOffset: 8, css: { w: "$64" } }, /* @__PURE__ */ React.createElement(Text, { variant: "body1", css: { color: "$on_surface_medium" } }, "Are you sure you want to end the recording?"), /* @__PURE__ */ React.createElement(
+      Button,
+      {
+        "data-testid": "stop_recording_confirm",
+        variant: "danger",
+        icon: true,
+        css: { ml: "auto" },
+        onClick: () => __async(void 0, null, function* () {
+          try {
+            yield hmsActions.stopRTMPAndRecording();
+          } catch (error) {
+            const err = error;
+            ToastManager.addToast({
+              title: err.message,
+              variant: "error"
+            });
+          }
+          setOpen(false);
+        })
+      },
+      "Stop"
+    ))));
+  }
+  return /* @__PURE__ */ React.createElement(
+    Button,
+    {
+      "data-testid": "start_recording",
+      variant: "standard",
+      icon: true,
+      disabled: recordingStarted || isStreamingOn,
+      onClick: () => __async(void 0, null, function* () {
+        yield startRecording();
+      })
+    },
+    recordingStarted ? /* @__PURE__ */ React.createElement(Loading, { size: 24, color: "currentColor" }) : /* @__PURE__ */ React.createElement(RecordIcon, null),
+    /* @__PURE__ */ React.createElement(Text, { as: "span", css: { "@md": { display: "none" }, color: "currentColor" } }, recordingStarted ? "Starting" : "Start", " Recording")
+  );
+};
+var StreamActions = () => {
+  const isConnected = useHMSStore(selectIsConnectedToRoom);
+  const isMobile = useMedia(config.media.md);
+  const roomState = useHMSStore(selectRoomState);
+  return /* @__PURE__ */ React.createElement(Flex, { align: "center", css: { gap: "$4" } }, !isMobile && /* @__PURE__ */ React.createElement(Flex, { align: "center", css: { gap: "$4" } }, /* @__PURE__ */ React.createElement(RecordingPauseStatus, null), /* @__PURE__ */ React.createElement(RecordingStatus, null), roomState !== HMSRoomState.Preview ? /* @__PURE__ */ React.createElement(LiveStatus, null) : null), isConnected && !isMobile ? /* @__PURE__ */ React.createElement(StartRecording, null) : null);
+};
+var StopRecordingInSheet = ({
+  onStopRecording,
+  onClose
+}) => {
+  return /* @__PURE__ */ React.createElement(Sheet.Root, { open: true }, /* @__PURE__ */ React.createElement(Sheet.Content, null, /* @__PURE__ */ React.createElement(Sheet.Title, { css: { p: "$10" } }, /* @__PURE__ */ React.createElement(Flex, { direction: "row", justify: "between", css: { w: "100%", c: "$alert_error_default" } }, /* @__PURE__ */ React.createElement(Flex, { justify: "start", align: "center", gap: "3" }, /* @__PURE__ */ React.createElement(AlertTriangleIcon, null), /* @__PURE__ */ React.createElement(Text, { variant: "h5", css: { c: "$alert_error_default" } }, "Stop Recording")), /* @__PURE__ */ React.createElement(Sheet.Close, { css: { color: "white" }, onClick: onClose }, /* @__PURE__ */ React.createElement(CrossIcon, null)))), /* @__PURE__ */ React.createElement(HorizontalDivider, null), /* @__PURE__ */ React.createElement(Box, { as: "div", css: { p: "$10", overflowY: "scroll", maxHeight: "70vh" } }, /* @__PURE__ */ React.createElement(Text, { variant: "caption", css: { c: "$on_surface_medium", pb: "$8" } }, "Are you sure you want to stop recording? You can\u2019t undo this action."), /* @__PURE__ */ React.createElement(
+    Button,
+    {
+      variant: "danger",
+      css: { width: "100%" },
+      type: "submit",
+      "data-testid": "popup_change_btn",
+      onClick: onStopRecording
+    },
+    "Stop"
+  ))));
+};
+
+export {
+  LiveStatus,
+  RecordingStatus,
+  RecordingPauseStatus,
+  StreamActions,
+  StopRecordingInSheet
+};
+//# sourceMappingURL=chunk-QKXHQ6DV.js.map

package/dist/chunk-QKXHQ6DV.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../src/Prebuilt/components/Header/StreamActions.tsx"],
+  "sourcesContent": ["import React, { useCallback, useEffect, useRef, useState } from 'react';\nimport { useMedia } from 'react-use';\nimport { HMSRecordingState } from '@100mslive/hms-video-store';\nimport {\n  HMSRoomState,\n  selectHLSState,\n  selectIsConnectedToRoom,\n  selectPermissions,\n  selectRecordingState,\n  selectRoomState,\n  useHMSActions,\n  useHMSStore,\n  useRecordingStreaming,\n} from '@100mslive/react-sdk';\nimport { AlertTriangleIcon, CrossIcon, PauseCircleIcon, RecordIcon } from '@100mslive/react-icons';\nimport { Box, Button, config as cssConfig, Flex, HorizontalDivider, Loading, Popover, Text, Tooltip } from '../../..';\nimport { Sheet } from '../../../Sheet';\n// @ts-ignore\nimport { ToastManager } from '../Toast/ToastManager';\nimport { useRoomLayoutConferencingScreen } from '../../provider/roomLayoutProvider/hooks/useRoomLayoutScreen';\nimport { useRecordingHandler } from '../../common/hooks';\n// @ts-ignore\nimport { formatTime } from '../../common/utils';\n\nexport const getRecordingText = (\n  {\n    isBrowserRecordingOn,\n    isServerRecordingOn,\n    isHLSRecordingOn,\n  }: { isBrowserRecordingOn: boolean; isServerRecordingOn: boolean; isHLSRecordingOn: boolean },\n  delimiter = ', ',\n) => {\n  if (!isBrowserRecordingOn && !isServerRecordingOn && !isHLSRecordingOn) {\n    return '';\n  }\n  const title: string[] = [];\n  if (isBrowserRecordingOn) {\n    title.push('Browser');\n  }\n  if (isServerRecordingOn) {\n    title.push('Server');\n  }\n  if (isHLSRecordingOn) {\n    title.push('HLS');\n  }\n  return title.join(delimiter);\n};\n\nexport const LiveStatus = () => {\n  const { isHLSRunning, isRTMPRunning } = useRecordingStreaming();\n  const hlsState = useHMSStore(selectHLSState);\n  const isMobile = useMedia(cssConfig.media.md);\n  const intervalRef = useRef<NodeJS.Timeout | null>(null);\n  const { screenType } = useRoomLayoutConferencingScreen();\n  const [liveTime, setLiveTime] = useState(0);\n\n  const startTimer = useCallback(() => {\n    intervalRef.current = setInterval(() => {\n      const timeStamp = hlsState?.variants[0]?.[screenType === 'hls_live_streaming' ? 'startedAt' : 'initialisedAt'];\n      if (hlsState?.running && timeStamp) {\n        setLiveTime(Date.now() - timeStamp.getTime());\n      }\n    }, 1000);\n  }, [hlsState?.running, hlsState?.variants, screenType]);\n\n  useEffect(() => {\n    if (hlsState?.running) {\n      startTimer();\n    }\n    if (!hlsState?.running && intervalRef.current) {\n      clearInterval(intervalRef.current);\n    }\n    return () => {\n      if (intervalRef.current) {\n        clearInterval(intervalRef.current);\n      }\n    };\n  }, [hlsState.running, isMobile, startTimer]);\n\n  if (!isHLSRunning && !isRTMPRunning) {\n    return null;\n  }\n  return (\n    <Flex\n      align=\"center\"\n      gap=\"1\"\n      css={{\n        border: '1px solid $border_default',\n        padding: '$4 $6 $4 $6',\n        borderRadius: '$1',\n      }}\n    >\n      <Box css={{ w: '$4', h: '$4', r: '$round', bg: '$alert_error_default', mr: '$2' }} />\n      <Flex align=\"center\" gap=\"2\">\n        <Text variant={!isMobile ? 'button' : 'body2'}>LIVE</Text>\n        <Text variant=\"caption\">{hlsState?.variants?.length > 0 && isHLSRunning ? formatTime(liveTime) : ''}</Text>\n      </Flex>\n    </Flex>\n  );\n};\n\nexport const RecordingStatus = () => {\n  const { isBrowserRecordingOn, isServerRecordingOn, isHLSRecordingOn, isRecordingOn } = useRecordingStreaming();\n  const permissions = useHMSStore(selectPermissions);\n  const isMobile = useMedia(cssConfig.media.md);\n\n  if (\n    !isRecordingOn ||\n    // if only browser recording is enabled, stop recording is shown\n    // so no need to show this as it duplicates\n    [permissions?.browserRecording, !isServerRecordingOn, !isHLSRecordingOn, isBrowserRecordingOn].every(\n      value => !!value,\n    )\n  ) {\n    // show recording icon in mobile without popover\n    if (!(isMobile && isRecordingOn)) return null;\n  }\n\n  return (\n    <Tooltip\n      boxCss={{ zIndex: 1 }}\n      title={getRecordingText({\n        isBrowserRecordingOn,\n        isServerRecordingOn,\n        isHLSRecordingOn,\n      })}\n    >\n      <Flex\n        css={{\n          color: '$alert_error_default',\n          alignItems: 'center',\n        }}\n      >\n        <RecordIcon width={24} height={24} />\n      </Flex>\n    </Tooltip>\n  );\n};\n\nexport const RecordingPauseStatus = () => {\n  const recording = useHMSStore(selectRecordingState);\n  if (recording.hls && recording.hls.state === HMSRecordingState.PAUSED) {\n    return (\n      <Tooltip\n        boxCss={{ zIndex: 1 }}\n        title={getRecordingText({\n          isBrowserRecordingOn: false,\n          isServerRecordingOn: false,\n          isHLSRecordingOn: true,\n        })}\n      >\n        <Flex\n          css={{\n            color: '$on_surface_high',\n            alignItems: 'center',\n          }}\n        >\n          <PauseCircleIcon width={24} height={24} />\n        </Flex>\n      </Tooltip>\n    );\n  }\n  return null;\n};\n\nconst StartRecording = () => {\n  const permissions = useHMSStore(selectPermissions);\n  const [open, setOpen] = useState(false);\n  const { startRecording, recordingStarted } = useRecordingHandler();\n  const { isBrowserRecordingOn, isStreamingOn, isHLSRunning } = useRecordingStreaming();\n  const hmsActions = useHMSActions();\n  if (!permissions?.browserRecording || isHLSRunning) {\n    return null;\n  }\n  if (isBrowserRecordingOn) {\n    return (\n      <Popover.Root open={open} onOpenChange={setOpen}>\n        <Popover.Trigger asChild>\n          <Button variant=\"danger\" data-testid=\"stop_recording\" icon outlined onClick={() => setOpen(true)}>\n            <RecordIcon />\n            <Text as=\"span\" css={{ '@md': { display: 'none' }, color: 'currentColor' }}>\n              Stop Recording\n            </Text>\n          </Button>\n        </Popover.Trigger>\n        <Popover.Portal>\n          <Popover.Content align=\"end\" sideOffset={8} css={{ w: '$64' }}>\n            <Text variant=\"body1\" css={{ color: '$on_surface_medium' }}>\n              Are you sure you want to end the recording?\n            </Text>\n            <Button\n              data-testid=\"stop_recording_confirm\"\n              variant=\"danger\"\n              icon\n              css={{ ml: 'auto' }}\n              onClick={async () => {\n                try {\n                  await hmsActions.stopRTMPAndRecording();\n                } catch (error) {\n                  const err = error as Error;\n                  ToastManager.addToast({\n                    title: err.message,\n                    variant: 'error',\n                  });\n                }\n                setOpen(false);\n              }}\n            >\n              Stop\n            </Button>\n          </Popover.Content>\n        </Popover.Portal>\n      </Popover.Root>\n    );\n  }\n  return (\n    <Button\n      data-testid=\"start_recording\"\n      variant=\"standard\"\n      icon\n      disabled={recordingStarted || isStreamingOn}\n      onClick={async () => {\n        await startRecording();\n      }}\n    >\n      {recordingStarted ? <Loading size={24} color=\"currentColor\" /> : <RecordIcon />}\n      <Text as=\"span\" css={{ '@md': { display: 'none' }, color: 'currentColor' }}>\n        {recordingStarted ? 'Starting' : 'Start'} Recording\n      </Text>\n    </Button>\n  );\n};\n\n/**\n * @description only start recording button will be shown.\n */\nexport const StreamActions = () => {\n  const isConnected = useHMSStore(selectIsConnectedToRoom);\n  const isMobile = useMedia(cssConfig.media.md);\n  const roomState = useHMSStore(selectRoomState);\n\n  return (\n    <Flex align=\"center\" css={{ gap: '$4' }}>\n      {!isMobile && (\n        <Flex align=\"center\" css={{ gap: '$4' }}>\n          <RecordingPauseStatus />\n          <RecordingStatus />\n          {roomState !== HMSRoomState.Preview ? <LiveStatus /> : null}\n        </Flex>\n      )}\n      {isConnected && !isMobile ? <StartRecording /> : null}\n    </Flex>\n  );\n};\n\nexport const StopRecordingInSheet = ({\n  onStopRecording,\n  onClose,\n}: {\n  onStopRecording: () => void;\n  onClose: () => void;\n}) => {\n  return (\n    <Sheet.Root open={true}>\n      <Sheet.Content>\n        <Sheet.Title css={{ p: '$10' }}>\n          <Flex direction=\"row\" justify=\"between\" css={{ w: '100%', c: '$alert_error_default' }}>\n            <Flex justify=\"start\" align=\"center\" gap=\"3\">\n              <AlertTriangleIcon />\n              <Text variant=\"h5\" css={{ c: '$alert_error_default' }}>\n                Stop Recording\n              </Text>\n            </Flex>\n            <Sheet.Close css={{ color: 'white' }} onClick={onClose}>\n              <CrossIcon />\n            </Sheet.Close>\n          </Flex>\n        </Sheet.Title>\n        <HorizontalDivider />\n        <Box as=\"div\" css={{ p: '$10', overflowY: 'scroll', maxHeight: '70vh' }}>\n          <Text variant=\"caption\" css={{ c: '$on_surface_medium', pb: '$8' }}>\n            Are you sure you want to stop recording? You can\u2019t undo this action.\n          </Text>\n          <Button\n            variant=\"danger\"\n            css={{ width: '100%' }}\n            type=\"submit\"\n            data-testid=\"popup_change_btn\"\n            onClick={onStopRecording}\n          >\n            Stop\n          </Button>\n        </Box>\n      </Sheet.Content>\n    </Sheet.Root>\n  );\n};\n"],
+  "mappings": "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",
+  "names": ["_a"]
+}

package/dist/chunk-RTWNTT77.js

@@ -0,0 +1,62 @@
+import {
+  __async,
+  init_define_process_env
+} from "./chunk-TBXRX6MK.js";
+
+// src/Prebuilt/components/hooks/useMetadata.tsx
+init_define_process_env();
+import { useCallback } from "react";
+import {
+  selectHasPeerHandRaised,
+  selectLocalPeerID,
+  selectPeerMetadata,
+  useHMSActions,
+  useHMSStore,
+  useHMSVanillaStore
+} from "@100mslive/react-sdk";
+var useMyMetadata = () => {
+  const hmsActions = useHMSActions();
+  const localPeerId = useHMSStore(selectLocalPeerID);
+  const vanillaStore = useHMSVanillaStore();
+  const metaData = useHMSStore(selectPeerMetadata(localPeerId));
+  const isHandRaised = useHMSStore(selectHasPeerHandRaised(localPeerId));
+  const update = (updatedFields) => __async(void 0, null, function* () {
+    try {
+      const currentMetadata = vanillaStore.getState(selectPeerMetadata(localPeerId));
+      yield hmsActions.changeMetadata(Object.assign(currentMetadata, updatedFields));
+      return true;
+    } catch (error) {
+      console.error("failed to update metadata ", updatedFields);
+    }
+    return false;
+  });
+  const toggleHandRaise = useCallback(() => __async(void 0, null, function* () {
+    if (isHandRaised) {
+      yield hmsActions.lowerLocalPeerHand();
+      yield update({ handRaisedAt: void 0 });
+    } else {
+      yield hmsActions.raiseLocalPeerHand();
+      yield update({ isBRBOn: false, handRaisedAt: Date.now() });
+    }
+  }), [isHandRaised]);
+  const toggleBRB = useCallback(() => __async(void 0, null, function* () {
+    const newValue = !(metaData == null ? void 0 : metaData.isBRBOn);
+    yield update({ isBRBOn: newValue });
+    if (newValue) {
+      yield hmsActions.lowerLocalPeerHand();
+    }
+  }), [metaData == null ? void 0 : metaData.isBRBOn]);
+  return {
+    isHandRaised,
+    isBRBOn: !!(metaData == null ? void 0 : metaData.isBRBOn),
+    metaData,
+    updateMetaData: update,
+    toggleHandRaise,
+    toggleBRB
+  };
+};
+
+export {
+  useMyMetadata
+};
+//# sourceMappingURL=chunk-RTWNTT77.js.map

package/dist/chunk-RTWNTT77.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../src/Prebuilt/components/hooks/useMetadata.tsx"],
+  "sourcesContent": ["import { useCallback } from 'react';\nimport {\n  selectHasPeerHandRaised,\n  selectLocalPeerID,\n  selectPeerMetadata,\n  useHMSActions,\n  useHMSStore,\n  useHMSVanillaStore,\n} from '@100mslive/react-sdk';\n\nexport const useMyMetadata = () => {\n  const hmsActions = useHMSActions();\n  const localPeerId = useHMSStore(selectLocalPeerID);\n  const vanillaStore = useHMSVanillaStore();\n  const metaData = useHMSStore(selectPeerMetadata(localPeerId));\n  const isHandRaised = useHMSStore(selectHasPeerHandRaised(localPeerId));\n\n  const update = async (updatedFields: Record<string, any>) => {\n    try {\n      // get current state from store and merge updated fields\n      const currentMetadata = vanillaStore.getState(selectPeerMetadata(localPeerId));\n      await hmsActions.changeMetadata(Object.assign(currentMetadata, updatedFields));\n      return true;\n    } catch (error) {\n      console.error('failed to update metadata ', updatedFields);\n    }\n    return false;\n  };\n\n  const toggleHandRaise = useCallback(async () => {\n    if (isHandRaised) {\n      await hmsActions.lowerLocalPeerHand();\n      await update({ handRaisedAt: undefined });\n    } else {\n      await hmsActions.raiseLocalPeerHand();\n      await update({ isBRBOn: false, handRaisedAt: Date.now() });\n    }\n  }, [isHandRaised]); //eslint-disable-line\n\n  const toggleBRB = useCallback(async () => {\n    const newValue = !metaData?.isBRBOn;\n    await update({ isBRBOn: newValue });\n    if (newValue) {\n      await hmsActions.lowerLocalPeerHand();\n    }\n  }, [metaData?.isBRBOn]); //eslint-disable-line\n\n  return {\n    isHandRaised,\n    isBRBOn: !!metaData?.isBRBOn,\n    metaData,\n    updateMetaData: update,\n    toggleHandRaise,\n    toggleBRB,\n  };\n};\n"],
+  "mappings": ";;;;;;AAAA;AAAA,SAAS,mBAAmB;AAC5B;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEA,IAAM,gBAAgB,MAAM;AACjC,QAAM,aAAa,cAAc;AACjC,QAAM,cAAc,YAAY,iBAAiB;AACjD,QAAM,eAAe,mBAAmB;AACxC,QAAM,WAAW,YAAY,mBAAmB,WAAW,CAAC;AAC5D,QAAM,eAAe,YAAY,wBAAwB,WAAW,CAAC;AAErE,QAAM,SAAS,CAAO,kBAAuC;AAC3D,QAAI;AAEF,YAAM,kBAAkB,aAAa,SAAS,mBAAmB,WAAW,CAAC;AAC7E,YAAM,WAAW,eAAe,OAAO,OAAO,iBAAiB,aAAa,CAAC;AAC7E,aAAO;AAAA,IACT,SAAS,OAAO;AACd,cAAQ,MAAM,8BAA8B,aAAa;AAAA,IAC3D;AACA,WAAO;AAAA,EACT;AAEA,QAAM,kBAAkB,YAAY,MAAY;AAC9C,QAAI,cAAc;AAChB,YAAM,WAAW,mBAAmB;AACpC,YAAM,OAAO,EAAE,cAAc,OAAU,CAAC;AAAA,IAC1C,OAAO;AACL,YAAM,WAAW,mBAAmB;AACpC,YAAM,OAAO,EAAE,SAAS,OAAO,cAAc,KAAK,IAAI,EAAE,CAAC;AAAA,IAC3D;AAAA,EACF,IAAG,CAAC,YAAY,CAAC;AAEjB,QAAM,YAAY,YAAY,MAAY;AACxC,UAAM,WAAW,EAAC,qCAAU;AAC5B,UAAM,OAAO,EAAE,SAAS,SAAS,CAAC;AAClC,QAAI,UAAU;AACZ,YAAM,WAAW,mBAAmB;AAAA,IACtC;AAAA,EACF,IAAG,CAAC,qCAAU,OAAO,CAAC;AAEtB,SAAO;AAAA,IACL;AAAA,IACA,SAAS,CAAC,EAAC,qCAAU;AAAA,IACrB;AAAA,IACA,gBAAgB;AAAA,IAChB;AAAA,IACA;AAAA,EACF;AACF;",
+  "names": []
+}