ugcinc-render 1.8.16 → 1.8.17

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 +94 -96
  2. package/dist/index.mjs +94 -96
  3. package/package.json +1 -1
package/dist/index.js CHANGED
@@ -2260,7 +2260,7 @@ var START = {
2260
2260
  imgTop: 0.5125,
2261
2261
  imgClipRight: 0.2076,
2262
2262
  imgClipBottom: 0.7103,
2263
- whiteOpacity: 0.824
2263
+ whiteOpacity: 0.862
2264
2264
  };
2265
2265
  var END = {
2266
2266
  ssBorderTop: 0.761,
@@ -2294,7 +2294,7 @@ function ScreenshotAnimation({
2294
2294
  height = 2618,
2295
2295
  pauseDurationMs = 1e3,
2296
2296
  flashDurationMs = 255,
2297
- borderRadius = 16,
2297
+ borderRadius = 35,
2298
2298
  borderColor = "rgba(254, 255, 255, 1)",
2299
2299
  backgroundColor = "#000000"
2300
2300
  }) {
@@ -2403,7 +2403,7 @@ function ScreenshotAnimation({
2403
2403
  }
2404
2404
  }
2405
2405
  ),
2406
- showContainer && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
2406
+ showContainer && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
2407
2407
  "div",
2408
2408
  {
2409
2409
  style: {
@@ -2417,101 +2417,99 @@ function ScreenshotAnimation({
2417
2417
  boxSizing: "border-box",
2418
2418
  overflow: "hidden"
2419
2419
  },
2420
- children: [
2421
- /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
2422
- "div",
2423
- {
2424
- style: {
2425
- position: "absolute",
2426
- left: 0,
2427
- top: 0,
2428
- width: contentW,
2429
- height: contentH,
2430
- overflow: "hidden",
2431
- // Top corners always match border, bottom corners animate
2432
- borderRadius: `${borderRadius - borderWidth}px ${borderRadius - borderWidth}px ${innerBorderRadius}px ${innerBorderRadius}px`
2433
- },
2434
- children: [
2435
- !thumbnailFilled && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
2436
- "div",
2437
- {
2438
- style: {
2439
- position: "absolute",
2440
- left: 0,
2441
- top: 0,
2442
- width: contentW,
2443
- height: Math.max(0, (imgTopPercent - containerTopInner) * height),
2444
- backgroundColor: grayColor
2445
- }
2420
+ children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
2421
+ "div",
2422
+ {
2423
+ style: {
2424
+ position: "absolute",
2425
+ left: 0,
2426
+ top: 0,
2427
+ width: contentW,
2428
+ height: contentH,
2429
+ overflow: "hidden",
2430
+ // Top corners always match border, bottom corners animate
2431
+ borderRadius: `${borderRadius - borderWidth}px ${borderRadius - borderWidth}px ${innerBorderRadius}px ${innerBorderRadius}px`
2432
+ },
2433
+ children: [
2434
+ !thumbnailFilled && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
2435
+ "div",
2436
+ {
2437
+ style: {
2438
+ position: "absolute",
2439
+ left: 0,
2440
+ top: 0,
2441
+ width: contentW,
2442
+ height: Math.max(0, (imgTopPercent - containerTopInner) * height),
2443
+ backgroundColor: grayColor
2446
2444
  }
2447
- ),
2448
- !thumbnailFilled && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
2449
- "div",
2450
- {
2451
- style: {
2452
- position: "absolute",
2453
- left: 0,
2454
- top: (imgTopPercent - containerTopInner) * height,
2455
- width: contentW,
2456
- height,
2457
- overflow: "hidden"
2458
- },
2459
- children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
2460
- import_remotion7.Img,
2461
- {
2462
- src: imageUrl,
2463
- style: {
2464
- width: contentW,
2465
- height: contentW * (height / width),
2466
- objectFit: "cover"
2467
- }
2445
+ }
2446
+ ),
2447
+ !thumbnailFilled && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
2448
+ "div",
2449
+ {
2450
+ style: {
2451
+ position: "absolute",
2452
+ left: 0,
2453
+ top: (imgTopPercent - containerTopInner) * height,
2454
+ width: contentW,
2455
+ height,
2456
+ overflow: "hidden"
2457
+ },
2458
+ children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
2459
+ import_remotion7.Img,
2460
+ {
2461
+ src: imageUrl,
2462
+ style: {
2463
+ width: contentW,
2464
+ height: contentW * (height / width),
2465
+ objectFit: "cover"
2468
2466
  }
2469
- )
2470
- }
2471
- ),
2472
- showSmallClip && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
2473
- "div",
2474
- {
2475
- style: {
2476
- position: "absolute",
2477
- left: 0,
2478
- top: thumbnailFilled ? 0 : (imgTopPercent - containerTopInner) * height,
2479
- width: thumbnailFilled ? contentW : smallClipWidth,
2480
- height: thumbnailFilled ? contentH : smallClipHeight,
2481
- overflow: "hidden"
2482
- },
2483
- children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
2484
- import_remotion7.Img,
2485
- {
2486
- src: imageUrl,
2487
- style: {
2488
- width: thumbnailFilled ? contentW : smallClipWidth,
2489
- height: thumbnailFilled ? contentH : smallClipWidth * (height / width),
2490
- objectFit: "cover"
2491
- }
2467
+ }
2468
+ )
2469
+ }
2470
+ ),
2471
+ showSmallClip && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
2472
+ "div",
2473
+ {
2474
+ style: {
2475
+ position: "absolute",
2476
+ left: 0,
2477
+ top: thumbnailFilled ? 0 : (imgTopPercent - containerTopInner) * height,
2478
+ width: thumbnailFilled ? contentW : smallClipWidth,
2479
+ height: thumbnailFilled ? contentH : smallClipHeight,
2480
+ overflow: "hidden"
2481
+ },
2482
+ children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
2483
+ import_remotion7.Img,
2484
+ {
2485
+ src: imageUrl,
2486
+ style: {
2487
+ width: thumbnailFilled ? contentW : smallClipWidth,
2488
+ height: thumbnailFilled ? contentH : smallClipWidth * (height / width),
2489
+ objectFit: "cover"
2492
2490
  }
2493
- )
2491
+ }
2492
+ )
2493
+ }
2494
+ ),
2495
+ whiteOpacity > 1e-3 && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
2496
+ "div",
2497
+ {
2498
+ style: {
2499
+ position: "absolute",
2500
+ left: 0,
2501
+ top: 0,
2502
+ width: contentW,
2503
+ height: contentH,
2504
+ backgroundColor: `rgba(255, 255, 255, ${whiteOpacity})`,
2505
+ borderRadius: `${borderRadius - borderWidth}px ${borderRadius - borderWidth}px ${innerBorderRadius}px ${innerBorderRadius}px`,
2506
+ pointerEvents: "none"
2494
2507
  }
2495
- )
2496
- ]
2497
- }
2498
- ),
2499
- whiteOpacity > 1e-3 && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
2500
- "div",
2501
- {
2502
- style: {
2503
- position: "absolute",
2504
- left: 0,
2505
- top: 0,
2506
- width: "100%",
2507
- height: "100%",
2508
- backgroundColor: `rgba(255, 254, 255, ${whiteOpacity})`,
2509
- borderRadius: borderRadius - borderWidth,
2510
- pointerEvents: "none"
2511
- }
2512
- }
2513
- )
2514
- ]
2508
+ }
2509
+ )
2510
+ ]
2511
+ }
2512
+ )
2515
2513
  }
