@digitalygo/create-diggocms-app 0.1.0 → 0.1.1

package/templates/with-mock/components/ExtendedText.tsx

@@ -0,0 +1,16 @@
+import type { ReactElement } from 'react';
+
+type TextProps = {
+  content?: string | null;
+  text?: string | null;
+};
+
+export function ExtendedText({ content, text }: TextProps): ReactElement | null {
+  const value = content ?? text;
+
+  if (!value) {
+    return null;
+  }
+
+  return <p className="diggo-text">{value}</p>;
+}

package/templates/with-mock/components/ExtendedVideo.tsx

@@ -0,0 +1,27 @@
+import type { VideoProps } from '@digitalygo/diggocms-sdk-core';
+import type { ReactElement } from 'react';
+
+type LegacyVideoProps = VideoProps & {
+  title?: string | null;
+};
+
+export function ExtendedVideo({
+  src,
+  poster,
+  alt,
+  title,
+}: LegacyVideoProps): ReactElement | null {
+  if (!src) {
+    return null;
+  }
+
+  return (
+    <figure className="diggo-video-block">
+      <video className="diggo-video" controls poster={poster ?? undefined}>
+        <source src={src} />
+        {alt ?? title ?? ''}
+      </video>
+      {alt || title ? <figcaption className="diggo-media-caption">{alt ?? title}</figcaption> : null}
+    </figure>
+  );
+}

package/templates/with-mock/components/server-components.ts

@@ -1,8 +1,8 @@
-// Re-export components for server-side usage (they're server-safe pure components)
 export { ExtendedTitle } from './ExtendedTitle';
-export { ExtendedSubtitle } from './ExtendedSubtitle';
 export { ExtendedImage } from './ExtendedImage';
-export { ExtendedRichtext } from './ExtendedRichtext';
+export { ExtendedText } from './ExtendedText';
+export { ExtendedVideo } from './ExtendedVideo';
+export { ExtendedGallery } from './ExtendedGallery';
 export { ExtendedCard } from './ExtendedCard';
 export { ExtendedMenuItem } from './ExtendedMenuItem';
 export { ExtendedMenuContainer } from './ExtendedMenuContainer';

package/templates/with-mock/fixtures/collection.json

@@ -1,28 +1,69 @@
 {
-  "type": "posts",
   "items": [
     {
-      "id": "1",
-      "title": "Getting Started with DiggoCMS",
-      "excerpt": "Learn how to set up your first DiggoCMS project",
-      "image": "https://via.placeholder.com/400x200/3b82f6/ffffff?text=Getting+Started"
+      "id": "item-1",
+      "title": "First Article",
+      "slug": "first-article",
+      "excerpt": "This is the first article in the collection demonstration.",
+      "image": {
+        "src": "https://images.unsplash.com/photo-1499750310107-5fef28a66643?w=400&h=200&fit=crop",
+        "alt": "Article 1 image"
+      },
+      "components": [
+        {
+          "type": "title",
+          "data": {
+            "content": "Nested Title in Article 1"
+          }
+        }
+      ]
     },
     {
-      "id": "2",
-      "title": "Building Custom Components",
-      "excerpt": "Create your own components for the SDK",
-      "image": "https://via.placeholder.com/400x200/10b981/ffffff?text=Custom+Components"
+      "id": "item-2",
+      "title": "Second Article",
+      "slug": "second-article",
+      "excerpt": "This is the second article with null image field.",
+      "image": null,
+      "components": [
+        {
+          "type": "text",
+          "data": {
+            "content": "Component with null image"
+          }
+        }
+      ]
     },
     {
-      "id": "3",
-      "title": "Working with Mock Data",
-      "excerpt": "Develop without a backend using our mock API",
-      "image": "https://via.placeholder.com/400x200/f59e0b/ffffff?text=Mock+Data"
+      "id": "item-3",
+      "title": null,
+      "slug": "third-article",
+      "excerpt": "This item has null title but still renders.",
+      "image": {
+        "src": "https://images.unsplash.com/photo-1519389950473-47ba0277781c?w=400&h=200&fit=crop",
+        "alt": "Article 3 image"
+      },
+      "components": []
+    },
+    {
+      "id": "item-4",
+      "title": "Fourth Article",
+      "slug": "fourth-article",
+      "excerpt": "Full content with all fields present.",
+      "image": {
+        "src": "https://images.unsplash.com/photo-1558655146-9f40138edfeb?w=400&h=200&fit=crop",
+        "alt": "Article 4 image"
+      },
+      "components": [
+        {
+          "type": "text",
+          "data": {
+            "content": "Additional content inside the collection item."
+          }
+        }
+      ]
     }
   ],
-  "pagination": {
-    "page": 1,
-    "totalPages": 1,
-    "totalItems": 3
-  }
+  "total": 4,
+  "page": 1,
+  "perPage": 10
 }

