{"_id":"@callpromn/rtc-kit","_rev":"6-d5537b88c1416cec0a7c45dc0ffbaa04","name":"@callpromn/rtc-kit","dist-tags":{"latest":"0.1.0"},"versions":{"0.0.2":{"name":"@callpromn/rtc-kit","version":"0.0.2","keywords":["wep-component","ui","components","rtc","calling","voip","callpro"],"author":{"name":"CallPro LLC"},"license":"MIT","_id":"@callpromn/rtc-kit@0.0.2","maintainers":[{"name":"blgn94","email":"bilguun.bb94@gmail.com"},{"name":"callpro","email":"dev@callpro.mn"},{"name":"artistry449","email":"artistry449@gmail.com"}],"dist":{"shasum":"3cadf10a8dfb4b019778b13e05d9e840a9d8fd85","tarball":"https://registry.npmjs.org/@callpromn/rtc-kit/-/rtc-kit-0.0.2.tgz","fileCount":7,"integrity":"sha512-xG1rS8N7ESFRpBX9VThJS2jVrCmtChe9nhIh9qt1JLy263swjn4jATp33oZu7GmX7kMUVpuBcsMJ9ZV0/wIa7g==","signatures":[{"sig":"MEUCIQDYwgt5IE92e/DVKLHFNKyFbJ/AbV6JDMTIlBDAMDVs6AIgC9oNotsobmjtZyOOwTEaty2uzhheVBNkRWTST8u01Hc=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":66786},"main":"dist/index.js","types":"dist/index.d.ts","module":"dist/index.mjs","exports":{"types":"./dist/index.d.ts","import":"./dist/index.mjs","require":"./dist/index.js"},"gitHead":"d4fea03cf4b660e32fec61c33a9020425f0a1d64","scripts":{"pk":"sudo npm run build && sudo npm link","test":"echo \"Error: no test specified\" && exit 1","build":"tsup","clean":"rimraf dist","pack:check":"npm pack && tar -tzf $(ls -t *.tgz | head -1)"},"_npmUser":{"name":"callpro","email":"dev@callpro.mn"},"_npmVersion":"10.8.2","description":"CallPro Web Components Kit for Web","directories":{},"_nodeVersion":"20.18.3","_hasShrinkwrap":false,"devDependencies":{"tsup":"^8.5.0","eslint":"^9.32.0","rimraf":"^6.0.1","prettier":"^3.6.2","typescript":"^5.8.3","@types/node":"^24.1.0","eslint-config-prettier":"^10.1.8","eslint-plugin-prettier":"^5.5.3","@typescript-eslint/parser":"^8.38.0","@typescript-eslint/eslint-plugin":"^8.38.0"},"_npmOperationalInternal":{"tmp":"tmp/rtc-kit_0.0.2_1755486591023_0.20940077980909555","host":"s3://npm-registry-packages-npm-production"}},"0.0.3":{"name":"@callpromn/rtc-kit","version":"0.0.3","keywords":["wep-component","ui","components","rtc","calling","voip","callpro"],"author":{"name":"CallPro LLC"},"license":"MIT","_id":"@callpromn/rtc-kit@0.0.3","maintainers":[{"name":"blgn94","email":"bilguun.bb94@gmail.com"},{"name":"callpro","email":"dev@callpro.mn"},{"name":"artistry449","email":"artistry449@gmail.com"}],"dist":{"shasum":"4f99306d91e20769f3e8595ab98ad3bd9f35541a","tarball":"https://registry.npmjs.org/@callpromn/rtc-kit/-/rtc-kit-0.0.3.tgz","fileCount":7,"integrity":"sha512-o2KqgAZgYYOWh386owAPYKeKvmEijhZksrQ5ClGcWDUb87aV7Qz7EbSeItbUPrxp6LQzxO4mzkPmYRH5JwKYAg==","signatures":[{"sig":"MEUCIEZeYWSuHQRbE3eKF3+QeHPUQcaHNEEyphhrA34mDdh4AiEA7fVyfzASXz+HErwh+sM1cYZDi3ytoDvnMTHbRaLL728=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":66786},"main":"dist/index.js","types":"dist/index.d.ts","module":"dist/index.mjs","exports":{"types":"./dist/index.d.ts","import":"./dist/index.mjs","require":"./dist/index.js"},"gitHead":"d4fea03cf4b660e32fec61c33a9020425f0a1d64","scripts":{"pk":"sudo npm run build && sudo npm link","test":"echo \"Error: no test specified\" && exit 1","build":"tsup","clean":"rimraf dist","pack:check":"npm pack && tar -tzf $(ls -t *.tgz | head -1)"},"_npmUser":{"name":"callpro","email":"dev@callpro.mn"},"_npmVersion":"10.8.2","description":"CallPro Web Components Kit for Web","directories":{},"_nodeVersion":"20.18.3","_hasShrinkwrap":false,"devDependencies":{"tsup":"^8.5.0","eslint":"^9.32.0","rimraf":"^6.0.1","prettier":"^3.6.2","typescript":"^5.8.3","@types/node":"^24.1.0","eslint-config-prettier":"^10.1.8","eslint-plugin-prettier":"^5.5.3","@typescript-eslint/parser":"^8.38.0","@typescript-eslint/eslint-plugin":"^8.38.0"},"_npmOperationalInternal":{"tmp":"tmp/rtc-kit_0.0.3_1755486745205_0.4008875006874184","host":"s3://npm-registry-packages-npm-production"}},"0.1.0":{"name":"@callpromn/rtc-kit","version":"0.1.0","main":"dist/index.js","module":"dist/index.mjs","types":"dist/index.d.ts","scripts":{"test":"echo \"Error: no test specified\" && exit 1","build":"tsup","pk":"sudo npm run build && sudo npm link","pack:check":"npm pack && tar -tzf $(ls -t *.tgz | head -1)","clean":"rimraf dist"},"keywords":["wep-component","ui","components","rtc","calling","voip","callpro"],"author":{"name":"CallPro LLC"},"license":"MIT","description":"CallPro Web Components Kit for Web","exports":{"types":"./dist/index.d.ts","import":"./dist/index.mjs","require":"./dist/index.js"},"devDependencies":{"@types/node":"^24.1.0","@typescript-eslint/eslint-plugin":"^8.38.0","@typescript-eslint/parser":"^8.38.0","eslint":"^9.32.0","eslint-config-prettier":"^10.1.8","eslint-plugin-prettier":"^5.5.3","prettier":"^3.6.2","rimraf":"^6.0.1","tsup":"^8.5.0","typescript":"^5.8.3"},"dependencies":{},"gitHead":"fd22319e3739ec2bc9888a7d23b18d4cf08615f6","_id":"@callpromn/rtc-kit@0.1.0","_nodeVersion":"24.13.0","_npmVersion":"11.6.2","dist":{"integrity":"sha512-B2bXAoiGAk6JAXnR7UFFYrOBzfphD9u19sbz9I1p9zrYpFvEaEFU9RrFKqp1mAl2bXaWPvTlDCcLULlOdzBmLQ==","shasum":"cb601b732c84819ff29a6858421a634513ec94c1","tarball":"https://registry.npmjs.org/@callpromn/rtc-kit/-/rtc-kit-0.1.0.tgz","fileCount":7,"unpackedSize":66664,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEYCIQCwYBe1UGd1rv8gKdsS6CuW3PCiwqnytJ9PNL6Y+LjmEQIhAKgHnnWtvMhKpCbPq5vl/0p9hCJC8CM/yh7lLzYsgcGx"}]},"_npmUser":{"name":"blgn94","email":"bilguun.bb94@gmail.com"},"directories":{},"maintainers":[{"name":"blgn94","email":"bilguun.bb94@gmail.com"},{"name":"callpro","email":"dev@callpro.mn"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/rtc-kit_0.1.0_1780030324183_0.9974723895376136"},"_hasShrinkwrap":false}},"time":{"created":"2025-08-18T03:09:50.929Z","modified":"2026-05-29T04:52:04.990Z","0.0.1":"2025-08-18T02:49:34.305Z","0.0.2":"2025-08-18T03:09:51.211Z","0.0.3":"2025-08-18T03:12:25.425Z","0.1.0":"2026-05-29T04:52:04.319Z"},"author":{"name":"CallPro LLC"},"license":"MIT","keywords":["wep-component","ui","components","rtc","calling","voip","callpro"],"description":"CallPro Web Components Kit for Web","maintainers":[{"name":"blgn94","email":"bilguun.bb94@gmail.com"},{"name":"callpro","email":"dev@callpro.mn"}],"readme":"# RTC Kit UI\n\n[![npm version](https://badge.fury.io/js/@callpromn%2Frtc-kit.svg)](https://www.npmjs.com/package/@callpromn/rtc-kit)\n[![npm downloads](https://img.shields.io/npm/dm/@callpromn/rtc-kit.svg)](https://www.npmjs.com/package/@callpromn/rtc-kit)\n[![License](https://img.shields.io/npm/l/@callpromn/rtc-kit.svg)](https://www.npmjs.com/package/@callpromn/rtc-kit?activeTab=code)\n\nЭнэхүү sdk нь Real-time communication (RTC) програм бүтээхэд зориулсан Web Components-ийн иж бүрэн сан юм. TypeScript хэлээр бичигдсэн бөгөөд бүх вэб фреймворкуудад хялбараар интеграцлах боломжтой.\n\n## Онцлогууд - Features\n\n✨ **Фреймворк хараат бус** - React, Vue, Angular эсвэл vanilla JavaScript зэрэг хэл болон сангууд дээр ажиллана.\n🎨 **Загвар солих боломжтой** - \"Dark mode\" бүхий дизайний сонголттой.\n🔧 **TypeScript дэмжлэг** - Хувьсагч болон фунлкцуудын typescript type-ууд тодорхойлогдсон.\n🚀 **Хамаарал байхгүй** - Хөнгөн бөгөөд хурдан ачаалах.\n\n## Суулгах - Installation\n\n```bash\nnpm install @callpromn/rtc-kit\n```\n\n## Хурдан эхлэх - Quick Start\n\n### Vanilla JavaScript/HTML\n\n```html\n<!DOCTYPE html>\n<html>\n<head>\n    <script type=\"module\">\n        import '@callpromn/rtc-kit';\n    </script>\n</head>\n<body>\n    <!-- Дуудлагын товчлуур - Call Button -->\n    <call-button to-phone-number=\"+1234567890\" theme=\"dark\"></call-button>\n    \n    <!-- Дугаар оруулах numpad -->\n    <rtc-numpad theme=\"dark\" max-length=\"10\"></rtc-numpad>\n    \n    <!-- Дугаар харуулах талбар - Number Display Field -->\n    <number-field phone-number=\"123456789\" theme=\"dark\"></number-field>\n</body>\n</html>\n```\n\n### Module Bundlers-ийн хамт (Webpack, Vite, гэх мэт)\n\n```javascript\nimport '@callpromn/rtc-kit';\n\n// Бүх компонентууд custom element-ээр ашиглах боломжтой\nconst callButton = document.createElement('call-button');\ncallButton.setAttribute('to-phone-number', '+1234567890');\ndocument.body.appendChild(callButton);\n```\n\n## Компонентууд - Components\n\n### 📞 Дуудлагын товчлуур - Call Button\nDefault дизайнтай товчлуураар гадагшаа дуудлага хийх.\n\n```html\n<call-button \n    to-phone-number=\"+1234567890\" \n    theme=\"dark\"\n    disabled=\"false\">\n</call-button>\n```\n\n**Атрибутууд - Attributes**\n- `to-phone-number` - Залгах утасны дугаар\n- `theme` - Light болон Dark mode (`\"light\"` | `\"dark\"`)\n- `disabled` - Товчлуурыг идэвхгүй болгох (`\"true\"` | `\"false\"`)\n- `style` - Тусгай CSS загвар\n\n---\n\n### ✅ Accept button\nИрж буй дуудлагыг хүлээн авах товчлуур.\n\n```html\n<accept-button theme=\"dark\"></accept-button>\n```\n\n**Атрибутууд - Attributes**\n- `theme` - Харагдах загвар (`\"light\"` | `\"dark\"`)\n- `disabled` - Товчлуурыг идэвхгүй болгох\n- `style` - Тусгай CSS загвар\n\n---\n\n### ❌ Decline button\nИрж буй дуудлагыг таслах товчлуур.\n\n```html\n<decline-button theme=\"dark\"></decline-button>\n```\n\n**Атрибутууд - Attributes**\n- `theme` - Харагдах загвар (`\"light\"` | `\"dark\"`)\n- `disabled` - Товчлуурыг идэвхгүй болгох\n- `style` - Тусгай CSS загвар\n\n---\n\n### 📞 End button\nИдэвхтэй буюу явагдаж байгаа дуудлагыг дуусгах товчлуур.\n\n```html\n<end-button theme=\"dark\"></end-button>\n```\n\n**Атрибутууд:**\n- `theme` - Харагдах загвар (`\"light\"` | `\"dark\"`)\n- `disabled` - Товчлуурыг идэвхгүй болгох\n- `style` - Тусгай CSS загвар\n\n---\n\n### 🎙️ Mic button\nДуудлагын үеэр микрофоныг асаах/унтраах.\n\n```html\n<mic-button theme=\"dark\"></mic-button>\n```\n\n**Атрибутууд - Attributes**\n- `theme` - Харагдах загвар (`\"light\"` | `\"dark\"`)\n- `disabled` - Товчлуурыг идэвхгүй болгох\n- `muted` - Анхны дуугүй төлөв\n- `style` - Тусгай CSS загвар\n\n---\n\n### 🔢 Numpad\nУтасны дугаар оруулахад зориулсан интерактив тоон самбар.\n\n```html\n<rtc-numpad \n    phone-number=\"\" \n    max-length=\"10\"\n    theme=\"dark\">\n</rtc-numpad>\n```\n\n**Атрибутууд - Attributes**\n- `phone-number` - Одоогийн утасны дугаарын утга\n- `max-length` - Оронын хамгийн их тоо (анхдагч: 8)\n- `theme` - Харагдах загвар (`\"light\"` | `\"dark\"`)\n- `style` - Тусгай CSS загвар\n\n**Events:**\n- `number-click` - Тоо дарагдах үед гарна\n  ```javascript\n  numpad.addEventListener('number-click', (event) => {\n      console.log('Дарагдсан:', event.detail.value);\n      console.log('Одоогийн дугаар:', event.detail.phoneNumber);\n  });\n  ```\n\n**Аргууд - Functions**\n- `getPhoneNumber()` - Одоогийн утасны дугаарыг авах\n- `setPhoneNumber(value)` - Утасны дугаарыг програмчлалаар тохируулах  \n- `clearPhoneNumber()` - Утасны дугаарыг арилгах\n\n---\n\n### 📱 Number field\nГараас оруулсан утасны дугаарыг харуулах талбар.\n\n```html\n<number-field \n    phone-number=\"1234567890\"\n    theme=\"dark\">\n</number-field>\n```\n\n**Атрибутууд - Attributes**\n- `phone-number` - Харуулах утасны дугаар\n- `theme` - Харагдах загвар (`\"light\"` | `\"dark\"`)\n- `style` - Тусгай CSS загвар\n\n---\n\n### ⌫ Number delete button\nДугаар устгах товчлуур.\n\n```html\n<number-delete-button \n    phone-number=\"123456\"\n    theme=\"dark\">\n</number-delete-button>\n```\n\n**Атрибутууд - Attributes**\n- `phone-number` - Одоогийн утасны дугаар (төлөв удирдахад)\n- `theme` - Харагдах загвар (`\"light\"` | `\"dark\"`)\n- `disabled` - Устгах тоо байхгүй үед идэвхгүй болгох\n- `style` - Тусгай CSS загвар\n\n## Загвар\n\nБүх компонентууд Light болон Dark mode-ийг дэмждэг:\n\n```html\n<!-- Хар загвар (анхдагч) -->\n<call-button theme=\"dark\"></call-button>\n\n<!-- Цагаан загвар -->\n<call-button theme=\"light\"></call-button>\n```\n\n### Тусгай загвар\n\nCSS-ын `style` атрибут ашиглан компонентынхоо загварыг солих боломжтой:\n\n```html\n<call-button \n    style=\"\n        --button-bg: #ff6b6b; \n        --button-color: white;\n        border-radius: 8px;\n    \">\n</call-button>\n```\n\n### Компонент загварын жишээнүүд\n\n#### Call button-ны загвар\n```html\n<!-- Тусгай Call button загвар -->\n<call-button \n    style=\"\n        background-color: #007bff;\n        width: 80px;\n        height: 80px;\n        border-radius: 50%;\n        box-shadow: 0 4px 20px rgba(0, 123, 255, 0.4);\n    \"\n    theme=\"dark\">\n</call-button>\n```\n\n#### Numpad-ны загвар\n```html\n<!-- Numpad-ны загвар -->\n<rtc-numpad \n    style=\"\n        width: 200px;\n        height: 250px;\n        background: #f8f9fa;\n        border-radius: 16px;\n        border: 2px solid #e9ecef;\n    \"\n    theme=\"light\">\n</rtc-numpad>\n```\n\n#### Number field-ны загвар\n```html\n<!-- Number field-ны загвар -->\n<number-field \n    style=\"\n        background: rgba(255, 255, 255, 0.05);\n        border: 2px solid #007bff;\n        border-radius: 12px;\n        padding: 16px 20px;\n        font-size: 24px;\n        font-weight: 600;\n        color: #007bff;\n        text-align: center;\n        min-height: 60px;\n        backdrop-filter: blur(10px);\n    \"\n    phone-number=\"123456789\"\n    theme=\"dark\">\n</number-field>\n```\n\n## Advanced Usage\n\n### Бүрэн диалер бүтээх\n\n```html\n<div class=\"phone-dialer\">\n    <!-- Дугаар харуулах -->\n    <number-field id=\"numberDisplay\" phone-number=\"\" theme=\"dark\"></number-field>\n    \n    <!-- Numpad -->\n    <rtc-numpad id=\"numpad\" theme=\"dark\" max-length=\"15\"></rtc-numpad>\n    \n    <!-- Controller -->\n    <div class=\"controls\">\n        <number-delete-button id=\"deleteBtn\" theme=\"dark\"></number-delete-button>\n        <call-button id=\"callBtn\" theme=\"dark\"></call-button>\n    </div>\n</div>\n\n<script>\n    const numpad = document.getElementById('numpad');\n    const numberDisplay = document.getElementById('numberDisplay');\n    const callBtn = document.getElementById('callBtn');\n    const deleteBtn = document.getElementById('deleteBtn');\n    \n    // Дугаар оруулах\n    numpad.addEventListener('number-click', (event) => {\n        const phoneNumber = event.detail.phoneNumber;\n        numberDisplay.setAttribute('phone-number', phoneNumber);\n        callBtn.setAttribute('to-phone-number', phoneNumber);\n        deleteBtn.setAttribute('phone-number', phoneNumber);\n    });\n    \n    // Дугаар устгах\n    deleteBtn.addEventListener('click', () => {\n        const currentNumber = numpad.getPhoneNumber();\n        const newNumber = currentNumber.slice(0, -1);\n        numpad.setPhoneNumber(newNumber);\n        numberDisplay.setAttribute('phone-number', newNumber);\n        callBtn.setAttribute('to-phone-number', newNumber);\n    });\n</script>\n```\n\n## Browser Support\n\n- ✅ Chrome 67+\n- ✅ Firefox 63+  \n- ✅ Safari 13.1+\n- ✅ Edge 79+\n\n## TypeScript дэмжлэг\n\nБүрэн TypeScript type тодорхойлолт багтсан:\n\n```typescript\nimport '@callpromn/rtc-kit';\n\n// Type-safe элемент үүсгэх\nconst callButton = document.createElement('call-button') as HTMLElement & {\n    'to-phone-number': string;\n    theme: 'light' | 'dark';\n    disabled: boolean;\n};\n```\n\n## Фреймворк интеграци - Framework integration\n\nЭдгээр нь vanilla Web Components боловч бүх томоохон фреймворкуудтай хялбарханаар ажиллана:\n\n- **React**: [@callpromn/rtc-kit-react](https://www.npmjs.com/package/@callpromn/rtc-kit-react)\n- **Vue**: Тун удахгүй\n- **Angular**: Тун удахгүй\n- **Svelte**: Тун удахгүй\n\n## Лиценз - License\n\nЭнэ төсөл нь CallPro LLC-ийн өмчийн програм хангамж юм. Дэлгэрэнгүй мэдээллийг [LICENSE.txt](https://www.npmjs.com/package/@callpromn/rtc-kit?activeTab=code)-ээс үзнэ үү.\n\n## Дэмжлэг - Support\n\n- 📧 И-мэйл: dev@callpro.mn\n- 📖 Баримт бичиг - documentation: [https://docs.callpro.mn](https://docs.callpro.mn)\n\n---\n\nMade with ❤️ by [CallPro LLC](https://callpro.mn)\n","readmeFilename":"README.md"}