@remotion/promo-pages 4.0.417 → 4.0.419

package/dist/Homepage.js

@@ -967,7 +967,7 @@ var useIsPlayer = () => {
 function truthy(value) {
   return Boolean(value);
 }
-var VERSION = "4.0.417";
+var VERSION = "4.0.419";
 var checkMultipleRemotionVersions = () => {
   if (typeof globalThis === "undefined") {
     return;
@@ -19411,7 +19411,7 @@ SelectSeparator2.displayName = Separator.displayName;
 var Switch = ({ active, onToggle }) => {
   return /* @__PURE__ */ jsx252("div", {
     "data-active": active,
-    className: "h-[34px] transition-all rounded-full w-[56px] border-2 border-b-4 bg-gray-200 p-[2px] cursor-pointer data-[active=true]:bg-brand border-black relative",
+    className: "h-[34px] transition-all rounded-full w-[56px] border-2 border-b-4 bg-gray-200 p-[2px] cursor-pointer data-[active=true]:bg-brand border-black relative shrink-0",
     onClick: onToggle,
     children: /* @__PURE__ */ jsx252("div", {
       "data-active": active,
@@ -22060,7 +22060,7 @@ var PricingSlider = ({ value, onChange, min: min2, max: max2, step = 1 }) => {
         step,
         value,
         onChange: (e) => onChange(Number(e.target.value)),
-        className: "pricing-slider flex-1",
+        className: "pricing-slider w-full",
         style: {
           background: `linear-gradient(to right, var(--color-brand) 0%, var(--color-brand) ${percentage}%, var(--background) ${percentage}%, var(--background) 100%)`
         }
@@ -22233,7 +22233,7 @@ var SectionCheckbox = ({ checked, onChange, title, subtitle, children }) => {
         className: "flex-1"
       }),
       /* @__PURE__ */ jsx47("div", {
-        className: cn2("fontbrand text-muted transition-opacity duration-150", checked ? "opacity-0" : "opacity-100"),
+        className: cn2("fontbrand text-muted transition-opacity duration-150", checked ? "hidden" : "opacity-100"),
         children: "Not selected"
       })
     ]
@@ -22320,27 +22320,33 @@ var CompanyPricing = () => {
         children: /* @__PURE__ */ jsx47("div", {
           className: "overflow-hidden",
           children: /* @__PURE__ */ jsxs9("div", {
-            className: "flex flex-row items-center gap-4 w-full py-3",
+            className: "flex flex-row items-center gap-3 sm:gap-4 w-full py-3",
             children: [
-              /* @__PURE__ */ jsx47(PricingSlider, {
-                value: devSeatCount,
-                onChange: setDevSeatCount,
-                min: 1,
-                max: 50
+              /* @__PURE__ */ jsx47("div", {
+                className: "flex-1 min-w-0",
+                children: /* @__PURE__ */ jsx47(PricingSlider, {
+                  value: devSeatCount,
+                  onChange: setDevSeatCount,
+                  min: 1,
+                  max: 50
+                })
               }),
               /* @__PURE__ */ jsxs9("div", {
-                className: "fontbrand shrink-0 w-[135px] text-right",
+                className: "fontbrand shrink-0 whitespace-nowrap w-[135px] sm:w-[150px] text-center",
                 children: [
                   devSeatCount,
                   " ",
                   devSeatCount === 1 ? "Seat" : "Seats"
                 ]
               }),
-              /* @__PURE__ */ jsx47("div", {
-                className: "fontbrand font-bold min-w-[60px] text-right shrink-0",
-                children: `$${new Intl.NumberFormat("en-US", {
-                  maximumFractionDigits: 0
-                }).format(SEAT_PRICE * devSeatCount)}`
+              /* @__PURE__ */ jsxs9("div", {
+                className: "fontbrand font-bold min-w-[60px] text-right shrink-0 whitespace-nowrap",
+                children: [
+                  "$",
+                  new Intl.NumberFormat("en-US", {
+                    maximumFractionDigits: 0
+                  }).format(SEAT_PRICE * devSeatCount)
+                ]
               })
             ]
           })
@@ -22370,27 +22376,33 @@ var CompanyPricing = () => {
         children: /* @__PURE__ */ jsx47("div", {
           className: "overflow-hidden",
           children: /* @__PURE__ */ jsxs9("div", {
-            className: "flex flex-row items-center gap-4 w-full py-3",
+            className: "flex flex-row items-center gap-3 sm:gap-4 w-full py-3",
             children: [
-              /* @__PURE__ */ jsx47(PricingSlider, {
-                value: cloudRenders,
-                onChange: setCloudRenders,
-                min: 1000,
-                max: 1e5,
-                step: 1000
+              /* @__PURE__ */ jsx47("div", {
+                className: "flex-1 min-w-0",
+                children: /* @__PURE__ */ jsx47(PricingSlider, {
+                  value: cloudRenders,
+                  onChange: setCloudRenders,
+                  min: 1000,
+                  max: 1e5,
+                  step: 1000
+                })
               }),
               /* @__PURE__ */ jsxs9("div", {
-                className: "fontbrand shrink-0 w-[135px] text-right",
+                className: "fontbrand shrink-0 whitespace-nowrap w-[135px] sm:w-[150px] text-right",
                 children: [
                   new Intl.NumberFormat("en-US").format(cloudRenders),
                   " Renders"
                 ]
               }),
-              /* @__PURE__ */ jsx47("div", {
-                className: "fontbrand font-bold min-w-[60px] text-right shrink-0",
-                children: `$${new Intl.NumberFormat("en-US", {
-                  maximumFractionDigits: 0
-                }).format(Math.ceil(cloudRenders / 1000) * RENDER_UNIT_PRICE)}`
+              /* @__PURE__ */ jsxs9("div", {
+                className: "fontbrand font-bold min-w-[60px] text-right shrink-0 whitespace-nowrap",
+                children: [
+                  "$",
+                  new Intl.NumberFormat("en-US", {
+                    maximumFractionDigits: 0
+                  }).format(Math.ceil(cloudRenders / 1000) * RENDER_UNIT_PRICE)
+                ]
               })
             ]
           })
@@ -22739,7 +22751,7 @@ var GitHubStars = () => {
             width: "45px"
           }),
           /* @__PURE__ */ jsx50(StatItemContent, {
-            content: "34k",
+            content: "35k",
             width: "80px",
             fontSize: "2.5rem",
             fontWeight: "bold"
@@ -25462,7 +25474,8 @@ var Controls = ({
   renderMuteButton,
   renderVolumeSlider,
   playing,
-  toggle
+  toggle,
+  renderCustomControls
 }) => {
   const playButtonRef = useRef82(null);
   const [supportsFullscreen, setSupportsFullscreen] = useState102(false);
@@ -25538,6 +25551,7 @@ var Controls = ({
     }
     return null;
   }, [showPlaybackRateControl]);
+  const customControlsElement = renderCustomControls ? renderCustomControls() : null;
   const ref = useRef82(null);
   const flexRef = useRef82(null);
   const onPointerDownIfContainer = useCallback82((e) => {
@@ -25609,6 +25623,10 @@ var Controls = ({
           /* @__PURE__ */ jsx94("div", {
             style: flex1
           }),
+          customControlsElement,
+          customControlsElement && playbackRates && canvasSize ? /* @__PURE__ */ jsx94("div", {
+            style: xSpacer
+          }) : null,
           playbackRates && canvasSize && /* @__PURE__ */ jsx94(PlaybackrateControl, {
             canvasSize,
             playbackRates
@@ -25876,6 +25894,7 @@ var PlayerUI = ({
   renderPlayPauseButton,
   renderMuteButton,
   renderVolumeSlider,
+  renderCustomControls,
   alwaysShowControls,
   showPlaybackRateControl,
   posterFillMode,
@@ -26299,7 +26318,8 @@ var PlayerUI = ({
         onDoubleClick: doubleClickToFullscreen ? handleDoubleClick : undefined,
         onPointerDown: clickToPlay ? handlePointerDown : undefined,
         renderMuteButton,
-        renderVolumeSlider
+        renderVolumeSlider,
+        renderCustomControls
       }) : null
     ]
   });
@@ -26607,6 +26627,7 @@ var PlayerFn = ({
   renderFullscreenButton,
   renderPlayPauseButton,
   renderVolumeSlider,
+  renderCustomControls,
   alwaysShowControls = false,
   initiallyMuted = false,
   showPlaybackRateControl = false,
@@ -26792,6 +26813,7 @@ var PlayerFn = ({
             renderPlayPauseButton: renderPlayPauseButton ?? null,
             renderMuteButton: renderMuteButton ?? null,
             renderVolumeSlider: renderVolumeSlider ?? null,
+            renderCustomControls: renderCustomControls ?? null,
             alwaysShowControls,
             showPlaybackRateControl,
             bufferStateDelayInMilliseconds: bufferStateDelayInMilliseconds ?? 300,
@@ -53351,15 +53373,10 @@ var emitReadiness = (channel) => {
   channel.postMessage({
     type: "main-tab-ready"
   });
-  let times = 0;
-  const interval = setInterval(() => {
+  setInterval(() => {
     channel.postMessage({
       type: "main-tab-ready"
     });
-    times++;
-    if (times > 30) {
-      clearInterval(interval);
-    }
   }, 300);
 };
 var addBroadcastChannelListener = () => {
@@ -54258,7 +54275,7 @@ var VideoForRendering2 = ({
     }
     const timestamp = frame / fps;
     const durationInSeconds = 1 / fps;
-    const newHandle = delayRender(`Extracting frame at time ${timestamp}`, {
+    const newHandle = delayRender(`Extracting frame at time ${timestamp} from ${src}`, {
       retries: delayRenderRetries ?? undefined,
       timeoutInMilliseconds: delayRenderTimeoutInMilliseconds ?? undefined
     });
@@ -61115,7 +61132,7 @@ var IfYouKnowReact = () => {
         autoPlay: true,
         playsInline: true,
         loop: true,
-        className: "w-[500px] cursor-default! relative lg:-translate-x-8 -mb-40 lg:mt-0 lg:mb-0"
+        className: "w-[500px] h-[500px] cursor-default! relative lg:-translate-x-8 -mb-40 lg:mt-0 lg:mb-0"
       }),
       /* @__PURE__ */ jsxs44("div", {
         children: [
@@ -62094,21 +62111,21 @@ var FEATURED_TEMPLATES = [
     showStackblitz: true
   },
   {
-    homePageLabel: "Prompt to Motion Graphics",
-    shortName: "Prompt to Motion Graphics (Next.js)",
+    homePageLabel: "Prompt to Motion Graphics SaaS Starter Kit",
+    shortName: "Prompt to Motion Graphics SaaS Starter Kit",
     org: "remotion-dev",
-    repoName: "template-prompt-to-motion-graphics",
-    description: "AI-powered code generation for Remotion",
-    longerDescription: 'A SaaS template for "Prompt to Motion Graphics" products. Generates Remotion code, streams it to the frontend, and compiles and previews it in the browser.',
+    repoName: "template-prompt-to-motion-graphics-saas",
+    description: "SaaS template for AI-powered code generation with Remotion",
+    longerDescription: 'A SaaS template for "Prompt to Motion Graphics" products. Generates Remotion code, streams it to the frontend, and compiles and previews it in the browser. See the <a href="/docs/ai/ai-saas-template">documentation page</a> for more details.',
     promoBanner: {
-      width: 1920,
-      height: 1080,
+      width: 2880,
+      height: 1512,
       src: "/img/prompt-to-motion-graphics.png"
     },
     cliId: "prompt-to-motion-graphics",
     type: "image",
     defaultBranch: "main",
-    featuredOnHomePage: null,
+    featuredOnHomePage: "https://prompt-to-motion-graphics-saas.vercel.app",
     previewURL: null,
     templateInMonorepo: "template-prompt-to-motion-graphics",
     allowEnableTailwind: false,
@@ -63181,7 +63198,7 @@ var GithubButton = () => {
       " ",
       /* @__PURE__ */ jsx160("div", {
         className: "text-xs inline-block ml-2 leading-none mt-[3px] self-center",
-        children: "34k"
+        children: "35k"
       })
     ]
   });

package/dist/Users/jonathanburger/remotion/packages/promo-pages/dist/Homepage.js

@@ -967,7 +967,7 @@ var useIsPlayer = () => {
 function truthy(value) {
   return Boolean(value);
 }
-var VERSION = "4.0.417";
+var VERSION = "4.0.419";
 var checkMultipleRemotionVersions = () => {
   if (typeof globalThis === "undefined") {
     return;
@@ -19411,7 +19411,7 @@ SelectSeparator2.displayName = Separator.displayName;
 var Switch = ({ active, onToggle }) => {
   return /* @__PURE__ */ jsx252("div", {
     "data-active": active,
-    className: "h-[34px] transition-all rounded-full w-[56px] border-2 border-b-4 bg-gray-200 p-[2px] cursor-pointer data-[active=true]:bg-brand border-black relative",
+    className: "h-[34px] transition-all rounded-full w-[56px] border-2 border-b-4 bg-gray-200 p-[2px] cursor-pointer data-[active=true]:bg-brand border-black relative shrink-0",
     onClick: onToggle,
     children: /* @__PURE__ */ jsx252("div", {
       "data-active": active,
@@ -22060,7 +22060,7 @@ var PricingSlider = ({ value, onChange, min: min2, max: max2, step = 1 }) => {
         step,
         value,
         onChange: (e) => onChange(Number(e.target.value)),
-        className: "pricing-slider flex-1",
+        className: "pricing-slider w-full",
         style: {
           background: `linear-gradient(to right, var(--color-brand) 0%, var(--color-brand) ${percentage}%, var(--background) ${percentage}%, var(--background) 100%)`
         }
@@ -22233,7 +22233,7 @@ var SectionCheckbox = ({ checked, onChange, title, subtitle, children }) => {
         className: "flex-1"
       }),
       /* @__PURE__ */ jsx47("div", {
-        className: cn2("fontbrand text-muted transition-opacity duration-150", checked ? "opacity-0" : "opacity-100"),
+        className: cn2("fontbrand text-muted transition-opacity duration-150", checked ? "hidden" : "opacity-100"),
         children: "Not selected"
       })
     ]
@@ -22320,27 +22320,33 @@ var CompanyPricing = () => {
         children: /* @__PURE__ */ jsx47("div", {
           className: "overflow-hidden",
           children: /* @__PURE__ */ jsxs9("div", {
-            className: "flex flex-row items-center gap-4 w-full py-3",
+            className: "flex flex-row items-center gap-3 sm:gap-4 w-full py-3",
             children: [
-              /* @__PURE__ */ jsx47(PricingSlider, {
-                value: devSeatCount,
-                onChange: setDevSeatCount,
-                min: 1,
-                max: 50
+              /* @__PURE__ */ jsx47("div", {
+                className: "flex-1 min-w-0",
+                children: /* @__PURE__ */ jsx47(PricingSlider, {
+                  value: devSeatCount,
+                  onChange: setDevSeatCount,
+                  min: 1,
+                  max: 50
+                })
               }),
               /* @__PURE__ */ jsxs9("div", {
-                className: "fontbrand shrink-0 w-[135px] text-right",
+                className: "fontbrand shrink-0 whitespace-nowrap w-[135px] sm:w-[150px] text-center",
                 children: [
                   devSeatCount,
                   " ",
                   devSeatCount === 1 ? "Seat" : "Seats"
                 ]
               }),
-              /* @__PURE__ */ jsx47("div", {
-                className: "fontbrand font-bold min-w-[60px] text-right shrink-0",
-                children: `$${new Intl.NumberFormat("en-US", {
-                  maximumFractionDigits: 0
-                }).format(SEAT_PRICE * devSeatCount)}`
+              /* @__PURE__ */ jsxs9("div", {
+                className: "fontbrand font-bold min-w-[60px] text-right shrink-0 whitespace-nowrap",
+                children: [
+                  "$",
+                  new Intl.NumberFormat("en-US", {
+                    maximumFractionDigits: 0
+                  }).format(SEAT_PRICE * devSeatCount)
+                ]
               })
             ]
           })
@@ -22370,27 +22376,33 @@ var CompanyPricing = () => {
         children: /* @__PURE__ */ jsx47("div", {
           className: "overflow-hidden",
           children: /* @__PURE__ */ jsxs9("div", {
-            className: "flex flex-row items-center gap-4 w-full py-3",
+            className: "flex flex-row items-center gap-3 sm:gap-4 w-full py-3",
             children: [
-              /* @__PURE__ */ jsx47(PricingSlider, {
-                value: cloudRenders,
-                onChange: setCloudRenders,
-                min: 1000,
-                max: 1e5,
-                step: 1000
+              /* @__PURE__ */ jsx47("div", {
+                className: "flex-1 min-w-0",
+                children: /* @__PURE__ */ jsx47(PricingSlider, {
+                  value: cloudRenders,
+                  onChange: setCloudRenders,
+                  min: 1000,
+                  max: 1e5,
+                  step: 1000
+                })
               }),
               /* @__PURE__ */ jsxs9("div", {
-                className: "fontbrand shrink-0 w-[135px] text-right",
+                className: "fontbrand shrink-0 whitespace-nowrap w-[135px] sm:w-[150px] text-right",
                 children: [
                   new Intl.NumberFormat("en-US").format(cloudRenders),
                   " Renders"
                 ]
               }),
-              /* @__PURE__ */ jsx47("div", {
-                className: "fontbrand font-bold min-w-[60px] text-right shrink-0",
-                children: `$${new Intl.NumberFormat("en-US", {
-                  maximumFractionDigits: 0
-                }).format(Math.ceil(cloudRenders / 1000) * RENDER_UNIT_PRICE)}`
+              /* @__PURE__ */ jsxs9("div", {
+                className: "fontbrand font-bold min-w-[60px] text-right shrink-0 whitespace-nowrap",
+                children: [
+                  "$",
+                  new Intl.NumberFormat("en-US", {
+                    maximumFractionDigits: 0
+                  }).format(Math.ceil(cloudRenders / 1000) * RENDER_UNIT_PRICE)
+                ]
               })
             ]
           })
@@ -22739,7 +22751,7 @@ var GitHubStars = () => {
             width: "45px"
           }),
           /* @__PURE__ */ jsx50(StatItemContent, {
-            content: "34k",
+            content: "35k",
             width: "80px",
             fontSize: "2.5rem",
             fontWeight: "bold"
@@ -25462,7 +25474,8 @@ var Controls = ({
   renderMuteButton,
   renderVolumeSlider,
   playing,
-  toggle
+  toggle,
+  renderCustomControls
 }) => {
   const playButtonRef = useRef82(null);
   const [supportsFullscreen, setSupportsFullscreen] = useState102(false);
@@ -25538,6 +25551,7 @@ var Controls = ({
     }
     return null;
   }, [showPlaybackRateControl]);
+  const customControlsElement = renderCustomControls ? renderCustomControls() : null;
   const ref = useRef82(null);
   const flexRef = useRef82(null);
   const onPointerDownIfContainer = useCallback82((e) => {
@@ -25609,6 +25623,10 @@ var Controls = ({
           /* @__PURE__ */ jsx94("div", {
             style: flex1
           }),
+          customControlsElement,
+          customControlsElement && playbackRates && canvasSize ? /* @__PURE__ */ jsx94("div", {
+            style: xSpacer
+          }) : null,
           playbackRates && canvasSize && /* @__PURE__ */ jsx94(PlaybackrateControl, {
             canvasSize,
             playbackRates
@@ -25876,6 +25894,7 @@ var PlayerUI = ({
   renderPlayPauseButton,
   renderMuteButton,
   renderVolumeSlider,
+  renderCustomControls,
   alwaysShowControls,
   showPlaybackRateControl,
   posterFillMode,
@@ -26299,7 +26318,8 @@ var PlayerUI = ({
         onDoubleClick: doubleClickToFullscreen ? handleDoubleClick : undefined,
         onPointerDown: clickToPlay ? handlePointerDown : undefined,
         renderMuteButton,
-        renderVolumeSlider
+        renderVolumeSlider,
+        renderCustomControls
       }) : null
     ]
   });
@@ -26607,6 +26627,7 @@ var PlayerFn = ({
   renderFullscreenButton,
   renderPlayPauseButton,
   renderVolumeSlider,
+  renderCustomControls,
   alwaysShowControls = false,
   initiallyMuted = false,
   showPlaybackRateControl = false,
@@ -26792,6 +26813,7 @@ var PlayerFn = ({
             renderPlayPauseButton: renderPlayPauseButton ?? null,
             renderMuteButton: renderMuteButton ?? null,
             renderVolumeSlider: renderVolumeSlider ?? null,
+            renderCustomControls: renderCustomControls ?? null,
             alwaysShowControls,
             showPlaybackRateControl,
             bufferStateDelayInMilliseconds: bufferStateDelayInMilliseconds ?? 300,
@@ -53351,15 +53373,10 @@ var emitReadiness = (channel) => {
   channel.postMessage({
     type: "main-tab-ready"
   });
-  let times = 0;
-  const interval = setInterval(() => {
+  setInterval(() => {
     channel.postMessage({
       type: "main-tab-ready"
     });
-    times++;
-    if (times > 30) {
-      clearInterval(interval);
-    }
   }, 300);
 };
 var addBroadcastChannelListener = () => {
@@ -54258,7 +54275,7 @@ var VideoForRendering2 = ({
     }
     const timestamp = frame / fps;
     const durationInSeconds = 1 / fps;
-    const newHandle = delayRender(`Extracting frame at time ${timestamp}`, {
+    const newHandle = delayRender(`Extracting frame at time ${timestamp} from ${src}`, {
       retries: delayRenderRetries ?? undefined,
       timeoutInMilliseconds: delayRenderTimeoutInMilliseconds ?? undefined
     });
@@ -61115,7 +61132,7 @@ var IfYouKnowReact = () => {
         autoPlay: true,
         playsInline: true,
         loop: true,
-        className: "w-[500px] cursor-default! relative lg:-translate-x-8 -mb-40 lg:mt-0 lg:mb-0"
+        className: "w-[500px] h-[500px] cursor-default! relative lg:-translate-x-8 -mb-40 lg:mt-0 lg:mb-0"
       }),
       /* @__PURE__ */ jsxs44("div", {
         children: [
@@ -62094,21 +62111,21 @@ var FEATURED_TEMPLATES = [
     showStackblitz: true
   },
   {
-    homePageLabel: "Prompt to Motion Graphics",
-    shortName: "Prompt to Motion Graphics (Next.js)",
+    homePageLabel: "Prompt to Motion Graphics SaaS Starter Kit",
+    shortName: "Prompt to Motion Graphics SaaS Starter Kit",
     org: "remotion-dev",
-    repoName: "template-prompt-to-motion-graphics",
-    description: "AI-powered code generation for Remotion",
-    longerDescription: 'A SaaS template for "Prompt to Motion Graphics" products. Generates Remotion code, streams it to the frontend, and compiles and previews it in the browser.',
+    repoName: "template-prompt-to-motion-graphics-saas",
+    description: "SaaS template for AI-powered code generation with Remotion",
+    longerDescription: 'A SaaS template for "Prompt to Motion Graphics" products. Generates Remotion code, streams it to the frontend, and compiles and previews it in the browser. See the <a href="/docs/ai/ai-saas-template">documentation page</a> for more details.',
     promoBanner: {
-      width: 1920,
-      height: 1080,
+      width: 2880,
+      height: 1512,
       src: "/img/prompt-to-motion-graphics.png"
     },
     cliId: "prompt-to-motion-graphics",
     type: "image",
     defaultBranch: "main",
-    featuredOnHomePage: null,
+    featuredOnHomePage: "https://prompt-to-motion-graphics-saas.vercel.app",
     previewURL: null,
     templateInMonorepo: "template-prompt-to-motion-graphics",
     allowEnableTailwind: false,
@@ -63181,7 +63198,7 @@ var GithubButton = () => {
       " ",
       /* @__PURE__ */ jsx160("div", {
         className: "text-xs inline-block ml-2 leading-none mt-[3px] self-center",
-        children: "34k"
+        children: "35k"
       })
     ]
   });

package/dist/Users/jonathanburger/remotion/packages/promo-pages/dist/design.js

@@ -6016,7 +6016,7 @@ var useIsPlayer = () => {
 function truthy2(value) {
   return Boolean(value);
 }
-var VERSION = "4.0.417";
+var VERSION = "4.0.419";
 var checkMultipleRemotionVersions = () => {
   if (typeof globalThis === "undefined") {
     return;
@@ -18367,7 +18367,7 @@ SelectSeparator2.displayName = Separator.displayName;
 var Switch = ({ active, onToggle }) => {
   return /* @__PURE__ */ jsx252("div", {
     "data-active": active,
-    className: "h-[34px] transition-all rounded-full w-[56px] border-2 border-b-4 bg-gray-200 p-[2px] cursor-pointer data-[active=true]:bg-brand border-black relative",
+    className: "h-[34px] transition-all rounded-full w-[56px] border-2 border-b-4 bg-gray-200 p-[2px] cursor-pointer data-[active=true]:bg-brand border-black relative shrink-0",
     onClick: onToggle,
     children: /* @__PURE__ */ jsx252("div", {
       "data-active": active,

package/dist/Users/jonathanburger/remotion/packages/promo-pages/dist/experts.js

@@ -967,7 +967,7 @@ var useIsPlayer = () => {
 function truthy(value) {
   return Boolean(value);
 }
-var VERSION = "4.0.417";
+var VERSION = "4.0.419";
 var checkMultipleRemotionVersions = () => {
   if (typeof globalThis === "undefined") {
     return;