2516
2514
  )
2517
2515
  ] });
@@ -2932,7 +2930,7 @@ var defaultScreenshotAnimationProps = {
2932
2930
  height: 2618,
2933
2931
  pauseDurationMs: 1e3,
2934
2932
  flashDurationMs: 255,
2935
- borderRadius: 16,
2933
+ borderRadius: 35,
2936
2934
  borderColor: "rgba(254, 255, 255, 1)",
2937
2935
  backgroundColor: "#000000"
2938
2936
  };
@@ -2942,7 +2940,7 @@ var screenshotAnimationSchema = import_zod.z.object({
2942
2940
  height: import_zod.z.number().optional().default(2618).describe("Canvas height (px)"),
2943
2941
  pauseDurationMs: import_zod.z.number().optional().default(1e3).describe("Pause before flash (ms)"),
2944
2942
  flashDurationMs: import_zod.z.number().optional().default(255).describe("Flash phase duration (ms)"),
2945
- borderRadius: import_zod.z.number().optional().default(16).describe("Border corner radius (px)"),
2943
+ borderRadius: import_zod.z.number().optional().default(35).describe("Border corner radius (px)"),
2946
2944
  borderColor: import_zod.z.string().optional().default("rgba(254, 255, 255, 1)").describe("Border color"),
2947
2945
  backgroundColor: import_zod.z.string().optional().default("#000000").describe("Background color")
2948
2946
  });
package/dist/index.mjs CHANGED
@@ -1397,7 +1397,7 @@ var START = {
1397
1397
  imgTop: 0.5125,
1398
1398
  imgClipRight: 0.2076,
1399
1399
  imgClipBottom: 0.7103,
1400
- whiteOpacity: 0.824
1400
+ whiteOpacity: 0.862
1401
1401
  };
