@zync/zync-screnplay-player 0.1.187

package/dist/screenplay/RemotionRenderer/helpers/faceCenteredVideoTransforms.js

@@ -0,0 +1,468 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+/**
+ * Face-Centered Video Transform Calculator
+ *
+ * This helper calculates transform origin and positioning to ensure a video is ALWAYS
+ * centered on a person's face, regardless of aspect ratio (landscape, square, portrait).
+ *
+ * Key features:
+ * - Converts absolute face coordinates to relative values
+ * - Handles different target aspect ratios (1920x1080, 1080x1080, 1080x1920)
+ * - Provides smooth interpolation between frames
+ * - Calculates optimal scale and positioning for face centering
+ */
+
+import { useCurrentFrame } from "remotion";
+
+/**
+ * Calculate face-centered video transforms
+ * @param {Object} params - Configuration object
+ * @param {Object} params.faceMetadata - Face detection metadata
+ * @param {number} params.targetWidth - Target video width (1920 for landscape, 1080 for square/portrait)
+ * @param {number} params.targetHeight - Target video height (1080 for landscape/square, 1920 for portrait)
+ * @param {number} params.currentFrame - Current frame number (optional, will use useCurrentFrame if not provided)
+ * @param {boolean} params.enableInterpolation - Whether to interpolate between frames
+ * @param {number} params.faceScale - Scale factor for face area (1.0 = face fills frame, 0.5 = face takes half frame)
+ * @param {boolean} params.useAveragePosition - Whether to use average face position for entire video duration
+ * @param {boolean} params.centerHorizontally - Whether to only center horizontally (X axis), not vertically (Y axis)
+ * @returns {Object} Transform styles and debug info
+ */
+export var calculateFaceCenteredTransforms = function calculateFaceCenteredTransforms(_ref) {
+  var _faceMetadata$metadat, _faceMetadata$metadat2;
+  var faceMetadata = _ref.faceMetadata,
+    targetWidth = _ref.targetWidth,
+    targetHeight = _ref.targetHeight,
+    _ref$currentFrame = _ref.currentFrame,
+    currentFrame = _ref$currentFrame === void 0 ? null : _ref$currentFrame,
+    _ref$enableInterpolat = _ref.enableInterpolation,
+    enableInterpolation = _ref$enableInterpolat === void 0 ? true : _ref$enableInterpolat,
+    _ref$faceScale = _ref.faceScale,
+    faceScale = _ref$faceScale === void 0 ? 0.6 : _ref$faceScale,
+    _ref$useAveragePositi = _ref.useAveragePosition,
+    useAveragePosition = _ref$useAveragePositi === void 0 ? false : _ref$useAveragePositi,
+    _ref$centerHorizontal = _ref.centerHorizontally,
+    centerHorizontally = _ref$centerHorizontal === void 0 ? false : _ref$centerHorizontal;
+  // Get current frame if not provided
+  var frameIndex = currentFrame;
+  if (frameIndex === null) {
+    try {
+      var remotionFrame = useCurrentFrame();
+      frameIndex = remotionFrame;
+    } catch (error) {
+      // useCurrentFrame not available (e.g., in testing environment)
+      frameIndex = 0;
+    }
+  }
+
+  // Validate inputs
+  if (!(faceMetadata !== null && faceMetadata !== void 0 && (_faceMetadata$metadat = faceMetadata.metadata) !== null && _faceMetadata$metadat !== void 0 && _faceMetadata$metadat.frames) || !(faceMetadata !== null && faceMetadata !== void 0 && (_faceMetadata$metadat2 = faceMetadata.metadata) !== null && _faceMetadata$metadat2 !== void 0 && _faceMetadata$metadat2.videoProperties)) {
+    return {
+      transform: "scale(1) translate(0px, 0px)",
+      transformOrigin: "center center",
+      debugInfo: {
+        error: "Invalid face metadata"
+      }
+    };
+  }
+  var _faceMetadata$metadat3 = faceMetadata.metadata,
+    frames = _faceMetadata$metadat3.frames,
+    videoProperties = _faceMetadata$metadat3.videoProperties;
+  var sourceWidth = videoProperties.width,
+    sourceHeight = videoProperties.height;
+
+  // Get face data for current frame or use average position
+  var faceData = useAveragePosition ? getAverageFaceData(frames) : getFaceDataForFrame(frames, frameIndex, enableInterpolation);
+  if (!faceData) {
+    return {
+      transform: "scale(1) translate(0px, 0px)",
+      transformOrigin: "center center",
+      debugInfo: {
+        error: "No face data available"
+      }
+    };
+  }
+
+  // Convert absolute face coordinates to relative (0-1 range)
+  var relativeFaceX = faceData.face_center[0] / sourceWidth;
+  var relativeFaceY = faceData.face_center[1] / sourceHeight;
+
+  // Calculate source and target aspect ratios
+  var sourceAspectRatio = sourceWidth / sourceHeight;
+  var targetAspectRatio = targetWidth / targetHeight;
+
+  // Calculate how the source video will be scaled to fit the target container
+  var videoScaleX,
+    videoScaleY,
+    videoOffsetX = 0,
+    videoOffsetY = 0;
+  if (sourceAspectRatio > targetAspectRatio) {
+    // Source is wider - will be cropped horizontally
+    videoScaleY = targetHeight / sourceHeight;
+    videoScaleX = videoScaleY;
+    var scaledWidth = sourceWidth * videoScaleX;
+    videoOffsetX = (targetWidth - scaledWidth) / 2;
+  } else {
+    // Source is taller - will be cropped vertically
+    videoScaleX = targetWidth / sourceWidth;
+    videoScaleY = videoScaleX;
+    var scaledHeight = sourceHeight * videoScaleY;
+    videoOffsetY = (targetHeight - scaledHeight) / 2;
+  }
+
+  // Calculate face position in the scaled video
+  var scaledFaceX = relativeFaceX * sourceWidth * videoScaleX + videoOffsetX;
+  var scaledFaceY = relativeFaceY * sourceHeight * videoScaleY + videoOffsetY;
+
+  // Calculate how much we need to translate to center the face
+  var targetCenterX = targetWidth / 2;
+  var targetCenterY = targetHeight / 2;
+  var translateX = targetCenterX - scaledFaceX;
+  var translateY = centerHorizontally ? 0 : targetCenterY - scaledFaceY;
+
+  // Calculate optimal scale based on face size and desired face scale
+  var faceWidth = faceData.face_bbox ? faceData.face_bbox[2] : sourceWidth * 0.3; // fallback to 30% of width
+  var faceHeight = faceData.face_bbox ? faceData.face_bbox[3] : sourceHeight * 0.3; // fallback to 30% of height
+
+  // Calculate what scale would make the face the desired size
+  var relativeFaceWidth = faceWidth / sourceWidth;
+  var relativeFaceHeight = faceHeight / sourceHeight;
+
+  // Use the smaller dimension to ensure face fits
+  var faceAspectScale = Math.min(targetWidth * faceScale / (relativeFaceWidth * sourceWidth * videoScaleX), targetHeight * faceScale / (relativeFaceHeight * sourceHeight * videoScaleY));
+
+  // Combine base scale with face-centering scale
+  var finalScale = Math.max(1, faceAspectScale); // Never scale down below 1
+
+  // Adjust translation for the final scale
+  var finalTranslateX = translateX * finalScale;
+  var finalTranslateY = translateY * finalScale;
+
+  // Create transform string
+  var transform = "scale(".concat(finalScale, ") translate(").concat(finalTranslateX, "px, ").concat(finalTranslateY, "px)");
+
+  // Transform origin should be at the face position in the original video
+  var transformOriginX = (relativeFaceX * 100).toFixed(2);
+  var transformOriginY = (relativeFaceY * 100).toFixed(2);
+  var transformOrigin = "".concat(transformOriginX, "% ").concat(transformOriginY, "%");
+  return {
+    transform: transform,
+    transformOrigin: transformOrigin,
+    debugInfo: {
+      frameIndex: useAveragePosition ? "AVERAGE" : frameIndex,
+      relativeFaceX: relativeFaceX.toFixed(3),
+      relativeFaceY: relativeFaceY.toFixed(3),
+      scaledFaceX: scaledFaceX.toFixed(1),
+      scaledFaceY: scaledFaceY.toFixed(1),
+      translateX: translateX.toFixed(1),
+      translateY: translateY.toFixed(1),
+      finalScale: finalScale.toFixed(2),
+      finalTranslateX: finalTranslateX.toFixed(1),
+      finalTranslateY: finalTranslateY.toFixed(1),
+      sourceAspectRatio: sourceAspectRatio.toFixed(3),
+      targetAspectRatio: targetAspectRatio.toFixed(3),
+      videoScaleX: videoScaleX.toFixed(3),
+      videoScaleY: videoScaleY.toFixed(3),
+      useAveragePosition: useAveragePosition,
+      centerHorizontally: centerHorizontally
+    }
+  };
+};
+
+/**
+ * Calculate average face position from all frames with face data
+ * @param {Array} frames - Array of frame data
+ * @returns {Object|null} Average face data or null if no face data available
+ */
+function getAverageFaceData(frames) {
+  if (!frames || frames.length === 0) return null;
+
+  // Filter frames with face data
+  var framesWithFaces = frames.filter(function (f) {
+    return f.face_detected && f.face_data;
+  });
+  if (framesWithFaces.length === 0) return null;
+
+  // Calculate average face center position
+  var totalFaceX = 0;
+  var totalFaceY = 0;
+  var totalFaceWidth = 0;
+  var totalFaceHeight = 0;
+  var validBboxCount = 0;
+  framesWithFaces.forEach(function (frame) {
+    var _frame$face_data = frame.face_data,
+      face_center = _frame$face_data.face_center,
+      face_bbox = _frame$face_data.face_bbox;
+    totalFaceX += face_center[0];
+    totalFaceY += face_center[1];
+
+    // Only include bbox data if it exists
+    if (face_bbox && face_bbox.length >= 4) {
+      totalFaceWidth += face_bbox[2];
+      totalFaceHeight += face_bbox[3];
+      validBboxCount++;
+    }
+  });
+  var avgFaceX = totalFaceX / framesWithFaces.length;
+  var avgFaceY = totalFaceY / framesWithFaces.length;
+
+  // Create average face data object
+  var averageFaceData = {
+    face_center: [avgFaceX, avgFaceY]
+  };
+
+  // Add average bbox if we have valid bbox data
+  if (validBboxCount > 0) {
+    var avgFaceWidth = totalFaceWidth / validBboxCount;
+    var avgFaceHeight = totalFaceHeight / validBboxCount;
+    // Use average position and size for bbox
+    averageFaceData.face_bbox = [avgFaceX - avgFaceWidth / 2, avgFaceY - avgFaceHeight / 2, avgFaceWidth, avgFaceHeight];
+  }
+  return averageFaceData;
+}
+
+/**
+ * Get face data for a specific frame with optional interpolation
+ */
+function getFaceDataForFrame(frames, targetFrame, enableInterpolation) {
+  if (!frames || frames.length === 0) return null;
+
+  // Find exact frame match first
+  var exactFrame = frames.find(function (f) {
+    return f.frame_index === targetFrame && f.face_detected;
+  });
+  if (exactFrame) return exactFrame.face_data;
+
+  // Filter frames with face data
+  var framesWithFaces = frames.filter(function (f) {
+    return f.face_detected && f.face_data;
+  });
+  if (framesWithFaces.length === 0) return null;
+  if (!enableInterpolation) {
+    // Find closest frame
+    return framesWithFaces.reduce(function (closest, current) {
+      var closestDiff = Math.abs(closest.frame_index - targetFrame);
+      var currentDiff = Math.abs(current.frame_index - targetFrame);
+      return currentDiff < closestDiff ? current : closest;
+    }).face_data;
+  }
+
+  // Sort frames by frame index
+  var sortedFrames = framesWithFaces.sort(function (a, b) {
+    return a.frame_index - b.frame_index;
+  });
+  if (sortedFrames.length === 1) return sortedFrames[0].face_data;
+
+  // Find surrounding frames for interpolation
+  var prevFrame = null;
+  var nextFrame = null;
+  for (var i = 0; i < sortedFrames.length; i++) {
+    if (sortedFrames[i].frame_index <= targetFrame) {
+      prevFrame = sortedFrames[i];
+    }
+    if (sortedFrames[i].frame_index >= targetFrame && !nextFrame) {
+      nextFrame = sortedFrames[i];
+      break;
+    }
+  }
+
+  // Use closest frame if we don't have both sides
+  if (!prevFrame) return nextFrame.face_data;
+  if (!nextFrame) return prevFrame.face_data;
+  if (prevFrame.frame_index === nextFrame.frame_index) return prevFrame.face_data;
+
+  // Interpolate between frames
+  var progress = (targetFrame - prevFrame.frame_index) / (nextFrame.frame_index - prevFrame.frame_index);
+  var prevFace = prevFrame.face_data;
+  var nextFace = nextFrame.face_data;
+  return {
+    face_center: [prevFace.face_center[0] + (nextFace.face_center[0] - prevFace.face_center[0]) * progress, prevFace.face_center[1] + (nextFace.face_center[1] - prevFace.face_center[1]) * progress],
+    face_bbox: progress < 0.5 ? prevFace.face_bbox : nextFace.face_bbox
+  };
+}
+
+/**
+ * Preset configurations for common aspect ratios
+ */
+export var ASPECT_RATIO_PRESETS = {
+  LANDSCAPE: {
+    width: 1920,
+    height: 1080
+  },
+  SQUARE: {
+    width: 1080,
+    height: 1080
+  },
+  PORTRAIT: {
+    width: 1080,
+    height: 1920
+  }
+};
+
+/**
+ * Calculate face-centered object-position values
+ * @param {Object} params - Configuration object
+ * @param {Object} params.faceMetadata - Face detection metadata
+ * @param {number} params.targetWidth - Target video width (1920 for landscape, 1080 for square/portrait)
+ * @param {number} params.targetHeight - Target video height (1080 for landscape/square, 1920 for portrait)
+ * @param {number} params.currentFrame - Current frame number (optional, will use useCurrentFrame if not provided)
+ * @param {boolean} params.enableInterpolation - Whether to interpolate between frames
+ * @param {boolean} params.useAveragePosition - Whether to use average face position for entire video duration
+ * @param {boolean} params.centerHorizontally - Whether to only center horizontally (X axis), not vertically (Y axis)
+ * @returns {Object} Object-position styles and debug info
+ */
+export var calculateFaceCenteredObjectPosition = function calculateFaceCenteredObjectPosition(_ref2) {
+  var _faceMetadata$metadat4, _faceMetadata$metadat5;
+  var faceMetadata = _ref2.faceMetadata,
+    targetWidth = _ref2.targetWidth,
+    targetHeight = _ref2.targetHeight,
+    _ref2$currentFrame = _ref2.currentFrame,
+    currentFrame = _ref2$currentFrame === void 0 ? null : _ref2$currentFrame,
+    _ref2$enableInterpola = _ref2.enableInterpolation,
+    enableInterpolation = _ref2$enableInterpola === void 0 ? true : _ref2$enableInterpola,
+    _ref2$useAveragePosit = _ref2.useAveragePosition,
+    useAveragePosition = _ref2$useAveragePosit === void 0 ? false : _ref2$useAveragePosit,
+    _ref2$centerHorizonta = _ref2.centerHorizontally,
+    centerHorizontally = _ref2$centerHorizonta === void 0 ? false : _ref2$centerHorizonta;
+  // Get current frame if not provided
+  var frameIndex = currentFrame;
+  if (frameIndex === null) {
+    try {
+      var remotionFrame = useCurrentFrame();
+      frameIndex = remotionFrame;
+    } catch (error) {
+      // useCurrentFrame not available (e.g., in testing environment)
+      frameIndex = 0;
+    }
+  }
+
+  // Validate inputs
+  if (!(faceMetadata !== null && faceMetadata !== void 0 && (_faceMetadata$metadat4 = faceMetadata.metadata) !== null && _faceMetadata$metadat4 !== void 0 && _faceMetadata$metadat4.frames) || !(faceMetadata !== null && faceMetadata !== void 0 && (_faceMetadata$metadat5 = faceMetadata.metadata) !== null && _faceMetadata$metadat5 !== void 0 && _faceMetadata$metadat5.videoProperties)) {
+    return {
+      objectPosition: "center center",
+      debugInfo: {
+        error: "Invalid face metadata"
+      }
+    };
+  }
+  var _faceMetadata$metadat6 = faceMetadata.metadata,
+    frames = _faceMetadata$metadat6.frames,
+    videoProperties = _faceMetadata$metadat6.videoProperties;
+  var sourceWidth = videoProperties.width,
+    sourceHeight = videoProperties.height;
+
+  // Get face data for current frame or use average position
+  var faceData = useAveragePosition ? getAverageFaceData(frames) : getFaceDataForFrame(frames, frameIndex, enableInterpolation);
+  if (!faceData) {
+    return {
+      objectPosition: "center center",
+      debugInfo: {
+        error: "No face data available"
+      }
+    };
+  }
+
+  // Convert absolute face coordinates to relative (0-1 range)
+  var relativeFaceX = faceData.face_center[0] / sourceWidth;
+  var relativeFaceY = faceData.face_center[1] / sourceHeight;
+
+  // Calculate source and target aspect ratios
+  var sourceAspectRatio = sourceWidth / sourceHeight;
+  var targetAspectRatio = targetWidth / targetHeight;
+
+  // Calculate object-position values
+  var objectPositionX, objectPositionY;
+  if (sourceAspectRatio > targetAspectRatio) {
+    // Source is wider than target - video will be cropped horizontally
+    // The video height fills the container, width is cropped
+    // We need to calculate which part of the horizontal area to show
+
+    // Calculate the visible width as a fraction of the source width
+    var visibleWidthFraction = targetAspectRatio / sourceAspectRatio;
+
+    // For object-position, we need to think about it differently:
+    // object-position 0% shows the left edge, 100% shows the right edge
+    // We want to position the video so the face appears centered in the visible area
+
+    // Calculate how much we need to shift the video to center the face
+    // If face is at center (0.5), no shift needed -> 50%
+    // If face is at 0.25, we need to shift right -> less than 50%
+    // If face is at 0.75, we need to shift left -> more than 50%
+
+    // The key insight: object-position percentage represents where in the source
+    // video corresponds to the center of the target container
+
+    // To center the face, we want the face position to be at the center of the visible area
+    // So object-position should be set to the face's relative position
+    objectPositionX = Math.max(0, Math.min(100, relativeFaceX * 100));
+    objectPositionY = centerHorizontally ? 50 : relativeFaceY * 100;
+  } else {
+    // Source is taller than target - video will be cropped vertically
+    // The video width fills the container, height is cropped
+
+    // Calculate the visible height as a fraction of the source height
+    var visibleHeightFraction = sourceAspectRatio / targetAspectRatio;
+
+    // Calculate the face position within the visible area
+    var facePositionInVisibleArea = relativeFaceY / visibleHeightFraction;
+
+    // Convert to object-position percentage
+    objectPositionX = relativeFaceX * 100;
+    objectPositionY = centerHorizontally ? 50 : Math.max(0, Math.min(100, (facePositionInVisibleArea - 0.5) * 100 + 50));
+  }
+
+  // Clamp values to valid range
+  objectPositionX = Math.max(0, Math.min(100, objectPositionX));
+  objectPositionY = Math.max(0, Math.min(100, objectPositionY));
+  var objectPosition = "".concat(objectPositionX.toFixed(1), "% ").concat(objectPositionY.toFixed(1), "%");
+  return {
+    objectPosition: objectPosition,
+    debugInfo: {
+      frameIndex: useAveragePosition ? "AVERAGE" : frameIndex,
+      relativeFaceX: relativeFaceX.toFixed(3),
+      relativeFaceY: relativeFaceY.toFixed(3),
+      objectPositionX: objectPositionX.toFixed(1),
+      objectPositionY: objectPositionY.toFixed(1),
+      sourceAspectRatio: sourceAspectRatio.toFixed(3),
+      targetAspectRatio: targetAspectRatio.toFixed(3),
+      useAveragePosition: useAveragePosition,
+      centerHorizontally: centerHorizontally
+    }
+  };
+};
+
+/**
+ * Helper function to get transforms for specific aspect ratios
+ */
+export var getFaceCenteredTransformsForAspectRatio = function getFaceCenteredTransformsForAspectRatio(aspectRatio, faceMetadata) {
+  var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
+  var preset = ASPECT_RATIO_PRESETS[aspectRatio.toUpperCase()];
+  if (!preset) {
+    throw new Error("Unknown aspect ratio: ".concat(aspectRatio, ". Use LANDSCAPE, SQUARE, or PORTRAIT."));
+  }
+  return calculateFaceCenteredTransforms(_objectSpread({
+    faceMetadata: faceMetadata,
+    targetWidth: preset.width,
+    targetHeight: preset.height
+  }, options));
+};
+
+/**
+ * Helper function to get object-position for specific aspect ratios
+ */
+export var getFaceCenteredObjectPositionForAspectRatio = function getFaceCenteredObjectPositionForAspectRatio(aspectRatio, faceMetadata) {
+  var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
+  var preset = ASPECT_RATIO_PRESETS[aspectRatio.toUpperCase()];
+  if (!preset) {
+    throw new Error("Unknown aspect ratio: ".concat(aspectRatio, ". Use LANDSCAPE, SQUARE, or PORTRAIT."));
+  }
+  return calculateFaceCenteredObjectPosition(_objectSpread({
+    faceMetadata: faceMetadata,
+    targetWidth: preset.width,
+    targetHeight: preset.height
+  }, options));
+};

