diff options
Diffstat (limited to 'src/components/organisms/layout')
29 files changed, 117 insertions, 116 deletions
diff --git a/src/components/organisms/layout/cards-list.stories.tsx b/src/components/organisms/layout/cards-list.stories.tsx index c19220a..b5f697a 100644 --- a/src/components/organisms/layout/cards-list.stories.tsx +++ b/src/components/organisms/layout/cards-list.stories.tsx @@ -1,5 +1,8 @@ import { ComponentMeta, ComponentStory } from '@storybook/react'; -import CardsListComponent, { type CardsListItem } from './cards-list'; +import { + CardsList as CardsListComponent, + type CardsListItem, +} from './cards-list'; /** * CardsList - Storybook Meta diff --git a/src/components/organisms/layout/cards-list.test.tsx b/src/components/organisms/layout/cards-list.test.tsx index 6a0ff7c..968a349 100644 --- a/src/components/organisms/layout/cards-list.test.tsx +++ b/src/components/organisms/layout/cards-list.test.tsx @@ -1,5 +1,5 @@ import { render, screen } from '../../../../tests/utils'; -import CardsList, { type CardsListItem } from './cards-list'; +import { CardsList, type CardsListItem } from './cards-list'; const items: CardsListItem[] = [ { diff --git a/src/components/organisms/layout/cards-list.tsx b/src/components/organisms/layout/cards-list.tsx index 12ec7d9..e3d1156 100644 --- a/src/components/organisms/layout/cards-list.tsx +++ b/src/components/organisms/layout/cards-list.tsx @@ -1,6 +1,6 @@ import { FC } from 'react'; -import List, { type ListItem, type ListProps } from '../../atoms/lists/list'; -import Card, { type CardProps } from '../../molecules/layout/card'; +import { List, type ListItem, type ListProps } from '../../atoms'; +import { Card, type CardProps } from '../../molecules'; import styles from './cards-list.module.scss'; export type CardsListItem = Omit<CardProps, 'className' | 'titleLevel'> & { @@ -27,7 +27,7 @@ export type CardsListProps = Pick<CardProps, 'titleLevel'> & * * Return a list of Card components. */ -const CardsList: FC<CardsListProps> = ({ +export const CardsList: FC<CardsListProps> = ({ className = '', items, kind = 'unordered', @@ -47,11 +47,11 @@ const CardsList: FC<CardsListProps> = ({ id, value: ( <Card - key={id} + {...card} className={styles.card} + key={id} id={id} titleLevel={titleLevel} - {...card} /> ), }; @@ -60,11 +60,9 @@ const CardsList: FC<CardsListProps> = ({ return ( <List + className={`${styles.wrapper} ${styles[kindModifier]} ${className}`} kind="flex" items={getCards(items)} - className={`${styles.wrapper} ${styles[kindModifier]} ${className}`} /> ); }; - -export default CardsList; diff --git a/src/components/organisms/layout/comment.fixture.tsx b/src/components/organisms/layout/comment.fixture.tsx index 57a4389..eee7981 100644 --- a/src/components/organisms/layout/comment.fixture.tsx +++ b/src/components/organisms/layout/comment.fixture.tsx @@ -1,7 +1,4 @@ -import { - getFormattedDate, - getFormattedTime, -} from '../../../utils/helpers/dates'; +import { getFormattedDate, getFormattedTime } from '../../../utils/helpers'; import { CommentProps } from './comment'; export const author = { diff --git a/src/components/organisms/layout/comment.stories.tsx b/src/components/organisms/layout/comment.stories.tsx index 7a8ac95..a73ba23 100644 --- a/src/components/organisms/layout/comment.stories.tsx +++ b/src/components/organisms/layout/comment.stories.tsx @@ -1,5 +1,5 @@ import { ComponentMeta, ComponentStory } from '@storybook/react'; -import CommentComponent from './comment'; +import { Comment } from './comment'; import { data } from './comment.fixture'; const saveComment = async () => { @@ -11,7 +11,7 @@ const saveComment = async () => { */ export default { title: 'Organisms/Layout/Comment', - component: CommentComponent, + component: Comment, args: { canReply: true, saveComment, @@ -104,10 +104,10 @@ export default { }, }, }, -} as ComponentMeta<typeof CommentComponent>; +} as ComponentMeta<typeof Comment>; -const Template: ComponentStory<typeof CommentComponent> = (args) => ( - <CommentComponent {...args} /> +const Template: ComponentStory<typeof Comment> = (args) => ( + <Comment {...args} /> ); /** diff --git a/src/components/organisms/layout/comment.test.tsx b/src/components/organisms/layout/comment.test.tsx index 5ea8c6f..6414371 100644 --- a/src/components/organisms/layout/comment.test.tsx +++ b/src/components/organisms/layout/comment.test.tsx @@ -1,5 +1,5 @@ import { render, screen } from '../../../../tests/utils'; -import Comment from './comment'; +import { Comment } from './comment'; import { author, data, diff --git a/src/components/organisms/layout/comment.tsx b/src/components/organisms/layout/comment.tsx index 23073ad..e2a42bf 100644 --- a/src/components/organisms/layout/comment.tsx +++ b/src/components/organisms/layout/comment.tsx @@ -3,12 +3,11 @@ import Script from 'next/script'; import { FC, useCallback, useState } from 'react'; import { useIntl } from 'react-intl'; import { type Comment as CommentSchema, type WithContext } from 'schema-dts'; -import { type SingleComment } from '../../../types/app'; -import useSettings from '../../../utils/hooks/use-settings'; -import Button from '../../atoms/buttons/button'; -import Link from '../../atoms/links/link'; -import Meta from '../../molecules/layout/meta'; -import CommentForm, { type CommentFormProps } from '../forms/comment-form'; +import { type SingleComment } from '../../../types'; +import { useSettings } from '../../../utils/hooks'; +import { Button, Link } from '../../atoms'; +import { Meta } from '../../molecules'; +import { CommentForm, type CommentFormProps } from '../forms'; import styles from './comment.module.scss'; export type CommentProps = Pick< @@ -27,7 +26,7 @@ export type CommentProps = Pick< * * Render a single comment. */ -const Comment: FC<CommentProps> = ({ +export const Comment: FC<CommentProps> = ({ approved, canReply = true, content, @@ -107,13 +106,13 @@ const Comment: FC<CommentProps> = ({ return ( <> <Script + dangerouslySetInnerHTML={{ __html: JSON.stringify(commentSchema) }} id="schema-comments" type="application/ld+json" - dangerouslySetInnerHTML={{ __html: JSON.stringify(commentSchema) }} /> <article - id={`comment-${id}`} className={`${styles.wrapper} ${styles['wrapper--comment']}`} + id={`comment-${id}`} > <header className={styles.header}> {author.avatar && ( @@ -136,6 +135,7 @@ const Comment: FC<CommentProps> = ({ )} </header> <Meta + className={styles.date} data={{ publication: { date: publicationDate, @@ -143,10 +143,9 @@ const Comment: FC<CommentProps> = ({ target: `#comment-${id}`, }, }} - layout="inline" - itemsLayout="inline" - className={styles.date} groupClassName={styles.date__item} + itemsLayout="inline" + layout="inline" /> <div className={styles.body} @@ -162,15 +161,13 @@ const Comment: FC<CommentProps> = ({ </article> {isReplying && ( <CommentForm + className={`${styles.wrapper} ${styles['wrapper--form']}`} Notice={Notice} parentId={id} saveComment={saveComment} title={formTitle} - className={`${styles.wrapper} ${styles['wrapper--form']}`} /> )} </> ); }; - -export default Comment; diff --git a/src/components/organisms/layout/comments-list.stories.tsx b/src/components/organisms/layout/comments-list.stories.tsx index 5ed0f2a..4b32d7b 100644 --- a/src/components/organisms/layout/comments-list.stories.tsx +++ b/src/components/organisms/layout/comments-list.stories.tsx @@ -1,5 +1,5 @@ import { ComponentMeta, ComponentStory } from '@storybook/react'; -import CommentsListComponent from './comments-list'; +import { CommentsList } from './comments-list'; import { comments } from './comments-list.fixture'; const saveComment = async () => { @@ -11,7 +11,7 @@ const saveComment = async () => { */ export default { title: 'Organisms/Layout/CommentsList', - component: CommentsListComponent, + component: CommentsList, args: { saveComment, }, @@ -66,10 +66,10 @@ export default { }, }, }, -} as ComponentMeta<typeof CommentsListComponent>; +} as ComponentMeta<typeof CommentsList>; -const Template: ComponentStory<typeof CommentsListComponent> = (args) => ( - <CommentsListComponent {...args} /> +const Template: ComponentStory<typeof CommentsList> = (args) => ( + <CommentsList {...args} /> ); /** diff --git a/src/components/organisms/layout/comments-list.test.tsx b/src/components/organisms/layout/comments-list.test.tsx index ef4b4af..0518425 100644 --- a/src/components/organisms/layout/comments-list.test.tsx +++ b/src/components/organisms/layout/comments-list.test.tsx @@ -1,6 +1,6 @@ import { render } from '../../../../tests/utils'; import { saveComment } from './comment.fixture'; -import CommentsList from './comments-list'; +import { CommentsList } from './comments-list'; import { comments } from './comments-list.fixture'; describe('CommentsList', () => { diff --git a/src/components/organisms/layout/comments-list.tsx b/src/components/organisms/layout/comments-list.tsx index 227f715..1ce0cf5 100644 --- a/src/components/organisms/layout/comments-list.tsx +++ b/src/components/organisms/layout/comments-list.tsx @@ -1,6 +1,6 @@ import { FC } from 'react'; -import { SingleComment } from '../../../types/app'; -import Comment, { type CommentProps } from '../../organisms/layout/comment'; +import { type SingleComment } from '../../../types'; +import { Comment, type CommentProps } from './comment'; import styles from './comments-list.module.scss'; export type CommentsListProps = Pick<CommentProps, 'Notice' | 'saveComment'> & { @@ -19,7 +19,7 @@ export type CommentsListProps = Pick<CommentProps, 'Notice' | 'saveComment'> & { * * Render a comments list. */ -const CommentsList: FC<CommentsListProps> = ({ +export const CommentsList: FC<CommentsListProps> = ({ comments, depth, Notice, @@ -54,5 +54,3 @@ const CommentsList: FC<CommentsListProps> = ({ return <ol className={styles.list}>{getItems(comments, 0)}</ol>; }; - -export default CommentsList; diff --git a/src/components/organisms/layout/footer.stories.tsx b/src/components/organisms/layout/footer.stories.tsx index bd5a744..b5097dd 100644 --- a/src/components/organisms/layout/footer.stories.tsx +++ b/src/components/organisms/layout/footer.stories.tsx @@ -1,5 +1,5 @@ import { ComponentMeta, ComponentStory } from '@storybook/react'; -import FooterComponent from './footer'; +import { Footer as FooterComponent } from './footer'; /** * Footer - Storybook Meta diff --git a/src/components/organisms/layout/footer.test.tsx b/src/components/organisms/layout/footer.test.tsx index 0ba1a57..f513739 100644 --- a/src/components/organisms/layout/footer.test.tsx +++ b/src/components/organisms/layout/footer.test.tsx @@ -1,5 +1,5 @@ import { render, screen } from '../../../../tests/utils'; -import Footer, { type FooterProps } from './footer'; +import { Footer, type FooterProps } from './footer'; const copyright: FooterProps['copyright'] = { dates: { start: '2017', end: '2022' }, diff --git a/src/components/organisms/layout/footer.tsx b/src/components/organisms/layout/footer.tsx index f67ad7d..f1f3236 100644 --- a/src/components/organisms/layout/footer.tsx +++ b/src/components/organisms/layout/footer.tsx @@ -1,10 +1,12 @@ import { FC } from 'react'; import { useIntl } from 'react-intl'; -import Copyright, { type CopyrightProps } from '../../atoms/layout/copyright'; -import BackToTop, { +import { Copyright, type CopyrightProps } from '../../atoms'; +import { + BackToTop, type BackToTopProps, -} from '../../molecules/buttons/back-to-top'; -import Nav, { type NavItem } from '../../molecules/nav/nav'; + Nav, + type NavItem, +} from '../../molecules'; import styles from './footer.module.scss'; export type FooterProps = { @@ -35,7 +37,7 @@ export type FooterProps = { * * Renders a footer with copyright and nav; */ -const Footer: FC<FooterProps> = ({ +export const Footer: FC<FooterProps> = ({ backToTopClassName, className = '', copyright, @@ -53,23 +55,21 @@ const Footer: FC<FooterProps> = ({ <footer className={`${styles.wrapper} ${className}`}> <Copyright dates={copyright.dates} - owner={copyright.owner} icon={copyright.icon} + owner={copyright.owner} /> {navItems && ( <Nav aria-label={ariaLabel} - kind="footer" - items={navItems} className={styles.nav} + items={navItems} + kind="footer" /> )} <BackToTop - target={topId} className={`${styles['back-to-top']} ${backToTopClassName}`} + target={topId} /> </footer> ); }; - -export default Footer; diff --git a/src/components/organisms/layout/header.stories.tsx b/src/components/organisms/layout/header.stories.tsx index 0507e89..31fb0ca 100644 --- a/src/components/organisms/layout/header.stories.tsx +++ b/src/components/organisms/layout/header.stories.tsx @@ -1,5 +1,5 @@ import { ComponentMeta, ComponentStory } from '@storybook/react'; -import HeaderComponent from './header'; +import { Header as HeaderComponent } from './header'; /** * Header - Storybook Meta diff --git a/src/components/organisms/layout/header.test.tsx b/src/components/organisms/layout/header.test.tsx index c7819c0..78df341 100644 --- a/src/components/organisms/layout/header.test.tsx +++ b/src/components/organisms/layout/header.test.tsx @@ -1,5 +1,5 @@ import { render, screen } from '../../../../tests/utils'; -import Header from './header'; +import { Header } from './header'; const nav = [ { id: 'home-link', href: '#', label: 'Home' }, diff --git a/src/components/organisms/layout/header.tsx b/src/components/organisms/layout/header.tsx index 4e5e0f2..d2f7620 100644 --- a/src/components/organisms/layout/header.tsx +++ b/src/components/organisms/layout/header.tsx @@ -1,6 +1,6 @@ import { FC } from 'react'; -import Branding, { type BrandingProps } from '../../molecules/layout/branding'; -import Toolbar, { type ToolbarProps } from '../toolbar/toolbar'; +import { Branding, type BrandingProps } from '../../molecules'; +import { Toolbar, type ToolbarProps } from '../toolbar'; import styles from './header.module.scss'; export type HeaderProps = BrandingProps & @@ -19,7 +19,7 @@ export type HeaderProps = BrandingProps & * * Render the website header. */ -const Header: FC<HeaderProps> = ({ +export const Header: FC<HeaderProps> = ({ ackeeStorageKey, className, motionStorageKey, @@ -42,5 +42,3 @@ const Header: FC<HeaderProps> = ({ </header> ); }; - -export default Header; diff --git a/src/components/organisms/layout/index.ts b/src/components/organisms/layout/index.ts new file mode 100644 index 0000000..35061cb --- /dev/null +++ b/src/components/organisms/layout/index.ts @@ -0,0 +1,9 @@ +export * from './cards-list'; +export * from './comment'; +export * from './comments-list'; +export * from './footer'; +export * from './header'; +export * from './no-results'; +export * from './overview'; +export * from './posts-list'; +export * from './summary'; diff --git a/src/components/organisms/layout/no-results.stories.tsx b/src/components/organisms/layout/no-results.stories.tsx index aa2e51e..b157572 100644 --- a/src/components/organisms/layout/no-results.stories.tsx +++ b/src/components/organisms/layout/no-results.stories.tsx @@ -1,5 +1,5 @@ import { ComponentMeta, ComponentStory } from '@storybook/react'; -import NoResultsComponent from './no-results'; +import { NoResults as NoResultsComponent } from './no-results'; export default { title: 'Organisms/Layout', diff --git a/src/components/organisms/layout/no-results.test.tsx b/src/components/organisms/layout/no-results.test.tsx index 551b82f..914b2db 100644 --- a/src/components/organisms/layout/no-results.test.tsx +++ b/src/components/organisms/layout/no-results.test.tsx @@ -1,5 +1,5 @@ import { render, screen } from '../../../../tests/utils'; -import NoResults from './no-results'; +import { NoResults } from './no-results'; describe('NoResults', () => { it('renders a no results text', () => { diff --git a/src/components/organisms/layout/no-results.tsx b/src/components/organisms/layout/no-results.tsx index 1b563da..1e7afe1 100644 --- a/src/components/organisms/layout/no-results.tsx +++ b/src/components/organisms/layout/no-results.tsx @@ -1,8 +1,6 @@ import { FC } from 'react'; import { useIntl } from 'react-intl'; -import SearchForm, { - type SearchFormProps, -} from '../../organisms/forms/search-form'; +import { SearchForm, type SearchFormProps } from '../forms'; export type NoResultsProps = Pick<SearchFormProps, 'searchPage'>; @@ -11,7 +9,7 @@ export type NoResultsProps = Pick<SearchFormProps, 'searchPage'>; * * Renders a no results text with a search form. */ -const NoResults: FC<NoResultsProps> = ({ searchPage }) => { +export const NoResults: FC<NoResultsProps> = ({ searchPage }) => { const intl = useIntl(); return ( @@ -34,5 +32,3 @@ const NoResults: FC<NoResultsProps> = ({ searchPage }) => { </> ); }; - -export default NoResults; diff --git a/src/components/organisms/layout/overview.stories.tsx b/src/components/organisms/layout/overview.stories.tsx index 26f7ba0..be6db72 100644 --- a/src/components/organisms/layout/overview.stories.tsx +++ b/src/components/organisms/layout/overview.stories.tsx @@ -1,5 +1,5 @@ import { ComponentMeta, ComponentStory } from '@storybook/react'; -import Overview, { OverviewMeta } from './overview'; +import { Overview, OverviewMeta } from './overview'; /** * Overview - Storybook Meta diff --git a/src/components/organisms/layout/overview.test.tsx b/src/components/organisms/layout/overview.test.tsx index 72e4cc0..25c1c26 100644 --- a/src/components/organisms/layout/overview.test.tsx +++ b/src/components/organisms/layout/overview.test.tsx @@ -1,5 +1,5 @@ import { render, screen } from '../../../../tests/utils'; -import Overview, { type OverviewMeta } from './overview'; +import { Overview, type OverviewMeta } from './overview'; const cover = { alt: 'Incidunt unde quam', diff --git a/src/components/organisms/layout/overview.tsx b/src/components/organisms/layout/overview.tsx index e539731..51920f6 100644 --- a/src/components/organisms/layout/overview.tsx +++ b/src/components/organisms/layout/overview.tsx @@ -1,8 +1,10 @@ import { FC } from 'react'; -import ResponsiveImage, { +import { + Meta, + type MetaData, + ResponsiveImage, type ResponsiveImageProps, -} from '../../molecules/images/responsive-image'; -import Meta, { type MetaData } from '../../molecules/layout/meta'; +} from '../../molecules'; import styles from './overview.module.scss'; export type OverviewMeta = Pick< @@ -35,7 +37,11 @@ export type OverviewProps = { * * Render an overview. */ -const Overview: FC<OverviewProps> = ({ className = '', cover, meta }) => { +export const Overview: FC<OverviewProps> = ({ + className = '', + cover, + meta, +}) => { const { technologies, ...remainingMeta } = meta; const metaModifier = technologies ? styles['meta--has-techno'] : ''; @@ -43,13 +49,11 @@ const Overview: FC<OverviewProps> = ({ className = '', cover, meta }) => { <div className={`${styles.wrapper} ${className}`}> {cover && <ResponsiveImage className={styles.cover} {...cover} />} <Meta + className={`${styles.meta} ${metaModifier}`} data={{ ...remainingMeta, technologies }} layout="inline" - className={`${styles.meta} ${metaModifier}`} withSeparator={false} /> </div> ); }; - -export default Overview; diff --git a/src/components/organisms/layout/posts-list.stories.tsx b/src/components/organisms/layout/posts-list.stories.tsx index bff1f28..d56c7e6 100644 --- a/src/components/organisms/layout/posts-list.stories.tsx +++ b/src/components/organisms/layout/posts-list.stories.tsx @@ -1,5 +1,5 @@ import { ComponentMeta, ComponentStory } from '@storybook/react'; -import PostsList from './posts-list'; +import { PostsList } from './posts-list'; import { posts, searchPage } from './posts-list.fixture'; /** diff --git a/src/components/organisms/layout/posts-list.test.tsx b/src/components/organisms/layout/posts-list.test.tsx index 1d6bbcb..41a8679 100644 --- a/src/components/organisms/layout/posts-list.test.tsx +++ b/src/components/organisms/layout/posts-list.test.tsx @@ -1,5 +1,5 @@ import { render, screen } from '../../../../tests/utils'; -import PostsList from './posts-list'; +import { PostsList } from './posts-list'; import { posts, searchPage } from './posts-list.fixture'; describe('PostsList', () => { diff --git a/src/components/organisms/layout/posts-list.tsx b/src/components/organisms/layout/posts-list.tsx index dede7b6..e214ca7 100644 --- a/src/components/organisms/layout/posts-list.tsx +++ b/src/components/organisms/layout/posts-list.tsx @@ -1,17 +1,17 @@ import { FC, Fragment, useRef } from 'react'; import { useIntl } from 'react-intl'; -import useIsMounted from '../../../utils/hooks/use-is-mounted'; -import useSettings from '../../../utils/hooks/use-settings'; -import Button from '../../atoms/buttons/button'; -import Heading, { type HeadingLevel } from '../../atoms/headings/heading'; -import ProgressBar from '../../atoms/loaders/progress-bar'; -import Spinner from '../../atoms/loaders/spinner'; -import Pagination, { - type PaginationProps, -} from '../../molecules/nav/pagination'; -import NoResults, { NoResultsProps } from './no-results'; +import { useIsMounted, useSettings } from '../../../utils/hooks'; +import { + Button, + Heading, + type HeadingLevel, + ProgressBar, + Spinner, +} from '../../atoms'; +import { Pagination, type PaginationProps } from '../../molecules'; +import { NoResults, type NoResultsProps } from './no-results'; import styles from './posts-list.module.scss'; -import Summary, { type SummaryProps } from './summary'; +import { Summary, type SummaryProps } from './summary'; export type Post = Omit<SummaryProps, 'titleLevel'> & { /** @@ -84,7 +84,7 @@ const sortPostsByYear = (data: Post[]): YearCollection => { * * Render a list of post summaries. */ -const PostsList: FC<PostsListProps> = ({ +export const PostsList: FC<PostsListProps> = ({ baseUrl, byYear = false, isLoading = false, @@ -237,5 +237,3 @@ const PostsList: FC<PostsListProps> = ({ </> ); }; - -export default PostsList; diff --git a/src/components/organisms/layout/summary.stories.tsx b/src/components/organisms/layout/summary.stories.tsx index 0b91e24..fe8b704 100644 --- a/src/components/organisms/layout/summary.stories.tsx +++ b/src/components/organisms/layout/summary.stories.tsx @@ -1,5 +1,5 @@ import { ComponentMeta, ComponentStory } from '@storybook/react'; -import Summary from './summary'; +import { Summary } from './summary'; import { cover, intro, meta } from './summary.fixture'; /** diff --git a/src/components/organisms/layout/summary.test.tsx b/src/components/organisms/layout/summary.test.tsx index 73f6df8..607d676 100644 --- a/src/components/organisms/layout/summary.test.tsx +++ b/src/components/organisms/layout/summary.test.tsx @@ -1,5 +1,5 @@ import { render, screen } from '../../../../tests/utils'; -import Summary from './summary'; +import { Summary } from './summary'; import { cover, intro, meta, title, url } from './summary.fixture'; describe('Summary', () => { diff --git a/src/components/organisms/layout/summary.tsx b/src/components/organisms/layout/summary.tsx index f2031d5..cacd6d2 100644 --- a/src/components/organisms/layout/summary.tsx +++ b/src/components/organisms/layout/summary.tsx @@ -1,15 +1,20 @@ import { FC, ReactNode } from 'react'; import { useIntl } from 'react-intl'; -import { type Article, type Meta as MetaType } from '../../../types/app'; -import useReadingTime from '../../../utils/hooks/use-reading-time'; -import ButtonLink from '../../atoms/buttons/button-link'; -import Heading, { type HeadingLevel } from '../../atoms/headings/heading'; -import Arrow from '../../atoms/icons/arrow'; -import Link from '../../atoms/links/link'; -import ResponsiveImage, { +import { type Article, type Meta as MetaType } from '../../../types'; +import { useReadingTime } from '../../../utils/hooks'; +import { + Arrow, + ButtonLink, + Heading, + type HeadingLevel, + Link, +} from '../../atoms'; +import { + Meta, + type MetaData, + ResponsiveImage, type ResponsiveImageProps, -} from '../../molecules/images/responsive-image'; -import Meta, { type MetaData } from '../../molecules/layout/meta'; +} from '../../molecules'; import styles from './summary.module.scss'; export type Cover = Pick< @@ -48,7 +53,7 @@ export type SummaryProps = Pick<Article, 'intro' | 'title'> & { * * Render a page summary. */ -const Summary: FC<SummaryProps> = ({ +export const Summary: FC<SummaryProps> = ({ intro, meta, title, @@ -125,16 +130,14 @@ const Summary: FC<SummaryProps> = ({ </div> <footer className={styles.footer}> <Meta + className={styles.meta} data={getMeta()} - layout="column" + groupClassName={styles.meta__item} itemsLayout="stacked" + layout="column" withSeparator={false} - className={styles.meta} - groupClassName={styles.meta__item} /> </footer> </article> ); }; - -export default Summary; |