From ccb9b5afacf713467ae1f6bcf3ee17e2a84ce9b8 Mon Sep 17 00:00:00 2001
From: Jeppe Reinhold <jeppe@reinhold.is>
Date: Wed, 15 May 2024 11:26:06 +0200
Subject: [PATCH] Don't require of prop in Subtitle doc block

---
 code/ui/blocks/src/blocks/Subtitle.stories.tsx |  2 +-
 code/ui/blocks/src/blocks/Subtitle.tsx         | 13 +++++++++++--
 code/ui/blocks/src/blocks/Title.tsx            |  2 +-
 3 files changed, 13 insertions(+), 4 deletions(-)

diff --git a/code/ui/blocks/src/blocks/Subtitle.stories.tsx b/code/ui/blocks/src/blocks/Subtitle.stories.tsx
index 4fe4a2ef6a19..6ee1e865baba 100644
--- a/code/ui/blocks/src/blocks/Subtitle.stories.tsx
+++ b/code/ui/blocks/src/blocks/Subtitle.stories.tsx
@@ -99,6 +99,6 @@ export const OfStringMetaAttached: Story = {
   parameters: { relativeCsfPaths: ['../examples/Button.stories'], attached: true },
 };
 export const Children: Story = {
-  parameters: { relativeCsfPaths: ['../examples/Button.stories'], attached: true },
+  parameters: { relativeCsfPaths: ['../examples/Button.stories'], attached: false },
   render: () => <Subtitle>This subtitle is a string passed as a children</Subtitle>,
 };
diff --git a/code/ui/blocks/src/blocks/Subtitle.tsx b/code/ui/blocks/src/blocks/Subtitle.tsx
index 9b7556e9c7c6..055ed047cc12 100644
--- a/code/ui/blocks/src/blocks/Subtitle.tsx
+++ b/code/ui/blocks/src/blocks/Subtitle.tsx
@@ -25,8 +25,17 @@ export const Subtitle: FunctionComponent<SubtitleProps> = (props) => {
     throw new Error('Unexpected `of={undefined}`, did you mistype a CSF file reference?');
   }
 
-  const { preparedMeta } = useOf(of || 'meta', ['meta']);
-  const { componentSubtitle, docs } = preparedMeta.parameters || {};
+  let preparedMeta;
+  try {
+    preparedMeta = useOf(of || 'meta', ['meta']).preparedMeta;
+  } catch (error) {
+    if (children && !error.message.includes('did you forget to use <Meta of={} />?')) {
+      // ignore error about unattached CSF since we can still render children
+      throw error;
+    }
+  }
+
+  const { componentSubtitle, docs } = preparedMeta?.parameters || {};
 
   if (componentSubtitle) {
     deprecate(
diff --git a/code/ui/blocks/src/blocks/Title.tsx b/code/ui/blocks/src/blocks/Title.tsx
index 55b85ebad717..28ac06136ef1 100644
--- a/code/ui/blocks/src/blocks/Title.tsx
+++ b/code/ui/blocks/src/blocks/Title.tsx
@@ -42,7 +42,7 @@ export const Title: FunctionComponent<TitleProps> = (props) => {
     }
   }
 
-  const content = children || extractTitle(preparedMeta.title);
+  const content = children || extractTitle(preparedMeta?.title);
 
   return content ? <PureTitle className="sbdocs-title sb-unstyled">{content}</PureTitle> : null;
 };