@tmsoft/webphone v1.0.14
📞 WebPhone Library (@tmsoft/webphone
)
@tmsoft/webphone
es una librería Vue 3 que proporciona un componente de teléfono web basado en SIP con soporte para llamadas WebRTC.
📌 Características
- 📡 Soporte para SIP y WebRTC
- 🎨 Integrado con PrimeVue y TailwindCSS
- 📞 Gestión de dispositivos de audio (micrófono y altavoz)
- 🔄 Mecanismo de reconexión SIP
- 🛠 Fácil integración en cualquier proyecto Vue 3
🚀 Instalación
En NPM:
npm install @tmsoft/webphone
En Yarn:
yarn add @tmsoft/webphone
En PNPM:
pnpm add @tmsoft/webphone
🛠 Uso
En una aplicación Vue, se puede importar y utilizar de la siguiente manera:
<script setup lang="ts">
import { ref } from 'vue'
import WebPhone from '@tmsoft/webphone'
const extension = ref('1001')
const password = ref('supersecret')
const domain = ref('sip.example.com')
</script>
<template>
<WebPhone :extension="extension" :password="password" :domain="domain" />
</template>
📌 Props del Componente
Propiedad | Tipo | Requerida | Descripción |
---|---|---|---|
extension | String | ✅ | Número de extensión del usuario. |
password | String | ✅ | Contraseña SIP de la extensión. |
domain | String | ✅ | Dominio del servidor SIP. |
mode | String | ❌ | Tipo de llamada. Valores: 'call' , 'webcall' , 'video' . Por defecto 'call' . |
image | String | ❌ | Imagen base64 o URL para mostrar en modo webcall . |
to | String | ❌ | Número de destino en modo webcall . |
callback | Function | ❌ | Función de volver atrás en modo webcall . |
🏗 Construcción del Paquete
Para compilar el paquete, ejecutar:
npm run build
Esto generará los archivos de distribución en dist/
con los siguientes formatos:
- UMD (
webphone.umd.js
) → Para navegadores y CDNs. - ES Module (
webphone.es.js
) → Para importación moderna. - CommonJS (
webphone.cjs.js
) → Para entornos Node.js.
🌎 Uso en CDN
Para cargar la librería directamente en una página sin instalar NPM, usar un CDN como jsDelivr:
<script type="module">
import WebPhone from 'https://cdn.jsdelivr.net/npm/@tmsoft/webphone/dist/webphone.es.js'
</script>
Para UMD:
<script src="https://cdn.jsdelivr.net/npm/@tmsoft/webphone/dist/webphone.umd.js"></script>
📤 Publicación en NPM
Para publicar una nueva versión del paquete en NPM:
1️⃣ Autenticarse en NPM
Si no se ha iniciado sesión:
npm login
2️⃣ Actualizar la versión en package.json
Ejemplo: Incrementar la versión 1.0.1
→ 1.0.2
en package.json
:
{
"name": "@tmsoft/webphone",
"version": "1.0.2"
}
3️⃣ Construir el paquete
npm run build
4️⃣ Publicar el paquete en NPM
npm run publish:lib
Para publicar en un registro privado como Verdaccio:
npm run publish:local