package/dist/screenplay/RemotionRenderer/helpers/getContrastColor.js

@@ -0,0 +1,15 @@
+export var getContrastColor = function getContrastColor(hexColor) {
+  if (!hexColor) {
+    return hexColor;
+  }
+  // Convert hex color value to RGB values
+  var red = parseInt(hexColor.substring(1, 3), 16);
+  var green = parseInt(hexColor.substring(3, 5), 16);
+  var blue = parseInt(hexColor.substring(5, 7), 16);
+
+  // Calculate relative luminance of the color
+  var luminance = (0.2126 * red + 0.7152 * green + 0.0722 * blue) / 255;
+
+  // Choose white or black font color based on luminance
+  return luminance > 0.5 ? "#000000" : "#FFFFFF";
+};

package/dist/screenplay/RemotionRenderer/helpers/getVideoOrientation.js

@@ -0,0 +1,21 @@
+function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
+var videoOrientationTypes = {
+  SQUARE: "square",
+  PORTRAIT: "portrait",
+  LANDSCAPE: "landscape"
+};
+export var getVideoOrientation = function getVideoOrientation() {
+  var aspectRatio = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : "";
+  var _aspectRatio$split = aspectRatio.split(":"),
+    _aspectRatio$split2 = _slicedToArray(_aspectRatio$split, 2),
+    width = _aspectRatio$split2[0],
+    height = _aspectRatio$split2[1];
+  if (!width || !height) return videoOrientationTypes.LANDSCAPE; // this is a legacy fallback
+
+  return Number(width) === Number(height) ? videoOrientationTypes.SQUARE : Number(width) > Number(height) ? videoOrientationTypes.LANDSCAPE : videoOrientationTypes.PORTRAIT;
+};

