@remotion/promo-pages 4.0.436 → 4.0.437

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.
package/dist/Homepage.js CHANGED
@@ -1003,7 +1003,7 @@ var useIsPlayer = () => {
1003
1003
  function truthy(value) {
1004
1004
  return Boolean(value);
1005
1005
  }
1006
- var VERSION = "4.0.436";
1006
+ var VERSION = "4.0.437";
1007
1007
  var checkMultipleRemotionVersions = () => {
1008
1008
  if (typeof globalThis === "undefined") {
1009
1009
  return;
@@ -4081,7 +4081,7 @@ var useBasicMediaInTimeline = ({
4081
4081
  const videoConfig = useVideoConfig();
4082
4082
  const [initialVolume] = useState10(() => volume);
4083
4083
  const mediaDuration = calculateMediaDuration({
4084
- mediaDurationInFrames: videoConfig.durationInFrames,
4084
+ mediaDurationInFrames: videoConfig.durationInFrames + (trimBefore ?? 0),
4085
4085
  playbackRate,
4086
4086
  trimBefore,
4087
4087
  trimAfter
@@ -29534,7 +29534,8 @@ class MediaPlayer {
29534
29534
  durationInFrames,
29535
29535
  onVideoFrameCallback,
29536
29536
  playing,
29537
- sequenceOffset
29537
+ sequenceOffset,
29538
+ credentials
29538
29539
  }) {
29539
29540
  this.canvas = canvas ?? null;
29540
29541
  this.src = src;
@@ -29558,7 +29559,9 @@ class MediaPlayer {
29558
29559
  this.playing = playing;
29559
29560
  this.sequenceOffset = sequenceOffset;
29560
29561
  this.input = new Input2({
29561
- source: new UrlSource(this.src),
29562
+ source: new UrlSource(this.src, credentials ? {
29563
+ requestInit: { credentials }
29564
+ } : undefined),
29562
29565
  formats: ALL_FORMATS
29563
29566
  });
29564
29567
  if (canvas) {
@@ -30341,6 +30344,7 @@ var AudioForPreviewAssertedShowing = ({
30341
30344
  fallbackHtml5AudioProps,
30342
30345
  debugAudioScheduling,
30343
30346
  onError,
30347
+ credentials,
30344
30348
  controls
30345
30349
  }) => {
30346
30350
  const videoConfig = useUnsafeVideoConfig2();
@@ -30467,7 +30471,8 @@ var AudioForPreviewAssertedShowing = ({
30467
30471
  durationInFrames: videoConfig.durationInFrames,
30468
30472
  onVideoFrameCallback: null,
30469
30473
  playing: initialPlaying.current,
30470
- sequenceOffset: initialSequenceOffset.current
30474
+ sequenceOffset: initialSequenceOffset.current,
30475
+ credentials
30471
30476
  });
30472
30477
  mediaPlayerRef.current = player;
30473
30478
  player.initialize(currentTimeRef.current, initialMuted.current).then((result) => {
@@ -30559,7 +30564,8 @@ var AudioForPreviewAssertedShowing = ({
30559
30564
  debugAudioScheduling,
30560
30565
  buffer,
30561
30566
  onError,
30562
- videoConfig.durationInFrames
30567
+ videoConfig.durationInFrames,
30568
+ credentials
30563
30569
  ]);
30564
30570
  if (shouldFallbackToNativeAudio && !disallowFallbackToHtml5Audio) {
30565
30571
  return /* @__PURE__ */ jsx58(Audio, {
@@ -30602,6 +30608,7 @@ var AudioForPreview2 = ({
30602
30608
  fallbackHtml5AudioProps,
30603
30609
  debugAudioScheduling,
30604
30610
  onError,
30611
+ credentials,
30605
30612
  controls
30606
30613
  }) => {
30607
30614
  const preloadedSrc = usePreload2(src);
@@ -30651,6 +30658,7 @@ var AudioForPreview2 = ({
30651
30658
  toneFrequency,
30652
30659
  debugAudioScheduling: debugAudioScheduling ?? false,
30653
30660
  onError,
30661
+ credentials,
30654
30662
  fallbackHtml5AudioProps,
30655
30663
  controls
30656
30664
  });
@@ -31745,11 +31753,12 @@ var getFormatOrNullOrNetworkError = async (input) => {
31745
31753
  return null;
31746
31754
  }
31747
31755
  };
31748
- var getSinks = async (src) => {
31756
+ var getSinks = async (src, credentials) => {
31749
31757
  const input = new Input22({
31750
31758
  formats: ALL_FORMATS2,
31751
31759
  source: new UrlSource2(src, {
31752
- getRetryDelay
31760
+ getRetryDelay,
31761
+ ...credentials ? { requestInit: { credentials } } : undefined
31753
31762
  })
31754
31763
  });
31755
31764
  const format = await getFormatOrNullOrNetworkError(input);
@@ -31829,15 +31838,16 @@ var getSinks = async (src) => {
31829
31838
  };
31830
31839
  };
31831
31840
  var sinkPromises = {};
31832
- var getSink = (src, logLevel) => {
31833
- let promise = sinkPromises[src];
31841
+ var getSink = (src, logLevel, credentials) => {
31842
+ const cacheKey = credentials ? `${src}::${credentials}` : src;
31843
+ let promise = sinkPromises[cacheKey];
31834
31844
  if (!promise) {
31835
31845
  Internals.Log.verbose({
31836
31846
  logLevel,
31837
31847
  tag: "@remotion/media"
31838
31848
  }, `Sink for ${src} was not found, creating new sink`);
31839
- promise = getSinks(src);
31840
- sinkPromises[src] = promise;
31849
+ promise = getSinks(src, credentials);
31850
+ sinkPromises[cacheKey] = promise;
31841
31851
  }
31842
31852
  return promise;
31843
31853
  };
@@ -31852,9 +31862,10 @@ var extractAudioInternal = async ({
31852
31862
  trimBefore,
31853
31863
  trimAfter,
31854
31864
  fps,
31855
- maxCacheSize
31865
+ maxCacheSize,
31866
+ credentials
31856
31867
  }) => {
31857
- const { getAudio, actualMatroskaTimestamps, isMatroska, getDuration } = await getSink(src, logLevel);
31868
+ const { getAudio, actualMatroskaTimestamps, isMatroska, getDuration } = await getSink(src, logLevel, credentials);
31858
31869
  let mediaDurationInSeconds = null;
31859
31870
  if (loop) {
31860
31871
  mediaDurationInSeconds = await getDuration();
@@ -31977,9 +31988,10 @@ var extractFrameInternal = async ({
31977
31988
  trimBefore,
31978
31989
  playbackRate,
31979
31990
  fps,
31980
- maxCacheSize
31991
+ maxCacheSize,
31992
+ credentials
31981
31993
  }) => {
31982
- const sink = await getSink(src, logLevel);
31994
+ const sink = await getSink(src, logLevel, credentials);
31983
31995
  const [video, mediaDurationInSecondsRaw] = await Promise.all([
31984
31996
  sink.getVideo(),
31985
31997
  loop ? sink.getDuration() : Promise.resolve(null)
@@ -32101,7 +32113,8 @@ var extractFrameAndAudio = async ({
32101
32113
  trimAfter,
32102
32114
  trimBefore,
32103
32115
  fps,
32104
- maxCacheSize
32116
+ maxCacheSize,
32117
+ credentials
32105
32118
  }) => {
32106
32119
  try {
32107
32120
  const [video, audio] = await Promise.all([
@@ -32114,7 +32127,8 @@ var extractFrameAndAudio = async ({
32114
32127
  playbackRate,
32115
32128
  trimBefore,
32116
32129
  fps,
32117
- maxCacheSize
32130
+ maxCacheSize,
32131
+ credentials
32118
32132
  }) : null,
32119
32133
  includeAudio ? extractAudio({
32120
32134
  src,
@@ -32127,7 +32141,8 @@ var extractFrameAndAudio = async ({
32127
32141
  trimAfter,
32128
32142
  fps,
32129
32143
  trimBefore,
32130
- maxCacheSize
32144
+ maxCacheSize,
32145
+ credentials
32131
32146
  }) : null
32132
32147
  ]);
32133
32148
  if (video?.type === "cannot-decode") {
@@ -32208,7 +32223,8 @@ var addBroadcastChannelListener = () => {
32208
32223
  trimAfter: data.trimAfter,
32209
32224
  trimBefore: data.trimBefore,
32210
32225
  fps: data.fps,
32211
- maxCacheSize: data.maxCacheSize
32226
+ maxCacheSize: data.maxCacheSize,
32227
+ credentials: data.credentials
32212
32228
  });
32213
32229
  if (result.type === "cannot-decode") {
32214
32230
  const cannotDecodeResponse = {
@@ -32303,7 +32319,8 @@ var extractFrameViaBroadcastChannel = async ({
32303
32319
  trimAfter,
32304
32320
  trimBefore,
32305
32321
  fps,
32306
- maxCacheSize
32322
+ maxCacheSize,
32323
+ credentials
32307
32324
  }) => {
32308
32325
  if (isClientSideRendering || window.remotion_isMainTab) {
32309
32326
  return extractFrameAndAudio({
@@ -32319,7 +32336,8 @@ var extractFrameViaBroadcastChannel = async ({
32319
32336
  trimAfter,
32320
32337
  trimBefore,
32321
32338
  fps,
32322
- maxCacheSize
32339
+ maxCacheSize,
32340
+ credentials
32323
32341
  });
32324
32342
  }
32325
32343
  await waitForMainTabToBeReady(window.remotion_broadcastChannel);
@@ -32396,7 +32414,8 @@ var extractFrameViaBroadcastChannel = async ({
32396
32414
  trimAfter,
32397
32415
  trimBefore,
32398
32416
  fps,
32399
- maxCacheSize
32417
+ maxCacheSize,
32418
+ credentials
32400
32419
  };
32401
32420
  window.remotion_broadcastChannel.postMessage(request);
32402
32421
  let timeoutId;
@@ -32431,7 +32450,8 @@ var AudioForRendering2 = ({
32431
32450
  toneFrequency,
32432
32451
  trimAfter,
32433
32452
  trimBefore,
32434
- onError
32453
+ onError,
32454
+ credentials
32435
32455
  }) => {
32436
32456
  const defaultLogLevel = Internals.useLogLevel();
32437
32457
  const logLevel = overriddenLogLevel ?? defaultLogLevel;
@@ -32495,7 +32515,8 @@ var AudioForRendering2 = ({
32495
32515
  trimAfter,
32496
32516
  trimBefore,
32497
32517
  fps,
32498
- maxCacheSize
32518
+ maxCacheSize,
32519
+ credentials
32499
32520
  }).then((result) => {
32500
32521
  const handleError = (error2, clientSideError, fallbackMessage) => {
32501
32522
  const [action, errorToUse] = callOnErrorAndResolve({
@@ -32589,7 +32610,8 @@ var AudioForRendering2 = ({
32589
32610
  replaceWithHtml5Audio,
32590
32611
  maxCacheSize,
32591
32612
  audioEnabled,
32592
- onError
32613
+ onError,
32614
+ credentials
32593
32615
  ]);
32594
32616
  if (replaceWithHtml5Audio) {
32595
32617
  return /* @__PURE__ */ jsx216(Html5Audio, {
@@ -32689,6 +32711,7 @@ var VideoForPreviewAssertedShowing = ({
32689
32711
  debugAudioScheduling,
32690
32712
  headless,
32691
32713
  onError,
32714
+ credentials,
32692
32715
  controls
32693
32716
  }) => {
32694
32717
  const src = usePreload22(unpreloadedSrc);
@@ -32792,7 +32815,8 @@ var VideoForPreviewAssertedShowing = ({
32792
32815
  durationInFrames: videoConfig.durationInFrames,
32793
32816
  onVideoFrameCallback: initialOnVideoFrameRef.current ?? null,
32794
32817
  playing: initialPlaying.current,
32795
- sequenceOffset: initialSequenceOffset.current
32818
+ sequenceOffset: initialSequenceOffset.current,
32819
+ credentials
32796
32820
  });
32797
32821
  mediaPlayerRef.current = player;
32798
32822
  player.initialize(currentTimeRef.current, initialMuted.current).then((result) => {
@@ -32882,7 +32906,8 @@ var VideoForPreviewAssertedShowing = ({
32882
32906
  sharedAudioContext,
32883
32907
  videoConfig.fps,
32884
32908
  onError,
32885
- videoConfig.durationInFrames
32909
+ videoConfig.durationInFrames,
32910
+ credentials
32886
32911
  ]);
32887
32912
  const classNameValue = useMemo412(() => {
32888
32913
  return [Internals.OBJECTFIT_CONTAIN_CLASS_NAME, className2].filter(Internals.truthy).join(" ");
@@ -33014,7 +33039,8 @@ var VideoForRendering2 = ({
33014
33039
  trimAfterValue,
33015
33040
  trimBeforeValue,
33016
33041
  headless,
33017
- onError
33042
+ onError,
33043
+ credentials
33018
33044
  }) => {
33019
33045
  if (!src) {
33020
33046
  throw new TypeError("No `src` was passed to <Video>.");
@@ -33081,7 +33107,8 @@ var VideoForRendering2 = ({
33081
33107
  trimAfter: trimAfterValue,
33082
33108
  trimBefore: trimBeforeValue,
33083
33109
  fps,
33084
- maxCacheSize
33110
+ maxCacheSize,
33111
+ credentials
33085
33112
  }).then((result) => {
33086
33113
  const handleError = (err, clientSideError, fallbackMessage, mediaDurationInSeconds) => {
33087
33114
  if (environment.isClientSideRendering) {
@@ -33213,7 +33240,8 @@ var VideoForRendering2 = ({
33213
33240
  maxCacheSize,
33214
33241
  cancelRender3,
33215
33242
  headless,
33216
- onError
33243
+ onError,
33244
+ credentials
33217
33245
  ]);
33218
33246
  const classNameValue = useMemo53(() => {
33219
33247
  return [Internals.OBJECTFIT_CONTAIN_CLASS_NAME, className2].filter(Internals.truthy).join(" ");
@@ -33352,6 +33380,7 @@ var InnerVideo = ({
33352
33380
  debugAudioScheduling,
33353
33381
  headless,
33354
33382
  onError,
33383
+ credentials,
33355
33384
  controls
33356
33385
  }) => {
33357
33386
  const environment = useRemotionEnvironment();
@@ -33394,7 +33423,8 @@ var InnerVideo = ({
33394
33423
  trimAfterValue,
33395
33424
  trimBeforeValue,
33396
33425
  headless,
33397
- onError
33426
+ onError,
33427
+ credentials
33398
33428
  });
33399
33429
  }
33400
33430
  return /* @__PURE__ */ jsx65(VideoForPreview2, {
@@ -33420,6 +33450,7 @@ var InnerVideo = ({
33420
33450
  debugAudioScheduling: debugAudioScheduling ?? false,
33421
33451
  headless: headless ?? false,
33422
33452
  onError,
33453
+ credentials,
33423
33454
  controls
33424
33455
  });
33425
33456
  };
@@ -33449,6 +33480,7 @@ var VideoInner = ({
33449
33480
  debugAudioScheduling,
33450
33481
  headless,
33451
33482
  onError,
33483
+ credentials,
33452
33484
  controls
33453
33485
  }) => {
33454
33486
  const fallbackLogLevel = Internals.useLogLevel();
@@ -33478,6 +33510,7 @@ var VideoInner = ({
33478
33510
  debugAudioScheduling: debugAudioScheduling ?? false,
33479
33511
  headless: headless ?? false,
33480
33512
  onError,
33513
+ credentials,
33481
33514
  controls
33482
33515
  });
33483
33516
  };
@@ -34785,7 +34818,7 @@ import {
34785
34818
  import { BufferTarget, StreamTarget } from "mediabunny";
34786
34819
 
34787
34820
  // ../core/dist/esm/version.mjs
34788
- var VERSION2 = "4.0.436";
34821
+ var VERSION2 = "4.0.437";
34789
34822
 
34790
34823
  // ../web-renderer/dist/esm/index.mjs
34791
34824
  import { AudioSample, VideoSample } from "mediabunny";
@@ -41453,6 +41486,29 @@ var FEATURED_TEMPLATES = [
41453
41486
  contributedBy: null,
41454
41487
  showStackblitz: true
41455
41488
  },
41489
+ {
41490
+ homePageLabel: "Electron",
41491
+ shortName: "Electron",
41492
+ org: "remotion-dev",
41493
+ repoName: "template-electron",
41494
+ description: "Render Remotion videos from a desktop app",
41495
+ longerDescription: "An Electron Forge + Vite starter template that renders Remotion videos from the Electron main process.",
41496
+ promoVideo: {
41497
+ muxId: "EvaWtUbbZ5zuYQ5EZFcZ501fg4JPtdVXXt9K02Rf62xcM",
41498
+ width: 1920,
41499
+ height: 1080
41500
+ },
41501
+ cliId: "electron",
41502
+ type: "video",
41503
+ defaultBranch: "main",
41504
+ featuredOnHomePage: null,
41505
+ previewURL: null,
41506
+ previewLabel: null,
41507
+ templateInMonorepo: "template-electron",
41508
+ allowEnableTailwind: false,
41509
+ contributedBy: null,
41510
+ showStackblitz: false
41511
+ },
41456
41512
  {
41457
41513
  homePageLabel: "React Router 7",
41458
41514
  shortName: "React Router",
@@ -41837,14 +41893,28 @@ var Cubes = (props) => {
41837
41893
  });
41838
41894
  };
41839
41895
 
41840
- // src/components/icons/js.tsx
41896
+ // src/components/icons/electron.tsx
41841
41897
  import { jsx as jsx136 } from "react/jsx-runtime";
41842
- var JSIcon = (props) => {
41898
+ var ElectronIcon = ({ style: style4 }) => {
41843
41899
  return /* @__PURE__ */ jsx136("svg", {
41900
+ viewBox: "0 0 640 640",
41901
+ style: style4,
41902
+ xmlns: "http://www.w3.org/2000/svg",
41903
+ children: /* @__PURE__ */ jsx136("path", {
41904
+ d: "M402 488.7C376.3 484 348.5 475.2 320 462.8C291.4 475.3 263.7 484.1 238 488.7C238.8 490.5 239.6 492.3 240.5 494.1C261.3 538 289.1 559.9 320 559.9C350.9 559.9 378.7 537.9 399.5 494.1C400.3 492.3 401.2 490.5 402 488.7zM320 576C277.2 576 243.6 543.3 221.6 491.2C168.9 497.3 126.6 484.4 106.4 448C85.7 410.9 97 365.2 130 320C97 274.8 85.7 229.1 106.4 192C126.6 155.7 168.9 142.7 221.6 148.8C243.6 96.7 277.3 64 320 64C362.7 64 396.4 96.7 418.4 148.8C471.1 142.7 513.4 155.6 533.6 192C554.3 229.1 543 274.8 510 320C543 365.2 554.3 410.9 533.6 448C513.4 484.3 471.1 497.3 418.4 491.2C396.4 543.3 362.7 576 320 576zM300.3 453.7C286.4 446.9 272.4 439.3 258.3 430.9C242.6 421.5 227.7 411.6 213.8 401.4C217.8 428 223.9 452.4 231.8 473.7C253.1 470.1 276.2 463.4 300.3 453.8zM408.2 473.6C416 452.4 422.1 428 426.2 401.3C412.3 411.6 397.4 421.5 381.7 430.8C367.7 439.2 353.6 446.8 339.7 453.6C363.8 463.2 386.9 469.9 408.2 473.5zM373.5 417.2C393.6 405.2 412.2 392.4 429.1 379.1C431.1 360.3 432.1 340.5 432.1 320.1C432.1 299.7 431.1 279.9 429.1 261.1C412.2 247.8 393.6 235 373.5 223C355.5 212.2 337.6 202.8 320.1 194.8C302.6 202.8 284.7 212.2 266.7 223C246.6 235 228 247.8 211.1 261.1C209.1 279.9 208.1 299.7 208.1 320.1C208.1 340.5 209.1 360.3 211.1 379.1C228 392.4 246.6 405.2 266.7 417.2C284.7 428 302.6 437.4 320.1 445.4C337.6 437.4 355.5 428 373.5 417.2zM424.5 475.8C425.4 475.9 426.3 476 427.2 476C473.5 479.9 504.8 467 519.7 440.2C534.8 413.1 529.6 377.9 503.1 337.9C502 336.3 501 334.7 499.8 333.1C484.5 351.6 465.8 369.9 444.2 387.3C440.4 419.8 433.7 449.7 424.5 475.6zM446.4 364.7C463.2 350.1 477.8 335 489.9 320C477.9 305 463.2 290 446.4 275.3C447.5 289.8 448.1 304.7 448.1 320C448.1 335.3 447.5 350.2 446.4 364.7zM503 302C529.6 262 534.7 226.8 519.6 199.7C504.7 172.9 473.3 160.1 427.1 164C426.2 164.1 425.3 164.2 424.4 164.2C433.6 190.2 440.3 220.1 444.1 252.5C465.7 270 484.4 288.2 499.7 306.7C500.8 305.1 501.9 303.5 503 301.9zM399.5 145.8C378.7 102 351 80 320 80C289 80 261.3 102 240.5 145.8C239.7 147.6 238.8 149.4 238 151.2C263.7 155.9 291.5 164.7 320 177.1C348.6 164.6 376.3 155.8 402 151.2C401.2 149.4 400.4 147.6 399.5 145.8zM408.1 166.4C386.8 170 363.7 176.7 339.6 186.3C353.5 193.1 367.5 200.7 381.6 209.1C397.3 218.5 412.2 228.4 426.1 238.6C422.1 212 416 187.6 408.1 166.3zM231.7 166.4C223.9 187.6 217.8 212 213.7 238.7C227.6 228.4 242.5 218.6 258.2 209.2C272.2 200.8 286.3 193.2 300.2 186.4C276.1 176.8 253 170.1 231.7 166.5zM215.5 164.2C214.6 164.1 213.7 164 212.8 164C166.5 160.1 135.2 173 120.3 199.7C105.2 226.8 110.4 262 136.9 302C138 303.6 139 305.2 140.2 306.8C155.5 288.3 174.2 270 195.8 252.6C199.6 220.1 206.3 190.2 215.5 164.3zM195.8 387.4C174.2 369.9 155.5 351.7 140.2 333.2C139.1 334.8 138 336.4 136.9 338C110.3 378 105.2 413.2 120.3 440.3C135.2 467.1 166.6 479.9 212.8 476.1C213.7 476 214.6 475.9 215.5 475.9C206.3 449.9 199.6 420 195.8 387.6zM193.7 275.3C176.9 289.9 162.3 305 150.2 320C162.2 335 176.9 350 193.7 364.7C192.6 350.2 192 335.3 192 320C192 304.7 192.6 289.8 193.7 275.3zM320 272C346.5 272 368 293.5 368 320C368 346.5 346.5 368 320 368C293.5 368 272 346.5 272 320C272 293.5 293.5 272 320 272zM352 320C352 302.3 337.7 288 320 288C302.3 288 288 302.3 288 320C288 337.7 302.3 352 320 352C337.7 352 352 337.7 352 320z",
41905
+ fill: "currentColor"
41906
+ })
41907
+ });
41908
+ };
41909
+
41910
+ // src/components/icons/js.tsx
41911
+ import { jsx as jsx137 } from "react/jsx-runtime";
41912
+ var JSIcon = (props) => {
41913
+ return /* @__PURE__ */ jsx137("svg", {
41844
41914
  className: "svg-inline--fa fa-js-square fa-w-14",
41845
41915
  viewBox: "0 0 448 512",
41846
41916
  ...props,
41847
- children: /* @__PURE__ */ jsx136("path", {
41917
+ children: /* @__PURE__ */ jsx137("path", {
41848
41918
  fill: "currentColor",
41849
41919
  d: "M400 32H48C21.5 32 0 53.5 0 80v352c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V80c0-26.5-21.5-48-48-48zM243.8 381.4c0 43.6-25.6 63.5-62.9 63.5-33.7 0-53.2-17.4-63.2-38.5l34.3-20.7c6.6 11.7 12.6 21.6 27.1 21.6 13.8 0 22.6-5.4 22.6-26.5V237.7h42.1v143.7zm99.6 63.5c-39.1 0-64.4-18.6-76.7-43l34.3-19.8c9 14.7 20.8 25.6 41.5 25.6 17.4 0 28.6-8.7 28.6-20.8 0-14.4-11.4-19.5-30.7-28l-10.5-4.5c-30.4-12.9-50.5-29.2-50.5-63.5 0-31.6 24.1-55.6 61.6-55.6 26.8 0 46 9.3 59.8 33.7L368 290c-7.2-12.9-15-18-27.1-18-12.3 0-20.1 7.8-20.1 18 0 12.6 7.8 17.7 25.9 25.6l10.5 4.5c35.8 15.3 55.9 31 55.9 66.2 0 37.8-29.8 58.6-69.7 58.6z"
41850
41920
  })
@@ -41852,13 +41922,13 @@ var JSIcon = (props) => {
41852
41922
  };
41853
41923
 
41854
41924
  // src/components/icons/music.tsx
41855
- import { jsx as jsx137 } from "react/jsx-runtime";
41925
+ import { jsx as jsx138 } from "react/jsx-runtime";
41856
41926
  var MusicIcon = (props) => {
41857
- return /* @__PURE__ */ jsx137("svg", {
41927
+ return /* @__PURE__ */ jsx138("svg", {
41858
41928
  ...props,
41859
41929
  xmlns: "http://www.w3.org/2000/svg",
41860
41930
  viewBox: "0 0 512 512",
41861
- children: /* @__PURE__ */ jsx137("path", {
41931
+ children: /* @__PURE__ */ jsx138("path", {
41862
41932
  fill: "currentColor",
41863
41933
  d: "M499.1 6.3c8.1 6 12.9 15.6 12.9 25.7l0 72 0 264c0 44.2-43 80-96 80s-96-35.8-96-80s43-80 96-80c11.2 0 22 1.6 32 4.6L448 147 192 223.8 192 432c0 44.2-43 80-96 80s-96-35.8-96-80s43-80 96-80c11.2 0 22 1.6 32 4.6L128 200l0-72c0-14.1 9.3-26.6 22.8-30.7l320-96c9.7-2.9 20.2-1.1 28.3 5z"
41864
41934
  })
@@ -41866,7 +41936,7 @@ var MusicIcon = (props) => {
41866
41936
  };
41867
41937
 
41868
41938
  // src/components/icons/next.tsx
41869
- import { jsx as jsx138, jsxs as jsxs56 } from "react/jsx-runtime";
41939
+ import { jsx as jsx139, jsxs as jsxs56 } from "react/jsx-runtime";
41870
41940
  var NextIcon = ({ style: style4 }) => {
41871
41941
  return /* @__PURE__ */ jsxs56("svg", {
41872
41942
  fill: "none",
@@ -41874,7 +41944,7 @@ var NextIcon = ({ style: style4 }) => {
41874
41944
  style: style4,
41875
41945
  xmlns: "http://www.w3.org/2000/svg",
41876
41946
  children: [
41877
- /* @__PURE__ */ jsx138("mask", {
41947
+ /* @__PURE__ */ jsx139("mask", {
41878
41948
  height: "180",
41879
41949
  id: "mask0_292_250",
41880
41950
  maskUnits: "userSpaceOnUse",
@@ -41882,7 +41952,7 @@ var NextIcon = ({ style: style4 }) => {
41882
41952
  width: "180",
41883
41953
  x: "0",
41884
41954
  y: "0",
41885
- children: /* @__PURE__ */ jsx138("circle", {
41955
+ children: /* @__PURE__ */ jsx139("circle", {
41886
41956
  cx: "90",
41887
41957
  cy: "90",
41888
41958
  fill: "currentcolor",
@@ -41892,17 +41962,17 @@ var NextIcon = ({ style: style4 }) => {
41892
41962
  /* @__PURE__ */ jsxs56("g", {
41893
41963
  mask: "url(#mask0_292_250)",
41894
41964
  children: [
41895
- /* @__PURE__ */ jsx138("circle", {
41965
+ /* @__PURE__ */ jsx139("circle", {
41896
41966
  cx: "90",
41897
41967
  cy: "90",
41898
41968
  fill: "currentcolor",
41899
41969
  r: "90"
41900
41970
  }),
41901
- /* @__PURE__ */ jsx138("path", {
41971
+ /* @__PURE__ */ jsx139("path", {
41902
41972
  d: "M149.508 157.52L69.142 54H54V125.97H66.1136V69.3836L139.999 164.845C143.333 162.614 146.509 160.165 149.508 157.52Z",
41903
41973
  fill: "url(#paint0_linear_292_250)"
41904
41974
  }),
41905
- /* @__PURE__ */ jsx138("rect", {
41975
+ /* @__PURE__ */ jsx139("rect", {
41906
41976
  fill: "url(#paint1_linear_292_250)",
41907
41977
  height: "72",
41908
41978
  width: "12",
@@ -41921,10 +41991,10 @@ var NextIcon = ({ style: style4 }) => {
41921
41991
  y1: "116.5",
41922
41992
  y2: "160.5",
41923
41993
  children: [
41924
- /* @__PURE__ */ jsx138("stop", {
41994
+ /* @__PURE__ */ jsx139("stop", {
41925
41995
  stopColor: "var(--background)"
41926
41996
  }),
41927
- /* @__PURE__ */ jsx138("stop", {
41997
+ /* @__PURE__ */ jsx139("stop", {
41928
41998
  offset: "1",
41929
41999
  stopColor: "var(--background)",
41930
42000
  stopOpacity: "0"
@@ -41939,10 +42009,10 @@ var NextIcon = ({ style: style4 }) => {
41939
42009
  y1: "54",
41940
42010
  y2: "106.875",
41941
42011
  children: [
41942
- /* @__PURE__ */ jsx138("stop", {
42012
+ /* @__PURE__ */ jsx139("stop", {
41943
42013
  stopColor: "var(--background)"
41944
42014
  }),
41945
- /* @__PURE__ */ jsx138("stop", {
42015
+ /* @__PURE__ */ jsx139("stop", {
41946
42016
  offset: "1",
41947
42017
  stopColor: "var(--background)",
41948
42018
  stopOpacity: "0"
@@ -41956,7 +42026,7 @@ var NextIcon = ({ style: style4 }) => {
41956
42026
  };
41957
42027
 
41958
42028
  // src/components/icons/overlay.tsx
41959
- import { jsx as jsx139, jsxs as jsxs57 } from "react/jsx-runtime";
42029
+ import { jsx as jsx140, jsxs as jsxs57 } from "react/jsx-runtime";
41960
42030
  var OverlayIcon = (props) => {
41961
42031
  return /* @__PURE__ */ jsxs57("svg", {
41962
42032
  viewBox: "0 0 576 512",
@@ -41964,11 +42034,11 @@ var OverlayIcon = (props) => {
41964
42034
  xmlns: "http://www.w3.org/2000/svg",
41965
42035
  ...props,
41966
42036
  children: [
41967
- /* @__PURE__ */ jsx139("path", {
42037
+ /* @__PURE__ */ jsx140("path", {
41968
42038
  d: "M251.1 407.9C274.5 418.7 301.5 418.7 324.9 407.9V407.8L476.9 337.6L530.1 362.2C538.6 366.1 544 374.6 544 384C544 393.4 538.6 401.9 530.1 405.8L311.5 506.8C296.6 513.7 279.4 513.7 264.5 506.8L45.9 405.8C37.4 401.9 32 393.4 32 384C32 374.6 37.4 366.1 45.9 362.2L99.1 337.7L251.1 407.9Z",
41969
42039
  fill: "currentcolor"
41970
42040
  }),
41971
- /* @__PURE__ */ jsx139("path", {
42041
+ /* @__PURE__ */ jsx140("path", {
41972
42042
  d: "M277.8 132.7L495.2 230.1C505.4 234.7 512 244.8 512 256C512 267.2 505.4 277.3 495.2 281.9L277.8 379.3C270.1 382.4 263.5 384 256 384C248.5 384 241 382.4 234.2 379.3L16.76 281.9C6.561 277.3 0.0003 267.2 0.0003 256C0.0003 244.8 6.561 234.7 16.76 230.1L234.2 132.7C241 129.6 248.5 128 256 128C263.5 128 270.1 129.6 277.8 132.7Z",
41973
42043
  stroke: "currentcolor",
41974
42044
  transform: "translate(32, -25)",
@@ -41979,13 +42049,13 @@ var OverlayIcon = (props) => {
41979
42049
  };
41980
42050
 
41981
42051
  // src/components/icons/prompt-to-video.tsx
41982
- import { jsx as jsx140 } from "react/jsx-runtime";
42052
+ import { jsx as jsx141 } from "react/jsx-runtime";
41983
42053
  var PromptToVideoIcon = (props) => {
41984
- return /* @__PURE__ */ jsx140("svg", {
42054
+ return /* @__PURE__ */ jsx141("svg", {
41985
42055
  xmlns: "http://www.w3.org/2000/svg",
41986
42056
  viewBox: "0 0 512 512",
41987
42057
  ...props,
41988
- children: /* @__PURE__ */ jsx140("path", {
42058
+ children: /* @__PURE__ */ jsx141("path", {
41989
42059
  d: "M278.5 15.6C275 6.2 266 0 256 0s-19 6.2-22.5 15.6L174.2 174.2 15.6 233.5C6.2 237 0 246 0 256s6.2 19 15.6 22.5l158.6 59.4 59.4 158.6C237 505.8 246 512 256 512s19-6.2 22.5-15.6l59.4-158.6 158.6-59.4C505.8 275 512 266 512 256s-6.2-19-15.6-22.5L337.8 174.2 278.5 15.6z",
41990
42060
  fill: "currentColor"
41991
42061
  })
@@ -41993,23 +42063,23 @@ var PromptToVideoIcon = (props) => {
41993
42063
  };
41994
42064
 
41995
42065
  // src/components/icons/recorder.tsx
41996
- import { jsx as jsx141, jsxs as jsxs58 } from "react/jsx-runtime";
42066
+ import { jsx as jsx144, jsxs as jsxs58 } from "react/jsx-runtime";
41997
42067
  var Recorder = (props) => {
41998
42068
  return /* @__PURE__ */ jsxs58("svg", {
41999
42069
  viewBox: "0 0 700 700",
42000
42070
  ...props,
42001
42071
  children: [
42002
- /* @__PURE__ */ jsx141("path", {
42072
+ /* @__PURE__ */ jsx144("path", {
42003
42073
  d: "M0 350C0 115.5 115.5 0 350 0C584.5 0 700 115.5 700 350C700 584.5 584.5 700 350 700C115.5 700 0 584.5 0 350Z",
42004
42074
  fill: "#F43B00",
42005
42075
  fillOpacity: "0.15"
42006
42076
  }),
42007
- /* @__PURE__ */ jsx141("path", {
42077
+ /* @__PURE__ */ jsx144("path", {
42008
42078
  d: "M79.4595 344.324C79.4595 161.794 169.362 71.8915 351.892 71.8915C534.422 71.8915 624.324 161.794 624.324 344.324C624.324 526.854 534.422 616.756 351.892 616.756C169.362 616.756 79.4595 526.854 79.4595 344.324Z",
42009
42079
  fill: "#F43B00",
42010
42080
  fillOpacity: "0.3"
42011
42081
  }),
42012
- /* @__PURE__ */ jsx141("path", {
42082
+ /* @__PURE__ */ jsx144("path", {
42013
42083
  d: "M155.135 343.378C155.135 212.185 219.752 147.567 350.946 147.567C482.139 147.567 546.756 212.185 546.756 343.378C546.756 474.571 482.139 539.189 350.946 539.189C219.752 539.189 155.135 474.571 155.135 343.378Z",
42014
42084
  fill: "#F43B00"
42015
42085
  })
@@ -42018,9 +42088,9 @@ var Recorder = (props) => {
42018
42088
  };
42019
42089
 
42020
42090
  // src/components/icons/remix.tsx
42021
- import { jsx as jsx144, jsxs as jsxs59 } from "react/jsx-runtime";
42091
+ import { jsx as jsx146, jsxs as jsxs59 } from "react/jsx-runtime";
42022
42092
  var ReactRouterIcon = (props) => {
42023
- return /* @__PURE__ */ jsx144("svg", {
42093
+ return /* @__PURE__ */ jsx146("svg", {
42024
42094
  xmlns: "http://www.w3.org/2000/svg",
42025
42095
  width: "800px",
42026
42096
  height: "800px",
@@ -42030,11 +42100,11 @@ var ReactRouterIcon = (props) => {
42030
42100
  ...props,
42031
42101
  children: /* @__PURE__ */ jsxs59("g", {
42032
42102
  children: [
42033
- /* @__PURE__ */ jsx144("path", {
42103
+ /* @__PURE__ */ jsx146("path", {
42034
42104
  d: "M78.0659341,92.5875806 C90.8837956,92.5875806 101.274726,82.1966508 101.274726,69.3787894 C101.274726,56.5609279 90.8837956,46.1699982 78.0659341,46.1699982 C65.2480726,46.1699982 54.8571429,56.5609279 54.8571429,69.3787894 C54.8571429,82.1966508 65.2480726,92.5875806 78.0659341,92.5875806 Z M23.2087913,139.005163 C36.0266526,139.005163 46.4175825,128.614233 46.4175825,115.796372 C46.4175825,102.97851 36.0266526,92.5875806 23.2087913,92.5875806 C10.3909298,92.5875806 0,102.97851 0,115.796372 C0,128.614233 10.3909298,139.005163 23.2087913,139.005163 Z M232.791209,139.005163 C245.60907,139.005163 256,128.614233 256,115.796372 C256,102.97851 245.60907,92.5875806 232.791209,92.5875806 C219.973347,92.5875806 209.582418,102.97851 209.582418,115.796372 C209.582418,128.614233 219.973347,139.005163 232.791209,139.005163 Z",
42035
42105
  fill: "currentcolor"
42036
42106
  }),
42037
- /* @__PURE__ */ jsx144("path", {
42107
+ /* @__PURE__ */ jsx146("path", {
42038
42108
  d: "M156.565464,70.3568084 C155.823426,62.6028163 155.445577,56.1490255 149.505494,51.6131676 C141.982638,45.8687002 133.461166,49.5960243 122.964463,45.8072968 C112.650326,43.3121427 105,34.1545727 105,23.2394367 C105,10.4046502 115.577888,0 128.626373,0 C138.29063,0 146.599638,5.70747659 150.259573,13.8825477 C155.861013,24.5221258 152.220489,35.3500418 159.258242,40.8041273 C167.591489,47.2621895 178.826167,42.5329154 191.362109,48.6517412 C195.390112,50.5026944 198.799584,53.4384578 201.202056,57.0769224 C203.604528,60.7153869 205,65.0565524 205,69.7183101 C205,80.633446 197.349674,89.7910161 187.035538,92.2861702 C176.538834,96.0748977 168.017363,92.3475736 160.494506,98.092041 C152.03503,104.551712 156.563892,115.358642 149.669352,126.774447 C145.756163,134.291567 137.802119,139.43662 128.626373,139.43662 C115.577888,139.43662 105,129.03197 105,116.197184 C105,106.873668 110.581887,98.832521 118.637891,95.1306146 C131.173833,89.0117889 142.408511,93.7410629 150.741758,87.2830007 C155.549106,83.5574243 156.565464,77.8102648 156.565464,70.3568084 Z",
42039
42109
  fill: "currentcolor"
42040
42110
  })
@@ -42044,7 +42114,7 @@ var ReactRouterIcon = (props) => {
42044
42114
  };
42045
42115
 
42046
42116
  // src/components/icons/render-server.tsx
42047
- import { jsx as jsx146, jsxs as jsxs60 } from "react/jsx-runtime";
42117
+ import { jsx as jsx147, jsxs as jsxs60 } from "react/jsx-runtime";
42048
42118
  var RenderServerIcon = (props) => {
42049
42119
  return /* @__PURE__ */ jsxs60("svg", {
42050
42120
  ...props,
@@ -42056,14 +42126,14 @@ var RenderServerIcon = (props) => {
42056
42126
  strokeLinecap: "round",
42057
42127
  strokeLinejoin: "round",
42058
42128
  children: [
42059
- /* @__PURE__ */ jsx146("rect", {
42129
+ /* @__PURE__ */ jsx147("rect", {
42060
42130
  width: "18",
42061
42131
  height: "18",
42062
42132
  x: "3",
42063
42133
  y: "3",
42064
42134
  rx: "2"
42065
42135
  }),
42066
- /* @__PURE__ */ jsx146("path", {
42136
+ /* @__PURE__ */ jsx147("path", {
42067
42137
  d: "m10 8 4 4-4 4"
42068
42138
  })
42069
42139
  ]
@@ -42071,13 +42141,13 @@ var RenderServerIcon = (props) => {
42071
42141
  };
42072
42142
 
42073
42143
  // src/components/icons/skia.tsx
42074
- import { jsx as jsx147 } from "react/jsx-runtime";
42144
+ import { jsx as jsx148 } from "react/jsx-runtime";
42075
42145
  var SkiaIcon = (props) => {
42076
- return /* @__PURE__ */ jsx147("svg", {
42146
+ return /* @__PURE__ */ jsx148("svg", {
42077
42147
  ...props,
42078
42148
  xmlns: "http://www.w3.org/2000/svg",
42079
42149
  viewBox: "0 0 576 512",
42080
- children: /* @__PURE__ */ jsx147("path", {
42150
+ children: /* @__PURE__ */ jsx148("path", {
42081
42151
  fill: "currentColor",
42082
42152
  d: "M288 400C288 461.9 237.9 512 176 512H32C14.33 512 0 497.7 0 480C0 462.3 14.33 448 32 448H36.81C54.44 448 66.4 429.1 64.59 411.6C64.2 407.8 64 403.9 64 400C64 338.1 114.1 288 176 288C178.8 288 181.5 288.1 184.3 288.3C184.1 285.7 183.1 282.1 183.1 280.3C183.1 244.6 201.1 210.1 229.1 189.1L474.3 12.25C499.7-6.279 534.9-3.526 557.2 18.74C579.4 41 582.2 76.16 563.7 101.6L386.1 345.1C365 374.9 331.4 392 295.7 392C293 392 290.3 391.9 287.7 391.7C287.9 394.5 287.1 397.2 287.1 400H288zM295.7 360C321.2 360 345.2 347.8 360.2 327.2L537.8 82.82C547.1 70.08 545.7 52.5 534.5 41.37C523.4 30.24 505.8 28.86 493.1 38.12L248.8 215.8C228.2 230.8 215.1 254.8 215.1 280.3C215.1 285.7 216.5 290.9 217.5 295.1L217.6 295.1C217.9 297.3 218.2 298.6 218.5 299.9L276.1 357.5C277.4 357.8 278.7 358.1 280 358.4L280 358.5C285.1 359.5 290.3 360 295.7 360L295.7 360zM253.5 380.1L195.9 322.5C194.5 322.2 193.2 321.8 191.9 321.6C186.7 320.5 181.4 320 176 320C131.8 320 96 355.8 96 400C96 402.8 96.14 405.6 96.43 408.3C98.15 425 93.42 441.9 83.96 455.1C74.31 468.5 58 480 36.81 480H176C220.2 480 256 444.2 256 400C256 394.6 255.5 389.3 254.4 384.1C254.2 382.8 253.9 381.5 253.5 380.1V380.1z"
42083
42153
  })
@@ -42085,13 +42155,13 @@ var SkiaIcon = (props) => {
42085
42155
  };
42086
42156
 
42087
42157
  // src/components/icons/stargazer.tsx
42088
- import { jsx as jsx148 } from "react/jsx-runtime";
42158
+ import { jsx as jsx149 } from "react/jsx-runtime";
42089
42159
  var Stargazer = (props) => {
42090
- return /* @__PURE__ */ jsx148("svg", {
42160
+ return /* @__PURE__ */ jsx149("svg", {
42091
42161
  height: "1em",
42092
42162
  viewBox: "0 0 512 512",
42093
42163
  ...props,
42094
- children: /* @__PURE__ */ jsx148("path", {
42164
+ children: /* @__PURE__ */ jsx149("path", {
42095
42165
  fill: "currentcolor",
42096
42166
  d: "M325.8 152.3c1.3 4.6 5.5 7.7 10.2 7.7s8.9-3.1 10.2-7.7L360 104l48.3-13.8c4.6-1.3 7.7-5.5 7.7-10.2s-3.1-8.9-7.7-10.2L360 56 346.2 7.7C344.9 3.1 340.7 0 336 0s-8.9 3.1-10.2 7.7L312 56 263.7 69.8c-4.6 1.3-7.7 5.5-7.7 10.2s3.1 8.9 7.7 10.2L312 104l13.8 48.3zM115.7 346.2L75.5 307l55.5-8.1c15.6-2.3 29.2-12.1 36.1-26.3l24.8-50.3 24.8 50.3c7 14.2 20.5 24 36.1 26.3l55.5 8.1-40.2 39.2c-11.3 11-16.4 26.9-13.8 42.4l9.5 55.4-49.5-26.1c-14-7.4-30.7-7.4-44.7 0L120 444l9.5-55.4c2.7-15.6-2.5-31.4-13.8-42.4zm54.7-188.8l-46.3 94L20.5 266.5C.9 269.3-7 293.5 7.2 307.4l74.9 73.2L64.5 483.9c-3.4 19.6 17.2 34.6 34.8 25.3l92.6-48.8 92.6 48.8c17.6 9.3 38.2-5.7 34.8-25.3L301.6 380.6l74.9-73.2c14.2-13.9 6.4-38.1-13.3-40.9L259.7 251.4l-46.3-94c-8.8-17.9-34.3-17.9-43.1 0zm258.4 85.8l11 38.6c1 3.6 4.4 6.2 8.2 6.2s7.1-2.5 8.2-6.2l11-38.6 38.6-11c3.6-1 6.2-4.4 6.2-8.2s-2.5-7.1-6.2-8.2l-38.6-11-11-38.6c-1-3.6-4.4-6.2-8.2-6.2s-7.1 2.5-8.2 6.2l-11 38.6-38.6 11c-3.6 1-6.2 4.4-6.2 8.2s2.5 7.1 6.2 8.2l38.6 11z"
42097
42167
  })
@@ -42099,13 +42169,13 @@ var Stargazer = (props) => {
42099
42169
  };
42100
42170
 
42101
42171
  // src/components/icons/still.tsx
42102
- import { jsx as jsx149 } from "react/jsx-runtime";
42172
+ import { jsx as jsx150 } from "react/jsx-runtime";
42103
42173
  var StillIcon = (props) => {
42104
- return /* @__PURE__ */ jsx149("svg", {
42174
+ return /* @__PURE__ */ jsx150("svg", {
42105
42175
  xmlns: "http://www.w3.org/2000/svg",
42106
42176
  viewBox: "0 0 512 512",
42107
42177
  ...props,
42108
- children: /* @__PURE__ */ jsx149("path", {
42178
+ children: /* @__PURE__ */ jsx150("path", {
42109
42179
  fill: "currentColor",
42110
42180
  d: "M324.9 157.8c-11.38-17.38-39.89-17.31-51.23-.0625L200.5 268.5L184.1 245.9C172.7 229.1 145.9 229.9 134.4 245.9l-64.52 89.16c-6.797 9.406-7.75 21.72-2.547 32C72.53 377.5 83.05 384 94.75 384h322.5c11.41 0 21.8-6.281 27.14-16.38c5.312-10 4.734-22.09-1.516-31.56L324.9 157.8zM95.8 352l62.39-87.38l29.91 41.34C191.2 310.2 196.4 313.2 201.4 312.6c5.25-.125 10.12-2.781 13.02-7.188l83.83-129.9L415 352H95.8zM447.1 32h-384C28.65 32-.0091 60.65-.0091 96v320c0 35.35 28.65 64 63.1 64h384c35.35 0 64-28.65 64-64V96C511.1 60.65 483.3 32 447.1 32zM480 416c0 17.64-14.36 32-32 32H64c-17.64 0-32-14.36-32-32V96c0-17.64 14.36-32 32-32h384c17.64 0 32 14.36 32 32V416zM144 192C170.5 192 192 170.5 192 144S170.5 96 144 96S96 117.5 96 144S117.5 192 144 192zM144 128c8.822 0 15.1 7.178 15.1 16S152.8 160 144 160S128 152.8 128 144S135.2 128 144 128z"
42111
42181
  })
@@ -42113,12 +42183,12 @@ var StillIcon = (props) => {
42113
42183
  };
42114
42184
 
42115
42185
  // src/components/icons/tiktok.tsx
42116
- import { jsx as jsx150 } from "react/jsx-runtime";
42186
+ import { jsx as jsx151 } from "react/jsx-runtime";
42117
42187
  var TikTok = (props) => {
42118
- return /* @__PURE__ */ jsx150("svg", {
42188
+ return /* @__PURE__ */ jsx151("svg", {
42119
42189
  ...props,
42120
42190
  viewBox: "0 0 448 512",
42121
- children: /* @__PURE__ */ jsx150("path", {
42191
+ children: /* @__PURE__ */ jsx151("path", {
42122
42192
  fill: "currentcolor",
42123
42193
  d: "M448 209.9a210.1 210.1 0 0 1 -122.8-39.3V349.4A162.6 162.6 0 1 1 185 188.3V278.2a74.6 74.6 0 1 0 52.2 71.2V0l88 0a121.2 121.2 0 0 0 1.9 22.2h0A122.2 122.2 0 0 0 381 102.4a121.4 121.4 0 0 0 67 20.1z"
42124
42194
  })
@@ -42126,14 +42196,14 @@ var TikTok = (props) => {
42126
42196
  };
42127
42197
 
42128
42198
  // src/components/icons/ts.tsx
42129
- import { jsx as jsx151 } from "react/jsx-runtime";
42199
+ import { jsx as jsx154 } from "react/jsx-runtime";
42130
42200
  var TypeScriptIcon = (props) => {
42131
- return /* @__PURE__ */ jsx151("svg", {
42201
+ return /* @__PURE__ */ jsx154("svg", {
42132
42202
  fill: "#000000",
42133
42203
  xmlns: "http://www.w3.org/2000/svg",
42134
42204
  viewBox: "0 0 24 24",
42135
42205
  ...props,
42136
- children: /* @__PURE__ */ jsx151("path", {
42206
+ children: /* @__PURE__ */ jsx154("path", {
42137
42207
  fill: "currentColor",
42138
42208
  d: "M3,5v14c0,1.105,0.895,2,2,2h14c1.105,0,2-0.895,2-2V5c0-1.105-0.895-2-2-2H5C3.895,3,3,3.895,3,5z M13.666,12.451h-2.118\tV19H9.841v-6.549H7.767V11h5.899V12.451z M13.998,18.626v-1.751c0,0,0.956,0.721,2.104,0.721c1.148,0,1.103-0.75,1.103-0.853\tc0-1.089-3.251-1.089-3.251-3.501c0-3.281,4.737-1.986,4.737-1.986l-0.059,1.559c0,0-0.794-0.53-1.692-0.53\tc-0.897,0-1.221,0.427-1.221,0.883c0,1.177,3.281,1.059,3.281,3.428C19,20.244,13.998,18.626,13.998,18.626z"
42139
42209
  })
@@ -42141,27 +42211,27 @@ var TypeScriptIcon = (props) => {
42141
42211
  };
42142
42212
 
42143
42213
  // src/components/icons/vercel.tsx
42144
- import { jsx as jsx154 } from "react/jsx-runtime";
42214
+ import { jsx as jsx156 } from "react/jsx-runtime";
42145
42215
  var VercelIcon = ({ style: style4 }) => {
42146
- return /* @__PURE__ */ jsx154("svg", {
42216
+ return /* @__PURE__ */ jsx156("svg", {
42147
42217
  fill: "currentcolor",
42148
42218
  viewBox: "0 0 76 65",
42149
42219
  style: style4,
42150
42220
  xmlns: "http://www.w3.org/2000/svg",
42151
- children: /* @__PURE__ */ jsx154("path", {
42221
+ children: /* @__PURE__ */ jsx156("path", {
42152
42222
  d: "M37.5274 0L75.0548 65H0L37.5274 0Z"
42153
42223
  })
42154
42224
  });
42155
42225
  };
42156
42226
 
42157
42227
  // src/components/icons/waveform.tsx
42158
- import { jsx as jsx156 } from "react/jsx-runtime";
42228
+ import { jsx as jsx157 } from "react/jsx-runtime";
42159
42229
  var Waveform = (props) => {
42160
- return /* @__PURE__ */ jsx156("svg", {
42230
+ return /* @__PURE__ */ jsx157("svg", {
42161
42231
  xmlns: "http://www.w3.org/2000/svg",
42162
42232
  viewBox: "0 0 640 512",
42163
42233
  ...props,
42164
- children: /* @__PURE__ */ jsx156("path", {
42234
+ children: /* @__PURE__ */ jsx157("path", {
42165
42235
  fill: "currentColor",
42166
42236
  d: "M224 96C215.2 96 208 103.2 208 111.1v288C208 408.8 215.2 416 223.1 416C232.8 416 240 408.8 240 400V111.1C240 103.2 232.8 96 224 96zM128 192C119.2 192 112 199.2 112 207.1V304C112 312.8 119.2 320 127.1 320S144 312.8 144 304V207.1C144 199.2 136.8 192 128 192zM32 224C23.2 224 16 231.2 16 239.1V272C16 280.8 23.2 288 31.1 288S48 280.8 48 272V239.1C48 231.2 40.8 224 32 224zM416 128C407.2 128 400 135.2 400 143.1v224C400 376.8 407.2 384 415.1 384S432 376.8 432 368V143.1C432 135.2 424.8 128 416 128zM608 224c-8.8 0-16 7.2-16 15.1V272C592 280.8 599.2 288 608 288s16-7.2 16-15.1V239.1C624 231.2 616.8 224 608 224zM512 64c-8.8 0-16 7.2-16 15.1V432C496 440.8 503.2 448 511.1 448C520.8 448 528 440.8 528 432V79.1C528 71.2 520.8 64 512 64zM320 0C311.2 0 304 7.2 304 15.1V496C304 504.8 311.2 512 319.1 512S336 504.8 336 496V15.1C336 7.2 328.8 0 320 0z"
42167
42237
  })
@@ -42169,17 +42239,17 @@ var Waveform = (props) => {
42169
42239
  };
42170
42240
 
42171
42241
  // src/components/homepage/IconForTemplate.tsx
42172
- import { jsx as jsx157 } from "react/jsx-runtime";
42242
+ import { jsx as jsx158 } from "react/jsx-runtime";
42173
42243
  var IconForTemplate = ({ template, scale: scale4 = 1 }) => {
42174
42244
  if (template.cliId === "hello-world") {
42175
- return /* @__PURE__ */ jsx157(TypeScriptIcon, {
42245
+ return /* @__PURE__ */ jsx158(TypeScriptIcon, {
42176
42246
  style: {
42177
42247
  height: scale4 * 48
42178
42248
  }
42179
42249
  });
42180
42250
  }
42181
42251
  if (template.cliId === "blank") {
42182
- return /* @__PURE__ */ jsx157(Blank, {
42252
+ return /* @__PURE__ */ jsx158(Blank, {
42183
42253
  style: {
42184
42254
  height: scale4 * 36,
42185
42255
  overflow: "visible"
@@ -42187,101 +42257,106 @@ var IconForTemplate = ({ template, scale: scale4 = 1 }) => {
42187
42257
  });
42188
42258
  }
42189
42259
  if (template.cliId === "javascript") {
42190
- return /* @__PURE__ */ jsx157(JSIcon, {
42260
+ return /* @__PURE__ */ jsx158(JSIcon, {
42191
42261
  style: {
42192
42262
  height: scale4 * 40
42193
42263
  }
42194
42264
  });
42195
42265
  }
42196
42266
  if (template.cliId === "three") {
42197
- return /* @__PURE__ */ jsx157(Cubes, {
42267
+ return /* @__PURE__ */ jsx158(Cubes, {
42198
42268
  style: {
42199
42269
  height: scale4 * 36
42200
42270
  }
42201
42271
  });
42202
42272
  }
42203
42273
  if (template.cliId === "still") {
42204
- return /* @__PURE__ */ jsx157(StillIcon, {
42274
+ return /* @__PURE__ */ jsx158(StillIcon, {
42205
42275
  style: {
42206
42276
  height: scale4 * 36
42207
42277
  }
42208
42278
  });
42209
42279
  }
42210
42280
  if (template.cliId === "audiogram") {
42211
- return /* @__PURE__ */ jsx157(Waveform, {
42281
+ return /* @__PURE__ */ jsx158(Waveform, {
42212
42282
  style: {
42213
42283
  height: scale4 * 36
42214
42284
  }
42215
42285
  });
42216
42286
  }
42217
42287
  if (template.cliId === "skia") {
42218
- return /* @__PURE__ */ jsx157(SkiaIcon, {
42288
+ return /* @__PURE__ */ jsx158(SkiaIcon, {
42219
42289
  style: {
42220
42290
  height: scale4 * 32
42221
42291
  }
42222
42292
  });
42223
42293
  }
42224
42294
  if (template.cliId === "music-visualization") {
42225
- return /* @__PURE__ */ jsx157(MusicIcon, {
42295
+ return /* @__PURE__ */ jsx158(MusicIcon, {
42226
42296
  style: {
42227
42297
  height: scale4 * 32
42228
42298
  }
42229
42299
  });
42230
42300
  }
42231
42301
  if (template.cliId === "react-router") {
42232
- return /* @__PURE__ */ jsx157(ReactRouterIcon, {
42302
+ return /* @__PURE__ */ jsx158(ReactRouterIcon, {
42233
42303
  style: {
42234
42304
  height: scale4 * 32
42235
42305
  }
42236
42306
  });
42237
42307
  }
42238
42308
  if (template.cliId === "overlay") {
42239
- return /* @__PURE__ */ jsx157(OverlayIcon, {
42309
+ return /* @__PURE__ */ jsx158(OverlayIcon, {
42240
42310
  style: { height: scale4 * 42 }
42241
42311
  });
42242
42312
  }
42243
42313
  if (template.cliId === "render-server") {
42244
- return /* @__PURE__ */ jsx157(RenderServerIcon, {
42314
+ return /* @__PURE__ */ jsx158(RenderServerIcon, {
42315
+ style: { height: scale4 * 36 }
42316
+ });
42317
+ }
42318
+ if (template.cliId === "electron") {
42319
+ return /* @__PURE__ */ jsx158(ElectronIcon, {
42245
42320
  style: { height: scale4 * 36 }
42246
42321
  });
42247
42322
  }
42248
42323
  if (template.cliId === "recorder") {
42249
- return /* @__PURE__ */ jsx157(Recorder, {
42324
+ return /* @__PURE__ */ jsx158(Recorder, {
42250
42325
  style: { height: scale4 * 36 }
42251
42326
  });
42252
42327
  }
42253
42328
  if (template.cliId === "next" || template.cliId === "next-no-tailwind" || template.cliId === "next-pages-dir") {
42254
- return /* @__PURE__ */ jsx157(NextIcon, {
42329
+ return /* @__PURE__ */ jsx158(NextIcon, {
42255
42330
  style: { height: scale4 * 36 }
42256
42331
  });
42257
42332
  }
42258
42333
  if (template.cliId === "stargazer") {
42259
- return /* @__PURE__ */ jsx157(Stargazer, {
42334
+ return /* @__PURE__ */ jsx158(Stargazer, {
42260
42335
  style: { height: scale4 * 36 }
42261
42336
  });
42262
42337
  }
42263
42338
  if (template.cliId === "tiktok") {
42264
- return /* @__PURE__ */ jsx157(TikTok, {
42339
+ return /* @__PURE__ */ jsx158(TikTok, {
42265
42340
  style: { height: scale4 * 36 }
42266
42341
  });
42267
42342
  }
42268
42343
  if (template.cliId === "code-hike") {
42269
- return /* @__PURE__ */ jsx157(CodeHike, {
42344
+ return /* @__PURE__ */ jsx158(CodeHike, {
42270
42345
  style: { height: scale4 * 36 }
42271
42346
  });
42272
42347
  }
42273
42348
  if (template.cliId === "prompt-to-video") {
42274
- return /* @__PURE__ */ jsx157(PromptToVideoIcon, {
42349
+ return /* @__PURE__ */ jsx158(PromptToVideoIcon, {
42275
42350
  style: { height: scale4 * 36 }
42276
42351
  });
42277
42352
  }
42278
42353
  if (template.cliId === "prompt-to-motion-graphics") {
42279
- return /* @__PURE__ */ jsx157(BrainIcon, {
42354
+ return /* @__PURE__ */ jsx158(BrainIcon, {
42280
42355
  style: { height: scale4 * 36 }
42281
42356
  });
42282
42357
  }
42283
42358
  if (template.cliId === "vercel") {
42284
- return /* @__PURE__ */ jsx157(VercelIcon, {
42359
+ return /* @__PURE__ */ jsx158(VercelIcon, {
42285
42360
  style: { height: scale4 * 28 }
42286
42361
  });
42287
42362
  }
@@ -42295,7 +42370,7 @@ var useMobileLayout = () => {
42295
42370
  };
42296
42371
 
42297
42372
  // src/components/homepage/MoreTemplatesButton.tsx
42298
- import { jsx as jsx158, jsxs as jsxs61 } from "react/jsx-runtime";
42373
+ import { jsx as jsx159, jsxs as jsxs61 } from "react/jsx-runtime";
42299
42374
  var icon6 = {
42300
42375
  height: 16,
42301
42376
  marginLeft: 10
@@ -42307,11 +42382,11 @@ var MoreTemplatesButton = () => {
42307
42382
  className: "right-0 border-2 rounded-full text-inherit px-4 py-2 fontbrand font-semibold text-sm flex flex-row items-center h-10",
42308
42383
  children: [
42309
42384
  mobileLayout ? "Templates" : "Find a template",
42310
- /* @__PURE__ */ jsx158("svg", {
42385
+ /* @__PURE__ */ jsx159("svg", {
42311
42386
  style: icon6,
42312
42387
  xmlns: "http://www.w3.org/2000/svg",
42313
42388
  viewBox: "0 0 448 512",
42314
- children: /* @__PURE__ */ jsx158("path", {
42389
+ children: /* @__PURE__ */ jsx159("path", {
42315
42390
  fill: "currentColor",
42316
42391
  d: "M438.6 278.6l-160 160C272.4 444.9 264.2 448 256 448s-16.38-3.125-22.62-9.375c-12.5-12.5-12.5-32.75 0-45.25L338.8 288H32C14.33 288 .0016 273.7 .0016 256S14.33 224 32 224h306.8l-105.4-105.4c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0l160 160C451.1 245.9 451.1 266.1 438.6 278.6z"
42317
42392
  })
@@ -42321,7 +42396,7 @@ var MoreTemplatesButton = () => {
42321
42396
  };
42322
42397
 
42323
42398
  // src/components/homepage/TemplateIcon.tsx
42324
- import { jsx as jsx159, jsxs as jsxs63 } from "react/jsx-runtime";
42399
+ import { jsx as jsx160, jsxs as jsxs63 } from "react/jsx-runtime";
42325
42400
  var icon7 = {
42326
42401
  display: "flex",
42327
42402
  width: 36,
@@ -42345,11 +42420,11 @@ var TemplateIcon = ({ children, label: label3 }) => {
42345
42420
  return /* @__PURE__ */ jsxs63("span", {
42346
42421
  style: outer,
42347
42422
  children: [
42348
- /* @__PURE__ */ jsx159("div", {
42423
+ /* @__PURE__ */ jsx160("div", {
42349
42424
  style: icon7,
42350
42425
  children
42351
42426
  }),
42352
- mobileLayout ? null : /* @__PURE__ */ jsx159("div", {
42427
+ mobileLayout ? null : /* @__PURE__ */ jsx160("div", {
42353
42428
  className: "text-xs fontbrand",
42354
42429
  children: label3
42355
42430
  })
@@ -42358,14 +42433,14 @@ var TemplateIcon = ({ children, label: label3 }) => {
42358
42433
  };
42359
42434
 
42360
42435
  // src/components/homepage/ChooseTemplate.tsx
42361
- import { jsx as jsx160, jsxs as jsxs65 } from "react/jsx-runtime";
42436
+ import { jsx as jsx161, jsxs as jsxs65 } from "react/jsx-runtime";
42362
42437
  var ChooseTemplate = () => {
42363
- return /* @__PURE__ */ jsx160("div", {
42438
+ return /* @__PURE__ */ jsx161("div", {
42364
42439
  style: {
42365
42440
  display: "flex",
42366
42441
  flexDirection: "column"
42367
42442
  },
42368
- children: /* @__PURE__ */ jsx160("div", {
42443
+ children: /* @__PURE__ */ jsx161("div", {
42369
42444
  style: {
42370
42445
  position: "relative",
42371
42446
  textAlign: "center"
@@ -42384,19 +42459,19 @@ var ChooseTemplate = () => {
42384
42459
  },
42385
42460
  children: [
42386
42461
  CreateVideoInternals.FEATURED_TEMPLATES.filter((f) => f.featuredOnHomePage).map((template) => {
42387
- return /* @__PURE__ */ jsx160("a", {
42462
+ return /* @__PURE__ */ jsx161("a", {
42388
42463
  className: "text-inherit no-underline",
42389
42464
  href: `/templates/${template.cliId}`,
42390
- children: /* @__PURE__ */ jsx160(TemplateIcon, {
42465
+ children: /* @__PURE__ */ jsx161(TemplateIcon, {
42391
42466
  label: template.featuredOnHomePage,
42392
- children: /* @__PURE__ */ jsx160(IconForTemplate, {
42467
+ children: /* @__PURE__ */ jsx161(IconForTemplate, {
42393
42468
  scale: 0.7,
42394
42469
  template
42395
42470
  })
42396
42471
  })
42397
42472
  }, template.cliId);
42398
42473
  }),
42399
- /* @__PURE__ */ jsx160(MoreTemplatesButton, {})
42474
+ /* @__PURE__ */ jsx161(MoreTemplatesButton, {})
42400
42475
  ]
42401
42476
  })
42402
42477
  })
@@ -42407,12 +42482,12 @@ var ChooseTemplate = () => {
42407
42482
  import { useState as useState65 } from "react";
42408
42483
 
42409
42484
  // src/components/homepage/GitHubButton.tsx
42410
- import { jsx as jsx161, jsxs as jsxs66 } from "react/jsx-runtime";
42485
+ import { jsx as jsx164, jsxs as jsxs66 } from "react/jsx-runtime";
42411
42486
  var GithubIcon = () => {
42412
- return /* @__PURE__ */ jsx161("svg", {
42487
+ return /* @__PURE__ */ jsx164("svg", {
42413
42488
  viewBox: "0 0 496 512",
42414
42489
  style: { height: 24, marginRight: 8 },
42415
- children: /* @__PURE__ */ jsx161("path", {
42490
+ children: /* @__PURE__ */ jsx164("path", {
42416
42491
  fill: "currentColor",
42417
42492
  d: "M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3.3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5.3-6.2 2.3zm44.2-1.7c-2.9.7-4.9 2.6-4.6 4.9.3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3.7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3.3 2.9 2.3 3.9 1.6 1 3.6.7 4.3-.7.7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3.7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3.7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z"
42418
42493
  })
@@ -42422,13 +42497,13 @@ var GithubButton = () => {
42422
42497
  return /* @__PURE__ */ jsxs66("div", {
42423
42498
  className: "flex flex-row items-center text-base",
42424
42499
  children: [
42425
- /* @__PURE__ */ jsx161(GithubIcon, {}),
42500
+ /* @__PURE__ */ jsx164(GithubIcon, {}),
42426
42501
  " ",
42427
- /* @__PURE__ */ jsx161("span", {
42502
+ /* @__PURE__ */ jsx164("span", {
42428
42503
  children: "GitHub"
42429
42504
  }),
42430
42505
  " ",
42431
- /* @__PURE__ */ jsx161("div", {
42506
+ /* @__PURE__ */ jsx164("div", {
42432
42507
  className: "text-xs inline-block ml-2 leading-none mt-[3px] self-center",
42433
42508
  children: "39k"
42434
42509
  })
@@ -42437,18 +42512,18 @@ var GithubButton = () => {
42437
42512
  };
42438
42513
 
42439
42514
  // src/components/homepage/GetStartedStrip.tsx
42440
- import { jsx as jsx164, jsxs as jsxs67 } from "react/jsx-runtime";
42515
+ import { jsx as jsx166, jsxs as jsxs67 } from "react/jsx-runtime";
42441
42516
  var GetStarted = () => {
42442
42517
  const [clicked, setClicked] = useState65(null);
42443
42518
  return /* @__PURE__ */ jsxs67("div", {
42444
42519
  className: "flex flex-col lg:flex-row items-center justify-center text-center w-full",
42445
42520
  children: [
42446
- /* @__PURE__ */ jsx164("div", {
42521
+ /* @__PURE__ */ jsx166("div", {
42447
42522
  className: "w-full lg:w-auto",
42448
42523
  children: /* @__PURE__ */ jsxs67("div", {
42449
42524
  className: "flex flex-row w-full relative",
42450
42525
  children: [
42451
- clicked ? /* @__PURE__ */ jsx164("div", {
42526
+ clicked ? /* @__PURE__ */ jsx166("div", {
42452
42527
  style: {
42453
42528
  animation: "click 0.7s linear",
42454
42529
  animationFillMode: "forwards"
@@ -42456,7 +42531,7 @@ var GetStarted = () => {
42456
42531
  className: "absolute z-0 top-[-10px] font-mono text-sm text-center w-full",
42457
42532
  children: "Copied!"
42458
42533
  }, clicked) : null,
42459
- /* @__PURE__ */ jsx164(Button, {
42534
+ /* @__PURE__ */ jsx166(Button, {
42460
42535
  className: "bg-[#333] text-white rounded-lg px-4 font-mono hover:[#444] cursor-pointer w-full",
42461
42536
  onClick: () => {
42462
42537
  navigator.clipboard.writeText("npx create-video@latest");
@@ -42468,59 +42543,59 @@ var GetStarted = () => {
42468
42543
  ]
42469
42544
  })
42470
42545
  }),
42471
- /* @__PURE__ */ jsx164("div", {
42546
+ /* @__PURE__ */ jsx166("div", {
42472
42547
  style: { width: 10, height: 10 }
42473
42548
  }),
42474
- /* @__PURE__ */ jsx164("div", {
42549
+ /* @__PURE__ */ jsx166("div", {
42475
42550
  className: "w-full lg:w-auto",
42476
- children: /* @__PURE__ */ jsx164(Button, {
42551
+ children: /* @__PURE__ */ jsx166(Button, {
42477
42552
  href: "/docs",
42478
42553
  className: "w-full",
42479
42554
  children: "Docs"
42480
42555
  })
42481
42556
  }),
42482
- /* @__PURE__ */ jsx164("div", {
42557
+ /* @__PURE__ */ jsx166("div", {
42483
42558
  className: "w-2 h-2"
42484
42559
  }),
42485
- /* @__PURE__ */ jsx164("div", {
42560
+ /* @__PURE__ */ jsx166("div", {
42486
42561
  className: "w-full lg:w-auto",
42487
- children: /* @__PURE__ */ jsx164(Button, {
42562
+ children: /* @__PURE__ */ jsx166(Button, {
42488
42563
  href: "https://remotion.dev/discord",
42489
42564
  target: "_blank",
42490
42565
  className: "w-full",
42491
42566
  children: "Discord"
42492
42567
  })
42493
42568
  }),
42494
- /* @__PURE__ */ jsx164("div", {
42569
+ /* @__PURE__ */ jsx166("div", {
42495
42570
  className: "w-2 h-2"
42496
42571
  }),
42497
- /* @__PURE__ */ jsx164("div", {
42572
+ /* @__PURE__ */ jsx166("div", {
42498
42573
  className: "w-full lg:w-auto",
42499
- children: /* @__PURE__ */ jsx164(Button, {
42574
+ children: /* @__PURE__ */ jsx166(Button, {
42500
42575
  href: "https://github.com/remotion-dev/remotion",
42501
42576
  target: "_blank",
42502
42577
  className: "w-full",
42503
- children: /* @__PURE__ */ jsx164(GithubButton, {})
42578
+ children: /* @__PURE__ */ jsx166(GithubButton, {})
42504
42579
  })
42505
42580
  }),
42506
42581
  " ",
42507
- /* @__PURE__ */ jsx164("div", {
42582
+ /* @__PURE__ */ jsx166("div", {
42508
42583
  className: "w-2 h-2"
42509
42584
  }),
42510
- /* @__PURE__ */ jsx164("div", {
42585
+ /* @__PURE__ */ jsx166("div", {
42511
42586
  className: "w-full lg:w-auto",
42512
42587
  children: /* @__PURE__ */ jsxs67(Button, {
42513
42588
  href: "/prompts",
42514
42589
  className: "w-full",
42515
42590
  children: [
42516
- /* @__PURE__ */ jsx164("svg", {
42591
+ /* @__PURE__ */ jsx166("svg", {
42517
42592
  width: "20",
42518
42593
  height: "20",
42519
42594
  viewBox: "0 0 149 149",
42520
42595
  fill: "none",
42521
42596
  xmlns: "http://www.w3.org/2000/svg",
42522
42597
  style: { marginRight: 8 },
42523
- children: /* @__PURE__ */ jsx164("path", {
42598
+ children: /* @__PURE__ */ jsx166("path", {
42524
42599
  d: "M29.05 98.54L58.19 82.19L58.68 80.77L58.19 79.98H56.77L51.9 79.68L35.25 79.23L20.81 78.63L6.82 77.88L3.3 77.13L0 72.78L0.340004 70.61L3.3 68.62L7.54 68.99L16.91 69.63L30.97 70.6L41.17 71.2L56.28 72.77H58.68L59.02 71.8L58.2 71.2L57.56 70.6L43.01 60.74L27.26 50.32L19.01 44.32L14.55 41.28L12.3 38.43L11.33 32.21L15.38 27.75L20.82 28.12L22.21 28.49L27.72 32.73L39.49 41.84L54.86 53.16L57.11 55.03L58.01 54.39L58.12 53.94L57.11 52.25L48.75 37.14L39.83 21.77L35.86 15.4L34.81 11.58C34.44 10.01 34.17 8.69 34.17 7.08L38.78 0.820007L41.33 0L47.48 0.820007L50.07 3.07001L53.89 11.81L60.08 25.57L69.68 44.28L72.49 49.83L73.99 54.97L74.55 56.54H75.52V55.64L76.31 45.1L77.77 32.16L79.19 15.51L79.68 10.82L82 5.2L86.61 2.16L90.21 3.88L93.17 8.12L92.76 10.86L91 22.3L87.55 40.22L85.3 52.22H86.61L88.11 50.72L94.18 42.66L104.38 29.91L108.88 24.85L114.13 19.26L117.5 16.6H123.87L128.56 23.57L126.46 30.77L119.9 39.09L114.46 46.14L106.66 56.64L101.79 65.04L102.24 65.71L103.4 65.6L121.02 61.85L130.54 60.13L141.9 58.18L147.04 60.58L147.6 63.02L145.58 68.01L133.43 71.01L119.18 73.86L97.96 78.88L97.7 79.07L98 79.44L107.56 80.34L111.65 80.56H121.66L140.3 81.95L145.17 85.17L148.09 89.11L147.6 92.11L140.1 95.93L129.98 93.53L106.36 87.91L98.26 85.89H97.14V86.56L103.89 93.16L116.26 104.33L131.75 118.73L132.54 122.29L130.55 125.1L128.45 124.8L114.84 114.56L109.59 109.95L97.7 99.94H96.91V100.99L99.65 105L114.12 126.75L114.87 133.42L113.82 135.59L110.07 136.9L105.95 136.15L97.48 124.26L88.74 110.87L81.69 98.87L80.83 99.36L76.67 144.17L74.72 146.46L70.22 148.18L66.47 145.33L64.48 140.72L66.47 131.61L68.87 119.72L70.82 110.27L72.58 98.53L73.63 94.63L73.56 94.37L72.7 94.48L63.85 106.63L50.39 124.82L39.74 136.22L37.19 137.23L32.77 134.94L33.18 130.85L35.65 127.21L50.39 108.46L59.28 96.84L65.02 90.13L64.98 89.16H64.64L25.49 114.58L18.52 115.48L15.52 112.67L15.89 108.06L17.31 106.56L29.08 98.46L29.04 98.5L29.05 98.54Z",
42525
42600
  fill: "#D97757"
42526
42601
  })
@@ -42534,11 +42609,11 @@ var GetStarted = () => {
42534
42609
  };
42535
42610
 
42536
42611
  // src/components/homepage/WriteInReact.tsx
42537
- import { jsx as jsx166, jsxs as jsxs68 } from "react/jsx-runtime";
42612
+ import { jsx as jsx167, jsxs as jsxs68 } from "react/jsx-runtime";
42538
42613
  var WriteInReact = () => {
42539
42614
  return /* @__PURE__ */ jsxs68("div", {
42540
42615
  children: [
42541
- /* @__PURE__ */ jsx166("h1", {
42616
+ /* @__PURE__ */ jsx167("h1", {
42542
42617
  className: "text-5xl lg:text-[5em] text-center fontbrand font-black leading-none ",
42543
42618
  style: {
42544
42619
  textShadow: "0 5px 30px var(--background)"
@@ -42552,81 +42627,81 @@ var WriteInReact = () => {
42552
42627
  className: "font-medium text-center text-lg",
42553
42628
  children: [
42554
42629
  "Create real MP4 videos with React. ",
42555
- /* @__PURE__ */ jsx166("br", {}),
42630
+ /* @__PURE__ */ jsx167("br", {}),
42556
42631
  "Parametrize content, render server-side and build applications."
42557
42632
  ]
42558
42633
  }),
42559
- /* @__PURE__ */ jsx166("br", {}),
42560
- /* @__PURE__ */ jsx166("div", {
42561
- children: /* @__PURE__ */ jsx166(GetStarted, {})
42634
+ /* @__PURE__ */ jsx167("br", {}),
42635
+ /* @__PURE__ */ jsx167("div", {
42636
+ children: /* @__PURE__ */ jsx167(GetStarted, {})
42562
42637
  }),
42563
- /* @__PURE__ */ jsx166("br", {}),
42564
- /* @__PURE__ */ jsx166("br", {}),
42565
- /* @__PURE__ */ jsx166(ChooseTemplate, {})
42638
+ /* @__PURE__ */ jsx167("br", {}),
42639
+ /* @__PURE__ */ jsx167("br", {}),
42640
+ /* @__PURE__ */ jsx167(ChooseTemplate, {})
42566
42641
  ]
42567
42642
  });
42568
42643
  };
42569
42644
 
42570
42645
  // src/components/Homepage.tsx
42571
- import { jsx as jsx167, jsxs as jsxs69 } from "react/jsx-runtime";
42646
+ import { jsx as jsx168, jsxs as jsxs69 } from "react/jsx-runtime";
42572
42647
  "use client";
42573
42648
  var NewLanding = ({ colorMode, setColorMode }) => {
42574
- return /* @__PURE__ */ jsx167(ColorModeProvider, {
42649
+ return /* @__PURE__ */ jsx168(ColorModeProvider, {
42575
42650
  colorMode,
42576
42651
  setColorMode,
42577
- children: /* @__PURE__ */ jsx167("div", {
42652
+ children: /* @__PURE__ */ jsx168("div", {
42578
42653
  className: "w-full relative",
42579
42654
  children: /* @__PURE__ */ jsxs69("div", {
42580
42655
  style: { overflow: "hidden" },
42581
42656
  children: [
42582
- /* @__PURE__ */ jsx167("div", {
42583
- children: /* @__PURE__ */ jsx167(BackgroundAnimation, {})
42657
+ /* @__PURE__ */ jsx168("div", {
42658
+ children: /* @__PURE__ */ jsx168(BackgroundAnimation, {})
42584
42659
  }),
42585
- /* @__PURE__ */ jsx167("br", {}),
42586
- /* @__PURE__ */ jsx167("br", {}),
42587
- /* @__PURE__ */ jsx167("br", {}),
42588
- /* @__PURE__ */ jsx167("br", {}),
42660
+ /* @__PURE__ */ jsx168("br", {}),
42661
+ /* @__PURE__ */ jsx168("br", {}),
42662
+ /* @__PURE__ */ jsx168("br", {}),
42663
+ /* @__PURE__ */ jsx168("br", {}),
42589
42664
  /* @__PURE__ */ jsxs69("div", {
42590
42665
  className: "max-w-[500px] lg:max-w-[1000px] m-auto pl-5 pr-5 overflow-x-clip md:overflow-x-visible relative",
42591
42666
  children: [
42592
- /* @__PURE__ */ jsx167(WriteInReact, {}),
42593
- /* @__PURE__ */ jsx167("br", {}),
42594
- /* @__PURE__ */ jsx167(IfYouKnowReact, {}),
42595
- /* @__PURE__ */ jsx167(ParameterizeAndEdit, {}),
42596
- /* @__PURE__ */ jsx167(RealMP4Videos, {}),
42597
- /* @__PURE__ */ jsx167("br", {}),
42598
- /* @__PURE__ */ jsx167("br", {}),
42599
- /* @__PURE__ */ jsx167("br", {}),
42600
- /* @__PURE__ */ jsx167(VideoAppsShowcase_default, {}),
42601
- /* @__PURE__ */ jsx167("br", {}),
42602
- /* @__PURE__ */ jsx167("br", {}),
42603
- /* @__PURE__ */ jsx167(Demo, {}),
42604
- /* @__PURE__ */ jsx167("br", {}),
42605
- /* @__PURE__ */ jsx167("br", {}),
42606
- /* @__PURE__ */ jsx167("br", {}),
42607
- /* @__PURE__ */ jsx167(SectionTitle, {
42667
+ /* @__PURE__ */ jsx168(WriteInReact, {}),
42668
+ /* @__PURE__ */ jsx168("br", {}),
42669
+ /* @__PURE__ */ jsx168(IfYouKnowReact, {}),
42670
+ /* @__PURE__ */ jsx168(ParameterizeAndEdit, {}),
42671
+ /* @__PURE__ */ jsx168(RealMP4Videos, {}),
42672
+ /* @__PURE__ */ jsx168("br", {}),
42673
+ /* @__PURE__ */ jsx168("br", {}),
42674
+ /* @__PURE__ */ jsx168("br", {}),
42675
+ /* @__PURE__ */ jsx168(VideoAppsShowcase_default, {}),
42676
+ /* @__PURE__ */ jsx168("br", {}),
42677
+ /* @__PURE__ */ jsx168("br", {}),
42678
+ /* @__PURE__ */ jsx168(Demo, {}),
42679
+ /* @__PURE__ */ jsx168("br", {}),
42680
+ /* @__PURE__ */ jsx168("br", {}),
42681
+ /* @__PURE__ */ jsx168("br", {}),
42682
+ /* @__PURE__ */ jsx168(SectionTitle, {
42608
42683
  children: "Pricing"
42609
42684
  }),
42610
- /* @__PURE__ */ jsx167(Pricing, {}),
42611
- /* @__PURE__ */ jsx167(TrustedByBanner_default, {}),
42612
- /* @__PURE__ */ jsx167("br", {}),
42613
- /* @__PURE__ */ jsx167(EvaluateRemotion_default, {}),
42614
- /* @__PURE__ */ jsx167("br", {}),
42615
- /* @__PURE__ */ jsx167("br", {}),
42616
- /* @__PURE__ */ jsx167("br", {}),
42617
- /* @__PURE__ */ jsx167(CommunityStats_default, {}),
42618
- /* @__PURE__ */ jsx167("br", {}),
42619
- /* @__PURE__ */ jsx167("br", {}),
42620
- /* @__PURE__ */ jsx167("br", {}),
42621
- /* @__PURE__ */ jsx167(EditorStarterSection_default, {}),
42622
- /* @__PURE__ */ jsx167("br", {}),
42623
- /* @__PURE__ */ jsx167("br", {}),
42624
- /* @__PURE__ */ jsx167("br", {}),
42625
- /* @__PURE__ */ jsx167("br", {}),
42626
- /* @__PURE__ */ jsx167(NewsletterButton, {}),
42627
- /* @__PURE__ */ jsx167("br", {}),
42628
- /* @__PURE__ */ jsx167("br", {}),
42629
- /* @__PURE__ */ jsx167("br", {})
42685
+ /* @__PURE__ */ jsx168(Pricing, {}),
42686
+ /* @__PURE__ */ jsx168(TrustedByBanner_default, {}),
42687
+ /* @__PURE__ */ jsx168("br", {}),
42688
+ /* @__PURE__ */ jsx168(EvaluateRemotion_default, {}),
42689
+ /* @__PURE__ */ jsx168("br", {}),
42690
+ /* @__PURE__ */ jsx168("br", {}),
42691
+ /* @__PURE__ */ jsx168("br", {}),
42692
+ /* @__PURE__ */ jsx168(CommunityStats_default, {}),
42693
+ /* @__PURE__ */ jsx168("br", {}),
42694
+ /* @__PURE__ */ jsx168("br", {}),
42695
+ /* @__PURE__ */ jsx168("br", {}),
42696
+ /* @__PURE__ */ jsx168(EditorStarterSection_default, {}),
42697
+ /* @__PURE__ */ jsx168("br", {}),
42698
+ /* @__PURE__ */ jsx168("br", {}),
42699
+ /* @__PURE__ */ jsx168("br", {}),
42700
+ /* @__PURE__ */ jsx168("br", {}),
42701
+ /* @__PURE__ */ jsx168(NewsletterButton, {}),
42702
+ /* @__PURE__ */ jsx168("br", {}),
42703
+ /* @__PURE__ */ jsx168("br", {}),
42704
+ /* @__PURE__ */ jsx168("br", {})
42630
42705
  ]
42631
42706
  })
42632
42707
  ]