test add temp placeholders for section, row one column and basic card

Author: yvonnetangsu

components/Storyblok/SbBasicCard.tsx

@@ -0,0 +1,19 @@
+import { storyblokEditable, type SbBlokData } from '@storyblok/react/rsc';
+import { CreateBloks } from '@/components/CreateBloks';
+
+// TODO: This is a placeholder
+export type SbBasicCardProps = {
+  blok: SbBlokData & {
+    headline?: string;
+    ctaLink?: SbBlokData[];
+  };
+}
+
+export const SbBasicCard = (props: SbBasicCardProps) => {
+  return (
+    <div {...storyblokEditable(props.blok)}>
+      <h2>{props.blok.headline}</h2>
+      <CreateBloks blokSection={props.blok.ctaLink} />
+    </div>
+  );
+};

components/Storyblok/SbRowOneColumn.tsx

@@ -0,0 +1,17 @@
+import { storyblokEditable, type SbBlokData } from '@storyblok/react/rsc';
+import { CreateBloks } from '@/components/CreateBloks';
+
+// TODO: This is a placeholder
+export type SbRowOneColumnProps = {
+  blok: SbBlokData & {
+    columnDontent: SbBlokData[];
+  };
+}
+
+export const SbRowOneColumn = (props: SbRowOneColumnProps) => {
+  return (
+    <div {...storyblokEditable(props.blok)}>
+      <CreateBloks blokSection={props.blok.columnDontent} />
+    </div>
+  );
+};

components/Storyblok/SbSection.tsx

@@ -0,0 +1,22 @@
+import { storyblokEditable, type SbBlokData } from '@storyblok/react/rsc';
+import { Container } from '@/components/Container';
+import { CreateBloks } from '@/components/CreateBloks';
+
+// TODO: This is a placeholder
+export type SbSectionProps = {
+  blok: SbBlokData & {
+    title?: string;
+    content: SbBlokData[];
+  };
+}
+
+export const SbSection = (props: SbSectionProps) => {
+  return (
+    <Container {...storyblokEditable(props.blok)} className="ood-section">
+      {props.blok.title && (
+        <h2>{props.blok.title}</h2>
+      )}
+      <CreateBloks blokSection={props.blok.content} />
+    </Container>
+  );
+};

utilities/storyblok.tsx

@@ -18,6 +18,9 @@ import { SbNavItem } from '@/components/Storyblok/SbNavItem';
 import { SbLockup } from '@/components/Storyblok/SbLockup';
 import { SbSingleColumnContent } from '@/components/Storyblok/SbSingleColumnContent';
 import { SbStoryImage } from '@/components/Storyblok/SbStoryImage';
+import { SbSection } from '@/components/Storyblok/SbSection';
+import { SbRowOneColumn } from '@/components/Storyblok/SbRowOneColumn';
+import { SbBasicCard } from '@/components/Storyblok/SbBasicCard';
 
 export const components = {
   // TODO DS-1417: Remove and clean up page
@@ -27,6 +30,8 @@ export const components = {
   ctaLink: SbCtaLink,
   navItem: SbNavItem,
   lockup: SbLockup,
+  // Cards
+  basicCard: SbBasicCard,
   // Pages
   oodCampaignPage: SbCampaignPage,
   oodInteriorPage: SbInteriorPage,
@@ -40,6 +45,8 @@ export const components = {
   localFooterPicker: SbLocalFooterPicker,
   oodLocalFooter: SbLocalFooter,
   // Layout
+  rowOneColumn: SbRowOneColumn,
+  section: SbSection,
   singleColumnContent: SbSingleColumnContent,
   // Media
   storyImage: SbStoryImage,