package/dist/screenplay/RemotionRenderer/helpers/hexToRgb.js

@@ -0,0 +1,48 @@
+// Utility to convert HEX to RGB array
+export var hexToRGB = function hexToRGB(hex, alpha) {
+  var cleanedHex = hex.replace("#", "");
+  var bigint = parseInt(cleanedHex, 16);
+  var r = (bigint >> 16 & 255) / 255;
+  var g = (bigint >> 8 & 255) / 255;
+  var b = (bigint & 255) / 255;
+  return alpha ? [r, g, b, alpha] : [r, g, b];
+};
+export var hexToRgbHtml = function hexToRgbHtml(hex, alpha) {
+  return "rgba(".concat(hexToRGB(hex, alpha).map(function (color, index) {
+    return index === 3 ? color : color * 255;
+  }).join(","), ")");
+};
+function getBrightness(_ref) {
+  var r = _ref.r,
+    g = _ref.g,
+    b = _ref.b;
+  return 0.299 * r + 0.587 * g + 0.114 * b;
+}
+var compareHexColors = function compareHexColors(color1, color2) {
+  var rgb1 = hexToRGB(color1);
+  var rgb2 = hexToRGB(color2);
+  var brightness1 = getBrightness(rgb1);
+  var brightness2 = getBrightness(rgb2);
+  if (Math.abs(brightness1 - brightness2) < 0.0001) {
+    // They are essentially the same brightness
+    return 0;
+  }
+  return brightness1 > brightness2 ? 1 : -1;
+};
+export var getBrighterColor = function getBrighterColor(color1, color2) {
+  var result = compareHexColors(color1, color2);
+  switch (result) {
+    case -1:
+      {
+        return color2;
+      }
+    case 0:
+      {
+        return color1;
+      }
+    case 1:
+      {
+        return color1;
+      }
+  }
+};

