refactor(components): rewrite Breadcrumbs component

5 files changed, 0 insertions, 238 deletions

diff --git a/src/components/molecules/nav/breadcrumb.module.scss b/src/components/molecules/nav/breadcrumb.module.scss
deleted file mode 100644
index 6786896..0000000
--- a/src/components/molecules/nav/breadcrumb.module.scss
+++ /dev/null
@@ -1,10 +0,0 @@
-@use "../../../styles/abstracts/placeholders";
-
-.item {
-  &:not(:last-of-type) {
-    &::after {
-      content: ">";
-      margin-left: var(--spacing-2xs);
-    }
-  }
-}
diff --git a/src/components/molecules/nav/breadcrumb.stories.tsx b/src/components/molecules/nav/breadcrumb.stories.tsx
deleted file mode 100644
index b6dd619..0000000
--- a/src/components/molecules/nav/breadcrumb.stories.tsx
+++ /dev/null
@@ -1,81 +0,0 @@
-import { ComponentMeta, ComponentStory } from '@storybook/react';
-import { Breadcrumb } from './breadcrumb';
-
-/**
- * Breadcrumb - Storybook Meta
- */
-export default {
-  title: 'Molecules/Navigation/Breadcrumb',
-  component: Breadcrumb,
-  argTypes: {
-    className: {
-      control: {
-        type: 'text',
-      },
-      table: {
-        category: 'Styles',
-      },
-      description: 'Set additional classnames to the nav element.',
-      type: {
-        name: 'string',
-        required: false,
-      },
-    },
-    itemClassName: {
-      control: {
-        type: 'text',
-      },
-      table: {
-        category: 'Styles',
-      },
-      description: 'Set additional classnames to the breadcrumb items.',
-      type: {
-        name: 'string',
-        required: false,
-      },
-    },
-    items: {
-      description: 'The breadcrumb items.',
-      type: {
-        name: 'object',
-        required: true,
-        value: {},
-      },
-    },
-  },
-} as ComponentMeta<typeof Breadcrumb>;
-
-const Template: ComponentStory<typeof Breadcrumb> = (args) => (
-  <Breadcrumb {...args} />
-);
-
-/**
- * Breadcrumb Stories - One item
- */
-export const OneItem = Template.bind({});
-OneItem.args = {
-  items: [{ id: 'home', url: '#', name: 'Home' }],
-};
-
-/**
- * Breadcrumb Stories - Two items
- */
-export const TwoItems = Template.bind({});
-TwoItems.args = {
-  items: [
-    { id: 'home', url: '#', name: 'Home' },
-    { id: 'blog', url: '#', name: 'Blog' },
-  ],
-};
-
-/**
- * Breadcrumb Stories - Three items
- */
-export const ThreeItems = Template.bind({});
-ThreeItems.args = {
-  items: [
-    { id: 'home', url: '#', name: 'Home' },
-    { id: 'blog', url: '#', name: 'Blog' },
-    { id: 'post1', url: '#', name: 'A Post' },
-  ],
-};
diff --git a/src/components/molecules/nav/breadcrumb.test.tsx b/src/components/molecules/nav/breadcrumb.test.tsx
deleted file mode 100644
index 8aa0d63..0000000
--- a/src/components/molecules/nav/breadcrumb.test.tsx
+++ /dev/null
@@ -1,16 +0,0 @@
-import { describe, expect, it } from '@jest/globals';
-import { render, screen } from '../../../../tests/utils';
-import { Breadcrumb, type BreadcrumbItem } from './breadcrumb';
-
-const items: BreadcrumbItem[] = [
-  { id: 'home', url: '#', name: 'Home' },
-  { id: 'blog', url: '#', name: 'Blog' },
-  { id: 'post1', url: '#', name: 'A Post' },
-];
-
-describe('Breadcrumb', () => {
-  it('renders a navigation', () => {
-    render(<Breadcrumb items={items} />);
-    expect(screen.getByRole('navigation')).toBeInTheDocument();
-  });
-});
diff --git a/src/components/molecules/nav/breadcrumb.tsx b/src/components/molecules/nav/breadcrumb.tsx
deleted file mode 100644
index 51f4633..0000000
--- a/src/components/molecules/nav/breadcrumb.tsx
+++ /dev/null
@@ -1,130 +0,0 @@
-import Script from 'next/script';
-import type { FC } from 'react';
-import { useIntl } from 'react-intl';
-import type {
-  BreadcrumbList,
-  ListItem as ListItemType,
-  WithContext,
-} from 'schema-dts';
-import { settings } from '../../../utils/config';
-import { Link, List, ListItem } from '../../atoms';
-import styles from './breadcrumb.module.scss';
-
-export type BreadcrumbItem = {
-  /**
-   * The item id.
-   */
-  id: string;
-  /**
-   * The item URL.
-   */
-  url: string;
-  /**
-   * The item name.
-   */
-  name: string;
-};
-
-export type BreadcrumbProps = {
-  /**
-   * Set additional classnames to the nav element.
-   */
-  className?: string;
-  /**
-   * Set additional classnames to the breadcrumb items.
-   */
-  itemClassName?: string;
-  /**
-   * The breadcrumb items
-   */
-  items: BreadcrumbItem[];
-};
-
-/**
- * Breadcrumb component
- *
- * Render a breadcrumb navigation.
- */
-export const Breadcrumb: FC<BreadcrumbProps> = ({
-  itemClassName = '',
-  items,
-  ...props
-}) => {
-  const intl = useIntl();
-
-  const ariaLabel = intl.formatMessage({
-    defaultMessage: 'Breadcrumb',
-    description: 'Breadcrumb: an accessible name for the breadcrumb nav.',
-    id: '28nnDY',
-  });
-
-  /**
-   * Retrieve the breadcrumb list items.
-   *
-   * @param {BreadcrumbItem[]} list - The breadcrumb items.
-   * @returns {JSX.Element[]} The list items.
-   */
-  const getListItems = (list: BreadcrumbItem[]): JSX.Element[] =>
-    list.map((item, index) => {
-      const isLastItem = index === list.length - 1;
-      const itemStyles = isLastItem
-        ? `${styles.item} screen-reader-text`
-        : styles.item;
-
-      return (
-        <ListItem key={item.id} className={`${itemStyles} ${itemClassName}`}>
-          {isLastItem ? item.name : <Link href={item.url}>{item.name}</Link>}
-        </ListItem>
-      );
-    });
-
-  /**
-   * Retrieve the breadcrumb list items with Schema.org format.
-   *
-   * @param {BreadcrumbItem[]} list - The breadcrumb items.
-   * @returns {ListItemType[]} An array of list items using Schema.org format.
-   */
-  const getSchemaItems = (list: BreadcrumbItem[]): ListItemType[] => {
-    const schemaItems: ListItemType[] = [];
-
-    list.forEach((item, index) => {
-      schemaItems.push({
-        '@type': 'ListItem',
-        position: index + 1,
-        name: item.name,
-        item: item.url,
-      });
-    });
-
-    return schemaItems;
-  };
-
-  const schemaJsonLd: WithContext<BreadcrumbList> = {
-    '@context': 'https://schema.org',
-    '@type': 'BreadcrumbList',
-    '@id': `${settings.url}/#breadcrumb`,
-    itemListElement: getSchemaItems(items),
-  };
-
-  return (
-    <>
-      <Script
-        dangerouslySetInnerHTML={{ __html: JSON.stringify(schemaJsonLd) }}
-        id="schema-breadcrumb"
-        type="application/ld+json"
-      />
-      <nav aria-label={ariaLabel} {...props}>
-        <span className="screen-reader-text">
-          {intl.formatMessage({
-            defaultMessage: 'You are here:',
-            description: 'Breadcrumb: You are here prefix',
-            id: '16zl9Z',
-          })}
-        </span>
-        <List hideMarker isInline isOrdered spacing="2xs">
-          {getListItems(items)}
-        </List>
-      </nav>
-    </>
-  );
-};
diff --git a/src/components/molecules/nav/index.ts b/src/components/molecules/nav/index.ts
index 2f9b8e3..08e47b7 100644
--- a/src/components/molecules/nav/index.ts
+++ b/src/components/molecules/nav/index.ts
@@ -1,4 +1,3 @@
-export * from './breadcrumb';
 export * from './nav-item';
 export * from './nav-link';
 export * from './nav-list';