Add teaser and list behaviors

app/search/algolia-search.tsx

@@ -97,12 +97,8 @@ const SearchBox = (props?: UseSearchBoxProps) => {
   const [inputValue, setInputValue] = useState<string>(query);
   const inputRef = useRef<HTMLInputElement>(null);
   const inputId = useId();
-
   const isSearchStalled = status === 'stalled';
-
-  useEffect(() => {
-    if (query) router.replace(`?q=${query}`, {scroll: false})
-  }, [router, query])
+  router.replace(query ? `?q=${query}` : '?', {scroll: false})
 
   return (
     <form

package.json

@@ -16,10 +16,10 @@
     "@formkit/auto-animate": "^0.8.1",
     "@heroicons/react": "^2.1.1",
     "@js-temporal/polyfill": "^0.4.4",
-    "@mui/base": "^5.0.0-beta.33",
+    "@mui/base": "^5.0.0-beta.37",
     "@next/third-parties": "^14.1.0",
     "@tailwindcss/container-queries": "^0.1.1",
-    "@types/node": "^20.11.20",
+    "@types/node": "^20.11.22",
     "@types/react": "^18.2.60",
     "@types/react-dom": "^18.2.19",
     "@uidotdev/usehooks": "^2.4.1",
@@ -42,9 +42,9 @@
     "qs": "^6.11.2",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "react-focus-lock": "^2.11.1",
-    "react-instantsearch": "^7.6.0",
-    "react-instantsearch-nextjs": "^0.1.13",
+    "react-focus-lock": "^2.11.2",
+    "react-instantsearch": "^7.7.0",
+    "react-instantsearch-nextjs": "^0.1.14",
     "react-tiny-oembed": "^1.1.0",
     "sharp": "^0.33.2",
     "tailwind-merge": "^2.2.1",

src/components/paragraphs/stanford-entity/entity-paragraph.tsx

@@ -4,13 +4,15 @@ import Button from "@components/elements/button";
 import {H2} from "@components/elements/headers";
 import {HtmlHTMLAttributes} from "react";
 import {ParagraphStanfordEntity} from "@lib/gql/__generated__/drupal.d";
+import {twMerge} from "tailwind-merge";
+import {getParagraphBehaviors} from "@components/paragraphs/get-paragraph-behaviors";
 
 type Props = HtmlHTMLAttributes<HTMLDivElement> & {
   paragraph: ParagraphStanfordEntity
 }
 
 const EntityParagraph = async ({paragraph, ...props}: Props) => {
-
+  const behaviors = getParagraphBehaviors(paragraph);
   const entities = paragraph.suEntityItem || [];
   const gridCols = [
     'lg:grid-cols-3',
@@ -22,7 +24,9 @@ const EntityParagraph = async ({paragraph, ...props}: Props) => {
   return (
     <div className="centered lg:max-w-[980px] flex flex-col gap-10 mb-20" {...props}>
       {paragraph.suEntityHeadline &&
-        <H2 className="text-center">{paragraph.suEntityHeadline}</H2>
+        <H2 className={twMerge("text-center", behaviors.stanford_teaser?.hide_heading && "sr-only")}>
+          {paragraph.suEntityHeadline}
+        </H2>
       }
 
       {paragraph.suEntityDescription?.processed &&

src/components/paragraphs/stanford-lists/list-paragraph.tsx

@@ -13,6 +13,7 @@ import {
 import {getParagraphBehaviors} from "@components/paragraphs/get-paragraph-behaviors";
 import {graphqlClient} from "@lib/gql/fetcher";
 import {buildHeaders} from "@lib/drupal/utils";
+import {twMerge} from "tailwind-merge";
 
 type Props = HtmlHTMLAttributes<HTMLDivElement> & {
   paragraph: ParagraphStanfordList
@@ -29,7 +30,9 @@ const ListParagraph = async ({paragraph, ...props}: Props) => {
   return (
     <div className="centered lg:max-w-[980px] flex flex-col gap-10 mb-20" {...props}>
       {paragraph.suListHeadline &&
-        <H2 className="text-center">{paragraph.suListHeadline}</H2>
+        <H2 className={twMerge("text-center", behaviors.list_paragraph?.hide_heading && "sr-only")}>
+          {paragraph.suListHeadline}
+        </H2>
       }
       {paragraph.suListDescription?.processed &&
         <Wysiwyg html={paragraph.suListDescription.processed}/>

src/lib/drupal/drupal-jsonapi.d.tsx

@@ -8,6 +8,7 @@ export type LayoutParagraphBehaviors = {
 export type ListParagraphBehaviors = {
   hide_empty?: boolean
   empty_message?: string
+  hide_heading?: boolean
 }
 
 export type CardParagraphBehaviors = {
@@ -22,9 +23,14 @@ export type BannerParagraphBehaviors = {
   hide_heading?: string
 }
 
+export type TeaserParagraphBehaviors = {
+  hide_heading?: boolean
+}
+
 export type ParagraphBehaviors = {
   layout_paragraphs?: LayoutParagraphBehaviors
   list_paragraph?: ListParagraphBehaviors
   su_card_styles?: CardParagraphBehaviors
   hero_pattern?: BannerParagraphBehaviors
+  stanford_teaser?: TeaserParagraphBehaviors
 }