From 601c9dc60d290abc82446e5639c1880120e375a4 Mon Sep 17 00:00:00 2001
From: MinamiFunakoshiTR <minami.funakoshi@thomsonreuters.com>
Date: Thu, 13 Mar 2025 08:40:32 -0700
Subject: [PATCH 1/2] cleans up snippet props

---
 src/components/Byline/Byline.svelte | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/Byline/Byline.svelte b/src/components/Byline/Byline.svelte
index 62b1ff5d..2c534925 100644
--- a/src/components/Byline/Byline.svelte
+++ b/src/components/Byline/Byline.svelte
@@ -65,9 +65,9 @@
       const authorSlug = slugify(author.trim(), { lower: true });
       return `https://www.reuters.com/authors/${authorSlug}/`;
     },
-    byline = null,
-    published = null,
-    updated = null,
+    byline,
+    published,
+    updated,
   }: Props = $props();
 
   let alignmentClass = $derived(align === 'left' ? 'text-left' : 'text-center');

From 4d1322859eb53eaf95586e14dd5b52ab624d2215 Mon Sep 17 00:00:00 2001
From: MinamiFunakoshiTR <minami.funakoshi@thomsonreuters.com>
Date: Thu, 13 Mar 2025 12:20:38 -0700
Subject: [PATCH 2/2] adds archieml docs

---
 src/components/Byline/Byline.mdx    | 31 +++++++++++++++++++++++++++++
 src/components/Byline/Byline.svelte |  6 +++---
 2 files changed, 34 insertions(+), 3 deletions(-)

diff --git a/src/components/Byline/Byline.mdx b/src/components/Byline/Byline.mdx
index 31352eb9..dbff6ad5 100644
--- a/src/components/Byline/Byline.mdx
+++ b/src/components/Byline/Byline.mdx
@@ -25,6 +25,37 @@ The `Byline` component adds a byline, published and updated datelines to your pa
 />
 ```
 
+## Using with ArchieML docs
+
+With the Graphics Kit, you'll likely get your text value from an ArchieML doc...
+
+```yaml
+# ArchieML doc
+[authors]
+* Dea Bankova
+* Prasanta Kumar Dutta
+* Anurag Rao
+* Mariano Zafra
+[]
+publishTime: 2021-09-12T00:00:00.000Z
+updateTime: 2021-09-12T12:57:00.000Z
+```
+
+... which you'll pass to the `Byline` component.
+
+```svelte
+<script>
+  import { Byline } from '@reuters-graphics/graphics-components';
+  import content from '$locales/en/content.json';
+</script>
+
+<Byline
+  authors={content.authors}
+  publishTime={content.publishTime}
+  updateTime={content.updateTime}
+/>
+```
+
 <Canvas of={BylineStories.Demo} />
 
 ## Cutomisation
diff --git a/src/components/Byline/Byline.svelte b/src/components/Byline/Byline.svelte
index 2c534925..c904e27f 100644
--- a/src/components/Byline/Byline.svelte
+++ b/src/components/Byline/Byline.svelte
@@ -42,16 +42,16 @@
     /**
      * Optional snippet for a custom byline.
      */
-    byline?: Snippet | null;
+    byline?: Snippet;
     /**
      * Optional snippet for a custom published dateline.
      */
     // Specify that this prop should have the type of a Svelte snippet, i.e. basic html
-    published?: Snippet | null;
+    published?: Snippet;
     /**
      * Optional snippet for a custom updated dateline.
      */
-    updated?: Snippet | null;
+    updated?: Snippet;
   }
 
   let {