From 5d51052ea1820f28c79f7c1cbfca635b99b52da5 Mon Sep 17 00:00:00 2001
From: Mike Decker <pookmish@stanford.edu>
Date: Mon, 25 Nov 2024 09:13:46 -0800
Subject: [PATCH] accordion component

---
 src/components/paragraphs/paragraph.tsx       |   3 +
 .../stanford-faq/expand-collapse-all.tsx      |  34 ++
 .../paragraphs/stanford-faq/faq-paragraph.tsx |  40 ++
 src/lib/gql/__generated__/drupal.d.tsx        | 554 +++++++++++++++++-
 src/lib/gql/__generated__/queries.ts          |  17 +-
 src/lib/gql/fragments-paragraph.drupal.gql    |  12 +
 6 files changed, 628 insertions(+), 32 deletions(-)
 create mode 100644 src/components/paragraphs/stanford-faq/expand-collapse-all.tsx
 create mode 100644 src/components/paragraphs/stanford-faq/faq-paragraph.tsx

diff --git a/src/components/paragraphs/paragraph.tsx b/src/components/paragraphs/paragraph.tsx
index c6fe158b..c057dec7 100644
--- a/src/components/paragraphs/paragraph.tsx
+++ b/src/components/paragraphs/paragraph.tsx
@@ -15,6 +15,7 @@ import SupAuthorListParagraph from "@components/paragraphs/sup-author-list/sup-a
 import SupSearchFormParagraph from "@components/paragraphs/sup-search-form/sup-search-form-paragraph"
 import SupBlogTeaserParagraph from "@components/paragraphs/sup-blog-teaser/sup-blog-teaser-paragraph"
 import UnpublishedBanner from "@components/elements/unpublished-banner"