package/templates/with-mock/fixtures/pages/chi-siamo.json

@@ -10,27 +10,28 @@
       }
     },
     {
-      "type": "subtitle",
+      "type": "text",
       "data": {
-        "content": "About Our Company"
+        "content": "Who we are — scopri la nostra storia, i nostri valori e il modo in cui lavoriamo insieme ai clienti."
       }
     },
     {
-      "type": "richtext",
+      "type": "text",
       "data": {
-        "content": "<p>We are a team of passionate developers building the next generation of headless CMS tools. DiggoCMS provides a flexible, developer-friendly platform for content management.</p>"
+        "content": "Siamo un'azienda italiana con una passione per l'innovazione e la qualità. Dal 2010 realizziamo soluzioni digitali che aiutano le aziende a crescere nel panorama digitale moderno."
       }
     },
     {
-      "type": "subtitle",
+      "type": "text",
       "data": {
-        "content": "Our Mission"
+        "content": "Il nostro team unisce collaborazione, creatività ed eccellenza. Se stai visualizzando questa pagina, significa che la navigazione verso Chi Siamo funziona correttamente."
       }
     },
     {
-      "type": "richtext",
+      "type": "image",
       "data": {
-        "content": "<p>To simplify content management for developers while providing powerful features for content editors.</p>"
+        "src": "https://images.unsplash.com/photo-1522071820081-009f0129c71c?w=800&h=400&fit=crop",
+        "alt": "Il nostro team"
       }
     }
   ]

package/templates/with-mock/fixtures/pages/contatti.json

@@ -10,23 +10,26 @@
       }
     },
     {
-      "type": "subtitle",
+      "type": "text",
       "data": {
-        "content": "Get in Touch"
+        "content": "Contacts — siamo qui per aiutarti con domande, collaborazioni e richieste di supporto."
       }
     },
     {
-      "type": "richtext",
+      "type": "text",
       "data": {
-        "content": "<p>Have questions? We'd love to hear from you.</p><p><strong>Email:</strong> hello@example.com<br><strong>Phone:</strong> +1 234 567 890</p>"
+        "content": "Questa sezione raccoglie i recapiti principali per scriverci, chiamarci o venire a trovarci in sede. Se stai visualizzando questa pagina, la navigazione verso Contatti funziona correttamente."
       }
     },
     {
       "type": "card",
       "data": {
-        "title": "Office Location",
-        "subtitle": "Headquarters",
-        "content": "<p>123 Developer Street<br>Tech City, TC 12345<br>United States</p>"
+        "title": "Informazioni di Contatto",
+        "richtext": "Indirizzo: Via Roma 123, 00100 Roma, Italia. Email: info@example.com. Telefono: +39 06 12345678. Orari: lun-ven 9:00-18:00.",
+        "callToAction": {
+          "text": "Scrivici",
+          "url": "mailto:info@example.com"
+        }
       }
     }
   ]

package/templates/with-mock/fixtures/pages/home.json

