@remotion/promo-pages 4.0.317 → 4.0.319

package/.turbo/turbo-lint.log

@@ -0,0 +1,5 @@
+
+
+> @remotion/promo-pages@4.0.318 lint /Users/jonathanburger/remotion/packages/promo-pages
+> tsc && eslint src
+

package/.turbo/turbo-make.log

@@ -1,8 +1,8 @@
 
 
-> @remotion/promo-pages@4.0.317 make /Users/jonathanburger/remotion/packages/promo-pages
+> @remotion/promo-pages@4.0.319 make /Users/jonathanburger/remotion/packages/promo-pages
 > bun --env-file=../.env.bundle bundle.ts
 
 ≈ tailwindcss v4.1.1
 
-Done in 37ms
+Done in 26ms

package/dist/Homepage.js

@@ -735,7 +735,7 @@ var __defProp2, __export2 = (target, all) => {
   });
 }, useIsPlayer = () => {
   return useContext(IsPlayerContext);
-}, VERSION = "4.0.317", checkMultipleRemotionVersions = () => {
+}, VERSION = "4.0.319", checkMultipleRemotionVersions = () => {
   if (typeof globalThis === "undefined") {
     return;
   }
@@ -2561,6 +2561,60 @@ Check that all your Remotion packages are on the same version. If your dependenc
   if (endAt < startFrom) {
     throw new TypeError("endAt prop must be greater than startFrom prop.");
   }
+}, validateTrimProps = (trimBefore, trimAfter) => {
+  if (typeof trimBefore !== "undefined") {
+    if (typeof trimBefore !== "number") {
+      throw new TypeError(`type of trimBefore prop must be a number, instead got type ${typeof trimBefore}.`);
+    }
+    if (isNaN(trimBefore) || trimBefore === Infinity) {
+      throw new TypeError("trimBefore prop can not be NaN or Infinity.");
+    }
+    if (trimBefore < 0) {
+      throw new TypeError(`trimBefore must be greater than equal to 0 instead got ${trimBefore}.`);
+    }
+  }
+  if (typeof trimAfter !== "undefined") {
+    if (typeof trimAfter !== "number") {
+      throw new TypeError(`type of trimAfter prop must be a number, instead got type ${typeof trimAfter}.`);
+    }
+    if (isNaN(trimAfter)) {
+      throw new TypeError("trimAfter prop can not be NaN.");
+    }
+    if (trimAfter <= 0) {
+      throw new TypeError(`trimAfter must be a positive number, instead got ${trimAfter}.`);
+    }
+  }
+  if (trimAfter < trimBefore) {
+    throw new TypeError("trimAfter prop must be greater than trimBefore prop.");
+  }
+}, validateMediaTrimProps = ({
+  startFrom,
+  endAt,
+  trimBefore,
+  trimAfter
+}) => {
+  if (typeof startFrom !== "undefined" && typeof trimBefore !== "undefined") {
+    throw new TypeError("Cannot use both startFrom and trimBefore props. Use trimBefore instead as startFrom is deprecated.");
+  }
+  if (typeof endAt !== "undefined" && typeof trimAfter !== "undefined") {
+    throw new TypeError("Cannot use both endAt and trimAfter props. Use trimAfter instead as endAt is deprecated.");
+  }
+  const hasNewProps = typeof trimBefore !== "undefined" || typeof trimAfter !== "undefined";
+  const hasOldProps = typeof startFrom !== "undefined" || typeof endAt !== "undefined";
+  if (hasNewProps) {
+    validateTrimProps(trimBefore, trimAfter);
+  } else if (hasOldProps) {
+    validateStartFromProps(startFrom, endAt);
+  }
+}, resolveTrimProps = ({
+  startFrom,
+  endAt,
+  trimBefore,
+  trimAfter
+}) => {
+  const trimBeforeValue = trimBefore ?? startFrom ?? undefined;
+  const trimAfterValue = trimAfter ?? endAt ?? undefined;
+  return { trimBeforeValue, trimAfterValue };
 }, durationReducer = (state, action) => {
   switch (action.type) {
     case "got-duration": {
@@ -4283,6 +4337,8 @@ Check that all your Remotion packages are on the same version. If your dependenc
   const {
     startFrom,
     endAt,
+    trimBefore,
+    trimAfter,
     name,
     stack,
     pauseWhenBuffering,
@@ -4310,6 +4366,13 @@ Check that all your Remotion packages are on the same version. If your dependenc
     setDurations({ type: "got-duration", durationInSeconds, src });
   }, [setDurations]);
   const durationFetched = durations[getAbsoluteSrc(preloadedSrc)] ?? durations[getAbsoluteSrc(props.src)];
+  validateMediaTrimProps({ startFrom, endAt, trimBefore, trimAfter });
+  const { trimBeforeValue, trimAfterValue } = resolveTrimProps({
+    startFrom,
+    endAt,
+    trimBefore,
+    trimAfter
+  });
   if (loop && durationFetched !== undefined) {
     if (!Number.isFinite(durationFetched)) {
       return /* @__PURE__ */ jsx19(Audio, {
@@ -4322,10 +4385,10 @@ Check that all your Remotion packages are on the same version. If your dependenc
     return /* @__PURE__ */ jsx19(Loop, {
       layout: "none",
       durationInFrames: calculateLoopDuration({
-        endAt,
+        endAt: trimAfterValue ?? endAt,
         mediaDuration: duration,
         playbackRate: props.playbackRate ?? 1,
-        startFrom
+        startFrom: trimBeforeValue ?? startFrom
       }),
       children: /* @__PURE__ */ jsx19(Audio, {
         ...propsOtherThanLoop,
@@ -4334,15 +4397,12 @@ Check that all your Remotion packages are on the same version. If your dependenc
       })
     });
   }
-  if (typeof startFrom !== "undefined" || typeof endAt !== "undefined") {
-    validateStartFromProps(startFrom, endAt);
-    const startFromFrameNo = startFrom ?? 0;
-    const endAtFrameNo = endAt ?? Infinity;
+  if (typeof trimBeforeValue !== "undefined" || typeof trimAfterValue !== "undefined") {
     return /* @__PURE__ */ jsx19(Sequence, {
       layout: "none",
-      from: 0 - startFromFrameNo,
+      from: 0 - (trimBeforeValue ?? 0),
       showInTimeline: false,
-      durationInFrames: endAtFrameNo,
+      durationInFrames: trimAfterValue,
       name,
       children: /* @__PURE__ */ jsx19(Audio, {
         _remotionInternalNeedsDurationCalculation: Boolean(loop),
@@ -5855,6 +5915,8 @@ Check that all your Remotion packages are on the same version. If your dependenc
   const {
     startFrom,
     endAt,
+    trimBefore,
+    trimAfter,
     name,
     pauseWhenBuffering,
     stack,
@@ -5879,6 +5941,13 @@ Check that all your Remotion packages are on the same version. If your dependenc
   }, [setDurations]);
   const onVideoFrame = useCallback16(() => {}, []);
   const durationFetched = durations[getAbsoluteSrc(preloadedSrc)] ?? durations[getAbsoluteSrc(props2.src)];
+  validateMediaTrimProps({ startFrom, endAt, trimBefore, trimAfter });
+  const { trimBeforeValue, trimAfterValue } = resolveTrimProps({
+    startFrom,
+    endAt,
+    trimBefore,
+    trimAfter
+  });
   if (loop && durationFetched !== undefined) {
     if (!Number.isFinite(durationFetched)) {
       return /* @__PURE__ */ jsx34(Video, {
@@ -5890,10 +5959,10 @@ Check that all your Remotion packages are on the same version. If your dependenc
     const mediaDuration = durationFetched * fps;
     return /* @__PURE__ */ jsx34(Loop, {
       durationInFrames: calculateLoopDuration({
-        endAt,
+        endAt: trimAfterValue ?? undefined,
         mediaDuration,
         playbackRate: props2.playbackRate ?? 1,
-        startFrom
+        startFrom: trimBeforeValue ?? undefined
       }),
       layout: "none",
       name,
@@ -5904,15 +5973,12 @@ Check that all your Remotion packages are on the same version. If your dependenc
       })
     });
   }
-  if (typeof startFrom !== "undefined" || typeof endAt !== "undefined") {
-    validateStartFromProps(startFrom, endAt);
-    const startFromFrameNo = startFrom ?? 0;
-    const endAtFrameNo = endAt ?? Infinity;
+  if (typeof trimBeforeValue !== "undefined" || typeof trimAfterValue !== "undefined") {
     return /* @__PURE__ */ jsx34(Sequence, {
       layout: "none",
-      from: 0 - startFromFrameNo,
+      from: 0 - (trimBeforeValue ?? 0),
       showInTimeline: false,
-      durationInFrames: endAtFrameNo,
+      durationInFrames: trimAfterValue,
       name,
       children: /* @__PURE__ */ jsx34(Video, {
         pauseWhenBuffering: pauseWhenBuffering ?? false,
@@ -8220,7 +8286,7 @@ var EnterpriseLicense = () => {
         checked: true
       }),
       /* @__PURE__ */ jsx4(PricingBulletPoint, {
-        text: "Private support channel",
+        text: "Private Slack or Discord",
         checked: true
       }),
       /* @__PURE__ */ jsx4(PricingBulletPoint, {
@@ -13201,7 +13267,7 @@ var useElementSize = (ref, options) => {
         setSize(null);
         return;
       }
-      const probableCssParentScale = contentRect.width === 0 ? 1 : newSize[0].width / contentRect.width;
+      const probableCssParentScale = contentRect.width === 0 || contentRect.width === 0 ? 1 : newSize[0].width / contentRect.width;
       const width = options.shouldApplyCssTransforms ? newSize[0].width : newSize[0].width * (1 / probableCssParentScale);
       const height = options.shouldApplyCssTransforms ? newSize[0].height : newSize[0].height * (1 / probableCssParentScale);
       setSize((prevState) => {
@@ -14995,8 +15061,7 @@ var acknowledgeRemotionLicenseMessage = (acknowledge, logLevel) => {
     return;
   }
   warningShown = true;
-  Internals.Log.warn(logLevel, "Note: Some companies are required to obtain a license to use Remotion. See: https://remotion.dev/license");
-  Internals.Log.warn(logLevel, "Pass the `acknowledgeRemotionLicense` prop to `<Player />` function to make this message disappear.");
+  Internals.Log.warn(logLevel, "Note: Some companies are required to obtain a license to use Remotion. See: https://remotion.dev/license\nPass the `acknowledgeRemotionLicense` prop to `<Player />` function to make this message disappear.");
 };
 var validateSingleFrame = (frame, variableName) => {
   if (typeof frame === "undefined" || frame === null) {

package/dist/components/homepage/Demo/DemoRender.d.ts

@@ -55,7 +55,7 @@ declare const data: z.ZodObject<{
     theme: z.ZodEnum<["light", "dark"]>;
     cardOrder: z.ZodArray<z.ZodNumber, "many">;
 }, "strip", z.ZodTypeAny, {
-    theme: "light" | "dark";
+    theme: "dark" | "light";
     emojiIndex: number;
     trending: {
         countryPaths: {
@@ -75,7 +75,7 @@ declare const data: z.ZodObject<{
     };
     cardOrder: number[];
 }, {
-    theme: "light" | "dark";
+    theme: "dark" | "light";
     emojiIndex: number;
     trending: {
         countryPaths: {

package/dist/components/homepage/Demo/math.d.ts

@@ -7,4 +7,4 @@ export declare const cardHeight: number;
 export declare const cardWidth: number;
 export declare const getPositionForIndex: (index: number) => Position;
 export declare const getInitialPositions: () => Position[];
-export declare const getIndexFromPosition: (clientX: number, clientY: number) => 0 | 2 | 3 | 1 | undefined;
+export declare const getIndexFromPosition: (clientX: number, clientY: number) => 0 | 1 | 3 | 2 | undefined;

package/dist/components/homepage/FreePricing.js

@@ -30,7 +30,7 @@ const textUnitWrapper = {
     flexDirection: 'column',
 };
 export const EnterpriseLicense = () => {
-    return (_jsxs(Container, { children: [_jsx(Audience, { children: "For advanced needs" }), _jsx(Title, { children: "Enterprise License" }), _jsx(PricingBulletPoint, { text: "Everything in Company License", checked: true }), _jsx(PricingBulletPoint, { text: "Custom terms, billing and pricing", checked: true }), _jsx(PricingBulletPoint, { text: "Compliance forms", checked: true }), _jsx(PricingBulletPoint, { text: "Prioritized feature requests", checked: true }), _jsx(PricingBulletPoint, { text: "Private support channel", checked: true }), _jsx(PricingBulletPoint, { text: "Monthly consulting session", checked: true }), _jsx("div", { style: { height: 30 } }), _jsx("div", { className: 'flex flex-row justify-end', children: _jsxs("div", { style: {
+    return (_jsxs(Container, { children: [_jsx(Audience, { children: "For advanced needs" }), _jsx(Title, { children: "Enterprise License" }), _jsx(PricingBulletPoint, { text: "Everything in Company License", checked: true }), _jsx(PricingBulletPoint, { text: "Custom terms, billing and pricing", checked: true }), _jsx(PricingBulletPoint, { text: "Compliance forms", checked: true }), _jsx(PricingBulletPoint, { text: "Prioritized feature requests", checked: true }), _jsx(PricingBulletPoint, { text: "Private Slack or Discord", checked: true }), _jsx(PricingBulletPoint, { text: "Monthly consulting session", checked: true }), _jsx("div", { style: { height: 30 } }), _jsx("div", { className: 'flex flex-row justify-end', children: _jsxs("div", { style: {
                         ...textUnitWrapper,
                         alignItems: 'flex-end',
                     }, children: [_jsx(PriceTag, { children: _jsx("a", { className: 'cursor-pointer no-underline text-inherit hover:text-brand', target: '_blank', href: "https://www.remotion.pro/contact", children: "Contact us" }) }), _jsx("div", { className: 'text-[var(--subtitle)] fontbrand text-sm', children: "Starting at $500 per month" })] }) })] }));

package/dist/homepage/Pricing.js

@@ -1645,7 +1645,7 @@ var EnterpriseLicense = () => {
         checked: true
       }),
       /* @__PURE__ */ jsx4(PricingBulletPoint, {
-        text: "Private support channel",
+        text: "Private Slack or Discord",
         checked: true
       }),
       /* @__PURE__ */ jsx4(PricingBulletPoint, {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@remotion/promo-pages",
-  "version": "4.0.317",
+  "version": "4.0.319",
   "publishConfig": {
     "access": "public"
   },
@@ -10,14 +10,14 @@
     "polished": "4.3.1",
     "zod": "3.22.3",
     "bun-plugin-tailwind": "0.0.15",
-    "@remotion/lambda": "4.0.317",
-    "@remotion/lottie": "4.0.317",
-    "@remotion/player": "4.0.317",
-    "@remotion/animated-emoji": "4.0.317",
-    "create-video": "4.0.317",
-    "remotion": "4.0.317",
-    "@remotion/shapes": "4.0.317",
-    "@remotion/paths": "4.0.317"
+    "@remotion/animated-emoji": "4.0.319",
+    "@remotion/shapes": "4.0.319",
+    "@remotion/player": "4.0.319",
+    "create-video": "4.0.319",
+    "remotion": "4.0.319",
+    "@remotion/paths": "4.0.319",
+    "@remotion/lambda": "4.0.319",
+    "@remotion/lottie": "4.0.319"
   },
   "devDependencies": {
     "@eslint/eslintrc": "3.1.0",
@@ -34,7 +34,7 @@
     "tailwind-merge": "2.5.2",
     "bun-plugin-tailwind": "0.0.13",
     "clsx": "2.1.1",
-    "@remotion/eslint-config-internal": "4.0.317"
+    "@remotion/eslint-config-internal": "4.0.319"
   },
   "repository": {
     "url": "https://github.com/remotion-dev/remotion/tree/main/packages/promo-pages"

package/src/components/homepage/FreePricing.tsx

@@ -103,7 +103,7 @@ export const EnterpriseLicense: React.FC = () => {
 			<PricingBulletPoint text="Custom terms, billing and pricing" checked />
 			<PricingBulletPoint text="Compliance forms" checked />
 			<PricingBulletPoint text="Prioritized feature requests" checked />
-			<PricingBulletPoint text="Private support channel" checked />
+			<PricingBulletPoint text="Private Slack or Discord" checked />
 			<PricingBulletPoint text="Monthly consulting session" checked />
 			<div style={{height: 30}} />
 			<div className={'flex flex-row justify-end'}>