@astryxdesign/cli 0.3.0-canary.c857354 → 0.3.0-canary.d52d2cb

package/assets/templates/blocks/components/AspectRatio/AspectRatioShowcase.tsx

@@ -10,19 +10,19 @@ const items = [
   {
     ratio: 1,
     label: '1 : 1',
-    src: 'https://lookaside.facebook.com/assets/astryx/light-home-square-1.png',
+    src: '/template-assets/light-home-square-1.png',
     alt: '1:1 square',
   },
   {
     ratio: 4 / 3,
     label: '4 : 3',
-    src: 'https://lookaside.facebook.com/assets/astryx/illustrative-horizontal-1.png',
+    src: '/template-assets/illustrative-horizontal-1.png',
     alt: '4:3 standard',
   },
   {
     ratio: 16 / 9,
     label: '16 : 9',
-    src: 'https://lookaside.facebook.com/assets/astryx/light-scene-horizontal-1.png',
+    src: '/template-assets/light-scene-horizontal-1.png',
     alt: '16:9 widescreen',
   },
 ];

package/assets/templates/blocks/components/AspectRatio/AspectRatioSquareImage.tsx

@@ -10,7 +10,7 @@ export default function AspectRatioSquareImage() {
     <Center width={300}>
       <AspectRatio ratio={1} fit="cover">
         <img
-          src="https://lookaside.facebook.com/assets/astryx/light-home-square-1.png"
+          src="/template-assets/light-home-square-1.png"
           alt="1:1 square"
         />
       </AspectRatio>

package/assets/templates/blocks/components/AspectRatio/AspectRatioWidescreen.tsx

@@ -10,7 +10,7 @@ export default function AspectRatioWidescreen() {
     <Center width={600}>
       <AspectRatio ratio={16 / 9} fit="cover">
         <img
-          src="https://lookaside.facebook.com/assets/astryx/light-scene-horizontal-1.png"
+          src="/template-assets/light-scene-horizontal-1.png"
           alt="16:9 widescreen"
         />
       </AspectRatio>

package/assets/templates/blocks/components/Avatar/AvatarFallbackChain.tsx

@@ -11,7 +11,7 @@ export default function AvatarFallbackChain() {
     <VStack gap={4}>
       <HStack gap={3} vAlign="center">
         <Avatar
-          src="https://lookaside.facebook.com/assets/astryx/DATA-Daniela-Gimenez.png"
+          src="/template-assets/DATA-Daniela-Gimenez.png"
           name="Daniela Gimenez"
           size="lg"
         />
@@ -19,8 +19,8 @@ export default function AvatarFallbackChain() {
       </HStack>
       <HStack gap={3} vAlign="center">
         <Avatar
-          src="https://lookaside.facebook.com/assets/astryx/does-not-exist-primary.jpg"
-          fallbackSrc="https://lookaside.facebook.com/assets/astryx/DATA-Ami-Pena.png"
+          src="/template-assets/does-not-exist-primary.jpg"
+          fallbackSrc="/template-assets/DATA-Ami-Pena.png"
           name="Invalid User"
           size="lg"
         />
@@ -28,8 +28,8 @@ export default function AvatarFallbackChain() {
       </HStack>
       <HStack gap={3} vAlign="center">
         <Avatar
-          src="https://lookaside.facebook.com/assets/astryx/does-not-exist-primary.jpg"
-          fallbackSrc="https://lookaside.facebook.com/assets/astryx/does-not-exist-fallback.jpg"
+          src="/template-assets/does-not-exist-primary.jpg"
+          fallbackSrc="/template-assets/does-not-exist-fallback.jpg"
           name="Test User"
           size="lg"
         />
@@ -37,7 +37,7 @@ export default function AvatarFallbackChain() {
       </HStack>
       <HStack gap={3} vAlign="center">
         <Avatar
-          src="https://lookaside.facebook.com/assets/astryx/does-not-exist-primary.jpg"
+          src="/template-assets/does-not-exist-primary.jpg"
           size="lg"
         />
         <Text type="supporting">All invalid, no name</Text>

package/assets/templates/blocks/components/Avatar/AvatarGroup.tsx

@@ -10,23 +10,23 @@ import {Text} from '@astryxdesign/core/Text';
 const USERS = [
   {
     name: 'Ami Pena',
-    src: 'https://lookaside.facebook.com/assets/astryx/DATA-Ami-Pena.png',
+    src: '/template-assets/DATA-Ami-Pena.png',
   },
   {
     name: 'Drew Young',
-    src: 'https://lookaside.facebook.com/assets/astryx/DATA-Drew-Young.png',
+    src: '/template-assets/DATA-Drew-Young.png',
   },
   {
     name: 'Gabriela Fernandez',
-    src: 'https://lookaside.facebook.com/assets/astryx/DATA-Gabriela-Fernandez.png',
+    src: '/template-assets/DATA-Gabriela-Fernandez.png',
   },
   {
     name: 'Jihoo Song',
-    src: 'https://lookaside.facebook.com/assets/astryx/DATA-Jihoo-Song.png',
+    src: '/template-assets/DATA-Jihoo-Song.png',
   },
   {
     name: 'Nam Tran',
-    src: 'https://lookaside.facebook.com/assets/astryx/DATA-Nam-Tran.png',
+    src: '/template-assets/DATA-Nam-Tran.png',
   },
 ];
 

package/assets/templates/blocks/components/Avatar/AvatarInteractive.tsx

@@ -11,7 +11,7 @@ export default function AvatarInteractive() {
     <Stack direction="horizontal" gap={6} vAlign="start">
       <Stack direction="vertical" gap={2} hAlign="center">
         <Avatar
-          src="https://lookaside.facebook.com/assets/astryx/DATA-Itai-Jordaan.png"
+          src="/template-assets/DATA-Itai-Jordaan.png"
           name="Itai Jordaan"
           size="xl"
           href="https://example.com/people/itai-jordaan"
@@ -22,7 +22,7 @@ export default function AvatarInteractive() {
       </Stack>
       <Stack direction="vertical" gap={2} hAlign="center">
         <Avatar
-          src="https://lookaside.facebook.com/assets/astryx/DATA-Margot-Schroder.png"
+          src="/template-assets/DATA-Margot-Schroder.png"
           name="Margot Schroder"
           size="xl"
           onClick={() => window.alert('Opening Margot Schroder’s profile')}

package/assets/templates/blocks/components/Avatar/AvatarShowcase.tsx

@@ -9,23 +9,23 @@ export default function AvatarShowcase() {
   return (
     <Stack direction="horizontal" gap={4} vAlign="center">
       <Avatar
-        src="https://lookaside.facebook.com/assets/astryx/DATA-Ana-Thomas.png"
+        src="/template-assets/DATA-Ana-Thomas.png"
         name="Ana Thomas"
         size="xl"
         status={<AvatarStatusDot variant="success" label="Online" />}
       />
       <Avatar
-        src="https://lookaside.facebook.com/assets/astryx/DATA-Drew-Young.png"
+        src="/template-assets/DATA-Drew-Young.png"
         name="Drew Young"
         size="xl"
       />
       <Avatar
-        src="https://lookaside.facebook.com/assets/astryx/DATA-Jihoo-Song.png"
+        src="/template-assets/DATA-Jihoo-Song.png"
         name="Jihoo Song"
         size="xl"
       />
       <Avatar
-        src="https://lookaside.facebook.com/assets/astryx/DATA-Nam-Tran.png"
+        src="/template-assets/DATA-Nam-Tran.png"
         name="Nam Tran"
         size="xl"
         status={<AvatarStatusDot variant="error" label="Busy" />}

package/assets/templates/blocks/components/Avatar/AvatarTooltip.tsx

@@ -15,17 +15,17 @@ export default function AvatarTooltip() {
         </Text>
         <Stack direction="horizontal" gap={4} vAlign="center">
           <Avatar
-            src="https://lookaside.facebook.com/assets/astryx/DATA-Ana-Thomas.png"
+            src="/template-assets/DATA-Ana-Thomas.png"
             name="Ana Thomas"
             size="xl"
           />
           <Avatar
-            src="https://lookaside.facebook.com/assets/astryx/DATA-Drew-Young.png"
+            src="/template-assets/DATA-Drew-Young.png"
             name="Drew Young"
             size="xl"
           />
           <Avatar
-            src="https://lookaside.facebook.com/assets/astryx/DATA-Jihoo-Song.png"
+            src="/template-assets/DATA-Jihoo-Song.png"
             name="Jihoo Song"
             size="xl"
           />
@@ -36,7 +36,7 @@ export default function AvatarTooltip() {
           Custom tooltip text
         </Text>
         <Avatar
-          src="https://lookaside.facebook.com/assets/astryx/DATA-Itai-Jordaan.png"
+          src="/template-assets/DATA-Itai-Jordaan.png"
           name="Itai Jordaan"
           size="xl"
           tooltip="Itai Jordaan · Engineering Lead"

package/assets/templates/blocks/components/Avatar/AvatarUserCard.tsx

@@ -9,19 +9,19 @@ import {Text} from '@astryxdesign/core/Text';
 const USERS = [
   {
     name: 'Itai Jordaan',
-    src: 'https://lookaside.facebook.com/assets/astryx/DATA-Itai-Jordaan.png',
+    src: '/template-assets/DATA-Itai-Jordaan.png',
     role: 'Engineering Lead',
     variant: 'success' as const,
   },
   {
     name: 'Margot Schroder',
-    src: 'https://lookaside.facebook.com/assets/astryx/DATA-Margot-Schroder.png',
+    src: '/template-assets/DATA-Margot-Schroder.png',
     role: 'Product Designer',
     variant: 'neutral' as const,
   },
   {
     name: 'Daniela Gimenez',
-    src: 'https://lookaside.facebook.com/assets/astryx/DATA-Daniela-Gimenez.png',
+    src: '/template-assets/DATA-Daniela-Gimenez.png',
     role: 'Engineering Manager',
     variant: 'error' as const,
   },

package/assets/templates/blocks/components/Avatar/AvatarWithImage.tsx

@@ -9,22 +9,22 @@ export default function AvatarWithImage() {
   return (
     <Stack direction="horizontal" gap={4} vAlign="center">
       <Avatar
-        src="https://lookaside.facebook.com/assets/astryx/DATA-Ami-Pena.png"
+        src="/template-assets/DATA-Ami-Pena.png"
         name="Ami Pena"
         size="xsm"
       />
       <Avatar
-        src="https://lookaside.facebook.com/assets/astryx/DATA-Ana-Thomas.png"
+        src="/template-assets/DATA-Ana-Thomas.png"
         name="Ana Thomas"
         size="md"
       />
       <Avatar
-        src="https://lookaside.facebook.com/assets/astryx/DATA-Daniela-Gimenez.png"
+        src="/template-assets/DATA-Daniela-Gimenez.png"
         name="Daniela Gimenez"
         size="lg"
       />
       <Avatar
-        src="https://lookaside.facebook.com/assets/astryx/DATA-Gabriela-Fernandez.png"
+        src="/template-assets/DATA-Gabriela-Fernandez.png"
         name="Gabriela Fernandez"
         size="xl"
       />

package/assets/templates/blocks/components/Avatar/AvatarWithStatus.tsx

@@ -9,19 +9,19 @@ export default function AvatarWithStatus() {
   return (
     <Stack direction="horizontal" gap={4} vAlign="center">
       <Avatar
-        src="https://lookaside.facebook.com/assets/astryx/DATA-Itai-Jordaan.png"
+        src="/template-assets/DATA-Itai-Jordaan.png"
         name="Itai Jordaan"
         size="xl"
         status={<AvatarStatusDot variant="success" label="Online" />}
       />
       <Avatar
-        src="https://lookaside.facebook.com/assets/astryx/DATA-Margot-Schroder.png"
+        src="/template-assets/DATA-Margot-Schroder.png"
         name="Margot Schroder"
         size="xl"
         status={<AvatarStatusDot variant="neutral" label="Offline" />}
       />
       <Avatar
-        src="https://lookaside.facebook.com/assets/astryx/DATA-Pablo-Morales.png"
+        src="/template-assets/DATA-Pablo-Morales.png"
         name="Pablo Morales"
         size="xl"
         status={<AvatarStatusDot variant="error" label="Busy" />}

package/assets/templates/blocks/components/ChatComposerDrawer/ChatComposerDrawerAttachments.tsx

@@ -11,31 +11,31 @@ import {Stack} from '@astryxdesign/core/Layout';
 const IMAGE_ATTACHMENTS = [
   {
     id: '1',
-    src: 'https://lookaside.facebook.com/assets/astryx/illustrative-vertical-1.png',
+    src: '/template-assets/illustrative-vertical-1.png',
     alt: 'River through a valley',
     label: 'valley.jpg',
   },
   {
     id: '2',
-    src: 'https://lookaside.facebook.com/assets/astryx/illustrative-vertical-2.png',
+    src: '/template-assets/illustrative-vertical-2.png',
     alt: 'Foggy mountain peak',
     label: 'mountain.jpg',
   },
   {
     id: '3',
-    src: 'https://lookaside.facebook.com/assets/astryx/illustrative-vertical-3.png',
+    src: '/template-assets/illustrative-vertical-3.png',
     alt: 'Golden retriever puppy',
     label: 'puppy.jpg',
   },
   {
     id: '4',
-    src: 'https://lookaside.facebook.com/assets/astryx/illustrative-vertical-4.png',
+    src: '/template-assets/illustrative-vertical-4.png',
     alt: 'Bridge at sunset',
     label: 'bridge.jpg',
   },
   {
     id: '5',
-    src: 'https://lookaside.facebook.com/assets/astryx/illustrative-vertical-5.png',
+    src: '/template-assets/illustrative-vertical-5.png',
     alt: 'Lakeside at dusk',
     label: 'lakeside.jpg',
   },

package/assets/templates/blocks/components/Lightbox/LightboxGallery.tsx

@@ -8,23 +8,23 @@ import {Thumbnail} from '@astryxdesign/core/Thumbnail';
 
 const PHOTOS = [
   {
-    src: 'https://lookaside.facebook.com/assets/astryx/Neutral-Backpack.png',
+    src: '/template-assets/Neutral-Backpack.png',
     alt: 'Backpack',
     caption: 'A backpack displayed on a neutral background.',
   },
   {
-    src: 'https://lookaside.facebook.com/assets/astryx/building.png',
+    src: '/template-assets/building.png',
     alt: 'Modern building',
     caption: 'A modern building with a contemporary architectural design.',
   },
   {
-    src: 'https://lookaside.facebook.com/assets/astryx/light-scene-horizontal-1.png',
+    src: '/template-assets/light-scene-horizontal-1.png',
     alt: 'Coastal shoreline with ocean waves',
     caption:
       'A scenic coastline with waves rolling onto a sandy beach beneath a clear sky.',
   },
   {
-    src: 'https://lookaside.facebook.com/assets/astryx/illustrative-vertical-1.png',
+    src: '/template-assets/illustrative-vertical-1.png',
     alt: 'Illustrated lakeside landscape at sunset',
     caption:
       'A stylized landscape illustration featuring pink clouds reflected over a calm lake at sunset.',

package/assets/templates/blocks/components/Lightbox/LightboxShowcase.tsx

@@ -12,7 +12,7 @@ export default function LightboxShowcase() {
         isOpen={isOpen}
         onOpenChange={setIsOpen}
         media={{
-          src: 'https://lookaside.facebook.com/assets/astryx/light-scene-horizontal-1.png',
+          src: '/template-assets/light-scene-horizontal-1.png',
           alt: 'Coastal shoreline with ocean waves',
           caption:
             'A scenic coastline with waves rolling onto a sandy beach beneath a clear sky.',

package/assets/templates/blocks/components/Lightbox/LightboxVideo.tsx

@@ -16,7 +16,7 @@ export default function LightboxVideo() {
         isOpen={isOpen}
         onOpenChange={setIsOpen}
         media={{
-          src: 'https://lookaside.facebook.com/assets/?set=astryx&name=Nature-1&density=1',
+          src: '/template-assets/Nature-1.mp4',
           alt: 'Flower blooming in time-lapse',
           type: 'video',
           caption: 'A flower blooming in time-lapse',

package/assets/templates/blocks/components/Lightbox/LightboxZoom.tsx

@@ -12,7 +12,7 @@ export default function LightboxZoom() {
   return (
     <>
       <Thumbnail
-        src="https://lookaside.facebook.com/assets/astryx/light-scene-horizontal-1.png"
+        src="/template-assets/light-scene-horizontal-1.png"
         alt="Coastal shoreline with ocean waves"
         label="Coastal shoreline with ocean waves"
         onClick={() => setIsOpen(true)}
@@ -21,7 +21,7 @@ export default function LightboxZoom() {
         isOpen={isOpen}
         onOpenChange={setIsOpen}
         media={{
-          src: 'https://lookaside.facebook.com/assets/astryx/light-scene-horizontal-1.png',
+          src: '/template-assets/light-scene-horizontal-1.png',
           alt: 'Coastal shoreline with ocean waves',
           caption:
             'A scenic coastline. Double-click to zoom in and drag to pan.',

package/assets/templates/blocks/components/MediaTheme/MediaThemeImageOverlay.tsx

@@ -10,7 +10,7 @@ import {Stack} from '@astryxdesign/core/Layout';
 import {Text} from '@astryxdesign/core/Text';
 
 const LANDSCAPE_IMAGE_URL =
-  'https://lookaside.facebook.com/assets/astryx/light-scene-horizontal-1.png';
+  '/template-assets/light-scene-horizontal-1.png';
 
 export default function MediaThemeImageOverlay() {
   return (

package/assets/templates/blocks/components/MediaTheme/MediaThemeLightScrim.tsx

@@ -10,7 +10,7 @@ import {Stack} from '@astryxdesign/core/Layout';
 import {Text} from '@astryxdesign/core/Text';
 
 const BRIGHT_ROOM_IMAGE_URL =
-  'https://lookaside.facebook.com/assets/astryx/light-home-square-1.png';
+  '/template-assets/light-home-square-1.png';
 
 export default function MediaThemeLightScrim() {
   return (

package/assets/templates/blocks/components/MediaTheme/MediaThemeShowcase.tsx

@@ -11,7 +11,7 @@ import {Badge} from '@astryxdesign/core/Badge';
 import {Icon} from '@astryxdesign/core/Icon';
 
 const SHOWCASE_IMAGE_URL =
-  'https://lookaside.facebook.com/assets/astryx/light-scene-horizontal-1.png';
+  '/template-assets/light-scene-horizontal-1.png';
 
 export default function MediaThemeShowcase() {
   return (

package/assets/templates/blocks/components/Overlay/OverlayBottomStrip.tsx

@@ -33,7 +33,7 @@ export default function OverlayBottomStrip() {
           overflow: 'clip',
         }}>
         <img
-          src="https://lookaside.facebook.com/assets/astryx/illustrative-horizontal-1.png"
+          src="/template-assets/illustrative-horizontal-1.png"
           alt="Product highlight preview"
           style={{width: '100%', height: '100%', objectFit: 'cover'}}
         />

package/assets/templates/blocks/components/Overlay/OverlayHoverReveal.tsx

@@ -28,7 +28,7 @@ export default function OverlayHoverReveal() {
       content={<Button label="Quick view" variant="secondary" size="sm" />}>
       <AspectRatio ratio={16 / 9} style={frame}>
         <img
-          src="https://lookaside.facebook.com/assets/astryx/light-working-horizontal-1.png"
+          src="/template-assets/light-working-horizontal-1.png"
           alt="Workspace preview"
           style={image}
         />

package/assets/templates/blocks/components/Overlay/OverlayShowcase.tsx

@@ -29,7 +29,7 @@ export default function OverlayShowcase() {
           overflow: 'clip',
         }}>
         <img
-          src="https://lookaside.facebook.com/assets/astryx/light-scene-horizontal-1.png"
+          src="/template-assets/light-scene-horizontal-1.png"
           alt="Abstract landscape"
           style={{width: '100%', height: '100%', objectFit: 'cover'}}
         />

package/assets/templates/blocks/components/TopNav/TopNavMegaMenu.tsx

@@ -75,7 +75,7 @@ export default function TopNavMegaMenuBlock() {
               <TopNavMegaMenuFeaturedCard
                 title="What's new in v4.0"
                 description="AI-powered analytics and real-time collaboration."
-                image="https://lookaside.facebook.com/assets/astryx/light-working-horizontal-1.png"
+                image="/template-assets/light-working-horizontal-1.png"
                 imageAlt="Team collaboration"
                 linkLabel="Read the announcement"
                 linkHref="#announcement"

package/assets/templates/pages/centered-hero/page.tsx

@@ -12,7 +12,7 @@ import {Section} from '@astryxdesign/core/Section';
 import {ArrowRightIcon} from '@heroicons/react/20/solid';
 
 const IMAGE_URL =
-  'https://lookaside.facebook.com/assets/astryx/light-scene-horizontal-1.png';
+  '/template-assets/light-scene-horizontal-1.png';
 
 const heroImage: CSSProperties = {
   width: '100%',

package/assets/templates/pages/classic-gallery/page.tsx

@@ -47,52 +47,52 @@ interface GalleryImage {
 
 const GALLERY_IMAGES: GalleryImage[] = [
   {
-    src: 'https://lookaside.facebook.com/assets/astryx/moody-scene-horizontal-1.png',
+    src: '/template-assets/moody-scene-horizontal-1.png',
     alt: 'Moody scene landscape',
     category: 'scene',
   },
   {
-    src: 'https://lookaside.facebook.com/assets/astryx/moody-lifestyle-vertical-1.png',
+    src: '/template-assets/moody-lifestyle-vertical-1.png',
     alt: 'Moody lifestyle portrait',
     category: 'lifestyle',
   },
   {
-    src: 'https://lookaside.facebook.com/assets/astryx/moody-home-vertical-1.png',
+    src: '/template-assets/moody-home-vertical-1.png',
     alt: 'Moody home interior',
     category: 'home',
   },
   {
-    src: 'https://lookaside.facebook.com/assets/astryx/moody-scene-horizontal-2.png',
+    src: '/template-assets/moody-scene-horizontal-2.png',
     alt: 'Moody scene vista',
     category: 'scene',
   },
   {
-    src: 'https://lookaside.facebook.com/assets/astryx/moody-lifestyle-vertical-2.png',
+    src: '/template-assets/moody-lifestyle-vertical-2.png',
     alt: 'Moody lifestyle scene',
     category: 'lifestyle',
   },
   {
-    src: 'https://lookaside.facebook.com/assets/astryx/moody-lifestyle-horizontal-1.png',
+    src: '/template-assets/moody-lifestyle-horizontal-1.png',
     alt: 'Moody lifestyle horizontal',
     category: 'lifestyle',
   },
   {
-    src: 'https://lookaside.facebook.com/assets/astryx/moody-scene-vertical-1.png',
+    src: '/template-assets/moody-scene-vertical-1.png',
     alt: 'Moody scene vertical',
     category: 'scene',
   },
   {
-    src: 'https://lookaside.facebook.com/assets/astryx/moody-home-vertical-2.png',
+    src: '/template-assets/moody-home-vertical-2.png',
     alt: 'Moody home vertical',
     category: 'home',
   },
   {
-    src: 'https://lookaside.facebook.com/assets/astryx/moody-home-horizontal-1.png',
+    src: '/template-assets/moody-home-horizontal-1.png',
     alt: 'Moody home horizontal',
     category: 'home',
   },
   {
-    src: 'https://lookaside.facebook.com/assets/astryx/moody-scene-vertical-2.png',
+    src: '/template-assets/moody-scene-vertical-2.png',
     alt: 'Moody scene vertical',
     category: 'scene',
   },

package/assets/templates/pages/detail-page/page.tsx

@@ -64,11 +64,11 @@ const itemsList: CSSProperties = {
 
 // ─── Product data ───────────────────────────────────────────────────────────
 const PRODUCT_IMAGES = [
-  'https://lookaside.facebook.com/assets/astryx/light-product-1.png',
-  'https://lookaside.facebook.com/assets/astryx/light-product-2.png',
-  'https://lookaside.facebook.com/assets/astryx/light-product-3.png',
-  'https://lookaside.facebook.com/assets/astryx/light-product-4.png',
-  'https://lookaside.facebook.com/assets/astryx/light-product-5.png',
+  '/template-assets/light-product-1.png',
+  '/template-assets/light-product-2.png',
+  '/template-assets/light-product-3.png',
+  '/template-assets/light-product-4.png',
+  '/template-assets/light-product-5.png',
 ];
 
 const PRODUCTS = [

package/assets/templates/pages/form-two-column/page.tsx

@@ -19,7 +19,7 @@ import {Card} from '@astryxdesign/core/Card';
 import {Selector} from '@astryxdesign/core/Selector';
 
 const ILLUSTRATION_URL =
-  'https://lookaside.facebook.com/assets/astryx/light-working-vertical-2.png';
+  '/template-assets/light-working-vertical-2.png';
 
 const INQUIRY_REASONS = [
   'New business',

package/assets/templates/pages/gallery-hero/page.tsx

@@ -13,15 +13,15 @@ import {ArrowRightIcon} from '@heroicons/react/20/solid';
 
 const IMAGES = [
   {
-    src: 'https://lookaside.facebook.com/assets/astryx/colorful-home-horizontal-1.png',
+    src: '/template-assets/colorful-home-horizontal-1.png',
     alt: 'Colorful home interior with vibrant decor',
   },
   {
-    src: 'https://lookaside.facebook.com/assets/astryx/colorful-lifestyle-horizontal-1.png',
+    src: '/template-assets/colorful-lifestyle-horizontal-1.png',
     alt: 'Colorful lifestyle portrait with natural lighting',
   },
   {
-    src: 'https://lookaside.facebook.com/assets/astryx/colorful-lifestyle-horizontal-2.png',
+    src: '/template-assets/colorful-lifestyle-horizontal-2.png',
     alt: 'Colorful lifestyle scene with warm tones',
   },
 ];