@@ -1,61 +1,110 @@
 {
-  "id": "home",
+  "id": "page-1",
   "slug": "home",
-  "title": "Welcome to DiggoCMS",
+  "title": "Welcome to DiggoCMS Demo",
   "components": [
     {
       "type": "title",
       "data": {
-        "content": "Welcome to DiggoCMS"
+        "content": "Benvenuto su DiggoCMS Demo"
       }
     },
     {
-      "type": "subtitle",
+      "type": "text",
       "data": {
-        "content": "Your headless CMS powered by React & Next.js"
+        "content": "A demonstration of the SDK rendering capabilities built around the current component model."
       }
     },
     {
-      "type": "richtext",
+      "type": "text",
       "data": {
-        "content": "<p>This is a sample page rendered from a <strong>mock API</strong>. All content comes from JSON fixtures in the <code>fixtures/</code> directory.</p><p>The DiggoCMS SDK automatically renders components based on the page payload.</p>"
+        "content": "This page showcases the DiggoCMS SDK with extended components. All content is rendered from a JSON payload matching the CMS API format."
       }
     },
     {
       "type": "image",
       "data": {
-        "src": "https://via.placeholder.com/800x400/3b82f6/ffffff?text=DiggoCMS+Mock",
-        "alt": "DiggoCMS Mock Placeholder"
+        "src": "https://images.unsplash.com/photo-1460925895917-afdab827c52f?w=800&h=400&fit=crop",
+        "alt": "DiggoCMS Demo Placeholder"
       }
     },
     {
-      "type": "subtitle",
+      "type": "text",
       "data": {
-        "content": "Features"
+        "content": "The SDK now renders plain text, videos, galleries, and richer CMS cards with minimal custom components."
       }
     },
     {
-      "type": "card",
+      "type": "video",
       "data": {
-        "title": "Dynamic Routing",
-        "subtitle": "Built on Next.js App Router",
-        "content": "<p>Pages are rendered dynamically using the [...slug] catch-all route pattern. Each page is fetched from the CMS API.</p>"
+        "src": "https://interactive-examples.mdn.mozilla.net/media/cc0-videos/flower.mp4",
+        "poster": "https://images.unsplash.com/photo-1492691527719-9d1e07e534b4?w=800&h=450&fit=crop",
+        "alt": "Short sample video"
       }
     },
     {
-      "type": "card",
+      "type": "gallery",
       "data": {
-        "title": "Component System",
-        "subtitle": "Extensible & Type-Safe",
-        "content": "<p>Components are registered in a type-safe registry. Extend base components or create your own custom ones.</p>"
+        "items": [
+          {
+            "type": "image",
+            "order": 2,
+            "data": {
+              "src": "https://images.unsplash.com/photo-1506905925346-21bda4d32df4?w=600&h=400&fit=crop",
+              "alt": "Gallery item one"
+            }
+          },
+          {
+            "type": "video",
+            "order": 1,
+            "data": {
+              "src": "https://interactive-examples.mdn.mozilla.net/media/cc0-videos/flower.mp4",
+              "poster": "https://images.unsplash.com/photo-1518837695005-2083093ee35b?w=600&h=400&fit=crop",
+              "alt": "Gallery video item"
+            }
+          },
+          {
+            "type": "image",
+            "order": 0,
+            "data": {
+              "src": "https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=600&h=400&fit=crop",
+              "alt": "Gallery item three"
+            }
+          }
+        ]
       }
     },
     {
       "type": "card",
       "data": {
-        "title": "Mock API",
-        "subtitle": "Develop Without a Backend",
-        "content": "<p>The included mock server lets you develop your frontend without needing a real CMS API running.</p>"
+        "image": {
+          "src": "https://images.unsplash.com/photo-1551434678-e076c223a692?w=640&h=360&fit=crop",
+          "alt": "CMS card preview"
+        },
+        "title": "Feature Card",
+        "richtext": "This card demonstrates the updated CMS card shape with an image, body copy, and a call to action.",
+        "callToAction": {
+          "text": "Explore collection",
+          "url": "/collection"
+        }
+      }
+    },
+    {
+      "type": "text",
+      "data": {
+        "content": "Null value handling"
+      }
+    },
+    {
+      "type": "title",
+      "data": {
+        "content": null
+      }
+    },
+    {
+      "type": "text",
+      "data": {
+        "content": "The null title above should not render, demonstrating graceful null handling."
       }
     }
   ]

package/templates/with-mock/lib/diggo-config.ts

@@ -1,20 +1,21 @@
 import type { ComponentRegistry, NavigationRegistry, DiggoConfig } from '@digitalygo/diggocms-sdk-core';
 import {
-  ExtendedTitle,
-  ExtendedSubtitle,
   ExtendedImage,
-  ExtendedRichtext,
+  ExtendedText,
+  ExtendedVideo,
+  ExtendedGallery,
   ExtendedCard,
   ExtendedMenuItem,
   ExtendedMenuContainer,
 } from '@/components/server-components';
 
-export const componentsRegistry: ComponentRegistry = {
-  subtitle: ExtendedSubtitle,
+export const componentsRegistry = {
   image: ExtendedImage,
-  richtext: ExtendedRichtext,
+  text: ExtendedText,
+  video: ExtendedVideo,
+  gallery: ExtendedGallery,
   card: ExtendedCard,
-};
+} as ComponentRegistry;
 
 export const navigationRegistry: NavigationRegistry = {
   MenuItem: ExtendedMenuItem,