aboutsummaryrefslogtreecommitdiffstats
path: root/src/components/molecules/nav
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/molecules/nav')
-rw-r--r--src/components/molecules/nav/breadcrumb.stories.tsx2
-rw-r--r--src/components/molecules/nav/breadcrumb.test.tsx2
-rw-r--r--src/components/molecules/nav/breadcrumb.tsx8
-rw-r--r--src/components/molecules/nav/index.ts3
-rw-r--r--src/components/molecules/nav/nav.stories.tsx13
-rw-r--r--src/components/molecules/nav/nav.test.tsx5
-rw-r--r--src/components/molecules/nav/nav.tsx9
-rw-r--r--src/components/molecules/nav/pagination.stories.tsx10
-rw-r--r--src/components/molecules/nav/pagination.test.tsx2
-rw-r--r--src/components/molecules/nav/pagination.tsx8
10 files changed, 27 insertions, 35 deletions
diff --git a/src/components/molecules/nav/breadcrumb.stories.tsx b/src/components/molecules/nav/breadcrumb.stories.tsx
index cf67e60..b6dd619 100644
--- a/src/components/molecules/nav/breadcrumb.stories.tsx
+++ b/src/components/molecules/nav/breadcrumb.stories.tsx
@@ -1,5 +1,5 @@
import { ComponentMeta, ComponentStory } from '@storybook/react';
-import Breadcrumb from './breadcrumb';
+import { Breadcrumb } from './breadcrumb';
/**
* Breadcrumb - Storybook Meta
diff --git a/src/components/molecules/nav/breadcrumb.test.tsx b/src/components/molecules/nav/breadcrumb.test.tsx
index f3a23b5..1838a1d 100644
--- a/src/components/molecules/nav/breadcrumb.test.tsx
+++ b/src/components/molecules/nav/breadcrumb.test.tsx
@@ -1,5 +1,5 @@
import { render, screen } from '../../../../tests/utils';
-import Breadcrumb, { type BreadcrumbItem } from './breadcrumb';
+import { Breadcrumb, type BreadcrumbItem } from './breadcrumb';
const items: BreadcrumbItem[] = [
{ id: 'home', url: '#', name: 'Home' },
diff --git a/src/components/molecules/nav/breadcrumb.tsx b/src/components/molecules/nav/breadcrumb.tsx
index bc50f55..247bc2b 100644
--- a/src/components/molecules/nav/breadcrumb.tsx
+++ b/src/components/molecules/nav/breadcrumb.tsx
@@ -3,7 +3,7 @@ import { FC } from 'react';
import { useIntl } from 'react-intl';
import { BreadcrumbList, ListItem, WithContext } from 'schema-dts';
import { settings } from '../../../utils/config';
-import Link from '../../atoms/links/link';
+import { Link } from '../../atoms';
import styles from './breadcrumb.module.scss';
export type BreadcrumbItem = {
@@ -41,7 +41,7 @@ export type BreadcrumbProps = {
*
* Render a breadcrumb navigation.
*/
-const Breadcrumb: FC<BreadcrumbProps> = ({
+export const Breadcrumb: FC<BreadcrumbProps> = ({
itemClassName = '',
items,
...props
@@ -106,9 +106,9 @@ const Breadcrumb: FC<BreadcrumbProps> = ({
return (
<>
<Script
+ dangerouslySetInnerHTML={{ __html: JSON.stringify(schemaJsonLd) }}
id="schema-breadcrumb"
type="application/ld+json"
- dangerouslySetInnerHTML={{ __html: JSON.stringify(schemaJsonLd) }}
/>
<nav aria-label={ariaLabel} {...props}>
<span className="screen-reader-text">
@@ -123,5 +123,3 @@ const Breadcrumb: FC<BreadcrumbProps> = ({
</>
);
};
-
-export default Breadcrumb;
diff --git a/src/components/molecules/nav/index.ts b/src/components/molecules/nav/index.ts
new file mode 100644
index 0000000..68efe4e
--- /dev/null
+++ b/src/components/molecules/nav/index.ts
@@ -0,0 +1,3 @@
+export * from './breadcrumb';
+export * from './nav';
+export * from './pagination';
diff --git a/src/components/molecules/nav/nav.stories.tsx b/src/components/molecules/nav/nav.stories.tsx
index abf6882..d343528 100644
--- a/src/components/molecules/nav/nav.stories.tsx
+++ b/src/components/molecules/nav/nav.stories.tsx
@@ -1,14 +1,13 @@
import { ComponentMeta, ComponentStory } from '@storybook/react';
-import Envelop from '../../atoms/icons/envelop';
-import Home from '../../atoms/icons/home';
-import NavComponent, { type NavItem } from './nav';
+import { Envelop, Home } from '../../atoms';
+import { Nav, type NavItem } from './nav';
/**
* Nav - Storybook Meta
*/
export default {
title: 'Molecules/Navigation/Nav',
- component: NavComponent,
+ component: Nav,
argTypes: {
'aria-label': {
control: {
@@ -72,11 +71,9 @@ export default {
},
},
},
-} as ComponentMeta<typeof NavComponent>;
+} as ComponentMeta<typeof Nav>;
-const Template: ComponentStory<typeof NavComponent> = (args) => (
- <NavComponent {...args} />
-);
+const Template: ComponentStory<typeof Nav> = (args) => <Nav {...args} />;
const MainNavItems: NavItem[] = [
{ id: 'homeLink', href: '/', label: 'Home', logo: <Home /> },
diff --git a/src/components/molecules/nav/nav.test.tsx b/src/components/molecules/nav/nav.test.tsx
index b0920c8..37b2f41 100644
--- a/src/components/molecules/nav/nav.test.tsx
+++ b/src/components/molecules/nav/nav.test.tsx
@@ -1,7 +1,6 @@
import { render, screen } from '../../../../tests/utils';
-import Envelop from '../../atoms/icons/envelop';
-import Home from '../../atoms/icons/home';
-import Nav, { type NavItem } from './nav';
+import { Envelop, Home } from '../../atoms';
+import { Nav, type NavItem } from './nav';
const navItems: NavItem[] = [
{ id: 'homeLink', href: '/', label: 'Home', logo: <Home /> },
diff --git a/src/components/molecules/nav/nav.tsx b/src/components/molecules/nav/nav.tsx
index 71d459a..8214d94 100644
--- a/src/components/molecules/nav/nav.tsx
+++ b/src/components/molecules/nav/nav.tsx
@@ -1,6 +1,5 @@
import { FC, ReactNode } from 'react';
-import Link from '../../atoms/links/link';
-import NavLink from '../../atoms/links/nav-link';
+import { Link, NavLink } from '../../atoms';
import styles from './nav.module.scss';
export type NavItem = {
@@ -50,7 +49,7 @@ export type NavProps = {
*
* Render the nav links.
*/
-const Nav: FC<NavProps> = ({
+export const Nav: FC<NavProps> = ({
className = '',
items,
kind,
@@ -76,10 +75,8 @@ const Nav: FC<NavProps> = ({
};
return (
- <nav className={`${styles[kindClass]} ${className}`} {...props}>
+ <nav {...props} className={`${styles[kindClass]} ${className}`}>
<ul className={`${styles.nav__list} ${listClassName}`}>{getItems()}</ul>
</nav>
);
};
-
-export default Nav;
diff --git a/src/components/molecules/nav/pagination.stories.tsx b/src/components/molecules/nav/pagination.stories.tsx
index 2e86db4..678c574 100644
--- a/src/components/molecules/nav/pagination.stories.tsx
+++ b/src/components/molecules/nav/pagination.stories.tsx
@@ -1,12 +1,12 @@
import { ComponentMeta, ComponentStory } from '@storybook/react';
-import PaginationComponent from './pagination';
+import { Pagination } from './pagination';
/**
* Pagination - Storybook Meta
*/
export default {
title: 'Molecules/Navigation/Pagination',
- component: PaginationComponent,
+ component: Pagination,
args: {
baseUrl: '/page/',
siblings: 1,
@@ -98,10 +98,10 @@ export default {
},
},
},
-} as ComponentMeta<typeof PaginationComponent>;
+} as ComponentMeta<typeof Pagination>;
-const Template: ComponentStory<typeof PaginationComponent> = (args) => (
- <PaginationComponent {...args} />
+const Template: ComponentStory<typeof Pagination> = (args) => (
+ <Pagination {...args} />
);
/**
diff --git a/src/components/molecules/nav/pagination.test.tsx b/src/components/molecules/nav/pagination.test.tsx
index bf0e6c1..86ba719 100644
--- a/src/components/molecules/nav/pagination.test.tsx
+++ b/src/components/molecules/nav/pagination.test.tsx
@@ -1,5 +1,5 @@
import { render, screen } from '../../../../tests/utils';
-import Pagination from './pagination';
+import { Pagination } from './pagination';
const total = 50;
const perPage = 10;
diff --git a/src/components/molecules/nav/pagination.tsx b/src/components/molecules/nav/pagination.tsx
index e832e1d..6fa69f0 100644
--- a/src/components/molecules/nav/pagination.tsx
+++ b/src/components/molecules/nav/pagination.tsx
@@ -1,6 +1,6 @@
import { FC, Fragment, ReactNode } from 'react';
import { useIntl } from 'react-intl';
-import ButtonLink from '../../atoms/buttons/button-link';
+import { ButtonLink } from '../../atoms';
import styles from './pagination.module.scss';
export type PaginationProps = {
@@ -39,7 +39,7 @@ export type PaginationProps = {
*
* Render a page-based navigation.
*/
-const Pagination: FC<PaginationProps> = ({
+export const Pagination: FC<PaginationProps> = ({
baseUrl = '/page/',
className = '',
current,
@@ -204,7 +204,7 @@ const Pagination: FC<PaginationProps> = ({
};
return (
- <nav className={`${styles.wrapper} ${className}`} {...props}>
+ <nav {...props} className={`${styles.wrapper} ${className}`}>
<ul className={`${styles.list} ${styles['list--pages']}`}>
{getPages(current, totalPages)}
</ul>
@@ -216,5 +216,3 @@ const Pagination: FC<PaginationProps> = ({
</nav>
);
};
-
-export default Pagination;