diff --git a/packages/drupal/gutenberg_blocks/js/blocks/teaser-list.tsx b/packages/drupal/gutenberg_blocks/js/blocks/teaser-list.tsx index 95bd870de..a7a4bc4b7 100644 --- a/packages/drupal/gutenberg_blocks/js/blocks/teaser-list.tsx +++ b/packages/drupal/gutenberg_blocks/js/blocks/teaser-list.tsx @@ -23,7 +23,7 @@ registerBlockType<{ attributes: { layout: { type: 'string', - default: 'GRID', + default: '', }, buttonText: { type: 'string', diff --git a/packages/schema/src/fragments/Card.gql b/packages/schema/src/fragments/CardItem.gql similarity index 100% rename from packages/schema/src/fragments/Card.gql rename to packages/schema/src/fragments/CardItem.gql diff --git a/packages/schema/src/schema.graphql b/packages/schema/src/schema.graphql index e28a7e697..ac0b3e3f6 100644 --- a/packages/schema/src/schema.graphql +++ b/packages/schema/src/schema.graphql @@ -387,7 +387,7 @@ type BlockTeaserListFilters { } """ -Inteface for anything that can appear as a card (teaser) item +Interface for anything that can appear as a card (teaser) item """ interface CardItem @resolveEntityBundle { id: ID! diff --git a/packages/ui/package.json b/packages/ui/package.json index c4c5c532c..cb094359b 100644 --- a/packages/ui/package.json +++ b/packages/ui/package.json @@ -46,6 +46,8 @@ "@heroicons/react": "^2.1.1", "@hookform/resolvers": "^3.3.3", "clsx": "^2.1.0", + "embla-carousel-class-names": "^8.5.2", + "embla-carousel-react": "^8.5.2", "framer-motion": "^10.17.4", "hast-util-is-element": "^2.1.3", "hast-util-select": "^5.0.5", @@ -93,6 +95,7 @@ "autoprefixer": "^10.4.16", "axe-playwright": "^2.0.1", "cssnano": "^6.0.3", + "embla-carousel": "^8.5.2", "happy-dom": "^12.10.3", "nyc": "^15.1.0", "postcss": "^8.4.32", diff --git a/packages/ui/src/components/Organisms/Card.tsx b/packages/ui/src/components/Organisms/CardItem.tsx similarity index 66% rename from packages/ui/src/components/Organisms/Card.tsx rename to packages/ui/src/components/Organisms/CardItem.tsx index c47fd76b6..ce95dab87 100644 --- a/packages/ui/src/components/Organisms/Card.tsx +++ b/packages/ui/src/components/Organisms/CardItem.tsx @@ -16,9 +16,9 @@ export const CardItem = ({ return (
-
+
{hero?.headline}
: null} {title} {readMoreText || @@ -53,11 +53,14 @@ export const CardItem = ({
-
+
{teaserImage ? ( - + ) : ( -
+
)}
diff --git a/packages/ui/src/components/Organisms/Carousel/Carousel.tsx b/packages/ui/src/components/Organisms/Carousel/Carousel.tsx new file mode 100644 index 000000000..e7584e452 --- /dev/null +++ b/packages/ui/src/components/Organisms/Carousel/Carousel.tsx @@ -0,0 +1,90 @@ +import clsx from 'clsx'; +import { EmblaOptionsType } from 'embla-carousel'; +import useEmblaCarousel from 'embla-carousel-react'; +import React, { ReactNode, useEffect } from 'react'; + +import { + NextButton, + PrevButton, + usePrevNextButtons, +} from './CarouselArrowButtons'; +import { DotButton, useDotButton } from './CarouselDotButton'; + +export function Carousel({ + children, + options, + visibleSlides = 2, +}: { + children: ReactNode; + options: EmblaOptionsType; + visibleSlides?: number; +}) { + const [emblaRef, emblaApi] = useEmblaCarousel(options); + + const { selectedIndex, scrollSnaps, onDotButtonClick } = + useDotButton(emblaApi); + + const { + prevBtnDisabled, + nextBtnDisabled, + onPrevButtonClick, + onNextButtonClick, + } = usePrevNextButtons(emblaApi); + + useEffect(() => { + if (emblaApi) { + // Do we want to use emblaApi for anything? + // console.log(emblaApi.slideNodes()); + } + }, [emblaApi]); + + return ( +
+
+ +
+ +
+
+ + +
+ +
+ {scrollSnaps.map((_: unknown, index: number) => ( + onDotButtonClick(index)} + className={clsx( + 'embla__dot inline-flex h-6 w-6 cursor-pointer touch-manipulation items-center justify-center rounded-[50%] text-gray-400', + { + 'embla__dot--selected bg-gray-800': index === selectedIndex, + 'bg-gray-200': index !== selectedIndex, + }, + )} + /> + ))} +
+
+
+ ); +} diff --git a/packages/ui/src/components/Organisms/Carousel/CarouselArrowButtons.tsx b/packages/ui/src/components/Organisms/Carousel/CarouselArrowButtons.tsx new file mode 100644 index 000000000..a7916318d --- /dev/null +++ b/packages/ui/src/components/Organisms/Carousel/CarouselArrowButtons.tsx @@ -0,0 +1,92 @@ +import { EmblaCarouselType } from 'embla-carousel'; +import React, { + ComponentPropsWithRef, + useCallback, + useEffect, + useState, +} from 'react'; + +type UsePrevNextButtonsType = { + prevBtnDisabled: boolean; + nextBtnDisabled: boolean; + onPrevButtonClick: () => void; + onNextButtonClick: () => void; +}; + +export const usePrevNextButtons = ( + emblaApi: EmblaCarouselType | undefined, +): UsePrevNextButtonsType => { + const [prevBtnDisabled, setPrevBtnDisabled] = useState(true); + const [nextBtnDisabled, setNextBtnDisabled] = useState(true); + + const onPrevButtonClick = useCallback(() => { + if (!emblaApi) return; + emblaApi.scrollPrev(); + }, [emblaApi]); + + const onNextButtonClick = useCallback(() => { + if (!emblaApi) return; + emblaApi.scrollNext(); + }, [emblaApi]); + + const onSelect = useCallback((emblaApi: EmblaCarouselType) => { + setPrevBtnDisabled(!emblaApi.canScrollPrev()); + setNextBtnDisabled(!emblaApi.canScrollNext()); + }, []); + + useEffect(() => { + if (!emblaApi) return; + + onSelect(emblaApi); + emblaApi.on('reInit', onSelect).on('select', onSelect); + }, [emblaApi, onSelect]); + + return { + prevBtnDisabled, + nextBtnDisabled, + onPrevButtonClick, + onNextButtonClick, + }; +}; + +type PropType = ComponentPropsWithRef<'button'>; + +export const PrevButton: React.FC = (props) => { + const { children, ...restProps } = props; + + return ( + + ); +}; + +export const NextButton: React.FC = (props) => { + const { children, ...restProps } = props; + + return ( + + ); +}; diff --git a/packages/ui/src/components/Organisms/Carousel/CarouselDotButton.tsx b/packages/ui/src/components/Organisms/Carousel/CarouselDotButton.tsx new file mode 100644 index 000000000..86c6d98b1 --- /dev/null +++ b/packages/ui/src/components/Organisms/Carousel/CarouselDotButton.tsx @@ -0,0 +1,62 @@ +import { EmblaCarouselType } from 'embla-carousel'; +import React, { + ComponentPropsWithRef, + useCallback, + useEffect, + useState, +} from 'react'; + +type UseDotButtonType = { + selectedIndex: number; + scrollSnaps: number[]; + onDotButtonClick: (index: number) => void; +}; + +export const useDotButton = ( + emblaApi: EmblaCarouselType | undefined, +): UseDotButtonType => { + const [selectedIndex, setSelectedIndex] = useState(0); + const [scrollSnaps, setScrollSnaps] = useState([]); + + const onDotButtonClick = useCallback( + (index: number) => { + if (!emblaApi) return; + emblaApi.scrollTo(index); + }, + [emblaApi], + ); + + const onInit = useCallback((emblaApi: EmblaCarouselType) => { + setScrollSnaps(emblaApi.scrollSnapList()); + }, []); + + const onSelect = useCallback((emblaApi: EmblaCarouselType) => { + setSelectedIndex(emblaApi.selectedScrollSnap()); + }, []); + + useEffect(() => { + if (!emblaApi) return; + + onInit(emblaApi); + onSelect(emblaApi); + emblaApi.on('reInit', onInit).on('reInit', onSelect).on('select', onSelect); + }, [emblaApi, onInit, onSelect]); + + return { + selectedIndex, + scrollSnaps, + onDotButtonClick, + }; +}; + +type PropType = ComponentPropsWithRef<'button'>; + +export const DotButton: React.FC = (props) => { + const { children, ...restProps } = props; + + return ( + + ); +}; diff --git a/packages/ui/src/components/Organisms/ContentHub.tsx b/packages/ui/src/components/Organisms/ContentHub.tsx index 6794cbd0e..e00772f81 100644 --- a/packages/ui/src/components/Organisms/ContentHub.tsx +++ b/packages/ui/src/components/Organisms/ContentHub.tsx @@ -8,7 +8,7 @@ import { useOperation } from '../../utils/operation'; import { Pagination, useCurrentPage } from '../Molecules/Pagination'; import { SearchForm, useSearchParameters } from '../Molecules/SearchForm'; import { Loading } from '../Routes/Loading'; -import { CardItem } from './Card'; +import { CardItem } from './CardItem'; export type ContentHubQueryArgs = { title: string | undefined; @@ -50,10 +50,10 @@ export function ContentHub({ pageSize = 10 }: { pageSize: number }) { ) : null} {data?.contentHub.total ? ( <> -
    +
      {data?.contentHub.items.filter(isTruthy).map((item) => { return ( -
    • +
      • ); diff --git a/packages/ui/src/components/Organisms/Footer.tsx b/packages/ui/src/components/Organisms/Footer.tsx index 76c5e7594..2b6b9077a 100644 --- a/packages/ui/src/components/Organisms/Footer.tsx +++ b/packages/ui/src/components/Organisms/Footer.tsx @@ -135,44 +135,42 @@ export function Footer() { aria-label="Footer Primary" > {items.map((item, key) => ( - <> -
    • - {item.target ? ( - - {item.title} - - ) : ( - - {item.title} - - )} - {item.children.length > 0 - ? item.children.map((child) => ( - - {child.title} - - )) - : null} -
      • - +
    • + {item.target ? ( + + {item.title} + + ) : ( + + {item.title} + + )} + {item.children.length > 0 + ? item.children.map((child) => ( + + {child.title} + + )) + : null} +
      • ))}
    diff --git a/packages/ui/src/components/Organisms/PageContent/BlockTeaserList.tsx b/packages/ui/src/components/Organisms/PageContent/BlockTeaserList.tsx index 4b13efc77..0cb7d5297 100644 --- a/packages/ui/src/components/Organisms/PageContent/BlockTeaserList.tsx +++ b/packages/ui/src/components/Organisms/PageContent/BlockTeaserList.tsx @@ -1,6 +1,7 @@ import { useIntl } from '@amazeelabs/react-intl'; import { BlockTeaserListFragment, + BlockTeaserListLayout, Locale, TeaserListQuery, } from '@custom/schema'; @@ -8,7 +9,8 @@ import queryString from 'query-string'; import React from 'react'; import { useOperation } from '../../../utils/operation'; -import { CardItem } from '../Card'; +import { CardItem } from '../CardItem'; +import { Carousel } from '../Carousel/Carousel'; export type TeaserListQueryArgs = { title: string | undefined; @@ -26,25 +28,59 @@ function getUUIDFromId(id: string) { export function BlockTeaserList(props: BlockTeaserListFragment) { const staticIds: Array = []; + return (
    -
      - {props.staticContent?.map((teaserItem) => { - staticIds.push(getUUIDFromId(teaserItem?.content?.id || '')); - return teaserItem?.content ? ( -
    • + {props.layout === undefined || + props.layout === BlockTeaserListLayout.Grid ? ( +
        + {props.staticContent?.map((teaserItem) => { + staticIds.push(getUUIDFromId(teaserItem?.content?.id || '')); + + return teaserItem?.content ? ( +
      • + +
        • + ) : null; + })} + {props.contentHubEnabled && ( + + )} +
      + ) : null} + + {props.layout === BlockTeaserListLayout.Carousel ? ( + + {props.staticContent?.map((teaserItem) => { + staticIds.push(getUUIDFromId(teaserItem?.content?.id || '')); + + return teaserItem?.content ? ( -
      • - ) : null; - })} - {props.contentHubEnabled && ( - - )} -
    + ) : null; + })} + {props.contentHubEnabled && ( + + )} + + ) : null}
    ); @@ -76,7 +112,7 @@ export function DynamicTeaserList( <> {data.teaserList.items.map((teaserItem) => { return teaserItem ? ( -
  • +
    • ) : null; diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 3cad50f43..f007f1f10 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -15,7 +15,7 @@ importers: devDependencies: '@commitlint/cli': specifier: ^18.4.3 - version: 18.4.3(@types/node@20.11.17)(typescript@5.6.3) + version: 18.4.3(@types/node@22.10.7)(typescript@5.7.3) '@commitlint/config-conventional': specifier: ^18.4.3 version: 18.4.3 @@ -627,6 +627,12 @@ importers: clsx: specifier: ^2.1.0 version: 2.1.0 + embla-carousel-class-names: + specifier: ^8.5.2 + version: 8.5.2(embla-carousel@8.5.2) + embla-carousel-react: + specifier: ^8.5.2 + version: 8.5.2(react@18.2.0) framer-motion: specifier: ^10.17.4 version: 10.17.4(react-dom@18.2.0)(react@18.2.0) @@ -751,6 +757,9 @@ importers: cssnano: specifier: ^6.0.3 version: 6.0.3(postcss@8.4.32) + embla-carousel: + specifier: ^8.5.2 + version: 8.5.2 happy-dom: specifier: ^12.10.3 version: 12.10.3 @@ -2835,14 +2844,14 @@ packages: resolution: {integrity: sha512-Ir+AOibqzrIsL6ajt3Rz3LskB7OiMVHqltZmspbW/TJuTVuyOMirVqAkjfY6JISiLHgyNqicAC8AyHHGzNd/dA==} engines: {node: '>=0.1.90'} - /@commitlint/cli@18.4.3(@types/node@20.11.17)(typescript@5.6.3): + /@commitlint/cli@18.4.3(@types/node@22.10.7)(typescript@5.7.3): resolution: {integrity: sha512-zop98yfB3A6NveYAZ3P1Mb6bIXuCeWgnUfVNkH4yhIMQpQfzFwseadazOuSn0OOfTt0lWuFauehpm9GcqM5lww==} engines: {node: '>=v18'} hasBin: true dependencies: '@commitlint/format': 18.6.1 '@commitlint/lint': 18.6.1 - '@commitlint/load': 18.6.1(@types/node@20.11.17)(typescript@5.6.3) + '@commitlint/load': 18.6.1(@types/node@22.10.7)(typescript@5.7.3) '@commitlint/read': 18.6.1 '@commitlint/types': 18.6.1 execa: 5.1.1 @@ -2913,7 +2922,7 @@ packages: '@commitlint/types': 18.6.1 dev: true - /@commitlint/load@18.6.1(@types/node@20.11.17)(typescript@5.6.3): + /@commitlint/load@18.6.1(@types/node@22.10.7)(typescript@5.7.3): resolution: {integrity: sha512-p26x8734tSXUHoAw0ERIiHyW4RaI4Bj99D8YgUlVV9SedLf8hlWAfyIFhHRIhfPngLlCe0QYOdRKYFt8gy56TA==} engines: {node: '>=v18'} dependencies: @@ -2922,8 +2931,8 @@ packages: '@commitlint/resolve-extends': 18.6.1 '@commitlint/types': 18.6.1 chalk: 4.1.2 - cosmiconfig: 8.3.6(typescript@5.6.3) - cosmiconfig-typescript-loader: 5.0.0(@types/node@20.11.17)(cosmiconfig@8.3.6)(typescript@5.6.3) + cosmiconfig: 8.3.6(typescript@5.7.3) + cosmiconfig-typescript-loader: 5.0.0(@types/node@22.10.7)(cosmiconfig@8.3.6)(typescript@5.7.3) lodash.isplainobject: 4.0.6 lodash.merge: 4.6.2 lodash.uniq: 4.5.0 @@ -8974,7 +8983,7 @@ packages: /@types/eslint-scope@3.7.7: resolution: {integrity: sha512-MzMFlSLBqNF2gcHWO0G1vP/YQyfvrxZ0bF+u7mzUdZ1/xK4A4sru+nraZz5i3iEIk1l1uyicaDVTB4QbbEkAYg==} dependencies: - '@types/eslint': 8.56.7 + '@types/eslint': 9.6.1 '@types/estree': 1.0.6 /@types/eslint@7.29.0: @@ -8983,18 +8992,11 @@ packages: '@types/estree': 1.0.6 '@types/json-schema': 7.0.15 - /@types/eslint@8.56.7: - resolution: {integrity: sha512-SjDvI/x3zsZnOkYZ3lCt9lOZWZLB2jIlNKz+LBgCtDurK0JZcwucxYHn1w2BJkD34dgX9Tjnak0txtq4WTggEA==} - dependencies: - '@types/estree': 1.0.6 - '@types/json-schema': 7.0.15 - /@types/eslint@9.6.1: resolution: {integrity: sha512-FXx2pKgId/WyYo2jXw63kk7/+TY7u7AziEJxJAnSFzHlqTAS3Ync6SvgYAN/k4/PQpnnVuzoMuVnByKK2qp0ag==} dependencies: '@types/estree': 1.0.6 '@types/json-schema': 7.0.15 - dev: true /@types/eslint__js@8.42.3: resolution: {integrity: sha512-alfG737uhmPdnvkrLdZLcEKJ/B8s9Y4hrZ+YAdzUeoArBlSUERA2E87ROfOaS4jd/C45fzOoZzidLc1IPwLqOw==} @@ -9223,6 +9225,12 @@ packages: dependencies: undici-types: 5.26.5 + /@types/node@22.10.7: + resolution: {integrity: sha512-V09KvXxFiutGp6B7XkpaDXlNadZxrzajcY50EuoLIpQ6WWYCSvf19lVIazzfIzQvhUN2HjX12spLojTnhuKlGg==} + dependencies: + undici-types: 6.20.0 + dev: true + /@types/node@22.7.2: resolution: {integrity: sha512-866lXSrpGpgyHBZUa2m9YNWqHDjjM0aBTJlNtYaGEw4rqY/dcD7deRVTbBBAJelfA7oaGDbNftXF/TL/A6RgoA==} dependencies: @@ -11052,6 +11060,15 @@ packages: dependencies: acorn: 8.11.3 + /acorn-import-assertions@1.9.0(acorn@8.14.0): + resolution: {integrity: sha512-cmMwop9x+8KFhxvKrKfPYmN6/pKTYYHBqLa0DfvVZcKMJWNyWLnaqND7dx/qn66R7ewM1UX5XMaDVP5wlVTaVA==} + deprecated: package has been renamed to acorn-import-attributes + peerDependencies: + acorn: ^8 + dependencies: + acorn: 8.14.0 + dev: false + /acorn-import-attributes@1.9.5(acorn@8.11.3): resolution: {integrity: sha512-n02Vykv5uA3eHGM/Z2dQrcD56kL8TyDb2p1+0P83PClMnC/nc+anbQRhIOWnSq4Ke/KvDPrY3C9hDtC/A3eHnQ==} peerDependencies: @@ -13627,7 +13644,7 @@ packages: object-assign: 4.1.1 vary: 1.1.2 - /cosmiconfig-typescript-loader@5.0.0(@types/node@20.11.17)(cosmiconfig@8.3.6)(typescript@5.6.3): + /cosmiconfig-typescript-loader@5.0.0(@types/node@22.10.7)(cosmiconfig@8.3.6)(typescript@5.7.3): resolution: {integrity: sha512-+8cK7jRAReYkMwMiG+bxhcNKiHJDM6bR9FD/nGBXOWdMLuYawjF5cGrtLilJ+LGd3ZjCXnJjR5DkfWPoIVlqJA==} engines: {node: '>=v16'} peerDependencies: @@ -13635,10 +13652,10 @@ packages: cosmiconfig: '>=8.2' typescript: '>=4' dependencies: - '@types/node': 20.11.17 - cosmiconfig: 8.3.6(typescript@5.6.3) + '@types/node': 22.10.7 + cosmiconfig: 8.3.6(typescript@5.7.3) jiti: 1.21.0 - typescript: 5.6.3 + typescript: 5.7.3 dev: true /cosmiconfig@6.0.0: @@ -13690,6 +13707,23 @@ packages: parse-json: 5.2.0 path-type: 4.0.0 typescript: 5.6.3 + dev: false + + /cosmiconfig@8.3.6(typescript@5.7.3): + resolution: {integrity: sha512-kcZ6+W5QzcJ3P1Mt+83OUv/oHFqZHIx8DuxG6eZ5RGMERoLqp4BuGjhHLYGK+Kf5XVkQvqBSmAy/nGWN3qDgEA==} + engines: {node: '>=14'} + peerDependencies: + typescript: '>=4.9.5' + peerDependenciesMeta: + typescript: + optional: true + dependencies: + import-fresh: 3.3.0 + js-yaml: 4.1.0 + parse-json: 5.2.0 + path-type: 4.0.0 + typescript: 5.7.3 + dev: true /cp-file@10.0.0: resolution: {integrity: sha512-vy2Vi1r2epK5WqxOLnskeKeZkdZvTKfFZQCplE3XWsP+SUJyd5XAUFC9lFgTjjXJF2GMne/UML14iEmkAaDfFg==} @@ -15592,6 +15626,35 @@ packages: /electron-to-chromium@1.4.731: resolution: {integrity: sha512-+TqVfZjpRz2V/5SPpmJxq9qK620SC5SqCnxQIOi7i/U08ZDcTpKbT7Xjj9FU5CbXTMUb4fywbIr8C7cGv4hcjw==} + /embla-carousel-class-names@8.5.2(embla-carousel@8.5.2): + resolution: {integrity: sha512-hYqvN06fzOs+e3QQKkDTqIxiTdlxSKoMQ7lO7oStRr/u1Gc8kNCBSh2flWmnXAHhZiVxoAX6o4jiBqJGW6xHsQ==} + peerDependencies: + embla-carousel: 8.5.2 + dependencies: + embla-carousel: 8.5.2 + dev: false + + /embla-carousel-react@8.5.2(react@18.2.0): + resolution: {integrity: sha512-Tmx+uY3MqseIGdwp0ScyUuxpBgx5jX1f7od4Cm5mDwg/dptEiTKf9xp6tw0lZN2VA9JbnVMl/aikmbc53c6QFA==} + peerDependencies: + react: ^16.8.0 || ^17.0.1 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc + dependencies: + embla-carousel: 8.5.2 + embla-carousel-reactive-utils: 8.5.2(embla-carousel@8.5.2) + react: 18.2.0 + dev: false + + /embla-carousel-reactive-utils@8.5.2(embla-carousel@8.5.2): + resolution: {integrity: sha512-QC8/hYSK/pEmqEdU1IO5O+XNc/Ptmmq7uCB44vKplgLKhB/l0+yvYx0+Cv0sF6Ena8Srld5vUErZkT+yTahtDg==} + peerDependencies: + embla-carousel: 8.5.2 + dependencies: + embla-carousel: 8.5.2 + dev: false + + /embla-carousel@8.5.2: + resolution: {integrity: sha512-xQ9oVLrun/eCG/7ru3R+I5bJ7shsD8fFwLEY7yPe27/+fDHCNj0OT5EoG5ZbFyOxOcG6yTwW8oTz/dWyFnyGpg==} + /emittery@0.13.1: resolution: {integrity: sha512-DeWwawk6r5yR9jFgnDKYt4sLS0LmHJJi3ZOnb5/JdbYwj3nW+FxQnHIjhBKz8YLC7oRNPVM9NQ47I3CVx34eqQ==} engines: {node: '>=12'} @@ -31473,6 +31536,12 @@ packages: hasBin: true requiresBuild: true + /typescript@5.7.3: + resolution: {integrity: sha512-84MVSjMEHP+FQRPy3pX9sTVV/INIex71s9TL2Gm5FG/WG1SqXeKyZ0k7/blY/4FdOzI12CBy1vGc4og/eus0fw==} + engines: {node: '>=14.17'} + hasBin: true + dev: true + /ua-parser-js@1.0.37: resolution: {integrity: sha512-bhTyI94tZofjo+Dn8SN6Zv8nBDvyXTymAdM3LDI/0IboIUwTu1rEhW7v2TfiVsoYWgkQ4kOVqnI8APUFbIQIFQ==} @@ -31529,6 +31598,10 @@ packages: resolution: {integrity: sha512-ve2KP6f/JnbPBFyobGHuerC9g1FYGn/F8n1LWTwNxCEzd6IfqTwUQcNXgEtmmQ6DlRrC1hrSrBnCZPokRrDHjw==} dev: true + /undici-types@6.20.0: + resolution: {integrity: sha512-Ny6QZ2Nju20vw1SRHe3d9jVu6gJ+4e3+MMpqu7pqE5HT6WsTSlce++GQmK5UXS8mzV8DSYHrQH+Xrf2jVcuKNg==} + dev: true + /unenv@1.9.0: resolution: {integrity: sha512-QKnFNznRxmbOF1hDgzpqrlIf6NC5sbZ2OJ+5Wl3OX8uM+LUJXbj4TXvLJCtwbPTmbMHCLIz6JLKNinNsMShK9g==} dependencies: @@ -32929,8 +33002,8 @@ packages: '@webassemblyjs/ast': 1.12.1 '@webassemblyjs/wasm-edit': 1.12.1 '@webassemblyjs/wasm-parser': 1.12.1 - acorn: 8.11.3 - acorn-import-assertions: 1.9.0(acorn@8.11.3) + acorn: 8.14.0 + acorn-import-assertions: 1.9.0(acorn@8.14.0) browserslist: 4.23.0 chrome-trace-event: 1.0.3 enhanced-resolve: 5.16.0 diff --git a/tests/e2e/specs/drupal/blocks.spec.ts b/tests/e2e/specs/drupal/blocks.spec.ts index db77ab751..0700d22d0 100644 --- a/tests/e2e/specs/drupal/blocks.spec.ts +++ b/tests/e2e/specs/drupal/blocks.spec.ts @@ -290,6 +290,6 @@ test.describe('Testing All Blocks', () => { await validateTileAndSubtitle(page, 'Block: Teaser list'); const content = page.getByRole('main'); - await expect(content.locator('ul > li')).toHaveCount(8); + await expect(content.locator('ul > li')).toHaveCount(5); }); });