@pexip/media 20.3.5 → 21.0.0

package/CHANGELOG.md

@@ -1,5 +1,65 @@
 # @pexip/media
 
+## 21.0.0
+
+### Major Changes
+
+- 2606fa4: Fix blur normalize function
+
+### Minor Changes
+
+- 1786b2d: Get correct stream status when only one input kind is requested
+- a004e3c: Introduce new `renderParams` that can be applied via the video
+  constraints:
+  - `backgroundThreshold` - Segmentation threshold for classifying pixels as
+    background (lower values include more background).
+  - `downSampleFactor` - Factor for downsampling the video frame before
+    processing (higher values improve performance but reduce quality).
+  - `lightWrapBlurAmount` - Amount of blur applied to the light wrap effect
+    around the subject's edges.
+  - `lightWrapEdgeBand` - Width of the edge band in pixels where the light wrap
+    effect is applied.
+  - `lightWrapIntensity` - Intensity/strength of the light wrap effect (0.0 to
+    1.0).
+  - `lightWrapTightness` - Controls how tightly the light wrap effect hugs the
+    subject's edges.
+  - `morphDilateRadiusPx` - Radius in pixels for morphological dilation
+    operation on the segmentation mask.
+  - `morphErodeRadiusPx` - Radius in pixels for morphological erosion operation
+    on the segmentation mask.
+  - `morphPass` - Number of morphological filter passes to apply for mask
+    refinement.
+  - `personCenterX` - X-coordinate (0.0 to 1.0) of the expected center position
+    of the person in the frame for segmentation optimization.
+  - `personCenterY` - Y-coordinate (0.0 to 1.0) of the expected center position
+    of the person in the frame for segmentation optimization.
+  - `sigmaRangeHi` - Bilateral filter: upper bound of sigma in color space for
+    edge-preserving smoothing.
+  - `sigmaRangeLo` - Bilateral filter: lower bound of sigma in color space for
+    edge-preserving smoothing.
+  - `sigmaSpace` - Bilateral filter: sigma in pixel space for mask edge
+    snapping.
+
+### Patch Changes
+
+- c10f5b6: Normalise initial `lightWrapBlurAmount` and `edgeBlurAmount` values
+- Updated dependencies [24bc717]
+- Updated dependencies [1786b2d]
+- Updated dependencies [872971f]
+- Updated dependencies [2e895ac]
+- Updated dependencies [3963c2e]
+- Updated dependencies [1fff975]
+- Updated dependencies [3963c2e]
+- Updated dependencies [762ebd2]
+- Updated dependencies [4eaf9d7]
+- Updated dependencies [4d2da34]
+- Updated dependencies [a004e3c]
+- Updated dependencies [4cc4701]
+  - @pexip/media-processor@21.0.0
+  - @pexip/media-control@21.0.0
+  - @pexip/utils@17.2.0
+  - @pexip/signal@16.9.4
+
 ## 20.3.5
 
 ### Patch Changes

package/api-docs/README.mdx