package/dist/screenplay/RemotionRenderer/hooks/useLottieReplaceColor.js

@@ -0,0 +1,45 @@
+import { hexToRGB } from "../helpers/hexToRgb.js";
+var updateLottieColors = function updateLottieColors(data, layerKey, color) {
+  if (data && data.layers) {
+    var _data$assets$, _data$assets$$layers;
+    (_data$assets$ = data.assets[0]) === null || _data$assets$ === void 0 ? void 0 : (_data$assets$$layers = _data$assets$.layers) === null || _data$assets$$layers === void 0 ? void 0 : _data$assets$$layers.forEach(function (layer) {
+      var _layer$nm;
+      if (!((_layer$nm = layer.nm) !== null && _layer$nm !== void 0 && _layer$nm.includes(layerKey))) {
+        return;
+      }
+      if (layer.shapes) {
+        layer.shapes.forEach(function (shape) {
+          if (shape.ty === "fl") {
+            // 'fl' stands for fill
+            shape.c.k = hexToRGB(color);
+          }
+          if (shape.ty === "st") {
+            // 'st' stands for stroke
+            shape.c.k = hexToRGB(color);
+          }
+          // Handle nested groups
+          if (shape.it) {
+            shape.it.forEach(function (item) {
+              if (item.ty === "fl") {
+                item.c.k = hexToRGB(color);
+              }
+              if (item.ty === "st") {
+                item.c.k = hexToRGB(color);
+              }
+            });
+          }
+        });
+      }
+    });
+  }
+};
+export var useLottieReplaceColor = function useLottieReplaceColor(_ref) {
+  var animationData = _ref.animationData,
+    dynamicColors = _ref.dynamicColors;
+  var primaryColorKey = "PrimaryColor";
+  var accentColorKey = "AccentColor";
+  if (animationData && dynamicColors[primaryColorKey] && dynamicColors[accentColorKey]) {
+    updateLottieColors(animationData, primaryColorKey, dynamicColors[primaryColorKey]);
+    updateLottieColors(animationData, accentColorKey, dynamicColors[accentColorKey]);
+  }
+};

package/dist/screenplay/RemotionRenderer/hooks/useOrientationBased.js

@@ -0,0 +1,29 @@
+import { useVideoConfig } from "remotion";
+export var useOrientationBased = function useOrientationBased(perOrientationStyles) {
+  var _useVideoConfig = useVideoConfig(),
+    _useVideoConfig$props = _useVideoConfig.props.output,
+    _useVideoConfig$props2 = _useVideoConfig$props === void 0 ? {
+      orientation: window.screenplayProps.output.orientation
+    } : _useVideoConfig$props,
+    orientation = _useVideoConfig$props2.orientation;
+  var result;
+  switch (orientation) {
+    case "portrait":
+      {
+        result = perOrientationStyles.portrait;
+        break;
+      }
+    case "square":
+      {
+        result = perOrientationStyles.square;
+        break;
+      }
+    case "landscape":
+      {
+        result = perOrientationStyles.landscape;
+        break;
+      }
+  }
+  result.orientation = orientation;
+  return result;
+};