@pexip/media-components
This package provides the necessary building blocks for creating video apps.
Install
npm install @pexip/media-components
Internationalization (i18n)
This package uses react-i18next for translations. It exports a
defaultTranslations object containing all English strings used by the
components. You must initialize i18next with these translations before
rendering any components from this package.
Basic setup (English only)
import i18next from 'i18next';
import {initReactI18next} from 'react-i18next';
import {defaultTranslations} from '@pexip/media-components';
i18next.use(initReactI18next).init({
lng: 'en',
resources: {
en: {translation: defaultTranslations},
},
interpolation: {escapeValue: false},
});
Merging with your own translations
import {defaultTranslations} from '@pexip/media-components';
import appTranslations from './locales/en.json';
i18next.use(initReactI18next).init({
lng: 'en',
resources: {
en: {translation: {...defaultTranslations, ...appTranslations}},
},
interpolation: {escapeValue: false},
});
Multiple languages
Provide defaultTranslations as the English fallback and add your own
translated resources for other languages:
import {defaultTranslations} from '@pexip/media-components';
i18next.use(initReactI18next).init({
lng: 'nb',
fallbackLng: 'en',
resources: {
en: {translation: defaultTranslations},
nb: {translation: myNorwegianTranslations},
},
interpolation: {escapeValue: false},
});
Package includes:
- views (building blocks for the video app)
- viewModels (some of the additional logic on top of the views)
- hooks (common logic for video apps wrapped with the hook)
- utils (more generic code that can be useful when building video app)
- signals (to be deprecated, atm those signals helps communicating between the pkg and the app, ideally they should be inside the app itself)
Enumerations
| Enumeration | Description |
|---|---|
| PreflightJoinDetailsToRender | - |
| BlockedBrowserPermissionsInfoType | - |
| PresentationType | - |
| PresentationEmphasis | - |
| PresentationSize | - |
| PresentationAction | - |
| StreamStatus | - |
| MuteState | indicate call mute state (not to be confused with member mute state) |
| ChatType | - |
| StreamQuality | - |
| VideoLayoutOptionValues | - |
| NetworkState | - |
| BreakoutRoomAssignmentMode | - |
| BreakoutRoomsScreen | - |
| BreakoutRoomVariant | - |
| CallHistoryDirection | - |
| NewChatMessageAction | - |
| MimeTypes | - |
| Platform | - |
| PanelAnimationTypes | - |
| QualityNames | - |
| InfoCardWidth | - |
| InfoCardType | - |
| TestYourMicStages | - |
| TestId | - |
Interfaces
| Interface | Description |
|---|---|
| Participant | - |
| ControlsOverlap | - |
| Preview | - |
| DeviceStatusInfo | - |
| PresentationActivityState | - |
| PresentationState | - |
| UserChatMessage | A chat message sent by a participant to the conference or to an individual. |
| ActivityChatMessage | A system generated message describing a change in the conference. |
| MeetingParticipant | - |
| InMeetingParticipant | - |
| PreviewMediaInput | - |
| NormalizedStats | - |
| BreakoutAskingForHelpStatus | - |
| MediaStore | - |
| RecorderEvents | - |
| Recorder | - |
| UserAgentsDetails | Data set of user agent details and and boolean properties for quick browser and device checks |
| TimerValues | - |