1402
1402
  var END = {
1403
1403
  ssBorderTop: 0.761,
@@ -1431,7 +1431,7 @@ function ScreenshotAnimation({
1431
1431
  height = 2618,
1432
1432
  pauseDurationMs = 1e3,
1433
1433
  flashDurationMs = 255,
1434
- borderRadius = 16,
1434
+ borderRadius = 35,
1435
1435
  borderColor = "rgba(254, 255, 255, 1)",
1436
1436
  backgroundColor = "#000000"
1437
1437
  }) {
@@ -1540,7 +1540,7 @@ function ScreenshotAnimation({
1540
1540
  }
1541
1541
  }
1542
1542
  ),
1543
- showContainer && /* @__PURE__ */ jsxs6(
1543
+ showContainer && /* @__PURE__ */ jsx8(
1544
1544
  "div",
1545
1545
  {
1546
1546
  style: {
@@ -1554,101 +1554,99 @@ function ScreenshotAnimation({
1554
1554
  boxSizing: "border-box",
1555
1555
  overflow: "hidden"
1556
1556
  },
1557
- children: [
1558
- /* @__PURE__ */ jsxs6(
1559
- "div",
1560
- {
1561
- style: {
1562
- position: "absolute",
1563
- left: 0,
1564
- top: 0,
1565
- width: contentW,
1566
- height: contentH,
1567
- overflow: "hidden",
1568
- // Top corners always match border, bottom corners animate
1569
- borderRadius: `${borderRadius - borderWidth}px ${borderRadius - borderWidth}px ${innerBorderRadius}px ${innerBorderRadius}px`
1570
- },
1571
- children: [
1572
- !thumbnailFilled && /* @__PURE__ */ jsx8(
1573
- "div",
1574
- {
1575
- style: {
1576
- position: "absolute",
1577
- left: 0,
1578
- top: 0,
1579
- width: contentW,
1580
- height: Math.max(0, (imgTopPercent - containerTopInner) * height),
1581
- backgroundColor: grayColor
1582
- }
1557
+ children: /* @__PURE__ */ jsxs6(
1558
+ "div",
1559
+ {
1560
+ style: {
1561
+ position: "absolute",
1562
+ left: 0,
1563
+ top: 0,
1564
+ width: contentW,
1565
+ height: contentH,
1566
+ overflow: "hidden",
1567
+ // Top corners always match border, bottom corners animate
1568
+ borderRadius: `${borderRadius - borderWidth}px ${borderRadius - borderWidth}px ${innerBorderRadius}px ${innerBorderRadius}px`
1569
+ },
1570
+ children: [
1571
+ !thumbnailFilled && /* @__PURE__ */ jsx8(
1572
+ "div",
1573
+ {
1574
+ style: {
1575
+ position: "absolute",
1576
+ left: 0,
1577
+ top: 0,
1578
+ width: contentW,
1579
+ height: Math.max(0, (imgTopPercent - containerTopInner) * height),
1580
+ backgroundColor: grayColor
1583
1581
  }
1584
- ),
1585
- !thumbnailFilled && /* @__PURE__ */ jsx8(
1586
- "div",
1587
- {
1588
- style: {
1589
- position: "absolute",
1590
- left: 0,
1591
- top: (imgTopPercent - containerTopInner) * height,
1592
- width: contentW,
1593
- height,
1594
- overflow: "hidden"
1595
- },
1596
- children: /* @__PURE__ */ jsx8(
1597
- Img3,
1598
- {
1599
- src: imageUrl,
1600
- style: {
1601
- width: contentW,
1602
- height: contentW * (height / width),
1603
- objectFit: "cover"
1604
- }
1582
+ }
1583
+ ),
1584
+ !thumbnailFilled && /* @__PURE__ */ jsx8(
1585
+ "div",
1586
+ {
1587
+ style: {
1588
+ position: "absolute",
1589
+ left: 0,
1590
+ top: (imgTopPercent - containerTopInner) * height,
1591
+ width: contentW,
1592
+ height,
1593
+ overflow: "hidden"
1594
+ },
1595
+ children: /* @__PURE__ */ jsx8(
1596
+ Img3,
1597
+ {
1598
+ src: imageUrl,
1599
+ style: {
1600
+ width: contentW,
1601
+ height: contentW * (height / width),
1602
+ objectFit: "cover"
1605
1603
  }
1606
- )
1607
- }
1608
- ),
1609
- showSmallClip && /* @__PURE__ */ jsx8(
1610
- "div",
1611
- {
1612
- style: {
1613
- position: "absolute",
1614
- left: 0,
1615
- top: thumbnailFilled ? 0 : (imgTopPercent - containerTopInner) * height,
1616
- width: thumbnailFilled ? contentW : smallClipWidth,
1617
- height: thumbnailFilled ? contentH : smallClipHeight,
1618
- overflow: "hidden"
1619
- },
1620
- children: /* @__PURE__ */ jsx8(
1621
- Img3,
1622
- {
1623
- src: imageUrl,
1624
- style: {
1625
- width: thumbnailFilled ? contentW : smallClipWidth,
1626
- height: thumbnailFilled ? contentH : smallClipWidth * (height / width),
1627
- objectFit: "cover"
1628
- }
1604
+ }
1605
+ )
1606
+ }
1607
+ ),
1608
+ showSmallClip && /* @__PURE__ */ jsx8(
1609
+ "div",
1610
+ {
1611
+ style: {
1612
+ position: "absolute",
1613
+ left: 0,
1614
+ top: thumbnailFilled ? 0 : (imgTopPercent - containerTopInner) * height,
1615
+ width: thumbnailFilled ? contentW : smallClipWidth,
1616
+ height: thumbnailFilled ? contentH : smallClipHeight,
1617
+ overflow: "hidden"
1618
+ },
1619
+ children: /* @__PURE__ */ jsx8(
1620
+ Img3,
1621
+ {
1622
+ src: imageUrl,
1623
+ style: {
1624
+ width: thumbnailFilled ? contentW : smallClipWidth,
1625
+ height: thumbnailFilled ? contentH : smallClipWidth * (height / width),
1626
+ objectFit: "cover"
1629
1627
  }
1630
- )
1628
+ }
1629
+ )
1630
+ }
1631
+ ),
1632
+ whiteOpacity > 1e-3 && /* @__PURE__ */ jsx8(
1633
+ "div",
1634
+ {
1635
+ style: {
1636
+ position: "absolute",
1637
+ left: 0,
1638
+ top: 0,
1639
+ width: contentW,
1640
+ height: contentH,
1641
+ backgroundColor: `rgba(255, 255, 255, ${whiteOpacity})`,
1642
+ borderRadius: `${borderRadius - borderWidth}px ${borderRadius - borderWidth}px ${innerBorderRadius}px ${innerBorderRadius}px`,
1643
+ pointerEvents: "none"
1631
1644
  }
1632
- )
1633
- ]
1634
- }
1635
- ),
1636
- whiteOpacity > 1e-3 && /* @__PURE__ */ jsx8(
1637
- "div",
1638
- {
1639
- style: {
1640
- position: "absolute",
1641
- left: 0,
1642
- top: 0,
1643
- width: "100%",
1644
- height: "100%",
1645
- backgroundColor: `rgba(255, 254, 255, ${whiteOpacity})`,
1646
- borderRadius: borderRadius - borderWidth,
1647
- pointerEvents: "none"
1648
- }
1649
- }
1650
- )
1651
- ]
1645
+ }
1646
+ )
1647
+ ]
1648
+ }
1649
+ )
1652
1650
  }
1653
1651
  )
1654
1652
  ] });
@@ -1786,7 +1784,7 @@ var defaultScreenshotAnimationProps = {
1786
1784
  height: 2618,
1787
1785
  pauseDurationMs: 1e3,
1788
1786
  flashDurationMs: 255,
1789
- borderRadius: 16,
1787
+ borderRadius: 35,
1790
1788
  borderColor: "rgba(254, 255, 255, 1)",
1791
1789
  backgroundColor: "#000000"
1792
1790
  };
@@ -1796,7 +1794,7 @@ var screenshotAnimationSchema = z.object({
1796
1794
  height: z.number().optional().default(2618).describe("Canvas height (px)"),
1797
1795
  pauseDurationMs: z.number().optional().default(1e3).describe("Pause before flash (ms)"),
1798
1796
  flashDurationMs: z.number().optional().default(255).describe("Flash phase duration (ms)"),
1799
- borderRadius: z.number().optional().default(16).describe("Border corner radius (px)"),
1797
+ borderRadius: z.number().optional().default(35).describe("Border corner radius (px)"),
1800
1798
  borderColor: z.string().optional().default("rgba(254, 255, 255, 1)").describe("Border color"),
1801
1799
  backgroundColor: z.string().optional().default("#000000").describe("Background color")
1802
1800
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "ugcinc-render",
3
- "version": "1.8.16",
3
+ "version": "1.8.17",
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",