@@ -400,5 +400,7 @@ await mediaController.media.applyConstraints({
 | [isAudioContentHint](functions/isAudioContentHint.mdx) | - |
 | [isVideoContentHint](functions/isVideoContentHint.mdx) | - |
 | [isVideoStreamTrackProcessorAPIs](functions/isVideoStreamTrackProcessorAPIs.mdx) | - |
+| [getBlurKernelSize](functions/getBlurKernelSize.mdx) | A function to get the blur kernel size of image height based on Kawase blur algorithm |
+| [getTentBlurSize](functions/getTentBlurSize.mdx) | A function to get the Tent blur size of image height |
 | [applyContentHint](functions/applyContentHint.mdx) | Apply the content hint to the track |
 | [createVideoStreamProcess](functions/createVideoStreamProcess.mdx) | - |

package/api-docs/functions/getBlurKernelSize.mdx

@@ -0,0 +1,25 @@
+```ts
+function getBlurKernelSize(
+   norm, 
+   heightRef, 
+   height, 
+   max): number;
+```
+
+A function to get the blur kernel size of image height based on
+Kawase blur algorithm
+
+## Parameters
+
+| Parameter | Type | Description |
+| ------ | ------ | ------ |
+| `norm` | `number` | [0-100] The normalized blur amount |
+| `heightRef` | `number` | The reference image height |
+| `height` | `number` | The current image height |
+| `max` | `number` | The upper bound |
+
+## Returns
+
+`number`
+
+blur kernel size

package/api-docs/functions/getTentBlurSize.mdx

@@ -0,0 +1,24 @@
+```ts
+function getTentBlurSize(
+   norm, 
+   heightRef, 
+   height, 
+   max): number;
+```
+
+A function to get the Tent blur size of image height
+
+## Parameters
+
+| Parameter | Type | Default value | Description |
+| ------ | ------ | ------ | ------ |
+| `norm` | `number` | `undefined` | [0-100] The normalized blur amount |
+| `heightRef` | `number` | `undefined` | The reference image height |
+| `height` | `number` | `undefined` | The current image height |
+| `max` | `number` | `MAX_TENT_BLUR_SIZE` | The upper bound |
+
+## Returns
+
+`number`
+
+tent blur size

package/api-docs/type-aliases/VideoRenderParams.mdx

@@ -1,5 +1,5 @@
 ```ts
-type VideoRenderParams = Omit<RendererOptions, "effects"> & object;
+type VideoRenderParams = Omit<RendererOptions, "effects" | "personCenter"> & object;
 ```
 
 ## Type Declaration
@@ -13,3 +13,5 @@ type VideoRenderParams = Omit<RendererOptions, "effects"> & object;
 | `pan?` | `boolean` | - |
 | `tilt?` | `boolean` | - |
 | `zoom?` | `boolean` | - |
+| `personCenterX?` | `number` | - |
+| `personCenterY?` | `number` | - |

package/dist/constants.d.ts

@@ -6,3 +6,4 @@ export declare const PROCESSOR_LABELS: Readonly<{
 }>;
 export declare const GET_USER_MEDIA_TIMEOUT_MS = 10000;
 export declare const DEVICE_CHANGE_DEBOUNCE_TIMEOUT_MS = 500;
+export declare const MAX_TENT_BLUR_SIZE = 9;

package/dist/constants.js

@@ -6,3 +6,4 @@ export const PROCESSOR_LABELS = Object.freeze({
 });
 export const GET_USER_MEDIA_TIMEOUT_MS = 10000;
 export const DEVICE_CHANGE_DEBOUNCE_TIMEOUT_MS = 500;
+export const MAX_TENT_BLUR_SIZE = 9;

package/dist/index.d.ts

@@ -4,7 +4,7 @@ export * from './signals';
 export * from './status';
 export * from './typeGuard';
 export * from './types';
-export { applyContentHint } from './utils';
+export { applyContentHint, getBlurKernelSize, getTentBlurSize } from './utils';
 export { createAudioMixingProcess } from './audioMixingProcessor';
 export { createAudioStreamProcess } from './audioProcessor';
 export { createMedia } from './media';

package/dist/index.js

@@ -4,7 +4,7 @@ export * from './signals';
 export * from './status';
 export * from './typeGuard';
 export * from './types';
-export { applyContentHint } from './utils';
+export { applyContentHint, getBlurKernelSize, getTentBlurSize } from './utils';
 export { createAudioMixingProcess } from './audioMixingProcessor';
 export { createAudioStreamProcess } from './audioProcessor';
 export { createMedia } from './media';

package/dist/previewController.js

@@ -373,7 +373,7 @@ export const createPreviewStreamController = ({ getCurrentDevices, getCurrentMed
             const audioSettings = extractFeaturesToConstraints(AUDIO_SETTINGS_KEYS, previewAudio);
             // Omit the width & height settings from the preview so that the one
             // from the main can be applied
-            const { width: _width, height: _height, ...videoSettings } = extractFeaturesToConstraints(VIDEO_SETTINGS_KEYS, previewVideo);
+            const { width: _width, height: _height, edgeBlurAmount: _edgeBlurAmount, lightWrapBlurAmount: _lightWrapBlurAmount, backgroundBlurAmount: _backgroundBlurAmount, ...videoSettings } = extractFeaturesToConstraints(VIDEO_SETTINGS_KEYS, previewVideo);
             logger.info({ audioInput, videoInput, audioSettings, videoSettings }, 'Apply changes to main');
             try {
                 await replaceMainStream({

package/dist/types.d.ts

@@ -531,7 +531,7 @@ export interface MediaController {
      */
     tryAndGetUserMedia: (constraints: MediaDeviceRequest) => void;
 }
-export type VideoRenderParams = Omit<RendererOptions, 'effects'> & {
+export type VideoRenderParams = Omit<RendererOptions, 'effects' | 'personCenter'> & {
     /**
      * Target frame rate for the video segmentation
      */
@@ -545,6 +545,8 @@ export type VideoRenderParams = Omit<RendererOptions, 'effects'> & {
     pan?: boolean;
     tilt?: boolean;
     zoom?: boolean;
+    personCenterX?: number;
+    personCenterY?: number;
 };
 export interface MediaChangesSignals {
     onAddTrack: Signal<MediaStreamTrack>;

package/dist/userMedia.d.ts

@@ -11,7 +11,10 @@ export declare const toSameDeviceStatus: ({ audio, video, }: {
     audio: boolean;
     video: boolean;
 }) => UserMediaStatus.PermissionsGranted | UserMediaStatus.PermissionsGrantedFallback | UserMediaStatus.PermissionsGrantedFallbackAudioinput | UserMediaStatus.PermissionsGrantedFallbackVideoinput;
-export declare const toOnlyDeviceStatus: (kind: "audioinput" | "videoinput", matched: boolean, devices: IndexedDevices) => UserMediaStatus.PermissionsRejectedAudioInput | UserMediaStatus.PermissionsRejectedVideoInput | UserMediaStatus.PermissionsOnlyAudioinput | UserMediaStatus.PermissionsOnlyAudioinputNoVideoDevices | UserMediaStatus.PermissionsOnlyAudioinputFallback | UserMediaStatus.PermissionsOnlyAudioinputFallbackNoVideoDevices | UserMediaStatus.PermissionsOnlyVideoinput | UserMediaStatus.PermissionsOnlyVideoinputNoAudioDevices | UserMediaStatus.PermissionsOnlyVideoinputFallback | UserMediaStatus.PermissionsOnlyVideoinputFallbackNoAudioDevices;
+export declare const toOnlyDeviceStatus: (kind: "audioinput" | "videoinput", streamedRequestedDevices: {
+    audio: boolean;
+    video: boolean;
+}, devices: IndexedDevices) => UserMediaStatus.PermissionsRejectedAudioInput | UserMediaStatus.PermissionsRejectedVideoInput | UserMediaStatus.PermissionsOnlyAudioinput | UserMediaStatus.PermissionsOnlyAudioinputNoVideoDevices | UserMediaStatus.PermissionsOnlyAudioinputFallback | UserMediaStatus.PermissionsOnlyAudioinputFallbackNoVideoDevices | UserMediaStatus.PermissionsOnlyVideoinput | UserMediaStatus.PermissionsOnlyVideoinputNoAudioDevices | UserMediaStatus.PermissionsOnlyVideoinputFallback | UserMediaStatus.PermissionsOnlyVideoinputFallbackNoAudioDevices;
 /**
  * Check if there is any track match with the `kind`
  */

package/dist/userMedia.js

@@ -71,12 +71,16 @@ export const toSameDeviceStatus = ({ audio, video, }) => {
     }
     return UserMediaStatus.PermissionsGrantedFallback;
 };
-export const toOnlyDeviceStatus = (kind, matched, devices) => {
-    const hasAnotherTypeOfAuthorizedDevice = devices.anyAuthorizedDevice(kind === 'audioinput' ? 'videoinput' : 'audioinput');
-    const hasAnotherTypeOfDevice = devices.size(kind === 'audioinput' ? 'videoinput' : 'audioinput') > 0;
+export const toOnlyDeviceStatus = (kind, streamedRequestedDevices, devices) => {
+    const [self, other] = kind === 'audioinput' ? ['audio', 'video'] : ['video', 'audio'];
+    const otherKind = kind === 'audioinput' ? 'videoinput' : 'audioinput';
+    const matched = streamedRequestedDevices[self];
+    const anotherDeviceRequested = streamedRequestedDevices[other];
+    const hasAnotherTypeOfAuthorizedDevice = devices.anyAuthorizedDevice(otherKind);
+    const hasAnotherTypeOfDevice = devices.size(otherKind) > 0;
     if (matched) {
         if (hasAnotherTypeOfDevice) {
-            if (hasAnotherTypeOfAuthorizedDevice) {
+            if (hasAnotherTypeOfAuthorizedDevice || !anotherDeviceRequested) {
                 return kind === 'audioinput'
                     ? UserMediaStatus.PermissionsOnlyAudioinput
                     : UserMediaStatus.PermissionsOnlyVideoinput;
@@ -90,7 +94,7 @@ export const toOnlyDeviceStatus = (kind, matched, devices) => {
             : UserMediaStatus.PermissionsOnlyVideoinputNoAudioDevices;
     }
     if (hasAnotherTypeOfDevice) {
-        if (hasAnotherTypeOfAuthorizedDevice) {
+        if (hasAnotherTypeOfAuthorizedDevice || !anotherDeviceRequested) {
             return kind === 'audioinput'
                 ? UserMediaStatus.PermissionsOnlyAudioinputFallback
                 : UserMediaStatus.PermissionsOnlyVideoinputFallback;
@@ -421,10 +425,10 @@ export const requestUserMedia = (getCurrentDevices, getMedia = getUserMedia) =>
                 ? constraints.video
                 : false,
         });
-        const { audio, video } = isStreamingRequestedDevices(constraints, stream, devices);
-        const onlyAudioStatus = toOnlyDeviceStatus('audioinput', audio, devices);
-        const onlyVideoStatus = toOnlyDeviceStatus('videoinput', video, devices);
-        const status = deriveDeviceStatus(onlyAudioStatus, onlyVideoStatus, toSameDeviceStatus({ audio, video }));
+        const streamedRequestedDevices = isStreamingRequestedDevices(constraints, stream, devices);
+        const onlyAudioStatus = toOnlyDeviceStatus('audioinput', streamedRequestedDevices, devices);
+        const onlyVideoStatus = toOnlyDeviceStatus('videoinput', streamedRequestedDevices, devices);
+        const status = deriveDeviceStatus(onlyAudioStatus, onlyVideoStatus, toSameDeviceStatus(streamedRequestedDevices));
         return [stream, status];
     }
     catch (error) {
@@ -521,10 +525,10 @@ export const createGetUserMediaProcess = ({ getCurrentDevices, getUserMedia, sco
                 }));
         }
         const relaxedConstraints = {};
-        if (constraints.audio) {
+        if (constraints.audio !== undefined) {
             relaxedConstraints.audio = relaxInputConstraint('audioinput', constraints.audio, currentDevices);
         }
-        if (constraints.video) {
+        if (constraints.video !== undefined) {
             relaxedConstraints.video = relaxInputConstraint('videoinput', constraints.video, currentDevices);
         }
         const [stream, status] = await getUserMedia(relaxedConstraints);

package/dist/utils.d.ts

@@ -54,17 +54,28 @@ export declare const getSettingsFromKeys: (keys: ExtendedMediaTrackSettingsKey[]
 export declare const diffSettings: (keysToLookFor: ExtendedMediaTrackSettingsKey[]) => (settingsA: ExtendedMediaTrackSettings | undefined, settingsB: ExtendedMediaTrackSettings | undefined) => ExtendedMediaTrackSettings | undefined;
 export declare const mergeSettings: (settingsA: ExtendedMediaTrackSettings | undefined, settingsB: ExtendedMediaTrackSettings | undefined) => ExtendedMediaTrackSettings | undefined;
 /**
- * A function to get the blur kernel size of image height
+ * A function to get the blur kernel size of image height based on
+ * Kawase blur algorithm
  *
- * @param percentage - The percentage of image height to calculate the blur
- * kernel size
- * @param height - The image height
- * @param lowestProcessingHeight - The lowest image height that is processed by the consumer, used to adjust the blur kernel size across different resolutions
+ * @param norm - [0-100] The normalized blur amount
+ * @param heightRef - The reference image height
+ * @param height - The current image height
  * @param max - The upper bound
  *
  * @returns blur kernel size
  */
-export declare const getBlurKernelSize: (percentage: number, height: number, lowestProcessingHeight?: number, max?: number) => number;
+export declare const getBlurKernelSize: (norm: number, heightRef: number, height: number, max?: number) => number;
+/**
+ * A function to get the Tent blur size of image height
+ *
+ * @param norm - [0-100] The normalized blur amount
+ * @param heightRef - The reference image height
+ * @param height - The current image height
+ * @param max - The upper bound
+ *
+ * @returns tent blur size
+ */
+export declare const getTentBlurSize: (norm: number, heightRef: number, height: number, max?: number) => number;
 /**
  * Apply the content hint to the track
  *

package/dist/utils.js

@@ -1,7 +1,8 @@
 import { createStreamTrackEventSubscriptions, createTrackDevicesChanges, extractConstraintsWithKeys, findDeviceFromConstraints, relaxInputConstraint, resolveMediaDeviceConstraints, shouldRequestDevice, toMediaDeviceInputKind, } from '@pexip/media-control';
-import { calculateMaxBlurPass } from '@pexip/media-processor';
+import { calculateMaxBlurPass, clamping, } from '@pexip/media-processor';
 import { hasOwn, assert, isEmpty } from '@pexip/utils';
 import { internalSignals } from './signals';
+import { MAX_TENT_BLUR_SIZE } from './constants';
 export const makeDeriveDeviceStatus = (constraints) => (audio, video, both) => {
     if (constraints.audio) {
         if (constraints.video) {
@@ -684,26 +685,39 @@ export const mergeSettings = (settingsA, settingsB) => {
     }
     return { ...settingsA, ...settingsB };
 };
+const clampNorm = clamping(0, 100);
 /**
- * A function to get the blur kernel size of image height
+ * A function to get the blur kernel size of image height based on
+ * Kawase blur algorithm
  *
- * @param percentage - The percentage of image height to calculate the blur
- * kernel size
- * @param height - The image height
- * @param lowestProcessingHeight - The lowest image height that is processed by the consumer, used to adjust the blur kernel size across different resolutions
+ * @param norm - [0-100] The normalized blur amount
+ * @param heightRef - The reference image height
+ * @param height - The current image height
  * @param max - The upper bound
  *
  * @returns blur kernel size
  */
-export const getBlurKernelSize = (percentage, height, lowestProcessingHeight, max = calculateMaxBlurPass(height)) => {
-    if (height <= 0 || percentage <= 0 || max <= 0) {
+export const getBlurKernelSize = (norm, heightRef, height, max = calculateMaxBlurPass(height)) => {
+    if (height <= 0 || norm <= 0 || max <= 0 || heightRef <= 0) {
         return 0;
     }
-    const minHeightMaxBlurPass = lowestProcessingHeight
-        ? calculateMaxBlurPass(lowestProcessingHeight)
-        : max;
-    return Math.min(Math.ceil(percentage * 0.01 * max) +
-        Math.max(0, max - minHeightMaxBlurPass), max);
+    return clamping(0, max)(Math.round(clampNorm(norm) * 0.01 * max - Math.log2(heightRef / height)));
+};
+/**
+ * A function to get the Tent blur size of image height
+ *
+ * @param norm - [0-100] The normalized blur amount
+ * @param heightRef - The reference image height
+ * @param height - The current image height
+ * @param max - The upper bound
+ *
+ * @returns tent blur size
+ */
+export const getTentBlurSize = (norm, heightRef, height, max = MAX_TENT_BLUR_SIZE) => {
+    if (height <= 0 || norm <= 0 || heightRef <= 0 || max <= 0) {
+        return 0;
+    }
+    return clamping(0, max)(Math.round((norm * 0.01 * max * height) / heightRef));
 };
 /**
  * Apply the content hint to the track

package/dist/videoProcessor.d.ts

@@ -18,7 +18,7 @@ interface VideoStreamProcessOptions extends Partial<VideoRenderParams>, Omit<Pro
      * Whether or to enable this processor
      */
     shouldEnable: () => boolean;
-    lowestProcessingHeight?: number;
+    referenceProcessingHeight?: number;
     processingWidth: number;
     processingHeight: number;
     hasInitializedDeps?: boolean;
@@ -34,9 +34,9 @@ interface VideoStreamProcessProps extends Partial<VideoRenderParams>, Required<P
     hasInitialized: boolean;
     contentHint?: VideoContentHint;
 }
-declare const FEATURE_KEYS: readonly ["backgroundBlurAmount", "backgroundImageUrl", "maskCombineRatio", "edgeBlurAmount", "foregroundThreshold", "frameRate", "videoSegmentation", "videoSegmentationModel", "width", "height", "pan", "tilt", "zoom", "contentHint"];
+declare const FEATURE_KEYS: readonly ["backgroundBlurAmount", "backgroundImageUrl", "backgroundThreshold", "maskCombineRatio", "edgeBlurAmount", "foregroundThreshold", "frameRate", "videoSegmentation", "videoSegmentationModel", "width", "height", "pan", "tilt", "zoom", "contentHint", "sigmaSpace", "sigmaRangeLo", "sigmaRangeHi", "excludeBystanders", "personCenterX", "personCenterY", "morphErodeRadiusPx", "morphPass", "morphDilateRadiusPx", "lightWrapIntensity", "lightWrapTightness", "lightWrapEdgeBand", "lightWrapBlurAmount", "downSampleFactor"];
 type FeaturePropKeys = (typeof FEATURE_KEYS)[number];
 type FeatureProps = Pick<Partial<VideoStreamProcessProps>, FeaturePropKeys>;
 export declare const updateFeatureProps: (constraints: MediaDeviceRequest["video"], props: FeatureProps) => FeatureProps;
-export declare const createVideoStreamProcess: ({ backgroundImageUrl, dynamicProcessingDimensions, edgeBlurAmount, foregroundThreshold, frameRate, gpuAPI, label, lowestProcessingHeight, maskCombineRatio, processingHeight, processingWidth, shouldEnable, stopAsMute, trackProcessorAPI, videoSegmentation, signals, ...options }: VideoStreamProcessOptions) => TrackProcessor;
+export declare const createVideoStreamProcess: ({ backgroundImageUrl, dynamicProcessingDimensions, backgroundThreshold, downSampleFactor, foregroundThreshold, lightWrapEdgeBand, lightWrapIntensity, lightWrapTightness, morphDilateRadiusPx, morphErodeRadiusPx, morphPass, personCenterX, personCenterY, sigmaSpace, sigmaRangeHi, sigmaRangeLo, frameRate, gpuAPI, label, referenceProcessingHeight, maskCombineRatio, processingHeight, processingWidth, shouldEnable, stopAsMute, trackProcessorAPI, videoSegmentation, signals, ...options }: VideoStreamProcessOptions) => TrackProcessor;
 export {};

package/dist/videoProcessor.js

@@ -1,13 +1,14 @@
 import { createCanvasTransform, createVideoProcessor, createVideoTrackProcessor, createVideoTrackProcessorWithFallback, isRenderEffects, isSegmentationModel, } from '@pexip/media-processor';
 import { extractConstraintsWithKeys, getValueFromConstrainNumber, muteStreamTrack, } from '@pexip/media-control';
 import { isEmpty, assert } from '@pexip/utils';
-import { createMediaTrack, getBlurKernelSize } from './utils';
+import { createMediaTrack, getBlurKernelSize, getTentBlurSize } from './utils';
 import { logger, proxyWithLog } from './logger';
 import { isVideoContentHint } from './typeGuard';
 import { PROCESSOR_LABELS } from './constants';
 const FEATURE_KEYS = [
     'backgroundBlurAmount',
     'backgroundImageUrl',
+    'backgroundThreshold',
     'maskCombineRatio',
     'edgeBlurAmount',
     'foregroundThreshold',
@@ -20,6 +21,20 @@ const FEATURE_KEYS = [
     'tilt',
     'zoom',
     'contentHint',
+    'sigmaSpace',
+    'sigmaRangeLo',
+    'sigmaRangeHi',
+    'excludeBystanders',
+    'personCenterX',
+    'personCenterY',
+    'morphErodeRadiusPx',
+    'morphPass',
+    'morphDilateRadiusPx',
+    'lightWrapIntensity',
+    'lightWrapTightness',
+    'lightWrapEdgeBand',
+    'lightWrapBlurAmount',
+    'downSampleFactor',
 ];
 const getVideoConstraints = extractConstraintsWithKeys(FEATURE_KEYS);
 export const updateFeatureProps = (constraints, props) => {
@@ -62,13 +77,27 @@ export const updateFeatureProps = (constraints, props) => {
                 }
                 return accm;
             }
-            case 'width':
-            case 'height':
-            case 'frameRate':
-            case 'foregroundThreshold':
+            case 'backgroundBlurAmount':
+            case 'backgroundThreshold':
+            case 'downSampleFactor':
             case 'edgeBlurAmount':
+            case 'foregroundThreshold':
+            case 'frameRate':
+            case 'height':
+            case 'lightWrapBlurAmount':
+            case 'lightWrapEdgeBand':
+            case 'lightWrapIntensity':
+            case 'lightWrapTightness':
             case 'maskCombineRatio':
-            case 'backgroundBlurAmount': {
+            case 'morphDilateRadiusPx':
+            case 'morphErodeRadiusPx':
+            case 'morphPass':
+            case 'personCenterX':
+            case 'personCenterY':
+            case 'sigmaRangeHi':
+            case 'sigmaRangeLo':
+            case 'sigmaSpace':
+            case 'width': {
                 const [feature] = extracted[key];
                 if (feature !== undefined) {
                     const value = getValueFromConstrainNumber(feature);
@@ -96,23 +125,68 @@ export const updateFeatureProps = (constraints, props) => {
         }
     }, {});
 };
-const applyFeatures = (transformer, features, lowestProcessingHeight) => {
+const applyFeatures = (transformer, features, referenceProcessingHeight) => {
     for (const key in features) {
         const k = key;
         switch (k) {
-            case 'edgeBlurAmount':
             case 'maskCombineRatio':
-            case 'foregroundThreshold': {
+            case 'foregroundThreshold':
+            case 'sigmaSpace':
+            case 'sigmaRangeLo':
+            case 'sigmaRangeHi':
+            case 'morphErodeRadiusPx':
+            case 'morphPass':
+            case 'morphDilateRadiusPx':
+            case 'lightWrapIntensity':
+            case 'lightWrapTightness':
+            case 'lightWrapEdgeBand':
+            case 'downSampleFactor':
+            case 'backgroundThreshold': {
+                const value = features[k];
+                if (value !== undefined) {
+                    transformer[k] = value;
+                }
+                break;
+            }
+            case 'excludeBystanders': {
                 const value = features[k];
                 if (value !== undefined) {
                     transformer[k] = value;
                 }
                 break;
             }
+            case 'personCenterX': {
+                const value = features[k];
+                if (value !== undefined) {
+                    transformer.personCenter = [
+                        value,
+                        transformer.personCenter[1],
+                    ];
+                }
+                break;
+            }
+            case 'personCenterY': {
+                const value = features[k];
+                if (value !== undefined) {
+                    transformer.personCenter = [
+                        transformer.personCenter[0],
+                        value,
+                    ];
+                }
+                break;
+            }
+            case 'lightWrapBlurAmount':
             case 'backgroundBlurAmount': {
                 const value = features[k];
                 if (value !== undefined) {
-                    transformer[k] = getBlurKernelSize(value, transformer.height, lowestProcessingHeight);
+                    transformer[k] = getBlurKernelSize(value, referenceProcessingHeight ?? transformer.height, transformer.height);
+                }
+                break;
+            }
+            case 'edgeBlurAmount': {
+                const value = features[k];
+                if (value !== undefined) {
+                    transformer[k] = getTentBlurSize(value, referenceProcessingHeight ?? transformer.height, transformer.height);
                 }
                 break;
             }
@@ -143,28 +217,47 @@ const getTrackProcessor = (shouldUseStreamTrackProcessor, ...params) => {
     }
     return createVideoTrackProcessorWithFallback(...params);
 };
-export const createVideoStreamProcess = ({ backgroundImageUrl, dynamicProcessingDimensions = () => false, edgeBlurAmount, foregroundThreshold, frameRate, gpuAPI = () => 'webgl', // dynamically changing the config will not be picked up, not a priority for now
-label = PROCESSOR_LABELS.VideoProcessor, lowestProcessingHeight, maskCombineRatio, processingHeight, processingWidth, shouldEnable, stopAsMute = () => false, trackProcessorAPI = () => 'stream', videoSegmentation, signals, ...options }) => {
+export const createVideoStreamProcess = ({ backgroundImageUrl, dynamicProcessingDimensions = () => false, backgroundThreshold, downSampleFactor, foregroundThreshold, lightWrapEdgeBand, lightWrapIntensity, lightWrapTightness, morphDilateRadiusPx, morphErodeRadiusPx, morphPass, personCenterX, personCenterY, sigmaSpace, sigmaRangeHi, sigmaRangeLo, frameRate, gpuAPI = () => 'webgl', // dynamically changing the config will not be picked up, not a priority for now
+label = PROCESSOR_LABELS.VideoProcessor, referenceProcessingHeight, maskCombineRatio, processingHeight, processingWidth, shouldEnable, stopAsMute = () => false, trackProcessorAPI = () => 'stream', videoSegmentation, signals, ...options }) => {
     const videoSegmentationModel = options.videoSegmentationModel ?? 'selfie';
     const segmenter = options.segmenters[videoSegmentationModel];
     if (!segmenter) {
         throw new Error('Segmenter is undefined');
     }
     const backgroundBlurAmount = options.backgroundBlurAmount &&
-        getBlurKernelSize(options.backgroundBlurAmount, processingHeight, lowestProcessingHeight);
+        getBlurKernelSize(options.backgroundBlurAmount, referenceProcessingHeight ?? processingHeight, processingHeight);
+    const lightWrapBlurAmount = options.lightWrapBlurAmount &&
+        getBlurKernelSize(options.lightWrapBlurAmount, referenceProcessingHeight ?? processingHeight, processingHeight);
+    const edgeBlurAmount = options.edgeBlurAmount &&
+        getTentBlurSize(options.edgeBlurAmount, referenceProcessingHeight ?? processingHeight, processingHeight);
     const transformer = options.transformer ??
         createCanvasTransform(segmenter, {
-            width: processingWidth,
-            height: processingHeight,
-            effects: videoSegmentation,
-            foregroundThreshold,
             backgroundBlurAmount,
-            edgeBlurAmount,
             backgroundImageUrl,
+            backgroundThreshold,
+            downSampleFactor,
+            edgeBlurAmount,
+            effects: videoSegmentation,
+            foregroundThreshold,
+            height: processingHeight,
+            lightWrapBlurAmount,
+            lightWrapEdgeBand,
+            lightWrapIntensity,
+            lightWrapTightness,
             maskCombineRatio,
+            morphDilateRadiusPx,
+            morphErodeRadiusPx,
+            morphPass,
+            personCenter: personCenterX !== undefined && personCenterY !== undefined
+                ? [personCenterX, personCenterY]
+                : undefined,
+            sigmaRangeHi,
+            sigmaRangeLo,
+            sigmaSpace,
+            width: processingWidth,
         });
     const proxy = proxyWithLog(logger, label);
-    let _videoProcessor = undefined;
+    let _videoProcessor;
     const props = {
         videoSegmentationModel,
         segmenters: {
@@ -186,11 +279,25 @@ label = PROCESSOR_LABELS.VideoProcessor, lowestProcessingHeight, maskCombineRati
         },
         videoSegmentation,
         backgroundBlurAmount,
+        backgroundImageUrl,
+        backgroundThreshold,
+        downSampleFactor,
         edgeBlurAmount,
         foregroundThreshold,
         frameRate,
-        backgroundImageUrl,
+        lightWrapBlurAmount,
+        lightWrapEdgeBand,
+        lightWrapIntensity,
+        lightWrapTightness,
         maskCombineRatio,
+        morphDilateRadiusPx,
+        morphErodeRadiusPx,
+        morphPass,
+        personCenterX,
+        personCenterY,
+        sigmaRangeHi,
+        sigmaRangeLo,
+        sigmaSpace,
         hasInitialized: options.hasInitializedDeps ?? false,
     };
     return async (prevMediaTrack) => {
@@ -227,7 +334,16 @@ label = PROCESSOR_LABELS.VideoProcessor, lowestProcessingHeight, maskCombineRati
                         });
                         if (props.backgroundBlurAmount !== undefined) {
                             props.transformer.backgroundBlurAmount =
-                                getBlurKernelSize(props.backgroundBlurAmount, height, lowestProcessingHeight);
+                                getBlurKernelSize(props.backgroundBlurAmount, referenceProcessingHeight ??
+                                    processingHeight, height);
+                        }
+                        if (props.lightWrapBlurAmount !== undefined) {
+                            props.transformer.lightWrapBlurAmount =
+                                getBlurKernelSize(props.lightWrapBlurAmount, referenceProcessingHeight ??
+                                    processingHeight, height);
+                        }
+                        if (props.edgeBlurAmount !== undefined) {
+                            props.transformer.edgeBlurAmount = getTentBlurSize(props.edgeBlurAmount, referenceProcessingHeight ?? processingHeight, height);
                         }
                     }
                 }
@@ -238,7 +354,7 @@ label = PROCESSOR_LABELS.VideoProcessor, lowestProcessingHeight, maskCombineRati
             }
             props.hasInitialized = true;
         }
-        applyFeatures(props.transformer, features, lowestProcessingHeight);
+        applyFeatures(props.transformer, features, referenceProcessingHeight);
         const model = features.videoSegmentationModel &&
             props.segmenters[features.videoSegmentationModel];
         if (features.videoSegmentationModel &&
@@ -318,7 +434,7 @@ label = PROCESSOR_LABELS.VideoProcessor, lowestProcessingHeight, maskCombineRati
                 if (isEmpty(features)) {
                     return;
                 }
-                applyFeatures(props.transformer, features, lowestProcessingHeight);
+                applyFeatures(props.transformer, features, referenceProcessingHeight);
                 if (dynamicProcessingDimensions()) {
                     const acceptedSettings = this.previousMediaTrack?.source.getSettings();
                     if (acceptedSettings?.width && acceptedSettings?.height) {
@@ -328,7 +444,16 @@ label = PROCESSOR_LABELS.VideoProcessor, lowestProcessingHeight, maskCombineRati
                         });
                         if (props.backgroundBlurAmount !== undefined) {
                             props.transformer.backgroundBlurAmount =
-                                getBlurKernelSize(props.backgroundBlurAmount, acceptedSettings.height, lowestProcessingHeight);
+                                getBlurKernelSize(props.backgroundBlurAmount, referenceProcessingHeight ??
+                                    processingHeight, acceptedSettings.height);
+                        }
+                        if (props.lightWrapBlurAmount !== undefined) {
+                            props.transformer.lightWrapBlurAmount =
+                                getBlurKernelSize(props.lightWrapBlurAmount, referenceProcessingHeight ??
+                                    processingHeight, acceptedSettings.height);
+                        }
+                        if (props.edgeBlurAmount !== undefined) {
+                            props.transformer.edgeBlurAmount = getTentBlurSize(props.edgeBlurAmount, referenceProcessingHeight ?? processingHeight, acceptedSettings.height);
                         }
                     }
                 }
@@ -343,18 +468,35 @@ label = PROCESSOR_LABELS.VideoProcessor, lowestProcessingHeight, maskCombineRati
             getSettings: () => {
                 const contentHint = track.contentHint ?? '';
                 return {
-                    videoSegmentation: transformer.effects,
-                    foregroundThreshold: transformer.foregroundThreshold,
-                    // Background blur amount is a function of height
                     backgroundBlurAmount: props.backgroundBlurAmount,
+                    backgroundImageUrl: transformer.backgroundImageUrl,
+                    backgroundThreshold: transformer.backgroundThreshold,
+                    contentHint,
+                    downSampleFactor: transformer.downSampleFactor,
                     edgeBlurAmount: transformer.edgeBlurAmount,
+                    excludeBystanders: transformer.excludeBystanders,
+                    foregroundThreshold: transformer.foregroundThreshold,
+                    frameRate: props.frameRate,
+                    height: props.height,
+                    lightWrapBlurAmount: transformer.lightWrapBlurAmount,
+                    lightWrapEdgeBand: transformer.lightWrapEdgeBand,
+                    lightWrapIntensity: transformer.lightWrapIntensity,
+                    lightWrapTightness: transformer.lightWrapTightness,
                     maskCombineRatio: transformer.maskCombineRatio,
-                    backgroundImageUrl: transformer.backgroundImageUrl,
-                    videoSegmentationModel: transformer.segmenter.modelAsset.modelName,
+                    morphDilateRadiusPx: transformer.morphDilateRadiusPx,
+                    morphErodeRadiusPx: transformer.morphErodeRadiusPx,
+                    morphPass: transformer.morphPass,
                     pan: props.pan,
+                    personCenterX: transformer.personCenter[0],
+                    personCenterY: transformer.personCenter[1],
+                    sigmaRangeHi: transformer.sigmaRangeHi,
+                    sigmaRangeLo: transformer.sigmaRangeLo,
+                    sigmaSpace: transformer.sigmaSpace,
                     tilt: props.tilt,
+                    videoSegmentation: transformer.effects,
+                    videoSegmentationModel: transformer.segmenter.modelAsset.modelName,
+                    width: props.width,
                     zoom: props.zoom,
-                    contentHint,
                 };
             },
         });

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "@pexip/media",
-  "version": "20.3.5",
+  "version": "21.0.0",
   "description": "Home for media related stuff",
-  "homepage": "https://gitlab.com/pexip/zoo",
+  "homepage": "https://developer.pexip.com",
   "bugs": "https://gitlab.com/pexip/zoo/issues",
   "repository": {
     "type": "git",
@@ -34,11 +34,11 @@
     "api-docs"
   ],
   "scripts": {
-    "build": "pexip-bundler build && yarn docs",
-    "build:sourcemap": "pexip-bundler build --sourcemap && yarn docs",
+    "build": "pexip-bundler build",
+    "build:sourcemap": "pexip-bundler build --sourcemap",
     "clean": "rm -fr dist api-docs",
     "dev": "pexip-bundler dev",
-    "prepack": "yarn clean && yarn build",
+    "prepack": "yarn clean && yarn build && yarn docs",
     "test": "jest",
     "check-format": "prettier --ignore-path=../../.prettierignore --check .",
     "format": "prettier --ignore-path=../../.prettierignore --write .",
@@ -47,10 +47,10 @@
     "docs": "typedoc"
   },
   "dependencies": {
-    "@pexip/media-control": "20.3.5",
-    "@pexip/media-processor": "20.3.5",
-    "@pexip/signal": "16.9.3",
-    "@pexip/utils": "17.1.3"
+    "@pexip/media-control": "21.0.0",
+    "@pexip/media-processor": "21.0.0",
+    "@pexip/signal": "16.9.4",
+    "@pexip/utils": "17.2.0"
   },
   "devDependencies": {
     "@jest/globals": "^30.2.0",