@linktr.ee/messaging-react 4.3.1-rc-1787556837 → 4.3.1-rc-1787557003

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@linktr.ee/messaging-react",
-  "version": "4.3.1-rc-1787556837",
+  "version": "4.3.1-rc-1787557003",
   "description": "React messaging components built on messaging-core for web applications",
   "type": "module",
   "main": "dist/index.cjs",
@@ -50,7 +50,7 @@
     "chromatic:local": "yarn storybook:build && chromatic"
   },
   "dependencies": {
-    "@linktr.ee/messaging-core": "2.5.0-rc-1787556837",
+    "@linktr.ee/messaging-core": "2.5.0-rc-1787557003",
     "@linktr.ee/messaging-taxonomy": "^0.10.0",
     "@phosphor-icons/react": "^2.1.10"
   },

package/src/components/RichCard/RichCard.stories.tsx

@@ -95,6 +95,13 @@ const COLLECTION: RichCardBaseProps = {
   imagePresentation: 'fan',
   actions: [secondaryLink('View collection', 'tr.ee/briesummer')],
 }
+const NEWLINE_SUBTITLE: RichCardBaseProps = {
+  ...OFFICIAL_WELCOME,
+  title: 'Start every conversation with a personal welcome message!',
+  subtitle:
+    '👋 Say hello as people arrive\n✨ Spark conversations\n💬 Add automated FAQs',
+  subtitleLines: 6,
+}
 
 const bothSides = (props: RichCardBaseProps) => (
   <>
@@ -113,7 +120,8 @@ const bothSides = (props: RichCardBaseProps) => (
  * The three real surfaces that converge on `linktree_rich_card`, each shown
  * Received (light) and Sent (dark). They differ only by knobs: the official
  * welcome card is `hero + primary`; a single-link broadcast is `hero +
- * secondary`; a collection is `fan + secondary`.
+ * secondary`; a collection is `fan + secondary`. A fourth row shows a
+ * newline-separated subtitle (the onboarding result-card shape).
  */
 export const Instances: StoryFn = () => (
   <Table>
@@ -131,65 +139,14 @@ export const Instances: StoryFn = () => (
         <RowLabel>Collection — fan · secondary</RowLabel>
         {bothSides(COLLECTION)}
       </tr>
-    </tbody>
-  </Table>
-)
-Instances.parameters = { chromatic: { disableSnapshot: false } }
-
-/* ── Onboarding result cards ─────────────────────────────────────────── */
-
-const RESULT_WELCOME: RichCardBaseProps = {
-  title: 'Start every conversation with a personal welcome message!',
-  subtitle:
-    '👋 Say hello as people arrive\n✨ Spark conversations\n💬 Add automated FAQs',
-  subtitleLines: 6,
-  images: [IMAGE],
-  imagePresentation: 'hero',
-  actions: [primary('Add yours now')],
-}
-const RESULT_TIPPING: RichCardBaseProps = {
-  title: 'Enable tipping and make money from your biggest supporters!',
-  subtitle:
-    '💕 Give fans a way to support\n💰 Turn support into earnings\n📈 Simple setup, lasting value',
-  subtitleLines: 6,
-  images: [IMAGE],
-  imagePresentation: 'hero',
-  actions: [primary('Enable now')],
-}
-const RESULT_SOCIAL: RichCardBaseProps = {
-  title: 'Invite your social audience to connect with you on Linktree!',
-  subtitle:
-    '🎤 Share it on socials\n🤩 Invite people to message\n🎯 Point conversations to Linktree',
-  subtitleLines: 6,
-  images: [IMAGE],
-  imagePresentation: 'hero',
-  actions: [primary('Start sharing')],
-}
-
-/**
- * The three onboarding result cards from Figma — welcome, tipping, and
- * social audience — each shown Received (light) and Sent (dark).
- */
-export const OnboardingResultCards: StoryFn = () => (
-  <Table>
-    <TableHead columns={['Received (light)', 'Sent (dark)']} />
-    <tbody>
       <tr>
-        <RowLabel>Welcome message</RowLabel>
-        {bothSides(RESULT_WELCOME)}
-      </tr>
-      <tr>
-        <RowLabel>Tipping</RowLabel>
-        {bothSides(RESULT_TIPPING)}
-      </tr>
-      <tr>
-        <RowLabel>Social audience</RowLabel>
-        {bothSides(RESULT_SOCIAL)}
+        <RowLabel>Subtitle with newlines</RowLabel>
+        {bothSides(NEWLINE_SUBTITLE)}
       </tr>
     </tbody>
   </Table>
 )
-OnboardingResultCards.parameters = { chromatic: { disableSnapshot: false } }
+Instances.parameters = { chromatic: { disableSnapshot: false } }
 
 /* ── Image presentation — hero / fan / count default ─────────────────── */