@whereby.com/browser-sdk 2.0.0 → 2.1.0-beta.1

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/README.md CHANGED
@@ -1,9 +1,6 @@
1
1
  # `@whereby.com/browser-sdk`
2
2
 
3
- Whereby browser SDK is a library for seamless integration of Whereby
4
- (https://whereby.com) video calls into your web application.
5
-
6
- **For a more detailed set of instructions, including the building of a [simple telehealth app](https://docs.whereby.com/whereby-101/create-your-video-experience/in-a-web-page/using-whereby-react-hooks-build-a-telehealth-app), please see our [documentation](https://docs.whereby.com/reference/react-hooks-reference).**
3
+ The Whereby browser SDK is a library for seamless integration of [Whereby](https://whereby.com/) video calls into your web application. You can use it to build a [completely custom integration](https://docs.whereby.com/whereby-101/create-your-video/in-a-web-page/using-whereby-react-hooks-build-a-telehealth-app) of Whereby-powered video calls using [React Hooks](https://docs.whereby.com/reference/react-hooks-reference), or you can also embed pre-built Whereby rooms in a web application [using a Web Component](https://docs.whereby.com/whereby-101/create-your-video/in-a-web-page/using-the-whereby-embed-element).
7
4
 
8
5
  ## Installation
9
6
 
@@ -21,8 +18,8 @@ yarn add @whereby.com/browser-sdk
21
18
 
22
19
  > [!IMPORTANT]
23
20
  > In order to make use of this functionality, you must have a Whereby account
24
- > from which you can create room urls, either [manually or through our
25
- > API](https://docs.whereby.com/creating-and-deleting-rooms).
21
+ > from which you can create room URLs, either [manually or through the Whereby
22
+ > API](https://docs.whereby.com/whereby-101/creating-and-deleting-rooms).
26
23
 
27
24
  ### React hooks
28
25
 
@@ -43,24 +40,25 @@ function MyPreCallUX() {
43
40
  const { currentCameraDeviceId, cameraDevices, localStream } = localMedia.state;
44
41
  const { setCameraDevice, toggleCameraEnabled } = localMedia.actions;
45
42
 
46
- return <div className="preCallView">
47
- { /* Render any UI, making use of state */ }
48
- { cameraDevices.map((d) => (
49
- <p
50
- key={d.deviceId}
51
- onClick={() => {
52
- if (d.deviceId !== currentCameraDeviceId) {
53
- setCameraDevice(d.deviceId);
54
- }
55
- }}
56
- >
57
- {d.label}
58
- </p>
59
- )) }
60
- <VideoView muted stream={localStream} />
61
- </div>;
43
+ return (
44
+ <div className="preCallView">
45
+ {/* Render any UI, making use of state */}
46
+ {cameraDevices.map((d) => (
47
+ <p
48
+ key={d.deviceId}
49
+ onClick={() => {
50
+ if (d.deviceId !== currentCameraDeviceId) {
51
+ setCameraDevice(d.deviceId);
52
+ }
53
+ }}
54
+ >
55
+ {d.label}
56
+ </p>
57
+ ))}
58
+ <VideoView muted stream={localStream} />
59
+ </div>
60
+ );
62
61
  }
63
-
64
62
  ```
65
63
 
66
64
  #### useRoomConnection
@@ -111,21 +109,17 @@ client";` to the top of component, like in the following example:
111
109
  import { VideoView, useLocalMedia } from "@whereby.com/browser-sdk/react";
112
110
 
113
111
  export default function MyNextVideoExperience() {
114
- const { state, actions } = useLocalMedia({ audio: false, video: true });
112
+ const { state, actions } = useLocalMedia({ audio: false, video: true });
115
113
 
116
- return (
117
- <p>{ state.localStream && <VideoView muted stream={state.localStream} /> }</p>
118
- );
114
+ return <p>{state.localStream && <VideoView muted stream={state.localStream} />}</p>;
119
115
  }
120
-
121
116
  ```
122
117
 
123
118
  ### Web component for embedding
124
119
 
125
- Use the `<whereby-embed />` web component to make use of Whereby's pre-built
126
- responsive UI. Refer to our
127
- [documentation](https://docs.whereby.com/embedding-rooms/in-a-web-page/using-the-whereby-embed-element)
128
- to learn which attributes are supported.
120
+ Use the `<whereby-embed />` web component to make use of Whereby's pre-built responsive UI. Refer to our [guide](https://docs.whereby.com/whereby-101/create-your-video/in-a-web-page/using-the-whereby-embed-element) and
121
+ [Web Component Reference](https://docs.whereby.com/reference/using-the-whereby-embed-element)
122
+ to learn which attributes are supported, how to listen to events, and send commands.
129
123
 
130
124
  #### React
131
125
 
@@ -141,14 +135,19 @@ export default MyComponent;
141
135
 
142
136
  #### In plain HTML
143
137
 
144
- ```html
138
+ You can import it in your project as follows:
139
+
140
+ ```
141
+ import "@whereby.com/browser-sdk/embed"
142
+ ```
143
+
144
+ And embed rooms using the Web Component.
145
+
146
+ ```
145
147
  <html>
146
- <head>
147
- <script src="...."></script>
148
- </head>
149
148
  <body>
150
149
  <div class="container">
151
- <whereby-embed room="<room_url>" />
150
+ <whereby-embed room="some-room" />
152
151
  </div>
153
152
  </body>
154
153
  </html>
@@ -157,4 +156,25 @@ export default MyComponent;
157
156
  > [!NOTE]
158
157
  > Although we have just higlighted two combinations of how to load and use the
159
158
  > web component, it should be possible to use this library with all the major
160
- > frontend frameworks.
159
+ > frontend frameworks and bundlers.
160
+ >
161
+ > If you don't want to use a bundler, you can use a script tag, like so:
162
+ >
163
+ > ```
164
+ > <script src="https://cdn.srv.whereby.com/embed/v2-embed.js"></script>
165
+ > ```
166
+
167
+ ## Migrating from v1 to v2
168
+
169
+ Migration from v1 to v2 is only relevant for users of the `<whereby-embed />`
170
+ web component. The following changes are necessary when upgrading to v2:
171
+
172
+ - If you import the web component in your app, you need to add `/embed` to the
173
+ import path, like so `import "whereby.com/browser-sdk/embed"`
174
+ - If you load the web component using a `<script>` tag, the src needs to be
175
+ changed to `https://cdn.srv.whereby.com/embed/v2-embed.js`. In addition, the
176
+ `type="module"` attribute is no longer required and can be removed.
177
+
178
+ The functionality of the web component should be exactly as the latest version
179
+ on the v1 branch, but a TypeScript definition is now available for projects
180
+ using this language.
package/package.json CHANGED
@@ -1,16 +1,21 @@
1
1
  {
2
2
  "name": "@whereby.com/browser-sdk",
3
- "version": "2.0.0",
3
+ "version": "2.1.0-beta.1",
4
4
  "description": "Modules for integration Whereby video in web apps",
5
5
  "author": "Whereby AS",
6
6
  "license": "MIT",
7
7
  "repository": {
8
8
  "type": "git",
9
- "url": "https://github.com/whereby/browser-sdk.git"
9
+ "url": "https://github.com/whereby/sdk.git",
10
+ "directory": "packages/browser-sdk"
10
11
  },
11
12
  "browserslist": "> 0.5%, last 2 versions, not dead",
12
13
  "source": "src/index.js",
13
14
  "exports": {
15
+ "./core": {
16
+ "import": "./dist/core/index.js",
17
+ "types": "./dist/core/index.d.ts"
18
+ },
14
19
  "./react": {
15
20
  "import": "./dist/react/index.esm.js",
16
21
  "types": "./dist/react/index.d.ts"
@@ -26,6 +31,9 @@
26
31
  },
27
32
  "typesVersions": {
28
33
  "*": {
34
+ "core": [
35
+ "dist/core/index.d.ts"
36
+ ],
29
37
  "react": [
30
38
  "dist/react/index.d.ts"
31
39
  ],
@@ -46,13 +54,10 @@
46
54
  "build": "rollup -c rollup.config.js",
47
55
  "build:storybook": "storybook build",
48
56
  "dev": "storybook dev -p 6006",
49
- "install:e2e-sample-app": "cd test/sample-app && yarn custom_install",
50
- "start:e2e-sample-app": "cd test/sample-app && yarn start",
51
57
  "test": "yarn test:lint && yarn test:unit",
52
58
  "test:lint": "eslint src/",
53
- "test:unit": "node --experimental-vm-modules node_modules/jest/bin/jest.js",
54
- "test:unit:watch": "node --experimental-vm-modules node_modules/jest/bin/jest.js --watch",
55
- "test:e2e": "playwright test",
59
+ "test:unit": "node --experimental-vm-modules ../../node_modules/jest/bin/jest.js",
60
+ "test:unit:watch": "node --experimental-vm-modules ../../node_modules/jest/bin/jest.js --watch",
56
61
  "storybook": "storybook dev -p 6006",
57
62
  "build-storybook": "storybook build"
58
63
  },
@@ -62,53 +67,43 @@
62
67
  "@babel/preset-env": "^7.23.2",
63
68
  "@babel/preset-react": "^7.22.15",
64
69
  "@babel/preset-typescript": "^7.23.2",
65
- "@playwright/test": "^1.38.1",
66
70
  "@rollup/plugin-commonjs": "^25.0.7",
67
71
  "@rollup/plugin-json": "^6.0.1",
68
72
  "@rollup/plugin-node-resolve": "^15.2.3",
69
73
  "@rollup/plugin-replace": "^5.0.5",
70
74
  "@storybook/addon-actions": "^7.5.2",
71
- "@storybook/addon-essentials": "^7.5.2",
72
- "@storybook/addon-links": "^7.5.2",
75
+ "@storybook/addon-essentials": "^7.6.13",
76
+ "@storybook/addon-links": "^7.6.13",
73
77
  "@storybook/react": "^7.5.2",
74
78
  "@storybook/react-webpack5": "^7.5.2",
75
79
  "@testing-library/react": "^14.0.0",
76
80
  "@types/btoa": "^1.2.3",
77
81
  "@types/chrome": "^0.0.210",
78
- "@types/jest": "^29.2.4",
79
- "@types/node": "^20.7.1",
82
+ "@types/node": "^20.11.16",
80
83
  "@types/react": "^18.0.26",
81
84
  "@types/uuid": "^9.0.7",
82
- "@typescript-eslint/eslint-plugin": "^5.46.1",
83
- "@typescript-eslint/parser": "^5.46.1",
84
85
  "babel-loader": "^8.2.5",
85
86
  "deep-object-diff": "^1.1.9",
86
87
  "dotenv": "^16.3.1",
87
88
  "dotenv-run-script": "^0.4.1",
88
- "eslint": "^8.29.0",
89
- "eslint-plugin-jest": "^26.5.3",
90
- "jest": "29.4.3",
91
- "jest-environment-jsdom": "29.4.3",
92
89
  "lit-html": "^2.5.0",
93
- "prettier": "^2.7.1",
94
90
  "react": "^18.2.0",
95
91
  "react-dom": "^18.2.0",
96
92
  "rimraf": "^3.0.2",
97
93
  "rollup": "^4.3.0",
98
94
  "rollup-plugin-dts": "^6.1.0",
95
+ "rollup-plugin-polyfill-node": "^0.13.0",
99
96
  "rollup-plugin-terser": "^7.0.2",
100
97
  "rollup-plugin-typescript2": "^0.36.0",
101
98
  "storybook": "^7.5.2",
102
- "ts-jest": "29.0.5",
103
99
  "tslib": "^2.4.1",
104
- "typescript": "^4.9.4",
105
100
  "uuid": "^9.0.1",
106
101
  "yalc": "^1.0.0-pre.53"
107
102
  },
108
103
  "dependencies": {
109
104
  "@reduxjs/toolkit": "^2.0.1",
110
105
  "@swc/helpers": "^0.3.13",
111
- "@whereby/jslib-media": "whereby/jslib-media.git#1.4.1",
106
+ "@whereby/jslib-media": "whereby/jslib-media.git#1.7.2",
112
107
  "axios": "^1.2.3",
113
108
  "btoa": "^1.2.1",
114
109
  "events": "^3.3.0",
@@ -122,5 +117,8 @@
122
117
  "string-width": "^4",
123
118
  "jackspeak": "2.1.1",
124
119
  "wrap-ansi": "7.0.0"
120
+ },
121
+ "publishConfig": {
122
+ "access": "public"
125
123
  }
126
124
  }
@@ -1,16 +0,0 @@
1
- var whereby=function(){"use strict";
2
- /*! (c) Andrea Giammarchi - ISC */var e={};try{e.WeakMap=WeakMap}catch(t){e.WeakMap=function(e,t){var n=t.defineProperty,r=t.hasOwnProperty,s=o.prototype;return s.delete=function(e){return this.has(e)&&delete e[this._]},s.get=function(e){return this.has(e)?e[this._]:void 0},s.has=function(e){return r.call(e,this._)},s.set=function(e,t){return n(e,this._,{configurable:!0,value:t}),this},o;function o(t){n(this,"_",{value:"_@ungap/weakmap"+e++}),t&&t.forEach(a,this)}function a(e){this.set(e[0],e[1])}}(Math.random(),Object)}var t=e.WeakMap,n={};try{n.Event=new Event(".").constructor}catch(e){try{n.Event=new CustomEvent(".").constructor}catch(e){n.Event=function(e,t){t||(t={});var n=document.createEvent("Event"),r=!!t.bubbles,s=!!t.cancelable;n.initEvent(e,r,s);try{n.bubbles=r,n.cancelable=s}catch(n){}return n}}}var r=n.Event,s={};
3
- /*! (c) Andrea Giammarchi - ISC */try{s.WeakSet=WeakSet}catch(e){!function(e){var t=new e,n=r.prototype;function r(n){t.set(this,new e),n&&n.forEach(this.add,this)}n.add=function(e){return t.get(this).set(e,1),this},n.delete=function(e){return t.get(this).delete(e)},n.has=function(e){return t.get(this).has(e)},s.WeakSet=r}(WeakMap)}var o,a,i,c=s.WeakSet,l="-"+Math.random().toFixed(6)+"%",u=!1;
4
- /*! (c) Andrea Giammarchi - ISC */try{o=document.createElement("template"),i="tabindex",(a="content")in o&&(o.innerHTML="<p "+i+'="'+l+'"></p>',o[a].childNodes[0].getAttribute(i)==l)||(l="_dt: "+l.slice(1,-1)+";",u=!0)}catch(e){}var h="\x3c!--"+l+"--\x3e",f=8,d=1,p=3,g=/^(?:plaintext|script|style|textarea|title|xmp)$/i,m=/^(?:area|base|br|col|embed|hr|img|input|keygen|link|menuitem|meta|param|source|track|wbr)$/i;
5
- /*! (c) Andrea Giammarchi - ISC */
6
- function v(e){return e.join(h).replace(k,_).replace(x,A)}var b=" \\f\\n\\r\\t",y="[^"+b+"\\/>\"'=]+",w="["+b+"]+"+y,E="<([A-Za-z]+[A-Za-z0-9:._-]*)((?:",C="(?:\\s*=\\s*(?:'[^']*?'|\"[^\"]*?\"|<[^>]*?>|"+y.replace("\\/","")+"))?)",x=new RegExp(E+w+C+"+)(["+b+"]*/?>)","g"),k=new RegExp(E+w+C+"*)(["+b+"]*/>)","g"),N=new RegExp("("+w+"\\s*=\\s*)(['\"]?)"+h+"\\2","gi");function A(e,t,n,r){return"<"+t+n.replace(N,$)+r}function $(e,t,n){return t+(n||'"')+l+(n||'"')}function _(e,t,n){return m.test(t)?e:"<"+t+n+"></"+t+">"}const{isArray:S}=Array,{indexOf:j,slice:O}=[];var L=e=>({get:t=>e.get(t),set:(t,n)=>(e.set(t,n),n)});const M=(e,t)=>111===e.nodeType?1/t<0?t?(({firstChild:e,lastChild:t})=>{const n=document.createRange();return n.setStartAfter(e),n.setEndAfter(t),n.deleteContents(),e})(e):e.lastChild:t?e.valueOf():e.firstChild:e,T=e=>{const{childNodes:t}=e,{length:n}=t;if(n<2)return n?t[0]:e;const r=O.call(t,0);return{ELEMENT_NODE:1,nodeType:111,firstChild:r[0],lastChild:r[n-1],valueOf(){if(t.length!==n){let t=0;for(;t<n;)e.appendChild(r[t++])}return e}}};
7
- /*! (c) Andrea Giammarchi - ISC */
8
- var R=function(e){var t="fragment",n="template",r="content"in o(n)?function(e){var t=o(n);return t.innerHTML=e,t.content}:function(e){var r=o(t),a=o(n),i=null;if(/^[^\S]*?<(col(?:group)?|t(?:head|body|foot|r|d|h))/i.test(e)){var c=RegExp.$1;a.innerHTML="<table>"+e+"</table>",i=a.querySelectorAll(c)}else a.innerHTML=e,i=a.childNodes;return s(r,i),r};return function(e,t){return("svg"===t?a:r)(e)};function s(e,t){for(var n=t.length;n--;)e.appendChild(t[0])}function o(n){return n===t?e.createDocumentFragment():e.createElementNS("http://www.w3.org/1999/xhtml",n)}function a(e){var n=o(t),r=o("div");return r.innerHTML='<svg xmlns="http://www.w3.org/2000/svg">'+e+"</svg>",s(n,r.firstChild.childNodes),n}}(document),U=(e,t,n,r,s)=>{const o=n.length;let a=t.length,i=o,c=0,l=0,u=null;for(;c<a||l<i;)if(a===c){const t=i<o?l?r(n[l-1],-0).nextSibling:r(n[i-l],0):s;for(;l<i;)e.insertBefore(r(n[l++],1),t)}else if(i===l)for(;c<a;)u&&u.has(t[c])||e.removeChild(r(t[c],-1)),c++;else if(t[c]===n[l])c++,l++;else if(t[a-1]===n[i-1])a--,i--;else if(t[c]===n[i-1]&&n[l]===t[a-1]){const s=r(t[--a],-1).nextSibling;e.insertBefore(r(n[l++],1),r(t[c++],-1).nextSibling),e.insertBefore(r(n[--i],1),s),t[a]=n[i]}else{if(!u){u=new Map;let e=l;for(;e<i;)u.set(n[e],e++)}if(u.has(t[c])){const s=u.get(t[c]);if(l<s&&s<i){let o=c,h=1;for(;++o<a&&o<i&&u.get(t[o])===s+h;)h++;if(h>s-l){const o=r(t[c],0);for(;l<s;)e.insertBefore(r(n[l++],1),o)}else e.replaceChild(r(n[l++],1),r(t[c++],-1))}else c++}else e.removeChild(r(t[c++],-1))}return n},W=function(e,t,n,r,s){var o=s in e,a=e.createDocumentFragment();return a[t](e[r]("g")),a[t](e[r]("")),(o?e[s](a,!0):a[n](!0)).childNodes.length<2?function e(r,s){for(var o=r[n](),a=r.childNodes||[],i=a.length,c=0;s&&c<i;c++)o[t](e(a[c],s));return o}:o?e[s]:function(e,t){return e[n](!!t)}}(document,"appendChild","cloneNode","createTextNode","importNode"),P="".trim||function(){return String(this).replace(/^\s+|\s+/g,"")},Z=u?function(e,t){var n=t.join(" ");return t.slice.call(e,0).sort((function(e,t){return n.indexOf(e.name)<=n.indexOf(t.name)?-1:1}))}:function(e,t){return t.slice.call(e,0)};function B(e,t){for(var n=t.length,r=0;r<n;)e=e.childNodes[t[r++]];return e}function z(e,t,n,r){for(var s=e.childNodes,o=s.length,a=0;a<o;){var i=s[a];switch(i.nodeType){case d:var c=r.concat(a);D(i,t,n,c),z(i,t,n,c);break;case f:var u=i.textContent;if(u===l)n.shift(),t.push(g.test(e.nodeName)?H(e,r):V(i,r.concat(a)));else switch(u.slice(0,2)){case"/*":if("*/"!==u.slice(-2))break;case"👻":e.removeChild(i),a--,o--}break;case p:g.test(e.nodeName)&&P.call(i.textContent)===h&&(n.shift(),t.push(H(e,r)))}a++}}function D(e,t,n,r){for(var s=e.attributes,o=[],a=[],i=Z(s,n),c=i.length,f=0;f<c;){var d,p=i[f++],g=p.value===l;if(g||1<(d=p.value.split(h)).length){var m=p.name;if(o.indexOf(m)<0){o.push(m);var v=n.shift().replace(g?/^(?:|[\S\s]*?\s)(\S+?)\s*=\s*('|")?$/:new RegExp("^(?:|[\\S\\s]*?\\s)("+m+")\\s*=\\s*('|\")[\\S\\s]*","i"),"$1"),b=s[v]||s[v.toLowerCase()];if(g)t.push(F(b,r,v,null));else{for(var y=d.length-2;y--;)n.shift();t.push(F(b,r,v,d))}}a.push(p)}}f=0;for(var w=(0<(c=a.length)&&u&&!("ownerSVGElement"in e));f<c;){var E=a[f++];w&&(E.value=""),e.removeAttribute(E.name)}var C=e.nodeName;if(/^script$/i.test(C)){var x=document.createElement(C);for(c=s.length,f=0;f<c;)x.setAttributeNode(s[f++].cloneNode(!0));x.textContent=e.textContent,e.parentNode.replaceChild(x,e)}}function V(e,t){return{type:"any",node:e,path:t}}function F(e,t,n,r){return{type:"attr",node:e,path:t,name:n,sparse:r}}function H(e,t){return{type:"text",node:e,path:t}}var I=L(new t);function q(e,t){var n=(e.convert||v)(t),r=e.transform;r&&(n=r(n));var s=R(n,e.type);K(s);var o=[];return z(s,o,t.slice(0),[]),{content:s,updates:function(n){for(var r=[],s=o.length,a=0,i=0;a<s;){var c=o[a++],l=B(n,c.path);switch(c.type){case"any":r.push({fn:e.any(l,[]),sparse:!1});break;case"attr":var u=c.sparse,h=e.attribute(l,c.name,c.node);null===u?r.push({fn:h,sparse:!1}):(i+=u.length-2,r.push({fn:h,sparse:!0,values:u}));break;case"text":r.push({fn:e.text(l),sparse:!1}),l.textContent=""}}return s+=i,function(){var e=arguments.length;if(s!==e-1)throw new Error(e-1+" values instead of "+s+"\n"+t.join("${value}"));for(var o=1,a=1;o<e;){var i=r[o-a];if(i.sparse){var c=i.values,l=c[0],u=1,h=c.length;for(a+=h-2;u<h;)l+=arguments[o++]+c[u++];i.fn(l)}else i.fn(arguments[o++])}return n}}}}var G=[];function J(e){var t=G,n=K;return function(r){return t!==r&&(n=function(e,t){var n=I.get(t)||I.set(t,q(e,t));return n.updates(W.call(document,n.content,!0))}(e,t=r)),n.apply(null,arguments)}}function K(e){for(var t=e.childNodes,n=t.length;n--;){var r=t[n];1!==r.nodeType&&0===P.call(r.textContent).length&&e.removeChild(r)}}
9
- /*! (c) Andrea Giammarchi - ISC */var Q=function(){var e=/acit|ex(?:s|g|n|p|$)|rph|ows|mnc|ntw|ine[ch]|zoo|^ord/i,t=/([^A-Z])([A-Z]+)/g;return function(e,t){return"ownerSVGElement"in e?function(e,t){var n;t?n=t.cloneNode(!0):(e.setAttribute("style","--hyper:style;"),n=e.getAttributeNode("style"));return n.value="",e.setAttributeNode(n),r(n,!0)}(e,t):r(e.style,!1)};function n(e,t,n){return t+"-"+n.toLowerCase()}function r(r,s){var o,a;return function(i){var c,l,u,h;switch(typeof i){case"object":if(i){if("object"===o){if(!s&&a!==i)for(l in a)l in i||(r[l]="")}else s?r.value="":r.cssText="";for(l in c=s?{}:r,i)u="number"!=typeof(h=i[l])||e.test(l)?h:h+"px",!s&&/^--/.test(l)?c.setProperty(l,u):c[l]=u;o="object",s?r.value=function(e){var r,s=[];for(r in e)s.push(r.replace(t,n),":",e[r],";");return s.join("")}(a=c):a=i;break}default:a!=i&&(o="string",a=i,s?r.value=i||"":r.cssText=i||"")}}}}();const X=(e,t)=>{let n,r=!0;const s=document.createAttributeNS(null,t);return t=>{n!==t&&(n=t,null==n?r||(e.removeAttributeNode(s),r=!0):(s.value=t,r&&(e.setAttributeNodeNS(s),r=!1)))}},Y=({dataset:e})=>t=>{for(const n in t){const r=t[n];null==r?delete e[n]:e[n]=r}},ee=(e,t)=>"dataset"===t?Y(e):n=>{e[t]=n},te=/^(?:form|list)$/i,ne=(e,t)=>e.ownerDocument.createTextNode(t);function re(e){return this.type=e,J(this)}function se(e){return e(this)}re.prototype={attribute(e,t,n){const r="svg"===this.type;switch(t){case"class":if(r)return X(e,t);t="className";case"props":return ee(e,t);case"aria":return(e=>t=>{for(const n in t){const r="role"===n?n:`aria-${n}`,s=t[n];null==s?e.removeAttribute(r):e.setAttribute(r,s)}})(e);case"style":return Q(e,n,r);case"ref":return(e=>t=>{"function"==typeof t?t(e):t.current=e})(e);case".dataset":return Y(e);default:return"."===t.slice(0,1)?ee(e,t.slice(1)):"?"===t.slice(0,1)?((e,t,n)=>r=>{n!==!!r&&((n=!!r)?e.setAttribute(t,""):e.removeAttribute(t))})(e,t.slice(1)):"on"===t.slice(0,2)?((e,t)=>{let n,r=t.slice(2);return!(t in e)&&t.toLowerCase()in e&&(r=r.toLowerCase()),t=>{const s=S(t)?t:[t,!1];n!==s[0]&&(n&&e.removeEventListener(r,n,s[1]),(n=s[0])&&e.addEventListener(r,n,s[1]))}})(e,t):!(t in e)||r||te.test(t)?X(e,t):((e,t)=>{let n;return r=>{n!==r&&(n=r,e[t]!==r&&(null==r?(e[t]="",e.removeAttribute(t)):e[t]=r))}})(e,t)}},any(e,t){const{type:n}=this;let r,s=!1;const o=a=>{switch(typeof a){case"string":case"number":case"boolean":s?r!==a&&(r=a,t[0].textContent=a):(s=!0,r=a,t=U(e.parentNode,t,[ne(e,a)],M,e));break;case"function":o(a(e));break;case"object":case"undefined":if(null==a){s=!1,t=U(e.parentNode,t,[],M,e);break}default:if(s=!1,r=a,S(a))if(0===a.length)t.length&&(t=U(e.parentNode,t,[],M,e));else switch(typeof a[0]){case"string":case"number":case"boolean":o(String(a));break;case"function":o(a.map(se,e));break;case"object":S(a[0])&&(a=a.concat.apply([],a));default:t=U(e.parentNode,t,a,M,e)}else"ELEMENT_NODE"in a?t=U(e.parentNode,t,11===a.nodeType?O.call(a.childNodes):[a],M,e):"text"in a?o(String(a.text)):"any"in a?o(a.any):"html"in a?t=U(e.parentNode,t,O.call(R([].concat(a.html).join(""),n).childNodes),M,e):"length"in a&&o(O.call(a))}};return o},text(e){let t;const n=r=>{if(t!==r){t=r;const s=typeof r;"object"===s&&r?"text"in r?n(String(r.text)):"any"in r?n(r.any):"html"in r?n([].concat(r.html).join("")):"length"in r&&n(O.call(r).join("")):"function"===s?n(r(e)):e.textContent=null==r?"":r}};return n}};const{create:oe,freeze:ae,keys:ie}=Object,ce=re.prototype,le=L(new t),ue=e=>({html:fe("html",e),svg:fe("svg",e),render(t,n){const r="function"==typeof n?n():n,s=le.get(t)||le.set(t,he()),o=r instanceof ge?de(e,s,r):r;return o!==s.wire&&(s.wire=o,t.textContent="",t.appendChild(o.valueOf())),t}}),he=()=>({stack:[],entry:null,wire:null}),fe=(e,n)=>{const r=L(new t);return s.for=(e,t)=>{const o=r.get(e)||r.set(e,oe(null));return o[t]||(o[t]=(e=>function(){return de(n,e,s.apply(null,arguments))})(he()))},s.node=function(){return de(n,he(),s.apply(null,arguments)).valueOf()},s;function s(){return new ge(e,ve.apply(null,arguments))}},de=(e,t,{type:n,template:r,values:s})=>{const{length:o}=s;pe(e,t,s,o);let{entry:a}=t;if(a&&a.template===r&&a.type===n)a.tag(r,...s);else{const o=new e(n);t.entry=a={type:n,template:r,tag:o,wire:T(o(r,...s))}}return a.wire},pe=(e,{stack:t},n,r)=>{for(let s=0;s<r;s++){const r=n[s];r instanceof me?n[s]=de(e,t[s]||(t[s]=he()),r):S(r)?pe(e,t[s]||(t[s]=he()),r,r.length):t[s]=null}r<t.length&&t.splice(r)};function ge(e,t){this.type=e,this.template=t.shift(),this.values=t}ae(ge);const me=ge;function ve(){let e=[],t=0,{length:n}=arguments;for(;t<n;)e.push(arguments[t++]);return e}ue(re);var be="function"==typeof cancelAnimationFrame,ye=be?cancelAnimationFrame:clearTimeout,we=be?requestAnimationFrame:setTimeout;function Ee(e){var t,n,r,s,o;return i(),function(e,i,l){return r=e,s=i,o=l,n||(n=we(a)),--t<0&&c(!0),c};function a(){i(),r.apply(s,o||[])}function i(){t=e||1/0,n=be?0:null}function c(e){var t=!!n;return t&&(ye(n),e&&a()),t}}
10
- /*! (c) Andrea Giammarchi - ISC */let Ce=null;const xe=L(new WeakMap),ke=(e,t,n)=>{e.apply(t,n)},Ne={async:!1,always:!1},Ae=(e,t)=>"function"==typeof t?t(e):t,$e=(e,t,n,r)=>{const s=Ce.i++,{hook:o,args:a,stack:i,length:c}=Ce;s===c&&(Ce.length=i.push({}));const l=i[s];if(l.args=a,s===c){const s="function"==typeof n,{async:a,always:i}=(s?r:n)||r||Ne;l.$=s?n(t):Ae(void 0,t),l._=a?xe.get(o)||xe.set(o,Ee()):ke,l.f=t=>{const n=e(l.$,t);(i||l.$!==n)&&(l.$=n,l._(o,null,l.args))}}return[l.$,l.f]},_e=new WeakMap;function Se({hook:e}){return e===this.hook}const je=new WeakMap,Oe=L(je),Le=()=>{},Me=e=>(t,n)=>{const r=Ce.i++,{hook:s,after:o,stack:a,length:i}=Ce;if(r<i){const s=a[r],{update:i,values:c,stop:l}=s;if(!n||n.some(Pe,c)){s.values=n,e&&l(e);const{clean:r}=s;r&&(s.clean=null,r());const a=()=>{s.clean=t()};e?i(a):o.push(a)}}else{const r=e?Ee():Le,i={clean:null,update:r,values:n,stop:Le};Ce.length=a.push(i),(Oe.get(s)||Oe.set(s,[])).push(i);const c=()=>{i.clean=t()};e?i.stop=r(c):o.push(c)}},Te=e=>{(je.get(e)||[]).forEach((e=>{const{clean:t,stop:n}=e;n(),t&&(e.clean=null,t())}))};je.has.bind(je);const Re=Me(!0),Ue=Me(!1),We=(e,t)=>{const n=Ce.i++,{stack:r,length:s}=Ce;return n===s?Ce.length=r.push({$:e(),_:t}):t&&!t.some(Pe,r[n]._)||(r[n]={$:e(),_:t}),r[n].$};function Pe(e,t){return e!==this[t]}let Ze=null;try{Ze=new{o(){}}.o}catch(Bt){}let Be=e=>class extends e{};if(Ze){const{getPrototypeOf:e,setPrototypeOf:t}=Object,{construct:n}="object"==typeof Reflect?Reflect:{construct(e,n,r){const s=[null];for(let e=0;e<n.length;e++)s.push(n[e]);const o=e.bind.apply(e,s);return t(new o,r.prototype)}};Be=function(r,s){function o(){return n(s?e(r):r,arguments,o)}return t(o.prototype,r.prototype),t(o,r)}}const ze={map:{},re:null},De=e=>new RegExp(`<(/)?(${e.join("|")})([^A-Za-z0-9:._-])`,"g");let Ve=null;const Fe=(e,t)=>{const{map:n,re:r}=Ve||t;return e.replace(r,((e,t,r,s)=>{const{tagName:o,is:a,element:i}=n[r];return i?t?`</${a}>`:`<${a}${s}`:t?`</${o}>`:`<${o} is="${a}"${s}`}))},He=({tagName:e,is:t,element:n})=>n?t:`${e}[is="${t}"]`,Ie=()=>Ve,qe=e=>{Ve=e},Ge={useCallback:(e,t)=>We((()=>e),t),useContext:e=>{const{hook:t,args:n}=Ce,r=_e.get(e),s={hook:t,args:n};return r.some(Se,s)||r.push(s),e.value},useEffect:Re,useLayoutEffect:Ue,useMemo:We,useReducer:$e,useRef:e=>{const t=Ce.i++,{stack:n,length:r}=Ce;return t===r&&(Ce.length=n.push({current:e})),n[t]},useState:(e,t)=>$e(Ae,e,void 0,t)},{render:Je,html:Ke,svg:Qe}=(e=>{const t=oe(ce);return ie(e).forEach((n=>{t[n]=e[n](t[n]||("convert"===n?v:String))})),n.prototype=t,ue(n);function n(){return re.apply(this,arguments)}})({transform:()=>e=>Fe(e,ze)}),Xe="_🔥",{defineProperties:Ye}=Object,et=new t,tt=new t,nt=new t,rt=new c,st=!0,ot="attributeChangedCallback",at="connectedCallback",it=`dis${at}`,ct=(e,t,n)=>{if(n in e){const r=e[n];t[n]={configurable:st,value(){return wt.call(this),r.apply(this,arguments)}}}else t[n]={configurable:st,value:wt}},lt=e=>{const{prototype:n}=e,r=[],s={html:{configurable:st,get:vt},svg:{configurable:st,get:bt}};if(s[Xe]={value:{events:r,info:null}},"handleEvent"in n||(s.handleEvent={configurable:st,value:yt}),"render"in n&&n.render.length){const{oninit:e}=n;Ye(n,{oninit:{configurable:st,value(){const t=(e=>{const t=[];return function n(){const r=Ce,s=[];Ce={hook:n,args:arguments,stack:t,i:0,length:t.length,after:s};try{return e.apply(null,arguments)}finally{Ce=r;for(let e=0,{length:t}=s;e<t;e++)s[e]()}}})(this.render.bind(this,Ge));Ye(this,{render:{configurable:st,value:t}}),this.addEventListener("disconnected",Te.bind(null,t),!1),e&&e.apply(this,arguments)}}})}"oninit"in n&&(r.push("init"),ct(n,s,"render")),ct(n,s,ot),ct(n,s,at),ct(n,s,it),[[ot,"onattributechanged",Et],[at,"onconnected",Ct],[it,"ondisconnected",kt],[at,"render",xt]].forEach((([e,t,o])=>{if(!(e in n)&&t in n)if("render"!==t&&r.push(t.slice(2)),e in s){const t=s[e].value;s[e]={configurable:st,value(){return t.apply(this,arguments),o.apply(this,arguments)}}}else s[e]={configurable:st,value:o}}));const o=e.booleanAttributes||[];o.forEach((e=>{e in n||(s[e]={configurable:st,get(){return this.hasAttribute(e)},set(t){t&&"false"!==t?this.setAttribute(e,t):this.removeAttribute(e)}})}));const a=e.observedAttributes||[];a.forEach((e=>{e in n||(s[e]={configurable:st,get(){return this.getAttribute(e)},set(t){null==t?this.removeAttribute(e):this.setAttribute(e,t)}})}));(e.mappedAttributes||[]).forEach((e=>{const o=new t,a="on"+e in n;a&&r.push(e),s[e]={configurable:st,get(){return o.get(this)},set(t){if(o.set(this,t),a){const n=ut(e);if(n.detail=t,rt.has(this))this.dispatchEvent(n);else{const e=nt.get(this);e?e.push(n):nt.set(this,[n])}}}}})),Ye(n,s);const i=o.concat(a);return i.length?Ye(e,{observedAttributes:{configurable:st,get:()=>i}}):e},ut=e=>new r(e),ht=(...e)=>new me("html",e);ht.for=Ke.for;const ft=(...e)=>new me("svg",e);ft.for=Qe.for;const dt=(e,n,r)=>{const s=pt(e,n,new t);return r.set(e,s),s},pt=(e,t,n)=>(r,...s)=>{const o=n.get(r)||((e,t,{info:n})=>{const r=n?Fe(t.join(Xe),n).split(Xe):t;return e.set(t,r),r})(n,r,e[Xe]);return Je(e,(()=>t(o,...s)))};function gt(e){this.addEventListener(e,this)}function mt(e){this.dispatchEvent(e)}function vt(){return et.get(this)||dt(this,ht,et)}function bt(){return tt.get(this)||dt(this,ft,tt)}function yt(e){this[`on${e.type}`](e)}function wt(){if(!rt.has(this)){rt.add(this),this[Xe].events.forEach(gt,this),this.dispatchEvent(ut("init"));const e=nt.get(this);e&&(nt.delete(this),e.forEach(mt,this))}}function Et(e,t,n){const r=ut("attributechanged");r.attributeName=e,r.oldValue=t,r.newValue=n,this.dispatchEvent(r)}function Ct(){this.dispatchEvent(ut("connected"))}function xt(){this.render()}function kt(){this.dispatchEvent(ut("disconnected"))}const{create:Nt,defineProperty:At,defineProperties:$t,getOwnPropertyNames:_t,getOwnPropertySymbols:St,getOwnPropertyDescriptor:jt,keys:Ot}=Object,Lt={element:HTMLElement},Mt=new t;new t;const Tt=new t;new t;const Rt=e=>{const t=Nt(null),n=Nt(null),r={prototype:n,statics:t};return _t(e).concat(St(e)).forEach((r=>{const s=jt(e,r);switch(s.enumerable=!1,r){case"extends":r="tagName";case"contains":case"includes":case"name":case"booleanAttributes":case"mappedAttributes":case"observedAttributes":case"style":case"tagName":t[r]=s;break;default:n[r]=s}})),r},Ut=(e,t,n)=>{if(!/^([A-Z][A-Za-z0-9_]*)(<([A-Za-z0-9:._-]+)>|:([A-Za-z0-9:._-]+))?$/.test(e))throw"Invalid name";const{$1:r,$3:s,$4:o}=RegExp;let a=s||o||t.tagName||t.extends||"element";const i="fragment"===a;if(i)a="element";else if(!/^[A-Za-z0-9:._-]+$/.test(a))throw"Invalid tag";let c="",l="";a.indexOf("-")<0?(c=r.replace(/(([A-Z0-9])([A-Z0-9][a-z]))|(([a-z])([A-Z]))/g,"$2$5-$3$6").toLowerCase()+n,c.indexOf("-")<0&&(l="-heresy")):(c=a+n,a="element");const u=c+l;if(customElements.get(u))throw`Duplicated ${u} definition`;const h=Be("object"==typeof t?Tt.get(t)||((e,t)=>{const{statics:n,prototype:r}=Rt(e),s=Be(Lt[t]||(Lt[t]=document.createElement(t).constructor),!1);return $t(s.prototype,r),$t(s,n),Tt.set(e,lt(s)),s})(t,a):Mt.get(t)||(e=>{const t=Be(e,!1);return Mt.set(e,lt(t)),t})(t),!0),f="element"===a;if(At(h,"new",{value:f?()=>document.createElement(u):()=>document.createElement(a,{is:u})}),At(h.prototype,"is",{value:u}),""===n){const e=(e=>{const{length:t}=e;let n=0,r=0;for(;r<t;)n=(n<<5)-n+e.charCodeAt(r++),n&=n;return n.toString(36)})(c.toUpperCase());ze.map[r]=Wt(h,a,u,{id:e,i:0}),ze.re=De(Ot(ze.map))}if(i){const{render:e}=h.prototype;At(h.prototype,"render",{configurable:!0,value(){if(e&&e.apply(this,arguments),this.parentNode){const{firstChild:e}=this;let t=null;if(e){const n=document.createRange();n.setStartBefore(e),n.setEndAfter(this.lastChild),t=n.extractContents(),this.parentNode.replaceChild(t,this)}}}})}const d=[u,h];return f||d.push({extends:a}),customElements.define(...d),{Class:h,is:u,name:r,tagName:a}},Wt=(e,t,n,r)=>{const{prototype:s}=e,o=((e,t)=>({tagName:e,is:t,element:"element"===e}))(t,n),a=[He(o)],i=e.includes||e.contains;if(i){const e={};Ot(i).forEach((t=>{const n=`-${r.id}-${r.i++}`,{Class:s,is:o,name:c,tagName:l}=Ut(t,i[t],n);a.push(He(e[c]=Wt(s,l,o,r)))}));const t=De(Ot(e)),{events:n}=s[Xe],o={events:n,info:{map:e,re:t}};if(At(s,Xe,{value:o}),"render"in s){const{render:e}=s,{info:t}=o;At(s,"render",{configurable:!0,value(){const n=Ie();qe(t);const r=e.apply(this,arguments);return qe(n),r}})}}return"style"in e&&(e=>{if((e||"").length){const t=document.createElement("style");t.type="text/css",t.styleSheet?t.styleSheet.cssText=e:t.appendChild(document.createTextNode(e));const n=document.head||document.querySelector("head");n.insertBefore(t,n.lastChild)}})(e.style(...a)),o};const Pt="2.0.0",Zt=["audio","background","cameraAccess","chat","people","embed","emptyRoomInvitation","help","leaveButton","precallReview","screenshare","video","floatSelf","recording","logo","locking","participantCount","settingsButton","pipButton","moreButton","personality","subgridLabels","lowData","breakout"];var Bt,zt;return Bt="WherebyEmbed",zt={oninit(){this.iframe=((e,t)=>e?e[t]||(e[t]={current:null}):{current:null})()},onconnected(){window.addEventListener("message",this.onmessage.bind(this))},ondisconnected(){window.removeEventListener("message",this.onmessage.bind(this))},observedAttributes:["displayName","minimal","room","subdomain","lang","metadata","groups","virtualBackgroundUrl","avatarUrl","externalId","title",...Zt].map((e=>e.toLowerCase())),onattributechanged({attributeName:e,oldValue:t}){["room","subdomain"].includes(e)&&null==t||this.render()},style:e=>`\n ${e} {\n display: block;\n }\n ${e} iframe {\n border: none;\n height: 100%;\n width: 100%;\n }\n `,_postCommand(e,t=[]){this.iframe.current&&this.iframe.current.contentWindow.postMessage({command:e,args:t},this.roomUrl.origin)},startRecording(){this._postCommand("start_recording")},stopRecording(){this._postCommand("stop_recording")},startStreaming(){this._postCommand("start_streaming")},stopStreaming(){this._postCommand("stop_streaming")},toggleCamera(e){this._postCommand("toggle_camera",[e])},toggleMicrophone(e){this._postCommand("toggle_microphone",[e])},toggleScreenshare(e){this._postCommand("toggle_screenshare",[e])},toggleChat(e){this._postCommand("toggle_chat",[e])},onmessage({origin:e,data:t}){if(!this.roomUrl||e!==this.roomUrl.origin)return;const{type:n,payload:r}=t;this.dispatchEvent(new CustomEvent(n,{detail:r}))},render(){const{avatarurl:e,displayname:t,lang:n,metadata:r,externalid:s,minimal:o,room:a,groups:i,virtualbackgroundurl:c,title:l}=this;let u,h;try{({roomUrl:u,subdomain:h}=function(e,t){if(!e)throw new Error("Missing room attribute");const n=/https:\/\/([^.]+)(\.whereby\.com|-ip-\d+-\d+-\d+-\d+.hereby.dev:4443)\/.+/.exec(e),r=n&&n[1]||t;if(!r)throw new Error("Missing subdomain attribute");if(!n)throw new Error("Could not parse room URL");return{subdomain:r,roomUrl:new URL(e)}}(a,this.subdomain))}catch(e){return this.html`Whereby: ${e instanceof Error?e.message:"unknown error"}`}this.roomUrl=u,Object.entries(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({jsApi:!0,we:Pt,iframeSource:h},t&&{displayName:t}),n&&{lang:n}),r&&{metadata:r}),s&&{externalId:s}),i&&{groups:i}),c&&{virtualBackgroundUrl:c}),e&&{avatarUrl:e}),null!=o&&{embed:o}),Zt.reduce(((e,t)=>null!=this[t.toLowerCase()]?Object.assign(Object.assign({},e),{[t]:this[t.toLowerCase()]}):e),{}))).forEach((([e,t])=>{this.roomUrl.searchParams.has(e)||this.roomUrl.searchParams.set(e,t)})),this.html`
11
- <iframe
12
- title=${l||"Video calling component"}
13
- ref=${this.iframe}
14
- src=${this.roomUrl}
15
- allow="autoplay; camera; microphone; fullscreen; speaker; display-capture" />
16
- `}},("string"==typeof Bt?Ut(Bt,zt,""):Ut(Bt.name,Bt,"")).Class,{sdkVersion:Pt}}();
@@ -1,49 +0,0 @@
1
- interface WherebyEmbedAttributes {
2
- audio: string;
3
- avatarUrl: string;
4
- background: string;
5
- breakout: string;
6
- cameraAccess: string;
7
- chat: string;
8
- displayName: string;
9
- emptyRoomInvitation: string;
10
- externalId: string;
11
- floatSelf: string;
12
- groups: string;
13
- help: string;
14
- lang: string;
15
- leaveButton: string;
16
- locking: string;
17
- logo: string;
18
- lowData: string;
19
- metadata: string;
20
- minimal: string;
21
- moreButton: string;
22
- participantCount: string;
23
- people: string;
24
- pipButton: string;
25
- precallReview: string;
26
- recording: string;
27
- room: string;
28
- settingsButton: string;
29
- screenshare: string;
30
- style: {
31
- [key: string]: string;
32
- };
33
- subgridLabels: string;
34
- title: string;
35
- video: string;
36
- virtualBackgroundUrl: string;
37
- }
38
- declare global {
39
- namespace JSX {
40
- interface IntrinsicElements {
41
- ["whereby-embed"]: Partial<WherebyEmbedAttributes>;
42
- }
43
- }
44
- }
45
- declare const _default: {
46
- sdkVersion: string;
47
- };
48
-
49
- export { _default as default };
@@ -1,156 +0,0 @@
1
- import { define, ref } from 'heresy';
2
-
3
- function parseRoomUrlAndSubdomain(roomAttribute, subdomainAttribute) {
4
- if (!roomAttribute) {
5
- throw new Error("Missing room attribute");
6
- }
7
- // Get subdomain from room URL, or use it specified
8
- const m = /https:\/\/([^.]+)(\.whereby\.com|-ip-\d+-\d+-\d+-\d+.hereby.dev:4443)\/.+/.exec(roomAttribute);
9
- const subdomain = (m && m[1]) || subdomainAttribute;
10
- if (!subdomain) {
11
- throw new Error("Missing subdomain attribute");
12
- }
13
- if (!m) {
14
- throw new Error("Could not parse room URL");
15
- }
16
- const roomUrl = new URL(roomAttribute);
17
- return {
18
- subdomain,
19
- roomUrl,
20
- };
21
- }
22
-
23
- const sdkVersion = "2.0.0";
24
-
25
- const boolAttrs = [
26
- "audio",
27
- "background",
28
- "cameraAccess",
29
- "chat",
30
- "people",
31
- "embed",
32
- "emptyRoomInvitation",
33
- "help",
34
- "leaveButton",
35
- "precallReview",
36
- "screenshare",
37
- "video",
38
- "floatSelf",
39
- "recording",
40
- "logo",
41
- "locking",
42
- "participantCount",
43
- "settingsButton",
44
- "pipButton",
45
- "moreButton",
46
- "personality",
47
- "subgridLabels",
48
- "lowData",
49
- "breakout",
50
- ];
51
- define("WherebyEmbed", {
52
- oninit() {
53
- this.iframe = ref();
54
- },
55
- onconnected() {
56
- window.addEventListener("message", this.onmessage.bind(this));
57
- },
58
- ondisconnected() {
59
- window.removeEventListener("message", this.onmessage.bind(this));
60
- },
61
- observedAttributes: [
62
- "displayName",
63
- "minimal",
64
- "room",
65
- "subdomain",
66
- "lang",
67
- "metadata",
68
- "groups",
69
- "virtualBackgroundUrl",
70
- "avatarUrl",
71
- "externalId",
72
- "title",
73
- ...boolAttrs,
74
- ].map((a) => a.toLowerCase()),
75
- onattributechanged({ attributeName, oldValue }) {
76
- if (["room", "subdomain"].includes(attributeName) && oldValue == null)
77
- return;
78
- this.render();
79
- },
80
- style(self) {
81
- return `
82
- ${self} {
83
- display: block;
84
- }
85
- ${self} iframe {
86
- border: none;
87
- height: 100%;
88
- width: 100%;
89
- }
90
- `;
91
- },
92
- // Commands
93
- _postCommand(command, args = []) {
94
- if (this.iframe.current) {
95
- this.iframe.current.contentWindow.postMessage({ command, args }, this.roomUrl.origin);
96
- }
97
- },
98
- startRecording() {
99
- this._postCommand("start_recording");
100
- },
101
- stopRecording() {
102
- this._postCommand("stop_recording");
103
- },
104
- startStreaming() {
105
- this._postCommand("start_streaming");
106
- },
107
- stopStreaming() {
108
- this._postCommand("stop_streaming");
109
- },
110
- toggleCamera(enabled) {
111
- this._postCommand("toggle_camera", [enabled]);
112
- },
113
- toggleMicrophone(enabled) {
114
- this._postCommand("toggle_microphone", [enabled]);
115
- },
116
- toggleScreenshare(enabled) {
117
- this._postCommand("toggle_screenshare", [enabled]);
118
- },
119
- toggleChat(enabled) {
120
- this._postCommand("toggle_chat", [enabled]);
121
- },
122
- onmessage({ origin, data }) {
123
- if (!this.roomUrl || origin !== this.roomUrl.origin)
124
- return;
125
- const { type, payload: detail } = data;
126
- this.dispatchEvent(new CustomEvent(type, { detail }));
127
- },
128
- render() {
129
- const { avatarurl: avatarUrl, displayname: displayName, lang, metadata, externalid: externalId, minimal, room, groups, virtualbackgroundurl: virtualBackgroundUrl, title, } = this;
130
- let roomUrl, subdomain;
131
- try {
132
- ({ roomUrl, subdomain } = parseRoomUrlAndSubdomain(room, this.subdomain));
133
- }
134
- catch (error) {
135
- return this.html `Whereby: ${error instanceof Error ? error.message : "unknown error"}`;
136
- }
137
- this.roomUrl = roomUrl;
138
- Object.entries(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({ jsApi: true, we: sdkVersion, iframeSource: subdomain }, (displayName && { displayName })), (lang && { lang: lang })), (metadata && { metadata: metadata })), (externalId && { externalId })), (groups && { groups: groups })), (virtualBackgroundUrl && { virtualBackgroundUrl: virtualBackgroundUrl })), (avatarUrl && { avatarUrl: avatarUrl })), (minimal != null && { embed: minimal })), boolAttrs.reduce(
139
- // add to URL if set in any way
140
- (o, v) => (this[v.toLowerCase()] != null ? Object.assign(Object.assign({}, o), { [v]: this[v.toLowerCase()] }) : o), {}))).forEach(([k, v]) => {
141
- if (!this.roomUrl.searchParams.has(k)) {
142
- this.roomUrl.searchParams.set(k, v);
143
- }
144
- });
145
- this.html `
146
- <iframe
147
- title=${title || "Video calling component"}
148
- ref=${this.iframe}
149
- src=${this.roomUrl}
150
- allow="autoplay; camera; microphone; fullscreen; speaker; display-capture" />
151
- `;
152
- },
153
- });
154
- var index = { sdkVersion: sdkVersion };
155
-
156
- export { index as default };