+import FaqParagraph from "@components/paragraphs/stanford-faq/faq-paragraph"
 
 type Props = {
   /**
@@ -70,6 +71,8 @@ const ParagraphComponent = async ({paragraph}: Props) => {
       return <SupSearchFormParagraph paragraph={paragraph} {...itemProps} />
     case "ParagraphSupBlogTeaser":
       return <SupBlogTeaserParagraph paragraph={paragraph} {...itemProps} />
+    case "ParagraphStanfordFaq":
+      return <FaqParagraph paragraph={paragraph} {...itemProps} />
   }
   console.warn(`Unknown paragraph ${paragraph.__typename}. Item ${paragraph.id}.`)
 }
diff --git a/src/components/paragraphs/stanford-faq/expand-collapse-all.tsx b/src/components/paragraphs/stanford-faq/expand-collapse-all.tsx
new file mode 100644
index 00000000..36dfbbcc
--- /dev/null
+++ b/src/components/paragraphs/stanford-faq/expand-collapse-all.tsx
@@ -0,0 +1,34 @@
+"use client"
+
+import Button from "@components/elements/button"
+import {useBoolean} from "usehooks-ts"
+import {HTMLAttributes, useEffect, useRef} from "react"
+
+type Props = HTMLAttributes<HTMLButtonElement>
+
+const ExpandCollapseAll = ({...props}: Props) => {
+  const {value: expand, toggle} = useBoolean(false)
+  const ref = useRef<HTMLButtonElement>(null)
+
+  useEffect(() => {
+    const buttons = ref.current?.parentElement?.parentElement?.getElementsByTagName("button") || []
+    for (let i = 0; i < buttons.length; i++) {
+      if (!expand && buttons[i].getAttribute("aria-expanded") === "false") {
+        buttons[i].click()
+      }
+
+      if (expand && buttons[i].getAttribute("aria-expanded") === "true") {
+        buttons[i].click()
+      }
+    }
+  }, [expand])
+
+  return (
+    // @ts-expect-error ref object type issue.
+    <Button ref={ref} buttonElem onClick={toggle} {...props}>
+      {expand ? "Expand All" : "Collapse All"}
+    </Button>
+  )
+}
+
+export default ExpandCollapseAll
diff --git a/src/components/paragraphs/stanford-faq/faq-paragraph.tsx b/src/components/paragraphs/stanford-faq/faq-paragraph.tsx
new file mode 100644
index 00000000..3f7f7a89
--- /dev/null
+++ b/src/components/paragraphs/stanford-faq/faq-paragraph.tsx
@@ -0,0 +1,40 @@
+import {HtmlHTMLAttributes} from "react"
+import {ParagraphStanfordFaq} from "@lib/gql/__generated__/drupal.d"
+import {H2} from "@components/elements/headers"
+import Wysiwyg from "@components/elements/wysiwyg"
+import Accordion from "@components/elements/accordion"
+import twMerge from "@lib/utils/twMergeConfig"
+import ExpandCollapseAll from "@components/paragraphs/stanford-faq/expand-collapse-all"
+
+type Props = HtmlHTMLAttributes<HTMLDivElement> & {
+  paragraph: ParagraphStanfordFaq
+}
+
+const FaqParagraph = ({paragraph, ...props}: Props) => {
+  return (
+    <div {...props} className={twMerge("mx-auto max-w-1200 space-y-20", props.className)}>
+      <div className="flex items-center justify-between gap-20">
+        {paragraph.suFaqHeadline && <H2>{paragraph.suFaqHeadline}</H2>}
+
+        <ExpandCollapseAll className="ml-auto" />
+      </div>
+      <Wysiwyg html={paragraph.suFaqDescription?.processed} />
+
+      <div>
+        {paragraph.suFaqQuestions?.map(question => (
+          <Accordion
+            className="border-t border-black-40 last:border-b"
+            buttonProps={{className: "mt-6"}}
+            key={question.id}
+            button={question.suAccordionTitle}
+            headingLevel={paragraph.suFaqHeadline ? "h3" : "h2"}
+          >
+            <Wysiwyg html={question.suAccordionBody.processed} />
+          </Accordion>
+        ))}
+      </div>
+    </div>
+  )
+}
+
+export default FaqParagraph
diff --git a/src/lib/gql/__generated__/drupal.d.tsx b/src/lib/gql/__generated__/drupal.d.tsx
index 15789d5b..e49e6347 100644
--- a/src/lib/gql/__generated__/drupal.d.tsx
+++ b/src/lib/gql/__generated__/drupal.d.tsx
@@ -4975,7 +4975,22 @@ export type NodeQuery = {
                 | {__typename?: "NodeSupBook"; id: string; path: string}
               > | null
             }
-          | {__typename: "ParagraphStanfordFaq"; id: string; behaviors?: string | null; status: boolean}
+          | {
+              __typename: "ParagraphStanfordFaq"
+              id: string
+              behaviors?: string | null
+              status: boolean
+              suFaqHeadline?: string | null
+              suFaqDescription?: {__typename?: "Text"; processed?: any | null} | null
+              suFaqQuestions?: Array<{
+                __typename: "ParagraphStanfordAccordion"
+                suAccordionTitle: string
+                id: string
+                behaviors?: string | null
+                status: boolean
+                suAccordionBody: {__typename?: "Text"; processed?: any | null}
+              }> | null
+            }
           | {
               __typename: "ParagraphStanfordGallery"
               id: string
@@ -5301,7 +5316,22 @@ export type NodeQuery = {
                 | {__typename?: "NodeSupBook"; id: string; path: string}
               > | null
             }
-          | {__typename: "ParagraphStanfordFaq"; id: string; behaviors?: string | null; status: boolean}
+          | {
+              __typename: "ParagraphStanfordFaq"
+              id: string
+              behaviors?: string | null
+              status: boolean
+              suFaqHeadline?: string | null
+              suFaqDescription?: {__typename?: "Text"; processed?: any | null} | null
+              suFaqQuestions?: Array<{
+                __typename: "ParagraphStanfordAccordion"
+                suAccordionTitle: string
+                id: string
+                behaviors?: string | null
+                status: boolean
+                suAccordionBody: {__typename?: "Text"; processed?: any | null}
+              }> | null
+            }
           | {
               __typename: "ParagraphStanfordGallery"
               id: string
@@ -5547,7 +5577,22 @@ export type NodeQuery = {
                 | {__typename?: "NodeSupBook"; id: string; path: string}
               > | null
             }
-          | {__typename: "ParagraphStanfordFaq"; id: string; behaviors?: string | null; status: boolean}
+          | {
+              __typename: "ParagraphStanfordFaq"
+              id: string
+              behaviors?: string | null
+              status: boolean
+              suFaqHeadline?: string | null
+              suFaqDescription?: {__typename?: "Text"; processed?: any | null} | null
+              suFaqQuestions?: Array<{
+                __typename: "ParagraphStanfordAccordion"
+                suAccordionTitle: string
+                id: string
+                behaviors?: string | null
+                status: boolean
+                suAccordionBody: {__typename?: "Text"; processed?: any | null}
+              }> | null
+            }
           | {
               __typename: "ParagraphStanfordGallery"
               id: string
@@ -5820,7 +5865,22 @@ export type NodeQuery = {
                 | {__typename?: "NodeSupBook"; id: string; path: string}
               > | null
             }
-          | {__typename: "ParagraphStanfordFaq"; id: string; behaviors?: string | null; status: boolean}
+          | {
+              __typename: "ParagraphStanfordFaq"
+              id: string
+              behaviors?: string | null
+              status: boolean
+              suFaqHeadline?: string | null
+              suFaqDescription?: {__typename?: "Text"; processed?: any | null} | null
+              suFaqQuestions?: Array<{
+                __typename: "ParagraphStanfordAccordion"
+                suAccordionTitle: string
+                id: string
+                behaviors?: string | null
+                status: boolean
+                suAccordionBody: {__typename?: "Text"; processed?: any | null}
+              }> | null
+            }
           | {
               __typename: "ParagraphStanfordGallery"
               id: string
@@ -6074,7 +6134,22 @@ export type NodeQuery = {
                 | {__typename?: "NodeSupBook"; id: string; path: string}
               > | null
             }
-          | {__typename: "ParagraphStanfordFaq"; id: string; behaviors?: string | null; status: boolean}
+          | {
+              __typename: "ParagraphStanfordFaq"
+              id: string
+              behaviors?: string | null
+              status: boolean
+              suFaqHeadline?: string | null
+              suFaqDescription?: {__typename?: "Text"; processed?: any | null} | null
+              suFaqQuestions?: Array<{
+                __typename: "ParagraphStanfordAccordion"
+                suAccordionTitle: string
+                id: string
+                behaviors?: string | null
+                status: boolean
+                suAccordionBody: {__typename?: "Text"; processed?: any | null}
+              }> | null
+            }
           | {
               __typename: "ParagraphStanfordGallery"
               id: string
@@ -6312,7 +6387,22 @@ export type NodeQuery = {
                 | {__typename?: "NodeSupBook"; id: string; path: string}
               > | null
             }
-          | {__typename: "ParagraphStanfordFaq"; id: string; behaviors?: string | null; status: boolean}
+          | {
+              __typename: "ParagraphStanfordFaq"
+              id: string
+              behaviors?: string | null
+              status: boolean
+              suFaqHeadline?: string | null
+              suFaqDescription?: {__typename?: "Text"; processed?: any | null} | null
+              suFaqQuestions?: Array<{
+                __typename: "ParagraphStanfordAccordion"
+                suAccordionTitle: string
+                id: string
+                behaviors?: string | null
+                status: boolean
+                suAccordionBody: {__typename?: "Text"; processed?: any | null}
+              }> | null
+            }
           | {
               __typename: "ParagraphStanfordGallery"
               id: string
@@ -7075,7 +7165,22 @@ export type EventSeriesQuery = {
               | {__typename?: "NodeSupBook"; id: string; path: string}
             > | null
           }
-        | {__typename: "ParagraphStanfordFaq"; id: string; behaviors?: string | null; status: boolean}
+        | {
+            __typename: "ParagraphStanfordFaq"
+            id: string
+            behaviors?: string | null
+            status: boolean
+            suFaqHeadline?: string | null
+            suFaqDescription?: {__typename?: "Text"; processed?: any | null} | null
+            suFaqQuestions?: Array<{
+              __typename: "ParagraphStanfordAccordion"
+              suAccordionTitle: string
+              id: string
+              behaviors?: string | null
+              status: boolean
+              suAccordionBody: {__typename?: "Text"; processed?: any | null}
+            }> | null
+          }
         | {
             __typename: "ParagraphStanfordGallery"
             id: string
@@ -7337,7 +7442,22 @@ export type EventsQuery = {
               | {__typename?: "NodeSupBook"; id: string; path: string}
             > | null
           }
-        | {__typename: "ParagraphStanfordFaq"; id: string; behaviors?: string | null; status: boolean}
+        | {
+            __typename: "ParagraphStanfordFaq"
+            id: string
+            behaviors?: string | null
+            status: boolean
+            suFaqHeadline?: string | null
+            suFaqDescription?: {__typename?: "Text"; processed?: any | null} | null
+            suFaqQuestions?: Array<{
+              __typename: "ParagraphStanfordAccordion"
+              suAccordionTitle: string
+              id: string
+              behaviors?: string | null
+              status: boolean
+              suAccordionBody: {__typename?: "Text"; processed?: any | null}
+            }> | null
+          }
         | {
             __typename: "ParagraphStanfordGallery"
             id: string
@@ -7670,7 +7790,22 @@ export type NewsQuery = {
               | {__typename?: "NodeSupBook"; id: string; path: string}
             > | null
           }
-        | {__typename: "ParagraphStanfordFaq"; id: string; behaviors?: string | null; status: boolean}
+        | {
+            __typename: "ParagraphStanfordFaq"
+            id: string
+            behaviors?: string | null
+            status: boolean
+            suFaqHeadline?: string | null
+            suFaqDescription?: {__typename?: "Text"; processed?: any | null} | null
+            suFaqQuestions?: Array<{
+              __typename: "ParagraphStanfordAccordion"
+              suAccordionTitle: string
+              id: string
+              behaviors?: string | null
+              status: boolean
+              suAccordionBody: {__typename?: "Text"; processed?: any | null}
+            }> | null
+          }
         | {
             __typename: "ParagraphStanfordGallery"
             id: string
@@ -7939,7 +8074,22 @@ export type BasicPagesQuery = {
               | {__typename?: "NodeSupBook"; id: string; path: string}
             > | null
           }
-        | {__typename: "ParagraphStanfordFaq"; id: string; behaviors?: string | null; status: boolean}
+        | {
+            __typename: "ParagraphStanfordFaq"
+            id: string
+            behaviors?: string | null
+            status: boolean
+            suFaqHeadline?: string | null
+            suFaqDescription?: {__typename?: "Text"; processed?: any | null} | null
+            suFaqQuestions?: Array<{
+              __typename: "ParagraphStanfordAccordion"
+              suAccordionTitle: string
+              id: string
+              behaviors?: string | null
+              status: boolean
+              suAccordionBody: {__typename?: "Text"; processed?: any | null}
+            }> | null
+          }
         | {
             __typename: "ParagraphStanfordGallery"
             id: string
@@ -8189,7 +8339,22 @@ export type PeopleQuery = {
               | {__typename?: "NodeSupBook"; id: string; path: string}
             > | null
           }
-        | {__typename: "ParagraphStanfordFaq"; id: string; behaviors?: string | null; status: boolean}
+        | {
+            __typename: "ParagraphStanfordFaq"
+            id: string
+            behaviors?: string | null
+            status: boolean
+            suFaqHeadline?: string | null
+            suFaqDescription?: {__typename?: "Text"; processed?: any | null} | null
+            suFaqQuestions?: Array<{
+              __typename: "ParagraphStanfordAccordion"
+              suAccordionTitle: string
+              id: string
+              behaviors?: string | null
+              status: boolean
+              suAccordionBody: {__typename?: "Text"; processed?: any | null}
+            }> | null
+          }
         | {
             __typename: "ParagraphStanfordGallery"
             id: string
@@ -8419,7 +8584,22 @@ export type PublicationsQuery = {
               | {__typename?: "NodeSupBook"; id: string; path: string}
             > | null
           }
-        | {__typename: "ParagraphStanfordFaq"; id: string; behaviors?: string | null; status: boolean}
+        | {
+            __typename: "ParagraphStanfordFaq"
+            id: string
+            behaviors?: string | null
+            status: boolean
+            suFaqHeadline?: string | null
+            suFaqDescription?: {__typename?: "Text"; processed?: any | null} | null
+            suFaqQuestions?: Array<{
+              __typename: "ParagraphStanfordAccordion"
+              suAccordionTitle: string
+              id: string
+              behaviors?: string | null
+              status: boolean
+              suAccordionBody: {__typename?: "Text"; processed?: any | null}
+            }> | null
+          }
         | {
             __typename: "ParagraphStanfordGallery"
             id: string
@@ -9043,7 +9223,22 @@ export type ParagraphQuery = {
           | {__typename?: "NodeSupBook"; id: string; path: string}
         > | null
       }
-    | {__typename: "ParagraphStanfordFaq"; id: string; behaviors?: string | null; status: boolean}
+    | {
+        __typename: "ParagraphStanfordFaq"
+        id: string
+        behaviors?: string | null
+        status: boolean
+        suFaqHeadline?: string | null
+        suFaqDescription?: {__typename?: "Text"; processed?: any | null} | null
+        suFaqQuestions?: Array<{
+          __typename: "ParagraphStanfordAccordion"
+          suAccordionTitle: string
+          id: string
+          behaviors?: string | null
+          status: boolean
+          suAccordionBody: {__typename?: "Text"; processed?: any | null}
+        }> | null
+      }
     | {
         __typename: "ParagraphStanfordGallery"
         id: string
@@ -10624,7 +10819,22 @@ export type FragmentNodeStanfordPageFragment = {
           | {__typename?: "NodeSupBook"; id: string; path: string}
         > | null
       }
-    | {__typename: "ParagraphStanfordFaq"; id: string; behaviors?: string | null; status: boolean}
+    | {
+        __typename: "ParagraphStanfordFaq"
+        id: string
+        behaviors?: string | null
+        status: boolean
+        suFaqHeadline?: string | null
+        suFaqDescription?: {__typename?: "Text"; processed?: any | null} | null
+        suFaqQuestions?: Array<{
+          __typename: "ParagraphStanfordAccordion"
+          suAccordionTitle: string
+          id: string
+          behaviors?: string | null
+          status: boolean
+          suAccordionBody: {__typename?: "Text"; processed?: any | null}
+        }> | null
+      }
     | {
         __typename: "ParagraphStanfordGallery"
         id: string
@@ -10964,7 +11174,22 @@ export type FragmentNodeStanfordEventFragment = {
           | {__typename?: "NodeSupBook"; id: string; path: string}
         > | null
       }
-    | {__typename: "ParagraphStanfordFaq"; id: string; behaviors?: string | null; status: boolean}
+    | {
+        __typename: "ParagraphStanfordFaq"
+        id: string
+        behaviors?: string | null
+        status: boolean
+        suFaqHeadline?: string | null
+        suFaqDescription?: {__typename?: "Text"; processed?: any | null} | null
+        suFaqQuestions?: Array<{
+          __typename: "ParagraphStanfordAccordion"
+          suAccordionTitle: string
+          id: string
+          behaviors?: string | null
+          status: boolean
+          suAccordionBody: {__typename?: "Text"; processed?: any | null}
+        }> | null
+      }
     | {
         __typename: "ParagraphStanfordGallery"
         id: string
@@ -11274,7 +11499,22 @@ export type FragmentNodeStanfordEventSeriesFragment = {
           | {__typename?: "NodeSupBook"; id: string; path: string}
         > | null
       }
-    | {__typename: "ParagraphStanfordFaq"; id: string; behaviors?: string | null; status: boolean}
+    | {
+        __typename: "ParagraphStanfordFaq"
+        id: string
+        behaviors?: string | null
+        status: boolean
+        suFaqHeadline?: string | null
+        suFaqDescription?: {__typename?: "Text"; processed?: any | null} | null
+        suFaqQuestions?: Array<{
+          __typename: "ParagraphStanfordAccordion"
+          suAccordionTitle: string
+          id: string
+          behaviors?: string | null
+          status: boolean
+          suAccordionBody: {__typename?: "Text"; processed?: any | null}
+        }> | null
+      }
     | {
         __typename: "ParagraphStanfordGallery"
         id: string
@@ -11504,7 +11744,22 @@ export type FragmentNodeStanfordNewsFragment = {
           | {__typename?: "NodeSupBook"; id: string; path: string}
         > | null
       }
-    | {__typename: "ParagraphStanfordFaq"; id: string; behaviors?: string | null; status: boolean}
+    | {
+        __typename: "ParagraphStanfordFaq"
+        id: string
+        behaviors?: string | null
+        status: boolean
+        suFaqHeadline?: string | null
+        suFaqDescription?: {__typename?: "Text"; processed?: any | null} | null
+        suFaqQuestions?: Array<{
+          __typename: "ParagraphStanfordAccordion"
+          suAccordionTitle: string
+          id: string
+          behaviors?: string | null
+          status: boolean
+          suAccordionBody: {__typename?: "Text"; processed?: any | null}
+        }> | null
+      }
     | {
         __typename: "ParagraphStanfordGallery"
         id: string
@@ -11687,7 +11942,22 @@ export type FragmentNodeStanfordPersonFragment = {
           | {__typename?: "NodeSupBook"; id: string; path: string}
         > | null
       }
-    | {__typename: "ParagraphStanfordFaq"; id: string; behaviors?: string | null; status: boolean}
+    | {
+        __typename: "ParagraphStanfordFaq"
+        id: string
+        behaviors?: string | null
+        status: boolean
+        suFaqHeadline?: string | null
+        suFaqDescription?: {__typename?: "Text"; processed?: any | null} | null
+        suFaqQuestions?: Array<{
+          __typename: "ParagraphStanfordAccordion"
+          suAccordionTitle: string
+          id: string
+          behaviors?: string | null
+          status: boolean
+          suAccordionBody: {__typename?: "Text"; processed?: any | null}
+        }> | null
+      }
     | {
         __typename: "ParagraphStanfordGallery"
         id: string
@@ -11893,7 +12163,22 @@ export type FragmentNodeStanfordPublicationFragment = {
           | {__typename?: "NodeSupBook"; id: string; path: string}
         > | null
       }
-    | {__typename: "ParagraphStanfordFaq"; id: string; behaviors?: string | null; status: boolean}
+    | {
+        __typename: "ParagraphStanfordFaq"
+        id: string
+        behaviors?: string | null
+        status: boolean
+        suFaqHeadline?: string | null
+        suFaqDescription?: {__typename?: "Text"; processed?: any | null} | null
+        suFaqQuestions?: Array<{
+          __typename: "ParagraphStanfordAccordion"
+          suAccordionTitle: string
+          id: string
+          behaviors?: string | null
+          status: boolean
+          suAccordionBody: {__typename?: "Text"; processed?: any | null}
+        }> | null
+      }
     | {
         __typename: "ParagraphStanfordGallery"
         id: string
@@ -12211,7 +12496,22 @@ type FragmentNodeUnion_NodeStanfordEvent_Fragment = {
           | {__typename?: "NodeSupBook"; id: string; path: string}
         > | null
       }
-    | {__typename: "ParagraphStanfordFaq"; id: string; behaviors?: string | null; status: boolean}
+    | {
+        __typename: "ParagraphStanfordFaq"
+        id: string
+        behaviors?: string | null
+        status: boolean
+        suFaqHeadline?: string | null
+        suFaqDescription?: {__typename?: "Text"; processed?: any | null} | null
+        suFaqQuestions?: Array<{
+          __typename: "ParagraphStanfordAccordion"
+          suAccordionTitle: string
+          id: string
+          behaviors?: string | null
+          status: boolean
+          suAccordionBody: {__typename?: "Text"; processed?: any | null}
+        }> | null
+      }
     | {
         __typename: "ParagraphStanfordGallery"
         id: string
@@ -12538,7 +12838,22 @@ type FragmentNodeUnion_NodeStanfordEventSeries_Fragment = {
           | {__typename?: "NodeSupBook"; id: string; path: string}
         > | null
       }
-    | {__typename: "ParagraphStanfordFaq"; id: string; behaviors?: string | null; status: boolean}
+    | {
+        __typename: "ParagraphStanfordFaq"
+        id: string
+        behaviors?: string | null
+        status: boolean
+        suFaqHeadline?: string | null
+        suFaqDescription?: {__typename?: "Text"; processed?: any | null} | null
+        suFaqQuestions?: Array<{
+          __typename: "ParagraphStanfordAccordion"
+          suAccordionTitle: string
+          id: string
+          behaviors?: string | null
+          status: boolean
+          suAccordionBody: {__typename?: "Text"; processed?: any | null}
+        }> | null
+      }
     | {
         __typename: "ParagraphStanfordGallery"
         id: string
@@ -12785,7 +13100,22 @@ type FragmentNodeUnion_NodeStanfordNews_Fragment = {
           | {__typename?: "NodeSupBook"; id: string; path: string}
         > | null
       }
-    | {__typename: "ParagraphStanfordFaq"; id: string; behaviors?: string | null; status: boolean}
+    | {
+        __typename: "ParagraphStanfordFaq"
+        id: string
+        behaviors?: string | null
+        status: boolean
+        suFaqHeadline?: string | null
+        suFaqDescription?: {__typename?: "Text"; processed?: any | null} | null
+        suFaqQuestions?: Array<{
+          __typename: "ParagraphStanfordAccordion"
+          suAccordionTitle: string
+          id: string
+          behaviors?: string | null
+          status: boolean
+          suAccordionBody: {__typename?: "Text"; processed?: any | null}
+        }> | null
+      }
     | {
         __typename: "ParagraphStanfordGallery"
         id: string
@@ -13059,7 +13389,22 @@ type FragmentNodeUnion_NodeStanfordPage_Fragment = {
           | {__typename?: "NodeSupBook"; id: string; path: string}
         > | null
       }
-    | {__typename: "ParagraphStanfordFaq"; id: string; behaviors?: string | null; status: boolean}
+    | {
+        __typename: "ParagraphStanfordFaq"
+        id: string
+        behaviors?: string | null
+        status: boolean
+        suFaqHeadline?: string | null
+        suFaqDescription?: {__typename?: "Text"; processed?: any | null} | null
+        suFaqQuestions?: Array<{
+          __typename: "ParagraphStanfordAccordion"
+          suAccordionTitle: string
+          id: string
+          behaviors?: string | null
+          status: boolean
+          suAccordionBody: {__typename?: "Text"; processed?: any | null}
+        }> | null
+      }
     | {
         __typename: "ParagraphStanfordGallery"
         id: string
@@ -13314,7 +13659,22 @@ type FragmentNodeUnion_NodeStanfordPerson_Fragment = {
           | {__typename?: "NodeSupBook"; id: string; path: string}
         > | null
       }
-    | {__typename: "ParagraphStanfordFaq"; id: string; behaviors?: string | null; status: boolean}
+    | {
+        __typename: "ParagraphStanfordFaq"
+        id: string
+        behaviors?: string | null
+        status: boolean
+        suFaqHeadline?: string | null
+        suFaqDescription?: {__typename?: "Text"; processed?: any | null} | null
+        suFaqQuestions?: Array<{
+          __typename: "ParagraphStanfordAccordion"
+          suAccordionTitle: string
+          id: string
+          behaviors?: string | null
+          status: boolean
+          suAccordionBody: {__typename?: "Text"; processed?: any | null}
+        }> | null
+      }
     | {
         __typename: "ParagraphStanfordGallery"
         id: string
@@ -13554,7 +13914,22 @@ type FragmentNodeUnion_NodeStanfordPublication_Fragment = {
           | {__typename?: "NodeSupBook"; id: string; path: string}
         > | null
       }
-    | {__typename: "ParagraphStanfordFaq"; id: string; behaviors?: string | null; status: boolean}
+    | {
+        __typename: "ParagraphStanfordFaq"
+        id: string
+        behaviors?: string | null
+        status: boolean
+        suFaqHeadline?: string | null
+        suFaqDescription?: {__typename?: "Text"; processed?: any | null} | null
+        suFaqQuestions?: Array<{
+          __typename: "ParagraphStanfordAccordion"
+          suAccordionTitle: string
+          id: string
+          behaviors?: string | null
+          status: boolean
+          suAccordionBody: {__typename?: "Text"; processed?: any | null}
+        }> | null
+      }
     | {
         __typename: "ParagraphStanfordGallery"
         id: string
@@ -14735,6 +15110,23 @@ export type FragmentParagraphStanfordAccordionFragment = {
   suAccordionBody: {__typename?: "Text"; processed?: any | null}
 }
 
+export type FragmentParagraphStanfordFaqFragment = {
+  __typename: "ParagraphStanfordFaq"
+  suFaqHeadline?: string | null
+  id: string
+  behaviors?: string | null
+  status: boolean
+  suFaqDescription?: {__typename?: "Text"; processed?: any | null} | null
+  suFaqQuestions?: Array<{
+    __typename: "ParagraphStanfordAccordion"
+    suAccordionTitle: string
+    id: string
+    behaviors?: string | null
+    status: boolean
+    suAccordionBody: {__typename?: "Text"; processed?: any | null}
+  }> | null
+}
+
 export type FragmentParagraphStanfordBannerFragment = {
   __typename: "ParagraphStanfordBanner"
   suBannerHeader?: string | null
@@ -15150,6 +15542,16 @@ type FragmentParagraphUnion_ParagraphStanfordFaq_Fragment = {
   id: string
   behaviors?: string | null
   status: boolean
+  suFaqHeadline?: string | null
+  suFaqDescription?: {__typename?: "Text"; processed?: any | null} | null
+  suFaqQuestions?: Array<{
+    __typename: "ParagraphStanfordAccordion"
+    suAccordionTitle: string
+    id: string
+    behaviors?: string | null
+    status: boolean
+    suAccordionBody: {__typename?: "Text"; processed?: any | null}
+  }> | null
 }
 
 type FragmentParagraphUnion_ParagraphStanfordGallery_Fragment = {
@@ -15705,7 +16107,22 @@ export type RouteQuery = {
                       | {__typename?: "NodeSupBook"; id: string; path: string}
                     > | null
                   }
-                | {__typename: "ParagraphStanfordFaq"; id: string; behaviors?: string | null; status: boolean}
+                | {
+                    __typename: "ParagraphStanfordFaq"
+                    id: string
+                    behaviors?: string | null
+                    status: boolean
+                    suFaqHeadline?: string | null
+                    suFaqDescription?: {__typename?: "Text"; processed?: any | null} | null
+                    suFaqQuestions?: Array<{
+                      __typename: "ParagraphStanfordAccordion"
+                      suAccordionTitle: string
+                      id: string
+                      behaviors?: string | null
+                      status: boolean
+                      suAccordionBody: {__typename?: "Text"; processed?: any | null}
+                    }> | null
+                  }
                 | {
                     __typename: "ParagraphStanfordGallery"
                     id: string
@@ -16053,7 +16470,22 @@ export type RouteQuery = {
                       | {__typename?: "NodeSupBook"; id: string; path: string}
                     > | null
                   }
-                | {__typename: "ParagraphStanfordFaq"; id: string; behaviors?: string | null; status: boolean}
+                | {
+                    __typename: "ParagraphStanfordFaq"
+                    id: string
+                    behaviors?: string | null
+                    status: boolean
+                    suFaqHeadline?: string | null
+                    suFaqDescription?: {__typename?: "Text"; processed?: any | null} | null
+                    suFaqQuestions?: Array<{
+                      __typename: "ParagraphStanfordAccordion"
+                      suAccordionTitle: string
+                      id: string
+                      behaviors?: string | null
+                      status: boolean
+                      suAccordionBody: {__typename?: "Text"; processed?: any | null}
+                    }> | null
+                  }
                 | {
                     __typename: "ParagraphStanfordGallery"
                     id: string
@@ -16321,7 +16753,22 @@ export type RouteQuery = {
                       | {__typename?: "NodeSupBook"; id: string; path: string}
                     > | null
                   }
-                | {__typename: "ParagraphStanfordFaq"; id: string; behaviors?: string | null; status: boolean}
+                | {
+                    __typename: "ParagraphStanfordFaq"
+                    id: string
+                    behaviors?: string | null
+                    status: boolean
+                    suFaqHeadline?: string | null
+                    suFaqDescription?: {__typename?: "Text"; processed?: any | null} | null
+                    suFaqQuestions?: Array<{
+                      __typename: "ParagraphStanfordAccordion"
+                      suAccordionTitle: string
+                      id: string
+                      behaviors?: string | null
+                      status: boolean
+                      suAccordionBody: {__typename?: "Text"; processed?: any | null}
+                    }> | null
+                  }
                 | {
                     __typename: "ParagraphStanfordGallery"
                     id: string
@@ -16640,7 +17087,22 @@ export type RouteQuery = {
                       | {__typename?: "NodeSupBook"; id: string; path: string}
                     > | null
                   }
-                | {__typename: "ParagraphStanfordFaq"; id: string; behaviors?: string | null; status: boolean}
+                | {
+                    __typename: "ParagraphStanfordFaq"
+                    id: string
+                    behaviors?: string | null
+                    status: boolean
+                    suFaqHeadline?: string | null
+                    suFaqDescription?: {__typename?: "Text"; processed?: any | null} | null
+                    suFaqQuestions?: Array<{
+                      __typename: "ParagraphStanfordAccordion"
+                      suAccordionTitle: string
+                      id: string
+                      behaviors?: string | null
+                      status: boolean
+                      suAccordionBody: {__typename?: "Text"; processed?: any | null}
+                    }> | null
+                  }
                 | {
                     __typename: "ParagraphStanfordGallery"
                     id: string
@@ -16939,7 +17401,22 @@ export type RouteQuery = {
                       | {__typename?: "NodeSupBook"; id: string; path: string}
                     > | null
                   }
-                | {__typename: "ParagraphStanfordFaq"; id: string; behaviors?: string | null; status: boolean}
+                | {
+                    __typename: "ParagraphStanfordFaq"
+                    id: string
+                    behaviors?: string | null
+                    status: boolean
+                    suFaqHeadline?: string | null
+                    suFaqDescription?: {__typename?: "Text"; processed?: any | null} | null
+                    suFaqQuestions?: Array<{
+                      __typename: "ParagraphStanfordAccordion"
+                      suAccordionTitle: string
+                      id: string
+                      behaviors?: string | null
+                      status: boolean
+                      suAccordionBody: {__typename?: "Text"; processed?: any | null}
+                    }> | null
+                  }
                 | {
                     __typename: "ParagraphStanfordGallery"
                     id: string
@@ -17203,7 +17680,22 @@ export type RouteQuery = {
                       | {__typename?: "NodeSupBook"; id: string; path: string}
                     > | null
                   }
-                | {__typename: "ParagraphStanfordFaq"; id: string; behaviors?: string | null; status: boolean}
+                | {
+                    __typename: "ParagraphStanfordFaq"
+                    id: string
+                    behaviors?: string | null
+                    status: boolean
+                    suFaqHeadline?: string | null
+                    suFaqDescription?: {__typename?: "Text"; processed?: any | null} | null
+                    suFaqQuestions?: Array<{
+                      __typename: "ParagraphStanfordAccordion"
+                      suAccordionTitle: string
+                      id: string
+                      behaviors?: string | null
+                      status: boolean
+                      suAccordionBody: {__typename?: "Text"; processed?: any | null}
+                    }> | null
+                  }
                 | {
                     __typename: "ParagraphStanfordGallery"
                     id: string
diff --git a/src/lib/gql/__generated__/queries.ts b/src/lib/gql/__generated__/queries.ts
index 39de80ec..50cc9bfb 100644
--- a/src/lib/gql/__generated__/queries.ts
+++ b/src/lib/gql/__generated__/queries.ts
@@ -536,6 +536,19 @@ export const FragmentParagraphSupBlogTeaserFragmentDoc = gql`
     ${FragmentParagraphInterfaceFragmentDoc}
 ${FragmentParagraphSupBlogFragmentDoc}
 ${FragmentLinkFragmentDoc}`;
+export const FragmentParagraphStanfordFaqFragmentDoc = gql`
+    fragment FragmentParagraphStanfordFaq on ParagraphStanfordFaq {
+  ...FragmentParagraphInterface
+  suFaqHeadline
+  suFaqDescription {
+    processed
+  }
+  suFaqQuestions {
+    ...FragmentParagraphStanfordAccordion
+  }
+}
+    ${FragmentParagraphInterfaceFragmentDoc}
+${FragmentParagraphStanfordAccordionFragmentDoc}`;
 export const FragmentParagraphUnionFragmentDoc = gql`
     fragment FragmentParagraphUnion on ParagraphUnion {
   ...FragmentParagraphInterface
@@ -554,6 +567,7 @@ export const FragmentParagraphUnionFragmentDoc = gql`
   ...FragmentParagraphSupAuthorList
   ...FragmentParagraphSupSearchForm
   ...FragmentParagraphSupBlogTeaser
+  ...FragmentParagraphStanfordFaq
 }
     ${FragmentParagraphInterfaceFragmentDoc}
 ${FragmentParagraphStanfordAccordionFragmentDoc}
@@ -570,7 +584,8 @@ ${FragmentParagraphSupCarouselFragmentDoc}
 ${FragmentParagraphSupFileListFragmentDoc}
 ${FragmentParagraphSupAuthorListFragmentDoc}
 ${FragmentParagraphSupSearchFormFragmentDoc}
-${FragmentParagraphSupBlogTeaserFragmentDoc}`;
+${FragmentParagraphSupBlogTeaserFragmentDoc}
+${FragmentParagraphStanfordFaqFragmentDoc}`;
 export const FragmentSmartDateTypeFragmentDoc = gql`
     fragment FragmentSmartDateType on SmartDateType {
   value
diff --git a/src/lib/gql/fragments-paragraph.drupal.gql b/src/lib/gql/fragments-paragraph.drupal.gql
index cec4246c..a0d60a8b 100644
--- a/src/lib/gql/fragments-paragraph.drupal.gql
+++ b/src/lib/gql/fragments-paragraph.drupal.gql
@@ -13,6 +13,17 @@ fragment FragmentParagraphStanfordAccordion on ParagraphStanfordAccordion {
   suAccordionTitle
 }
 
+fragment FragmentParagraphStanfordFaq on ParagraphStanfordFaq {
+  ...FragmentParagraphInterface
+  suFaqHeadline
+  suFaqDescription {
+    processed
+  }
+  suFaqQuestions {
+    ...FragmentParagraphStanfordAccordion
+  }
+}
+
 fragment FragmentParagraphStanfordBanner on ParagraphStanfordBanner {
   ...FragmentParagraphInterface
   suBannerHeader
@@ -264,4 +275,5 @@ fragment FragmentParagraphUnion on ParagraphUnion {
   ...FragmentParagraphSupAuthorList
   ...FragmentParagraphSupSearchForm
   ...FragmentParagraphSupBlogTeaser
+  ...FragmentParagraphStanfordFaq
 }