feat(docs): add template gallery page with visual previews (heygen-com#160)

* feat(docs): add template gallery page with visual previews

* fix(docs): remove invalid MDX heading anchors

* chore: retrigger CI

* feat(docs): merge gallery into templates page with hover-to-play video previews

- Consolidated gallery.mdx and templates.mdx into single templates.mdx
- Moved templates page to Getting Started section
- Added MP4 video previews rendered by hyperframes (hover to play)
- Custom JS for hover-to-play behavior (Mintlify strips JSX event handlers)
- 2-column grid for landscape, 3-column for portrait
- Remotion-style cards with gradient overlay labels

* fix(docs): update broken links after templates page move

* ci(regression): remove scripts/ from regression trigger paths

scripts/ contains dev utilities (lint, versioning, preview generation)
that don't affect the rendering engine.

Author: jrusso1020

.github/workflows/regression.yml

@@ -23,7 +23,6 @@ jobs:
               - "packages/core/**"
               - "packages/producer/**"
               - "packages/engine/**"
-              - "scripts/**"
               - "Dockerfile*"
 
   regression-shards:

docs/concepts/compositions.mdx

@@ -133,7 +133,7 @@ Compositions can expose variables for dynamic content:
 <div data-composition-id="card" data-var-title="string" data-var-color="color">
 ```
 
-Variables make compositions reusable as [templates](/guides/templates) -- the same composition can render different content by injecting variable values at render time.
+Variables make compositions reusable as [templates](/templates) -- the same composition can render different content by injecting variable values at render time.
 
 ## Listing Compositions
 
@@ -152,7 +152,7 @@ npx hyperframes compositions
   <Card title="GSAP Animation" icon="wand-magic-sparkles" href="/guides/gsap-animation">
     Add animations to your compositions with GSAP timelines
   </Card>
-  <Card title="Templates" icon="grid-2" href="/guides/templates">
+  <Card title="Templates" icon="grid-2" href="/templates">
     Start from built-in templates for common video patterns
   </Card>
   <Card title="HTML Schema Reference" icon="book" href="/reference/html-schema">

docs/docs.json

@@ -36,7 +36,7 @@
         "groups": [
           {
             "group": "Getting Started",
-            "pages": ["introduction", "quickstart"]
+            "pages": ["introduction", "quickstart", "templates"]
           },
           {
             "group": "Concepts",
@@ -51,7 +51,6 @@
             "group": "Guides",
             "pages": [
               "guides/gsap-animation",
-              "guides/templates",
               "guides/rendering",
               "guides/common-mistakes",
               "guides/troubleshooting"

docs/guides/templates.mdx

@@ -9,7 +9,7 @@ If your issue is about a specific coding mistake (animations not working, video
   <Accordion title='"No composition found"'>
     Your directory needs an `index.html` with a valid [composition](/concepts/compositions). The root element must have a [`data-composition-id`](/concepts/data-attributes#composition-attributes) attribute.
 
-    **Fix:** Run `npx hyperframes init` to create a composition from a [template](/guides/templates), or verify your `index.html` has the correct structure:
+    **Fix:** Run `npx hyperframes init` to create a composition from a [template](/templates), or verify your `index.html` has the correct structure:
 
     ```html index.html
     <div id="root" data-composition-id="my-video"