videomail-client 13.6.10 → 13.6.12

package/README.md

@@ -59,7 +59,7 @@ There are plenty if you just ask us. And way more will follow, we are rolling ..
 
 There are many options you can pass onto the VideomailClient constructor. Check out the annotated source code at [src/options.ts](https://github.com/binarykitchen/videomail-client/blob/master/src/options.ts)
 
-In most cases, these defaults are good enough. But `siteName` should be changed when you deploy your own site, see <a href="#whitelist">Whitelist</a>.
+In most cases, these defaults are good enough. But `whitelistKey` should be changed when you deploy your own site, see <a href="#whitelist">Whitelist</a>.
 
 Looking at the examples in the `/src/stories` folder should give you some ideas how to use these options.
 
@@ -92,7 +92,7 @@ Looking at the examples in the `/src/stories` folder should give you some ideas
 The constructor accepts a JSON with optional <a href="#options">options</a>. Example:
 
 ```ts
-const videomailClient = new VideomailClient({ siteName: "my site name" });
+const videomailClient = new VideomailClient({ whitelistKey: "my whitelist key" });
 ```
 
 <a name="on"></a>
@@ -233,7 +233,7 @@ It's emitted in the SUBMITTED event under the videomail object:
   "width": 320,
   "height": 240,
   "videomailClientVersion": "2.4.11",
-  "siteName": "videomail-client-demo",
+  "whitelistKey": "videomail-client-demo",
   "alias": "some-subject-183622500964",
   "dateCreated": 1541130589811,
   "url": "https://videomail.io/videomail/some-subject-150322500964",

package/dist/cjs/index.cjs

@@ -6046,7 +6046,7 @@ var __webpack_modules__ = {
                     val = options.strictNullHandling ? null : '';
                 } else {
                     key = options.decoder(part.slice(0, pos), defaults.decoder, charset, 'key');
-                    val = utils.maybeMap(parseArrayValue(part.slice(pos + 1), options, isArray(obj[key]) ? obj[key].length : 0), function(encodedVal) {
+                    if (null !== key) val = utils.maybeMap(parseArrayValue(part.slice(pos + 1), options, isArray(obj[key]) ? obj[key].length : 0), function(encodedVal) {
                         return options.decoder(encodedVal, defaults.decoder, charset, 'value');
                     });
                 }
@@ -6054,9 +6054,11 @@ var __webpack_modules__ = {
                 if (part.indexOf('[]=') > -1) val = isArray(val) ? [
                     val
                 ] : val;
-                var existing = has.call(obj, key);
-                if (existing && 'combine' === options.duplicates) obj[key] = utils.combine(obj[key], val);
-                else if (!existing || 'last' === options.duplicates) obj[key] = val;
+                if (null !== key) {
+                    var existing = has.call(obj, key);
+                    if (existing && 'combine' === options.duplicates) obj[key] = utils.combine(obj[key], val, options.arrayLimit, options.plainObjects);
+                    else if (!existing || 'last' === options.duplicates) obj[key] = val;
+                }
             }
             return obj;
         };
@@ -6070,7 +6072,7 @@ var __webpack_modules__ = {
             for(var i = chain.length - 1; i >= 0; --i){
                 var obj;
                 var root = chain[i];
-                if ('[]' === root && options.parseArrays) obj = options.allowEmptyArrays && ('' === leaf || options.strictNullHandling && null === leaf) ? [] : utils.combine([], leaf);
+                if ('[]' === root && options.parseArrays) obj = utils.isOverflow(leaf) ? leaf : options.allowEmptyArrays && ('' === leaf || options.strictNullHandling && null === leaf) ? [] : utils.combine([], leaf, options.arrayLimit, options.plainObjects);
                 else {
                     obj = options.plainObjects ? {
                         __proto__: null
@@ -6091,12 +6093,19 @@ var __webpack_modules__ = {
             }
             return leaf;
         };
-        var parseKeys = function(givenKey, val, options, valuesParsed) {
-            if (!givenKey) return;
+        var splitKeyIntoSegments = function(givenKey, options) {
             var key = options.allowDots ? givenKey.replace(/\.([^.[]+)/g, '[$1]') : givenKey;
+            if (options.depth <= 0) {
+                if (!options.plainObjects && has.call(Object.prototype, key)) {
+                    if (!options.allowPrototypes) return;
+                }
+                return [
+                    key
+                ];
+            }
             var brackets = /(\[[^[\]]*])/;
             var child = /(\[[^[\]]*])/g;
-            var segment = options.depth > 0 && brackets.exec(key);
+            var segment = brackets.exec(key);
             var parent = segment ? key.slice(0, segment.index) : key;
             var keys = [];
             if (parent) {
@@ -6106,9 +6115,10 @@ var __webpack_modules__ = {
                 keys.push(parent);
             }
             var i = 0;
-            while(options.depth > 0 && null !== (segment = child.exec(key)) && i < options.depth){
+            while(null !== (segment = child.exec(key)) && i < options.depth){
                 i += 1;
-                if (!options.plainObjects && has.call(Object.prototype, segment[1].slice(1, -1))) {
+                var segmentContent = segment[1].slice(1, -1);
+                if (!options.plainObjects && has.call(Object.prototype, segmentContent)) {
                     if (!options.allowPrototypes) return;
                 }
                 keys.push(segment[1]);
@@ -6117,6 +6127,12 @@ var __webpack_modules__ = {
                 if (true === options.strictDepth) throw new RangeError('Input depth exceeded depth option of ' + options.depth + ' and strictDepth is true');
                 keys.push('[' + key.slice(segment.index) + ']');
             }
+            return keys;
+        };
+        var parseKeys = function(givenKey, val, options, valuesParsed) {
+            if (!givenKey) return;
+            var keys = splitKeyIntoSegments(givenKey, options);
+            if (!keys) return;
             return parseObject(keys, val, options, valuesParsed);
         };
         var normalizeParseOptions = function(opts) {
@@ -6367,8 +6383,23 @@ var __webpack_modules__ = {
     "./node_modules/qs/lib/utils.js" (module, __unused_rspack_exports, __webpack_require__) {
         "use strict";
         var formats = __webpack_require__("./node_modules/qs/lib/formats.js");
+        var getSideChannel = __webpack_require__("./node_modules/side-channel/index.js");
         var has = Object.prototype.hasOwnProperty;
         var isArray = Array.isArray;
+        var overflowChannel = getSideChannel();
+        var markOverflow = function(obj, maxIndex) {
+            overflowChannel.set(obj, maxIndex);
+            return obj;
+        };
+        var isOverflow = function(obj) {
+            return overflowChannel.has(obj);
+        };
+        var getMaxIndex = function(obj) {
+            return overflowChannel.get(obj);
+        };
+        var setMaxIndex = function(obj, maxIndex) {
+            overflowChannel.set(obj, maxIndex);
+        };
         var hexTable = function() {
             var array = [];
             for(var i = 0; i < 256; ++i)array.push('%' + ((i < 16 ? '0' : '') + i.toString(16)).toUpperCase());
@@ -6400,12 +6431,32 @@ var __webpack_modules__ = {
                     target,
                     source
                 ];
-                else if (options && (options.plainObjects || options.allowPrototypes) || !has.call(Object.prototype, source)) target[source] = true;
+                else if (isOverflow(target)) {
+                    var newIndex = getMaxIndex(target) + 1;
+                    target[newIndex] = source;
+                    setMaxIndex(target, newIndex);
+                } else if (options && (options.plainObjects || options.allowPrototypes) || !has.call(Object.prototype, source)) target[source] = true;
                 return target;
             }
-            if (!target || 'object' != typeof target) return [
-                target
-            ].concat(source);
+            if (!target || 'object' != typeof target) {
+                if (isOverflow(source)) {
+                    var sourceKeys = Object.keys(source);
+                    var result = options && options.plainObjects ? {
+                        __proto__: null,
+                        0: target
+                    } : {
+                        0: target
+                    };
+                    for(var m = 0; m < sourceKeys.length; m++){
+                        var oldKey = parseInt(sourceKeys[m], 10);
+                        result[oldKey + 1] = source[sourceKeys[m]];
+                    }
+                    return markOverflow(result, getMaxIndex(source) + 1);
+                }
+                return [
+                    target
+                ].concat(source);
+            }
             var mergeTarget = target;
             if (isArray(target) && !isArray(source)) mergeTarget = arrayToObject(target, options);
             if (isArray(target) && isArray(source)) {
@@ -6515,8 +6566,18 @@ var __webpack_modules__ = {
             if (!obj || 'object' != typeof obj) return false;
             return !!(obj.constructor && obj.constructor.isBuffer && obj.constructor.isBuffer(obj));
         };
-        var combine = function(a, b) {
-            return [].concat(a, b);
+        var combine = function(a, b, arrayLimit, plainObjects) {
+            if (isOverflow(a)) {
+                var newIndex = getMaxIndex(a) + 1;
+                a[newIndex] = b;
+                setMaxIndex(a, newIndex);
+                return a;
+            }
+            var result = [].concat(a, b);
+            if (result.length > arrayLimit) return markOverflow(arrayToObject(result, {
+                plainObjects: plainObjects
+            }), result.length - 1);
+            return result;
         };
         var maybeMap = function(val, fn) {
             if (isArray(val)) {
@@ -6534,6 +6595,7 @@ var __webpack_modules__ = {
             decode: decode,
             encode: encode,
             isBuffer: isBuffer,
+            isOverflow: isOverflow,
             isRegExp: isRegExp,
             maybeMap: maybeMap,
             merge: merge
@@ -7187,7 +7249,12 @@ var __webpack_modules__ = {
             this.emit('request', this);
             xhr.send(void 0 === data ? null : data);
         };
-        request.agent = ()=>new Agent();
+        const proxyAgent = new Proxy(Agent, {
+            apply (target, thisArg, argumentsList) {
+                return new target(...argumentsList);
+            }
+        });
+        request.agent = proxyAgent;
         for (const method of [
             'GET',
             'POST',
@@ -10504,7 +10571,7 @@ var __webpack_exports__ = {};
         MP4: "mp4"
     };
     const constants = {
-        SITE_NAME_LABEL: "x-videomail-site-name",
+        WHITELIST_KEY_LABEL: "x-videomail-whitelist-key",
         VERSION_LABEL: "videomailClientVersion",
         public: {
             ENC_TYPE_APP_JSON: "application/json",
@@ -10664,7 +10731,7 @@ var __webpack_exports__ = {};
     var client = __webpack_require__("./node_modules/superagent/lib/client.js");
     var client_default = /*#__PURE__*/ __webpack_require__.n(client);
     var package_namespaceObject = {
-        rE: "13.6.10"
+        rE: "13.6.12"
     };
     function isAudioEnabled(options) {
         return Boolean(options.audio.enabled);
@@ -13988,10 +14055,10 @@ var __webpack_exports__ = {};
         }
         constructor(message, options, classList, errData){
             var _ref;
-            super(message, errData), VideomailError_define_property(this, "title", "Error from videomail-client npm package"), VideomailError_define_property(this, "location", window.location.href), VideomailError_define_property(this, "logLines", void 0), VideomailError_define_property(this, "siteName", void 0), VideomailError_define_property(this, "cookie", void 0), VideomailError_define_property(this, "err", void 0), VideomailError_define_property(this, "promise", void 0), VideomailError_define_property(this, "reason", void 0), VideomailError_define_property(this, "browser", void 0), VideomailError_define_property(this, "cpu", void 0), VideomailError_define_property(this, "device", void 0), VideomailError_define_property(this, "engine", void 0), VideomailError_define_property(this, "os", void 0), VideomailError_define_property(this, "screen", void 0), VideomailError_define_property(this, "orientation", void 0), VideomailError_define_property(this, "classList", void 0);
+            super(message, errData), VideomailError_define_property(this, "title", "Error from videomail-client npm package"), VideomailError_define_property(this, "location", window.location.href), VideomailError_define_property(this, "logLines", void 0), VideomailError_define_property(this, "whitelistKey", void 0), VideomailError_define_property(this, "cookie", void 0), VideomailError_define_property(this, "err", void 0), VideomailError_define_property(this, "promise", void 0), VideomailError_define_property(this, "reason", void 0), VideomailError_define_property(this, "browser", void 0), VideomailError_define_property(this, "cpu", void 0), VideomailError_define_property(this, "device", void 0), VideomailError_define_property(this, "engine", void 0), VideomailError_define_property(this, "os", void 0), VideomailError_define_property(this, "screen", void 0), VideomailError_define_property(this, "orientation", void 0), VideomailError_define_property(this, "classList", void 0);
             this.explanation = null == errData ? void 0 : errData.explanation;
             this.logLines = null == errData ? void 0 : errData.logLines;
-            this.siteName = options.siteName;
+            this.whitelistKey = options.whitelistKey;
             this.classList = classList;
             const browser = util_getBrowser(options);
             const usefulClientData = browser.getUsefulData();
@@ -14737,7 +14804,7 @@ var __webpack_exports__ = {};
             return resource_async_to_generator(function*() {
                 const url = `${this.options.apiUrl}/videomail/${identifierName}/${identifierValue}/snapshot`;
                 try {
-                    const request = yield client_default()("get", url).type("json").set("Accept", "application/json").withCredentials().set("Timezone-Id", this.timezoneId).set(constants.SITE_NAME_LABEL, this.options.siteName).timeout(this.options.timeouts.connection);
+                    const request = yield client_default()("get", url).type("json").set("Accept", "application/json").withCredentials().set("Timezone-Id", this.timezoneId).set(constants.WHITELIST_KEY_LABEL, this.options.whitelistKey).timeout(this.options.timeouts.connection);
                     const videomail = request.body;
                     return videomail;
                 } catch (exc) {
@@ -14751,7 +14818,7 @@ var __webpack_exports__ = {};
         write(method, videomail) {
             return resource_async_to_generator(function*() {
                 const queryParams = {
-                    [constants.SITE_NAME_LABEL]: this.options.siteName
+                    [constants.WHITELIST_KEY_LABEL]: this.options.whitelistKey
                 };
                 let url = `${this.options.apiUrl}/videomail/`;
                 if (method === FormMethod.PUT && videomail.key) url += videomail.key;
@@ -14779,7 +14846,7 @@ var __webpack_exports__ = {};
         reportError(err) {
             return resource_async_to_generator(function*() {
                 const queryParams = {
-                    [constants.SITE_NAME_LABEL]: this.options.siteName
+                    [constants.WHITELIST_KEY_LABEL]: this.options.whitelistKey
                 };
                 const url = `${this.options.apiUrl}/client-error/`;
                 try {
@@ -14798,7 +14865,7 @@ var __webpack_exports__ = {};
                         orientation: err.orientation,
                         os: err.os,
                         screen: err.screen,
-                        siteName: err.siteName,
+                        whitelistKey: err.whitelistKey,
                         status: err.status,
                         title: err.title,
                         message: err.message,
@@ -14900,7 +14967,7 @@ var __webpack_exports__ = {};
         verbose: !PRODUCTION,
         apiUrl: "https://videomail.io/api",
         socketUrl: "wss://videomail.io",
-        siteName: "videomail-client-demo",
+        whitelistKey: "videomail-client-demo",
         enablePause: true,
         enableAutoPause: true,
         enableSpace: true,
@@ -16450,7 +16517,7 @@ var __webpack_exports__ = {};
         return dimension;
     }
     const dimensions_calculateHeight = calculateHeight;
-    function calculateWidth(responsive, videoHeight, options, ratio) {
+    function calculateWidth(responsive, options, videoHeight, ratio) {
         const dimension = {
             unit: "px"
         };
@@ -16846,14 +16913,11 @@ var __webpack_exports__ = {};
             return videoWidth && videoWidth > 0;
         }
         getRawWidth(responsive) {
-            let rawWidth = this.getVideoWidth();
+            let rawWidth;
             const widthDimension = {
                 unit: "px"
             };
-            if (this.options.video.width || this.options.video.height) if (responsive) {
-                const dimension = this.recorder.calculateWidth(responsive);
-                rawWidth = dimension.value;
-            } else rawWidth = this.options.video.width;
+            rawWidth = responsive ? this.getVideoWidth() : this.options.video.width ? this.options.video.width : this.getVideoWidth();
             if (responsive) {
                 const widthDimension = this.recorder.limitWidth(rawWidth);
                 rawWidth = null == widthDimension ? void 0 : widthDimension.value;
@@ -16863,32 +16927,12 @@ var __webpack_exports__ = {};
         }
         getRawHeight(responsive) {
             let rawHeight;
-            if (this.options.video.width || this.options.video.height) {
-                const heightDimension = this.recorder.calculateHeight(responsive);
-                rawHeight = heightDimension.value;
-                if (void 0 === rawHeight) throw error_createError({
-                    message: "Undefined height",
-                    explanation: "Calculated raw height cannot be undefined.",
-                    options: this.options
-                });
-                if (0 !== rawHeight && rawHeight < 1) throw error_createError({
-                    message: "Invalid height",
-                    explanation: `Calculated raw height of ${rawHeight} cannot be less than 1!`,
-                    options: this.options
-                });
-            } else {
-                rawHeight = this.getVideoHeight();
-                if (void 0 === rawHeight) throw error_createError({
-                    message: "Bad dimensions",
-                    explanation: "Raw video height from DOM element cannot be undefined.",
-                    options: this.options
-                });
-                if (0 !== rawHeight && rawHeight < 1) throw error_createError({
-                    message: "Bad dimensions",
-                    explanation: "Raw video height from DOM element cannot be less than 1.",
-                    options: this.options
-                });
-            }
+            if (responsive) {
+                rawHeight = this.options.video.height || this.getVideoHeight();
+                const ratio = this.recorder.getRatio();
+                const rawWidth = this.getRawWidth(responsive);
+                if (void 0 !== ratio && rawWidth.value) rawHeight = rawWidth.value * ratio;
+            } else rawHeight = this.options.video.height ? this.options.video.height : this.getVideoHeight();
             if (responsive) {
                 const heightDimension = this.recorder.limitHeight(rawHeight);
                 rawHeight = heightDimension.value;
@@ -17090,8 +17134,8 @@ var __webpack_exports__ = {};
             this.confirmedFrameNumber = this.confirmedSampleNumber = this.samplesCount = this.framesCount = 0;
             this.sampleProgress = this.frameProgress = void 0;
             this.key = args.key;
-            if (args.mp4) this.replay.setMp4Source(`${args.mp4 + constants.SITE_NAME_LABEL}/${this.options.siteName}/videomail.mp4`, true);
-            if (args.webm) this.replay.setWebMSource(`${args.webm + constants.SITE_NAME_LABEL}/${this.options.siteName}/videomail.webm`, true);
+            if (args.mp4) this.replay.setMp4Source(`${args.mp4 + constants.WHITELIST_KEY_LABEL}/${this.options.whitelistKey}/videomail.mp4`, true);
+            if (args.webm) this.replay.setWebMSource(`${args.webm + constants.WHITELIST_KEY_LABEL}/${this.options.whitelistKey}/videomail.webm`, true);
             this.hide();
             const widthDimension = this.getRecorderWidth(true);
             const heightDimension = this.getRecorderHeight(true);
@@ -17111,7 +17155,7 @@ var __webpack_exports__ = {};
             if (!this.connected) {
                 this.connecting = true;
                 this.emit("CONNECTING");
-                const url2Connect = `${this.options.socketUrl}?${encodeURIComponent(constants.SITE_NAME_LABEL)}=${encodeURIComponent(this.options.siteName)}`;
+                const url2Connect = `${this.options.socketUrl}?${encodeURIComponent(constants.WHITELIST_KEY_LABEL)}=${encodeURIComponent(this.options.whitelistKey)}`;
                 this.options.logger.debug(`Recorder: initializing web socket to ${url2Connect}`);
                 try {
                     this.stream = stream_default()(url2Connect, {
@@ -17843,8 +17887,8 @@ var __webpack_exports__ = {};
                 if (void 0 !== height && this.options.video.width) {
                     const ratio = this.getRatio();
                     if (void 0 !== ratio) {
-                        const maxHeight = this.options.video.width * ratio;
-                        height = Math.min(maxHeight, height);
+                        const idealHeight = this.options.video.width * ratio;
+                        height = Math.min(idealHeight, height);
                     }
                 }
                 recorderHeight = {
@@ -17875,7 +17919,8 @@ var __webpack_exports__ = {};
             let videoHeight;
             if (this.userMedia) videoHeight = this.userMedia.getVideoHeight();
             else if (this.recorderElement) videoHeight = this.recorderElement.videoHeight || this.recorderElement.height;
-            return dimensions_calculateWidth(responsive, videoHeight, this.options, this.getRatio());
+            const ratio = this.getRatio();
+            return dimensions_calculateWidth(responsive, this.options, videoHeight, ratio);
         }
         calculateHeight(responsive) {
             let videoDimension;
@@ -17964,7 +18009,7 @@ var __webpack_exports__ = {};
                 height = this.videomail.height;
                 if (width) ratio = height / width;
             }
-            if (!width) width = dimensions_calculateWidth(responsive, videoHeight, this.options, ratio);
+            if (!width) width = dimensions_calculateWidth(responsive, this.options, videoHeight, ratio);
             if (!height) {
                 let element = this.visuals.getElement();
                 if (!element) element = document.body;

package/dist/esm/constants.d.ts

@@ -1,5 +1,5 @@
 declare const _default: {
-    SITE_NAME_LABEL: string;
+    WHITELIST_KEY_LABEL: string;
     VERSION_LABEL: string;
     public: {
         ENC_TYPE_APP_JSON: string;

package/dist/esm/index.js

@@ -3555,7 +3555,7 @@ const VideoType = {
     MP4: "mp4"
 };
 const constants = {
-    SITE_NAME_LABEL: "x-videomail-site-name",
+    WHITELIST_KEY_LABEL: "x-videomail-whitelist-key",
     VERSION_LABEL: "videomailClientVersion",
     public: {
         ENC_TYPE_APP_JSON: "application/json",
@@ -3563,7 +3563,7 @@ const constants = {
     }
 };
 var package_namespaceObject = {
-    rE: "13.6.10"
+    rE: "13.6.12"
 };
 function isAudioEnabled(options) {
     return Boolean(options.audio.enabled);
@@ -3693,7 +3693,7 @@ class VideomailError extends error_HTTPVideomailError {
     title = "Error from videomail-client npm package";
     location = window.location.href;
     logLines;
-    siteName;
+    whitelistKey;
     cookie;
     err;
     promise;
@@ -3722,7 +3722,7 @@ class VideomailError extends error_HTTPVideomailError {
         super(message, errData);
         this.explanation = errData?.explanation;
         this.logLines = errData?.logLines;
-        this.siteName = options.siteName;
+        this.whitelistKey = options.whitelistKey;
         this.classList = classList;
         const browser = util_getBrowser(options);
         const usefulClientData = browser.getUsefulData();
@@ -4262,7 +4262,7 @@ class Resource {
     async get(identifierName, identifierValue) {
         const url = `${this.options.apiUrl}/videomail/${identifierName}/${identifierValue}/snapshot`;
         try {
-            const request = await superagent("get", url).type("json").set("Accept", "application/json").withCredentials().set("Timezone-Id", this.timezoneId).set(constants.SITE_NAME_LABEL, this.options.siteName).timeout(this.options.timeouts.connection);
+            const request = await superagent("get", url).type("json").set("Accept", "application/json").withCredentials().set("Timezone-Id", this.timezoneId).set(constants.WHITELIST_KEY_LABEL, this.options.whitelistKey).timeout(this.options.timeouts.connection);
             const videomail = request.body;
             return videomail;
         } catch (exc) {
@@ -4274,7 +4274,7 @@ class Resource {
     }
     async write(method, videomail) {
         const queryParams = {
-            [constants.SITE_NAME_LABEL]: this.options.siteName
+            [constants.WHITELIST_KEY_LABEL]: this.options.whitelistKey
         };
         let url = `${this.options.apiUrl}/videomail/`;
         if (method === FormMethod.PUT && videomail.key) url += videomail.key;
@@ -4296,7 +4296,7 @@ class Resource {
     }
     async reportError(err) {
         const queryParams = {
-            [constants.SITE_NAME_LABEL]: this.options.siteName
+            [constants.WHITELIST_KEY_LABEL]: this.options.whitelistKey
         };
         const url = `${this.options.apiUrl}/client-error/`;
         try {
@@ -4314,7 +4314,7 @@ class Resource {
                 orientation: err.orientation,
                 os: err.os,
                 screen: err.screen,
-                siteName: err.siteName,
+                whitelistKey: err.whitelistKey,
                 status: err.status,
                 title: err.title,
                 message: err.message,
@@ -4401,7 +4401,7 @@ const options_options = {
     verbose: !PRODUCTION,
     apiUrl: "https://videomail.io/api",
     socketUrl: "wss://videomail.io",
-    siteName: "videomail-client-demo",
+    whitelistKey: "videomail-client-demo",
     enablePause: true,
     enableAutoPause: true,
     enableSpace: true,
@@ -5774,7 +5774,7 @@ function calculateHeight(responsive, videoWidth, options, ratio, element) {
     return dimension;
 }
 const dimensions_calculateHeight = calculateHeight;
-function calculateWidth(responsive, videoHeight, options, ratio) {
+function calculateWidth(responsive, options, videoHeight, ratio) {
     const dimension = {
         unit: "px"
     };
@@ -6140,14 +6140,11 @@ class UserMedia extends util_Despot {
         return videoWidth && videoWidth > 0;
     }
     getRawWidth(responsive) {
-        let rawWidth = this.getVideoWidth();
+        let rawWidth;
         const widthDimension = {
             unit: "px"
         };
-        if (this.options.video.width || this.options.video.height) if (responsive) {
-            const dimension = this.recorder.calculateWidth(responsive);
-            rawWidth = dimension.value;
-        } else rawWidth = this.options.video.width;
+        rawWidth = responsive ? this.getVideoWidth() : this.options.video.width ? this.options.video.width : this.getVideoWidth();
         if (responsive) {
             const widthDimension = this.recorder.limitWidth(rawWidth);
             rawWidth = widthDimension?.value;
@@ -6157,32 +6154,12 @@ class UserMedia extends util_Despot {
     }
     getRawHeight(responsive) {
         let rawHeight;
-        if (this.options.video.width || this.options.video.height) {
-            const heightDimension = this.recorder.calculateHeight(responsive);
-            rawHeight = heightDimension.value;
-            if (void 0 === rawHeight) throw error_createError({
-                message: "Undefined height",
-                explanation: "Calculated raw height cannot be undefined.",
-                options: this.options
-            });
-            if (0 !== rawHeight && rawHeight < 1) throw error_createError({
-                message: "Invalid height",
-                explanation: `Calculated raw height of ${rawHeight} cannot be less than 1!`,
-                options: this.options
-            });
-        } else {
-            rawHeight = this.getVideoHeight();
-            if (void 0 === rawHeight) throw error_createError({
-                message: "Bad dimensions",
-                explanation: "Raw video height from DOM element cannot be undefined.",
-                options: this.options
-            });
-            if (0 !== rawHeight && rawHeight < 1) throw error_createError({
-                message: "Bad dimensions",
-                explanation: "Raw video height from DOM element cannot be less than 1.",
-                options: this.options
-            });
-        }
+        if (responsive) {
+            rawHeight = this.options.video.height || this.getVideoHeight();
+            const ratio = this.recorder.getRatio();
+            const rawWidth = this.getRawWidth(responsive);
+            if (void 0 !== ratio && rawWidth.value) rawHeight = rawWidth.value * ratio;
+        } else rawHeight = this.options.video.height ? this.options.video.height : this.getVideoHeight();
         if (responsive) {
             const heightDimension = this.recorder.limitHeight(rawHeight);
             rawHeight = heightDimension.value;
@@ -6402,8 +6379,8 @@ class Recorder extends util_Despot {
         this.confirmedFrameNumber = this.confirmedSampleNumber = this.samplesCount = this.framesCount = 0;
         this.sampleProgress = this.frameProgress = void 0;
         this.key = args.key;
-        if (args.mp4) this.replay.setMp4Source(`${args.mp4 + constants.SITE_NAME_LABEL}/${this.options.siteName}/videomail.mp4`, true);
-        if (args.webm) this.replay.setWebMSource(`${args.webm + constants.SITE_NAME_LABEL}/${this.options.siteName}/videomail.webm`, true);
+        if (args.mp4) this.replay.setMp4Source(`${args.mp4 + constants.WHITELIST_KEY_LABEL}/${this.options.whitelistKey}/videomail.mp4`, true);
+        if (args.webm) this.replay.setWebMSource(`${args.webm + constants.WHITELIST_KEY_LABEL}/${this.options.whitelistKey}/videomail.webm`, true);
         this.hide();
         const widthDimension = this.getRecorderWidth(true);
         const heightDimension = this.getRecorderHeight(true);
@@ -6423,7 +6400,7 @@ class Recorder extends util_Despot {
         if (!this.connected) {
             this.connecting = true;
             this.emit("CONNECTING");
-            const url2Connect = `${this.options.socketUrl}?${encodeURIComponent(constants.SITE_NAME_LABEL)}=${encodeURIComponent(this.options.siteName)}`;
+            const url2Connect = `${this.options.socketUrl}?${encodeURIComponent(constants.WHITELIST_KEY_LABEL)}=${encodeURIComponent(this.options.whitelistKey)}`;
             this.options.logger.debug(`Recorder: initializing web socket to ${url2Connect}`);
             try {
                 this.stream = websocket_stream(url2Connect, {
@@ -7139,8 +7116,8 @@ class Recorder extends util_Despot {
             if (void 0 !== height && this.options.video.width) {
                 const ratio = this.getRatio();
                 if (void 0 !== ratio) {
-                    const maxHeight = this.options.video.width * ratio;
-                    height = Math.min(maxHeight, height);
+                    const idealHeight = this.options.video.width * ratio;
+                    height = Math.min(idealHeight, height);
                 }
             }
             recorderHeight = {
@@ -7171,7 +7148,8 @@ class Recorder extends util_Despot {
         let videoHeight;
         if (this.userMedia) videoHeight = this.userMedia.getVideoHeight();
         else if (this.recorderElement) videoHeight = this.recorderElement.videoHeight || this.recorderElement.height;
-        return dimensions_calculateWidth(responsive, videoHeight, this.options, this.getRatio());
+        const ratio = this.getRatio();
+        return dimensions_calculateWidth(responsive, this.options, videoHeight, ratio);
     }
     calculateHeight(responsive) {
         let videoDimension;
@@ -7251,7 +7229,7 @@ class Replay extends util_Despot {
             height = this.videomail.height;
             if (width) ratio = height / width;
         }
-        if (!width) width = dimensions_calculateWidth(responsive, videoHeight, this.options, ratio);
+        if (!width) width = dimensions_calculateWidth(responsive, this.options, videoHeight, ratio);
         if (!height) {
             let element = this.visuals.getElement();
             if (!element) element = document.body;

package/dist/esm/types/Videomail.d.ts

@@ -39,7 +39,7 @@ export interface Videomail {
     sentDateIso?: string;
     sentDateServerPretty?: string;
     serverTimePretty?: string;
-    siteName: string;
+    whitelistKey: string;
     siteTitle?: string;
     url: string;
     userKey?: string;

package/dist/esm/types/error.d.ts

@@ -8,7 +8,7 @@ export interface VideomailErrorData {
     explanation?: string | undefined;
     logLines?: string[] | undefined;
     message: string;
-    siteName?: string | undefined;
+    whitelistKey?: string | undefined;
     title: string;
     trace?: string | undefined;
     code?: string | undefined;

package/dist/esm/types/options.d.ts

@@ -12,7 +12,7 @@ export interface VideomailClientOptions {
     verbose: boolean;
     apiUrl: string;
     socketUrl: string;
-    siteName: string;
+    whitelistKey: string;
     enablePause: boolean;
     enableAutoPause: boolean;
     enableSpace: boolean;

package/dist/esm/util/error/VideomailError.d.ts

@@ -10,7 +10,7 @@ declare class VideomailError extends HTTPVideomailError {
     readonly title = "Error from videomail-client npm package";
     readonly location: string;
     logLines?: string[] | undefined;
-    siteName: string | undefined;
+    whitelistKey: string | undefined;
     cookie: string[] | undefined;
     err?: Error | undefined;
     promise?: Promise<any> | undefined;

package/dist/esm/util/html/dimensions/calculateWidth.d.ts

@@ -1,4 +1,4 @@
 import { Dimension } from "../../../types/dimension";
 import { VideomailClientOptions } from "../../../types/options";
-declare function calculateWidth(responsive: boolean, videoHeight: number, options: VideomailClientOptions, ratio?: number): Dimension;
+declare function calculateWidth(responsive: boolean, options: VideomailClientOptions, videoHeight?: number, ratio?: number): Dimension;
 export default calculateWidth;

package/dist/esm/wrappers/container.d.ts

@@ -42,7 +42,7 @@ declare class Container extends Despot {
     private hideMySelf;
     private submitVideomail;
     limitWidth(width?: number): import("../types/dimension").Dimension | undefined;
-    limitHeight(height: number): import("../types/dimension").Dimension;
+    limitHeight(height: number | undefined): import("../types/dimension").Dimension;
     private areVisualsHidden;
     hasElement(): boolean;
     getSubmitButton(): HTMLButtonElement | undefined;

package/dist/esm/wrappers/form.d.ts

@@ -112,7 +112,7 @@ declare class Form extends Despot {
         sentDateIso?: string;
         sentDateServerPretty?: string;
         serverTimePretty?: string;
-        siteName?: string;
+        whitelistKey?: string;
         siteTitle?: string;
         url?: string;
         userKey?: string;
@@ -251,7 +251,7 @@ declare class Form extends Despot {
         sentDateIso?: string;
         sentDateServerPretty?: string;
         serverTimePretty?: string;
-        siteName?: string;
+        whitelistKey?: string;
         siteTitle?: string;
         url?: string;
         userKey?: string;

package/dist/esm/wrappers/visuals/recorder.d.ts

@@ -103,14 +103,14 @@ declare class Recorder extends Despot {
     isUnloaded(): boolean | undefined;
     getRecorderWidth(responsive: boolean): Dimension | undefined;
     getRecorderHeight(responsive: boolean, useBoundingClientRect?: boolean): Dimension | undefined;
-    private getRatio;
+    getRatio(): number | undefined;
     calculateWidth(responsive: boolean): Dimension;
     calculateHeight(responsive: boolean): Dimension;
     getRawVisualUserMedia(): HTMLVideoElement | null | undefined;
     isConnected(): boolean;
     isConnecting(): boolean;
     limitWidth(width?: number): Dimension | undefined;
-    limitHeight(height: number): Dimension;
+    limitHeight(height: number | undefined): Dimension;
     isUserMediaLoaded(): boolean | undefined;
 }
 export default Recorder;

package/dist/esm/wrappers/visuals.d.ts

@@ -56,7 +56,7 @@ declare class Visuals extends Despot {
     getRecorderWidth(responsive: boolean): Dimension | undefined;
     getRecorderHeight(responsive: boolean, useBoundingClientRect?: boolean): Dimension | undefined;
     limitWidth(width?: number): Dimension | undefined;
-    limitHeight(height: number): Dimension;
+    limitHeight(height: number | undefined): Dimension;
     getReplay(): Replay;
     getBoundingClientRect(): DOMRect | undefined;
     checkTimer(elapsedTime: number): void;

package/dist/umd/index.js

@@ -6052,7 +6052,7 @@
                             val = options.strictNullHandling ? null : '';
                         } else {
                             key = options.decoder(part.slice(0, pos), defaults.decoder, charset, 'key');
-                            val = utils.maybeMap(parseArrayValue(part.slice(pos + 1), options, isArray(obj[key]) ? obj[key].length : 0), function(encodedVal) {
+                            if (null !== key) val = utils.maybeMap(parseArrayValue(part.slice(pos + 1), options, isArray(obj[key]) ? obj[key].length : 0), function(encodedVal) {
                                 return options.decoder(encodedVal, defaults.decoder, charset, 'value');
                             });
                         }
@@ -6060,9 +6060,11 @@
                         if (part.indexOf('[]=') > -1) val = isArray(val) ? [
                             val
                         ] : val;
-                        var existing = has.call(obj, key);
-                        if (existing && 'combine' === options.duplicates) obj[key] = utils.combine(obj[key], val);
-                        else if (!existing || 'last' === options.duplicates) obj[key] = val;
+                        if (null !== key) {
+                            var existing = has.call(obj, key);
+                            if (existing && 'combine' === options.duplicates) obj[key] = utils.combine(obj[key], val, options.arrayLimit, options.plainObjects);
+                            else if (!existing || 'last' === options.duplicates) obj[key] = val;
+                        }
                     }
                     return obj;
                 };
@@ -6076,7 +6078,7 @@
                     for(var i = chain.length - 1; i >= 0; --i){
                         var obj;
                         var root = chain[i];
-                        if ('[]' === root && options.parseArrays) obj = options.allowEmptyArrays && ('' === leaf || options.strictNullHandling && null === leaf) ? [] : utils.combine([], leaf);
+                        if ('[]' === root && options.parseArrays) obj = utils.isOverflow(leaf) ? leaf : options.allowEmptyArrays && ('' === leaf || options.strictNullHandling && null === leaf) ? [] : utils.combine([], leaf, options.arrayLimit, options.plainObjects);
                         else {
                             obj = options.plainObjects ? {
                                 __proto__: null
@@ -6097,12 +6099,19 @@
                     }
                     return leaf;
                 };
-                var parseKeys = function(givenKey, val, options, valuesParsed) {
-                    if (!givenKey) return;
+                var splitKeyIntoSegments = function(givenKey, options) {
                     var key = options.allowDots ? givenKey.replace(/\.([^.[]+)/g, '[$1]') : givenKey;
+                    if (options.depth <= 0) {
+                        if (!options.plainObjects && has.call(Object.prototype, key)) {
+                            if (!options.allowPrototypes) return;
+                        }
+                        return [
+                            key
+                        ];
+                    }
                     var brackets = /(\[[^[\]]*])/;
                     var child = /(\[[^[\]]*])/g;
-                    var segment = options.depth > 0 && brackets.exec(key);
+                    var segment = brackets.exec(key);
                     var parent = segment ? key.slice(0, segment.index) : key;
                     var keys = [];
                     if (parent) {
@@ -6112,9 +6121,10 @@
                         keys.push(parent);
                     }
                     var i = 0;
-                    while(options.depth > 0 && null !== (segment = child.exec(key)) && i < options.depth){
+                    while(null !== (segment = child.exec(key)) && i < options.depth){
                         i += 1;
-                        if (!options.plainObjects && has.call(Object.prototype, segment[1].slice(1, -1))) {
+                        var segmentContent = segment[1].slice(1, -1);
+                        if (!options.plainObjects && has.call(Object.prototype, segmentContent)) {
                             if (!options.allowPrototypes) return;
                         }
                         keys.push(segment[1]);
@@ -6123,6 +6133,12 @@
                         if (true === options.strictDepth) throw new RangeError('Input depth exceeded depth option of ' + options.depth + ' and strictDepth is true');
                         keys.push('[' + key.slice(segment.index) + ']');
                     }
+                    return keys;
+                };
+                var parseKeys = function(givenKey, val, options, valuesParsed) {
+                    if (!givenKey) return;
+                    var keys = splitKeyIntoSegments(givenKey, options);
+                    if (!keys) return;
                     return parseObject(keys, val, options, valuesParsed);
                 };
                 var normalizeParseOptions = function(opts) {
@@ -6373,8 +6389,23 @@
             "./node_modules/qs/lib/utils.js" (module1, __unused_rspack_exports, __webpack_require__) {
                 "use strict";
                 var formats = __webpack_require__("./node_modules/qs/lib/formats.js");
+                var getSideChannel = __webpack_require__("./node_modules/side-channel/index.js");
                 var has = Object.prototype.hasOwnProperty;
                 var isArray = Array.isArray;
+                var overflowChannel = getSideChannel();
+                var markOverflow = function(obj, maxIndex) {
+                    overflowChannel.set(obj, maxIndex);
+                    return obj;
+                };
+                var isOverflow = function(obj) {
+                    return overflowChannel.has(obj);
+                };
+                var getMaxIndex = function(obj) {
+                    return overflowChannel.get(obj);
+                };
+                var setMaxIndex = function(obj, maxIndex) {
+                    overflowChannel.set(obj, maxIndex);
+                };
                 var hexTable = function() {
                     var array = [];
                     for(var i = 0; i < 256; ++i)array.push('%' + ((i < 16 ? '0' : '') + i.toString(16)).toUpperCase());
@@ -6406,12 +6437,32 @@
                             target,
                             source
                         ];
-                        else if (options && (options.plainObjects || options.allowPrototypes) || !has.call(Object.prototype, source)) target[source] = true;
+                        else if (isOverflow(target)) {
+                            var newIndex = getMaxIndex(target) + 1;
+                            target[newIndex] = source;
+                            setMaxIndex(target, newIndex);
+                        } else if (options && (options.plainObjects || options.allowPrototypes) || !has.call(Object.prototype, source)) target[source] = true;
                         return target;
                     }
-                    if (!target || 'object' != typeof target) return [
-                        target
-                    ].concat(source);
+                    if (!target || 'object' != typeof target) {
+                        if (isOverflow(source)) {
+                            var sourceKeys = Object.keys(source);
+                            var result = options && options.plainObjects ? {
+                                __proto__: null,
+                                0: target
+                            } : {
+                                0: target
+                            };
+                            for(var m = 0; m < sourceKeys.length; m++){
+                                var oldKey = parseInt(sourceKeys[m], 10);
+                                result[oldKey + 1] = source[sourceKeys[m]];
+                            }
+                            return markOverflow(result, getMaxIndex(source) + 1);
+                        }
+                        return [
+                            target
+                        ].concat(source);
+                    }
                     var mergeTarget = target;
                     if (isArray(target) && !isArray(source)) mergeTarget = arrayToObject(target, options);
                     if (isArray(target) && isArray(source)) {
@@ -6521,8 +6572,18 @@
                     if (!obj || 'object' != typeof obj) return false;
                     return !!(obj.constructor && obj.constructor.isBuffer && obj.constructor.isBuffer(obj));
                 };
-                var combine = function(a, b) {
-                    return [].concat(a, b);
+                var combine = function(a, b, arrayLimit, plainObjects) {
+                    if (isOverflow(a)) {
+                        var newIndex = getMaxIndex(a) + 1;
+                        a[newIndex] = b;
+                        setMaxIndex(a, newIndex);
+                        return a;
+                    }
+                    var result = [].concat(a, b);
+                    if (result.length > arrayLimit) return markOverflow(arrayToObject(result, {
+                        plainObjects: plainObjects
+                    }), result.length - 1);
+                    return result;
                 };
                 var maybeMap = function(val, fn) {
                     if (isArray(val)) {
@@ -6540,6 +6601,7 @@
                     decode: decode,
                     encode: encode,
                     isBuffer: isBuffer,
+                    isOverflow: isOverflow,
                     isRegExp: isRegExp,
                     maybeMap: maybeMap,
                     merge: merge
@@ -7193,7 +7255,12 @@
                     this.emit('request', this);
                     xhr.send(void 0 === data ? null : data);
                 };
-                request.agent = ()=>new Agent();
+                const proxyAgent = new Proxy(Agent, {
+                    apply (target, thisArg, argumentsList) {
+                        return new target(...argumentsList);
+                    }
+                });
+                request.agent = proxyAgent;
                 for (const method of [
                     'GET',
                     'POST',
@@ -10510,7 +10577,7 @@
                 MP4: "mp4"
             };
             const constants = {
-                SITE_NAME_LABEL: "x-videomail-site-name",
+                WHITELIST_KEY_LABEL: "x-videomail-whitelist-key",
                 VERSION_LABEL: "videomailClientVersion",
                 public: {
                     ENC_TYPE_APP_JSON: "application/json",
@@ -10670,7 +10737,7 @@
             var client = __webpack_require__("./node_modules/superagent/lib/client.js");
             var client_default = /*#__PURE__*/ __webpack_require__.n(client);
             var package_namespaceObject = {
-                rE: "13.6.10"
+                rE: "13.6.12"
             };
             function isAudioEnabled(options) {
                 return Boolean(options.audio.enabled);
@@ -13955,7 +14022,7 @@
                 title = "Error from videomail-client npm package";
                 location = window.location.href;
                 logLines;
-                siteName;
+                whitelistKey;
                 cookie;
                 err;
                 promise;
@@ -13984,7 +14051,7 @@
                     super(message, errData);
                     this.explanation = errData?.explanation;
                     this.logLines = errData?.logLines;
-                    this.siteName = options.siteName;
+                    this.whitelistKey = options.whitelistKey;
                     this.classList = classList;
                     const browser = util_getBrowser(options);
                     const usefulClientData = browser.getUsefulData();
@@ -14637,7 +14704,7 @@
                 async get(identifierName, identifierValue) {
                     const url = `${this.options.apiUrl}/videomail/${identifierName}/${identifierValue}/snapshot`;
                     try {
-                        const request = await client_default()("get", url).type("json").set("Accept", "application/json").withCredentials().set("Timezone-Id", this.timezoneId).set(constants.SITE_NAME_LABEL, this.options.siteName).timeout(this.options.timeouts.connection);
+                        const request = await client_default()("get", url).type("json").set("Accept", "application/json").withCredentials().set("Timezone-Id", this.timezoneId).set(constants.WHITELIST_KEY_LABEL, this.options.whitelistKey).timeout(this.options.timeouts.connection);
                         const videomail = request.body;
                         return videomail;
                     } catch (exc) {
@@ -14649,7 +14716,7 @@
                 }
                 async write(method, videomail) {
                     const queryParams = {
-                        [constants.SITE_NAME_LABEL]: this.options.siteName
+                        [constants.WHITELIST_KEY_LABEL]: this.options.whitelistKey
                     };
                     let url = `${this.options.apiUrl}/videomail/`;
                     if (method === FormMethod.PUT && videomail.key) url += videomail.key;
@@ -14671,7 +14738,7 @@
                 }
                 async reportError(err) {
                     const queryParams = {
-                        [constants.SITE_NAME_LABEL]: this.options.siteName
+                        [constants.WHITELIST_KEY_LABEL]: this.options.whitelistKey
                     };
                     const url = `${this.options.apiUrl}/client-error/`;
                     try {
@@ -14689,7 +14756,7 @@
                             orientation: err.orientation,
                             os: err.os,
                             screen: err.screen,
-                            siteName: err.siteName,
+                            whitelistKey: err.whitelistKey,
                             status: err.status,
                             title: err.title,
                             message: err.message,
@@ -14776,7 +14843,7 @@
                 verbose: !PRODUCTION,
                 apiUrl: "https://videomail.io/api",
                 socketUrl: "wss://videomail.io",
-                siteName: "videomail-client-demo",
+                whitelistKey: "videomail-client-demo",
                 enablePause: true,
                 enableAutoPause: true,
                 enableSpace: true,
@@ -16216,7 +16283,7 @@
                 return dimension;
             }
             const dimensions_calculateHeight = calculateHeight;
-            function calculateWidth(responsive, videoHeight, options, ratio) {
+            function calculateWidth(responsive, options, videoHeight, ratio) {
                 const dimension = {
                     unit: "px"
                 };
@@ -16595,14 +16662,11 @@
                     return videoWidth && videoWidth > 0;
                 }
                 getRawWidth(responsive) {
-                    let rawWidth = this.getVideoWidth();
+                    let rawWidth;
                     const widthDimension = {
                         unit: "px"
                     };
-                    if (this.options.video.width || this.options.video.height) if (responsive) {
-                        const dimension = this.recorder.calculateWidth(responsive);
-                        rawWidth = dimension.value;
-                    } else rawWidth = this.options.video.width;
+                    rawWidth = responsive ? this.getVideoWidth() : this.options.video.width ? this.options.video.width : this.getVideoWidth();
                     if (responsive) {
                         const widthDimension = this.recorder.limitWidth(rawWidth);
                         rawWidth = widthDimension?.value;
@@ -16612,32 +16676,12 @@
                 }
                 getRawHeight(responsive) {
                     let rawHeight;
-                    if (this.options.video.width || this.options.video.height) {
-                        const heightDimension = this.recorder.calculateHeight(responsive);
-                        rawHeight = heightDimension.value;
-                        if (void 0 === rawHeight) throw error_createError({
-                            message: "Undefined height",
-                            explanation: "Calculated raw height cannot be undefined.",
-                            options: this.options
-                        });
-                        if (0 !== rawHeight && rawHeight < 1) throw error_createError({
-                            message: "Invalid height",
-                            explanation: `Calculated raw height of ${rawHeight} cannot be less than 1!`,
-                            options: this.options
-                        });
-                    } else {
-                        rawHeight = this.getVideoHeight();
-                        if (void 0 === rawHeight) throw error_createError({
-                            message: "Bad dimensions",
-                            explanation: "Raw video height from DOM element cannot be undefined.",
-                            options: this.options
-                        });
-                        if (0 !== rawHeight && rawHeight < 1) throw error_createError({
-                            message: "Bad dimensions",
-                            explanation: "Raw video height from DOM element cannot be less than 1.",
-                            options: this.options
-                        });
-                    }
+                    if (responsive) {
+                        rawHeight = this.options.video.height || this.getVideoHeight();
+                        const ratio = this.recorder.getRatio();
+                        const rawWidth = this.getRawWidth(responsive);
+                        if (void 0 !== ratio && rawWidth.value) rawHeight = rawWidth.value * ratio;
+                    } else rawHeight = this.options.video.height ? this.options.video.height : this.getVideoHeight();
                     if (responsive) {
                         const heightDimension = this.recorder.limitHeight(rawHeight);
                         rawHeight = heightDimension.value;
@@ -16857,8 +16901,8 @@
                     this.confirmedFrameNumber = this.confirmedSampleNumber = this.samplesCount = this.framesCount = 0;
                     this.sampleProgress = this.frameProgress = void 0;
                     this.key = args.key;
-                    if (args.mp4) this.replay.setMp4Source(`${args.mp4 + constants.SITE_NAME_LABEL}/${this.options.siteName}/videomail.mp4`, true);
-                    if (args.webm) this.replay.setWebMSource(`${args.webm + constants.SITE_NAME_LABEL}/${this.options.siteName}/videomail.webm`, true);
+                    if (args.mp4) this.replay.setMp4Source(`${args.mp4 + constants.WHITELIST_KEY_LABEL}/${this.options.whitelistKey}/videomail.mp4`, true);
+                    if (args.webm) this.replay.setWebMSource(`${args.webm + constants.WHITELIST_KEY_LABEL}/${this.options.whitelistKey}/videomail.webm`, true);
                     this.hide();
                     const widthDimension = this.getRecorderWidth(true);
                     const heightDimension = this.getRecorderHeight(true);
@@ -16878,7 +16922,7 @@
                     if (!this.connected) {
                         this.connecting = true;
                         this.emit("CONNECTING");
-                        const url2Connect = `${this.options.socketUrl}?${encodeURIComponent(constants.SITE_NAME_LABEL)}=${encodeURIComponent(this.options.siteName)}`;
+                        const url2Connect = `${this.options.socketUrl}?${encodeURIComponent(constants.WHITELIST_KEY_LABEL)}=${encodeURIComponent(this.options.whitelistKey)}`;
                         this.options.logger.debug(`Recorder: initializing web socket to ${url2Connect}`);
                         try {
                             this.stream = stream_default()(url2Connect, {
@@ -17594,8 +17638,8 @@
                         if (void 0 !== height && this.options.video.width) {
                             const ratio = this.getRatio();
                             if (void 0 !== ratio) {
-                                const maxHeight = this.options.video.width * ratio;
-                                height = Math.min(maxHeight, height);
+                                const idealHeight = this.options.video.width * ratio;
+                                height = Math.min(idealHeight, height);
                             }
                         }
                         recorderHeight = {
@@ -17626,7 +17670,8 @@
                     let videoHeight;
                     if (this.userMedia) videoHeight = this.userMedia.getVideoHeight();
                     else if (this.recorderElement) videoHeight = this.recorderElement.videoHeight || this.recorderElement.height;
-                    return dimensions_calculateWidth(responsive, videoHeight, this.options, this.getRatio());
+                    const ratio = this.getRatio();
+                    return dimensions_calculateWidth(responsive, this.options, videoHeight, ratio);
                 }
                 calculateHeight(responsive) {
                     let videoDimension;
@@ -17706,7 +17751,7 @@
                         height = this.videomail.height;
                         if (width) ratio = height / width;
                     }
-                    if (!width) width = dimensions_calculateWidth(responsive, videoHeight, this.options, ratio);
+                    if (!width) width = dimensions_calculateWidth(responsive, this.options, videoHeight, ratio);
                     if (!height) {
                         let element = this.visuals.getElement();
                         if (!element) element = document.body;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "videomail-client",
-  "version": "13.6.10",
+  "version": "13.6.12",
   "description": "A wicked npm package to record videos directly in the browser, wohooo!",
   "keywords": [
     "webcam",
@@ -69,7 +69,7 @@
     "is-power-of-two": "1.0.0",
     "nanoevents": "9.1.0",
     "serialize-error": "12.0.0",
-    "superagent": "10.2.3",
+    "superagent": "10.3.0",
     "ua-parser-js": "2.0.7",
     "websocket-stream": "5.5.2"
   },
@@ -91,16 +91,16 @@
     "@types/node": "24.10.1",
     "@types/superagent": "8.1.9",
     "@types/ua-parser-js": "0.7.39",
-    "@vitest/eslint-plugin": "1.6.5",
+    "@vitest/eslint-plugin": "1.6.6",
     "audit-ci": "7.1.0",
-    "chromatic": "13.3.4",
+    "chromatic": "13.3.5",
     "cross-env": "10.1.0",
     "eslint": "9.39.2",
     "eslint-import-resolver-typescript": "4.4.4",
     "eslint-plugin-de-morgan": "2.0.0",
     "eslint-plugin-depend": "1.4.0",
     "eslint-plugin-import-x": "4.16.1",
-    "eslint-plugin-package-json": "0.88.0",
+    "eslint-plugin-package-json": "0.88.1",
     "eslint-plugin-promise": "7.2.1",
     "eslint-plugin-regexp": "2.10.0",
     "eslint-plugin-security": "3.0.1",
@@ -114,12 +114,12 @@
     "prettier-plugin-curly": "0.4.1",
     "prettier-plugin-packagejson": "2.5.20",
     "prettier-plugin-sh": "0.18.0",
-    "release-it": "19.2.2",
+    "release-it": "19.2.3",
     "storybook": "10.1.11",
     "storybook-html-rsbuild": "3.2.0",
     "type-fest": "5.3.1",
     "typescript": "5.9.3",
-    "typescript-eslint": "8.51.0",
+    "typescript-eslint": "8.52.0",
     "vitest": "4.0.16"
   },
   "engines": {