ugcinc-render 1.8.13 → 1.8.14

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/dist/index.js +12 -18
  2. package/dist/index.mjs +12 -18
  3. package/package.json +1 -1
package/dist/index.js CHANGED
@@ -2652,6 +2652,7 @@ function ScreenshotAnimationV2({
2652
2652
  const isPause = timeMs < flashStartMs;
2653
2653
  const isFlashPhase = timeMs >= flashStartMs && timeMs < flashEndMs;
2654
2654
  const isPhase2 = timeMs >= phase2StartMs;
2655
+ const showContainer = isFlashPhase || isPhase2;
2655
2656
  let whiteOpacity = 0;
2656
2657
  if (isPause) {
2657
2658
  whiteOpacity = 0;
@@ -2663,11 +2664,11 @@ function ScreenshotAnimationV2({
2663
2664
  } else if (isPhase2) {
2664
2665
  whiteOpacity = interpolateKeyframes(KEYFRAMES.whiteOpacity, animationTimeMs);
2665
2666
  }
2666
- const containerTop = interpolateKeyframes(KEYFRAMES.ssBorderTop, animationTimeMs);
2667
- const containerTopInner = interpolateKeyframes(KEYFRAMES.ssBorderTopInner, animationTimeMs);
2668
- const containerLeft = interpolateKeyframes(KEYFRAMES.ssBorderLeft, animationTimeMs);
2669
- const containerRight = interpolateKeyframes(KEYFRAMES.ssBorderRight, animationTimeMs);
2670
- const containerBottom = interpolateKeyframes(KEYFRAMES.ssBorderBottom, animationTimeMs);
2667
+ const containerTop = isFlashPhase ? 0 : interpolateKeyframes(KEYFRAMES.ssBorderTop, animationTimeMs);
2668
+ const containerTopInner = isFlashPhase ? 5e-3 : interpolateKeyframes(KEYFRAMES.ssBorderTopInner, animationTimeMs);
2669
+ const containerLeft = isFlashPhase ? 0 : interpolateKeyframes(KEYFRAMES.ssBorderLeft, animationTimeMs);
2670
+ const containerRight = isFlashPhase ? 1 : interpolateKeyframes(KEYFRAMES.ssBorderRight, animationTimeMs);
2671
+ const containerBottom = isFlashPhase ? 1 : interpolateKeyframes(KEYFRAMES.ssBorderBottom, animationTimeMs);
2671
2672
  const borderWidth = (containerTopInner - containerTop) * height;
2672
2673
  const containerX = containerLeft * width;
2673
2674
  const containerY = containerTop * height;
@@ -2677,9 +2678,10 @@ function ScreenshotAnimationV2({
2677
2678
  const contentY = containerY + borderWidth;
2678
2679
  const contentW = containerW - borderWidth * 2;
2679
2680
  const contentH = containerH - borderWidth * 2;
2680
- const imgTopPercent = interpolateKeyframes(KEYFRAMES.imgTop, animationTimeMs);
2681
+ const imgTopPercent = isFlashPhase ? 0.5 : interpolateKeyframes(KEYFRAMES.imgTop, animationTimeMs);
2681
2682
  const imgClipRightPercent = interpolateKeyframes(KEYFRAMES.imgClipRight, animationTimeMs);
2682
2683
  const imgClipBottomPercent = interpolateKeyframes(KEYFRAMES.imgClipBottom, animationTimeMs);
2684
+ const showSmallClip = isPhase2;
2683
2685
  const thumbnailFilled = animationTimeMs >= 735;
2684
2686
  const grayR = interpolateKeyframes(KEYFRAMES.grayFillR, animationTimeMs);
2685
2687
  const grayG = interpolateKeyframes(KEYFRAMES.grayFillG, animationTimeMs);
@@ -2715,7 +2717,7 @@ function ScreenshotAnimationV2({
2715
2717
  }
2716
2718
  }
2717
2719
  ),
2718
- isPhase2 && /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
2720
+ showContainer && /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
2719
2721
  "div",
2720
2722
  {
2721
2723
  style: {
@@ -2744,7 +2746,7 @@ function ScreenshotAnimationV2({
2744
2746
  borderRadius: `${borderRadius - borderWidth}px ${borderRadius - borderWidth}px ${innerBorderRadius}px ${innerBorderRadius}px`
2745
2747
  },
2746
2748
  children: [
2747
- !thumbnailFilled && grayGapHeight > 0 && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
2749
+ !thumbnailFilled && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
2748
2750
  "div",
2749
2751
  {
2750
2752
  style: {
@@ -2782,7 +2784,7 @@ function ScreenshotAnimationV2({
2782
2784
  )
2783
2785
  }
2784
2786
  ),
2785
- /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
2787
+ showSmallClip && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
2786
2788
  "div",
2787
2789
  {
2788
2790
  style: {
@@ -2826,14 +2828,6 @@ function ScreenshotAnimationV2({
2826
2828
  )
2827
2829
  ]
2828
2830
  }
2829
- ),
2830
- !isPhase2 && whiteOpacity > 1e-3 && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
2831
- import_remotion8.AbsoluteFill,
2832
- {
2833
- style: {
2834
- backgroundColor: `rgba(255, 254, 255, ${whiteOpacity})`
2835
- }
2836
- }
2837
2831
  )
2838
2832
  ] });
2839
2833
  }
@@ -3274,7 +3268,7 @@ var defaultScreenshotAnimationProps = {
3274
3268
  backgroundColor: "#000000"
3275
3269
  };
3276
3270
  var defaultScreenshotAnimationV2Props = {
3277
- imageUrl: "https://n14dcpakf8w1fekl.public.blob.vercel-storage.com/media/8ff1462b-13d7-4abe-9325-0a6ad19004f0/15.9-aUsMryjm5qRrmw8nsxv8KWJWKnsetx.png",
3271
+ imageUrl: "https://n14dcpakf8w1fekl.public.blob.vercel-storage.com/media/8ff1462b-13d7-4abe-9325-0a6ad19004f0/IMG_3163-RY0CFNrbnSnqZpaJzi9VdslzfYLLKf.png",
3278
3272
  width: 1202,
3279
3273
  height: 2618,
3280
3274
  pauseDurationMs: 1e3,
package/dist/index.mjs CHANGED
@@ -1788,6 +1788,7 @@ function ScreenshotAnimationV2({
1788
1788
  const isPause = timeMs < flashStartMs;
1789
1789
  const isFlashPhase = timeMs >= flashStartMs && timeMs < flashEndMs;
1790
1790
  const isPhase2 = timeMs >= phase2StartMs;
1791
+ const showContainer = isFlashPhase || isPhase2;
1791
1792
  let whiteOpacity = 0;
1792
1793
  if (isPause) {
1793
1794
  whiteOpacity = 0;
@@ -1799,11 +1800,11 @@ function ScreenshotAnimationV2({
1799
1800
  } else if (isPhase2) {
1800
1801
  whiteOpacity = interpolateKeyframes(KEYFRAMES.whiteOpacity, animationTimeMs);
1801
1802
  }
1802
- const containerTop = interpolateKeyframes(KEYFRAMES.ssBorderTop, animationTimeMs);
1803
- const containerTopInner = interpolateKeyframes(KEYFRAMES.ssBorderTopInner, animationTimeMs);
1804
- const containerLeft = interpolateKeyframes(KEYFRAMES.ssBorderLeft, animationTimeMs);
1805
- const containerRight = interpolateKeyframes(KEYFRAMES.ssBorderRight, animationTimeMs);
1806
- const containerBottom = interpolateKeyframes(KEYFRAMES.ssBorderBottom, animationTimeMs);
1803
+ const containerTop = isFlashPhase ? 0 : interpolateKeyframes(KEYFRAMES.ssBorderTop, animationTimeMs);
1804
+ const containerTopInner = isFlashPhase ? 5e-3 : interpolateKeyframes(KEYFRAMES.ssBorderTopInner, animationTimeMs);
1805
+ const containerLeft = isFlashPhase ? 0 : interpolateKeyframes(KEYFRAMES.ssBorderLeft, animationTimeMs);
1806
+ const containerRight = isFlashPhase ? 1 : interpolateKeyframes(KEYFRAMES.ssBorderRight, animationTimeMs);
1807
+ const containerBottom = isFlashPhase ? 1 : interpolateKeyframes(KEYFRAMES.ssBorderBottom, animationTimeMs);
1807
1808
  const borderWidth = (containerTopInner - containerTop) * height;
1808
1809
  const containerX = containerLeft * width;
1809
1810
  const containerY = containerTop * height;
@@ -1813,9 +1814,10 @@ function ScreenshotAnimationV2({
1813
1814
  const contentY = containerY + borderWidth;
1814
1815
  const contentW = containerW - borderWidth * 2;
1815
1816
  const contentH = containerH - borderWidth * 2;
1816
- const imgTopPercent = interpolateKeyframes(KEYFRAMES.imgTop, animationTimeMs);
1817
+ const imgTopPercent = isFlashPhase ? 0.5 : interpolateKeyframes(KEYFRAMES.imgTop, animationTimeMs);
1817
1818
  const imgClipRightPercent = interpolateKeyframes(KEYFRAMES.imgClipRight, animationTimeMs);
1818
1819
  const imgClipBottomPercent = interpolateKeyframes(KEYFRAMES.imgClipBottom, animationTimeMs);
1820
+ const showSmallClip = isPhase2;
1819
1821
  const thumbnailFilled = animationTimeMs >= 735;
1820
1822
  const grayR = interpolateKeyframes(KEYFRAMES.grayFillR, animationTimeMs);
1821
1823
  const grayG = interpolateKeyframes(KEYFRAMES.grayFillG, animationTimeMs);
@@ -1851,7 +1853,7 @@ function ScreenshotAnimationV2({
1851
1853
  }
1852
1854
  }
1853
1855
  ),
1854
- isPhase2 && /* @__PURE__ */ jsxs7(
1856
+ showContainer && /* @__PURE__ */ jsxs7(
1855
1857
  "div",
1856
1858
  {
1857
1859
  style: {
@@ -1880,7 +1882,7 @@ function ScreenshotAnimationV2({
1880
1882
  borderRadius: `${borderRadius - borderWidth}px ${borderRadius - borderWidth}px ${innerBorderRadius}px ${innerBorderRadius}px`
1881
1883
  },
1882
1884
  children: [
1883
- !thumbnailFilled && grayGapHeight > 0 && /* @__PURE__ */ jsx9(
1885
+ !thumbnailFilled && /* @__PURE__ */ jsx9(
1884
1886
  "div",
1885
1887
  {
1886
1888
  style: {
@@ -1918,7 +1920,7 @@ function ScreenshotAnimationV2({
1918
1920
  )
1919
1921
  }
1920
1922
  ),
1921
- /* @__PURE__ */ jsx9(
1923
+ showSmallClip && /* @__PURE__ */ jsx9(
1922
1924
  "div",
1923
1925
  {
1924
1926
  style: {
@@ -1962,14 +1964,6 @@ function ScreenshotAnimationV2({
1962
1964
  )
1963
1965
  ]
1964
1966
  }
1965
- ),
1966
- !isPhase2 && whiteOpacity > 1e-3 && /* @__PURE__ */ jsx9(
1967
- AbsoluteFill5,
1968
- {
1969
- style: {
1970
- backgroundColor: `rgba(255, 254, 255, ${whiteOpacity})`
1971
- }
1972
- }
1973
1967
  )
1974
1968
  ] });
1975
1969
  }
@@ -2127,7 +2121,7 @@ var defaultScreenshotAnimationProps = {
2127
2121
  backgroundColor: "#000000"
2128
2122
  };
2129
2123
  var defaultScreenshotAnimationV2Props = {
2130
- imageUrl: "https://n14dcpakf8w1fekl.public.blob.vercel-storage.com/media/8ff1462b-13d7-4abe-9325-0a6ad19004f0/15.9-aUsMryjm5qRrmw8nsxv8KWJWKnsetx.png",
2124
+ imageUrl: "https://n14dcpakf8w1fekl.public.blob.vercel-storage.com/media/8ff1462b-13d7-4abe-9325-0a6ad19004f0/IMG_3163-RY0CFNrbnSnqZpaJzi9VdslzfYLLKf.png",
2131
2125
  width: 1202,
2132
2126
  height: 2618,
2133
2127
  pauseDurationMs: 1e3,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "ugcinc-render",
3
- "version": "1.8.13",
3
+ "version": "1.8.14",
4
4
  "description": "Unified rendering package for UGC Inc - shared types, components, and compositions for pixel-perfect client/server rendering",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.mjs",