@faststore/ui 2.0.66-alpha.0 → 2.0.70-alpha.0

package/dist/index.d.ts

@@ -19,8 +19,6 @@ export { default as Carousel } from './components/molecules/Carousel';
 export type { CarouselProps } from './components/molecules/Carousel';
 export { default as Banner, BannerContent, BannerImage, BannerLink, } from './components/molecules/Banner';
 export type { BannerProps, BannerContentProps, BannerImageProps, BannerLinkProps, } from './components/molecules/Banner';
-export { default as Breadcrumb } from './components/molecules/Breadcrumb';
-export type { BreadcrumbProps } from './components/molecules/Breadcrumb';
 export { default as Form } from './components/molecules/Form';
 export type { FormProps } from './components/molecules/Form';
 export { default as OutOfStock, OutOfStockTitle, OutOfStockMessage, } from './components/organisms/OutOfStock';

package/dist/index.js

@@ -11,7 +11,6 @@ export { default as Bullets } from './components/molecules/Bullets';
 export { default as SearchInput } from './components/molecules/SearchInput';
 export { default as Carousel } from './components/molecules/Carousel';
 export { default as Banner, BannerContent, BannerImage, BannerLink, } from './components/molecules/Banner';
-export { default as Breadcrumb } from './components/molecules/Breadcrumb';
 export { default as Form } from './components/molecules/Form';
 // Organisms
 export { default as OutOfStock, OutOfStockTitle, OutOfStockMessage, } from './components/organisms/OutOfStock';

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAA;AAErC,QAAQ;AACR,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,4BAA4B,CAAA;AAG/D,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,6BAA6B,CAAA;AAGjE,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,8BAA8B,CAAA;AAGnE,YAAY;AACZ,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,oCAAoC,CAAA;AAG3E,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,qCAAqC,CAAA;AAG7E,OAAO,EACL,OAAO,IAAI,IAAI,EACf,SAAS,EACT,WAAW,EACX,WAAW,GACZ,MAAM,6BAA6B,CAAA;AAQpC,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,gCAAgC,CAAA;AAGnE,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,oCAAoC,CAAA;AAM3E,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,iCAAiC,CAAA;AAGrE,OAAO,EACL,OAAO,IAAI,MAAM,EACjB,aAAa,EACb,WAAW,EACX,UAAU,GACX,MAAM,+BAA+B,CAAA;AAQtC,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,mCAAmC,CAAA;AAGzE,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,6BAA6B,CAAA;AAG7D,YAAY;AACZ,OAAO,EACL,OAAO,IAAI,UAAU,EACrB,eAAe,EACf,iBAAiB,GAClB,MAAM,mCAAmC,CAAA;AAO1C,OAAO,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,8BAA8B,CAAA;AAG1D,QAAQ;AACR,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,mBAAmB,CAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAA;AAErC,QAAQ;AACR,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,4BAA4B,CAAA;AAG/D,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,6BAA6B,CAAA;AAGjE,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,8BAA8B,CAAA;AAGnE,YAAY;AACZ,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,oCAAoC,CAAA;AAG3E,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,qCAAqC,CAAA;AAG7E,OAAO,EACL,OAAO,IAAI,IAAI,EACf,SAAS,EACT,WAAW,EACX,WAAW,GACZ,MAAM,6BAA6B,CAAA;AAQpC,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,gCAAgC,CAAA;AAGnE,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,oCAAoC,CAAA;AAM3E,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,iCAAiC,CAAA;AAGrE,OAAO,EACL,OAAO,IAAI,MAAM,EACjB,aAAa,EACb,WAAW,EACX,UAAU,GACX,MAAM,+BAA+B,CAAA;AAQtC,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,6BAA6B,CAAA;AAG7D,YAAY;AACZ,OAAO,EACL,OAAO,IAAI,UAAU,EACrB,eAAe,EACf,iBAAiB,GAClB,MAAM,mCAAmC,CAAA;AAO1C,OAAO,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,8BAA8B,CAAA;AAG1D,QAAQ;AACR,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,mBAAmB,CAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@faststore/ui",
-  "version": "2.0.66-alpha.0",
+  "version": "2.0.70-alpha.0",
   "description": "A lightweight, framework agnostic component library for React",
   "author": "emersonlaurentino",
   "license": "MIT",
@@ -59,5 +59,5 @@
     "node": "16.18.0",
     "yarn": "1.19.1"
   },
-  "gitHead": "67c201f56dcedf4ee63b4a852264e8b147b8dff0"
+  "gitHead": "5718a199c16ee52a9446cd4090a4f564863c4243"
 }

package/src/components/molecules/Breadcrumb/styles.scss

@@ -0,0 +1,166 @@
+[data-fs-breadcrumb] {
+  // --------------------------------------------------------
+  // Design Tokens for Breadcrumb
+  // --------------------------------------------------------
+
+  // Default properties
+  --fs-breadcrumb-margin-left                         : calc(-1 * var(--fs-spacing-1));
+  --fs-breadcrumb-padding                             : var(--fs-spacing-2) 0;
+
+  // List item
+  --fs-breadcrumb-list-item-padding                   : var(--fs-spacing-0);
+  --fs-breadcrumb-list-item-last-text-color           : var(--fs-color-text-light);
+  --fs-breadcrumb-list-item-max-width-mobile          : 30%;
+
+  // Link
+  --fs-breadcrumb-link-color-visited                  : var(--fs-color-link);
+
+  // Link Home
+  --fs-breadcrumb-link-home-padding                   : var(--fs-spacing-1);
+  --fs-breadcrumb-link-home-border-radius             : var(--fs-border-radius-circle);
+  --fs-breadcrumb-link-home-hover-bkg-color           : var(--fs-color-primary-bkg-light);
+  --fs-breadcrumb-link-home-color                     : var(--fs-color-text);
+
+  // Divider
+  --fs-breadcrumb-divider-height                      : var(--fs-spacing-3);
+  --fs-breadcrumb-divider-margin                      : var(--fs-spacing-1);
+  --fs-breadcrumb-divider-border-left-width           : var(--fs-border-width);
+  --fs-breadcrumb-divider-border-left-color           : var(--fs-border-color-light);
+
+  // Dropdown Button
+  --fs-breadcrumb-dropdown-button-margin-left         : var(--fs-breadcrumb-margin-left);
+  --fs-breadcrumb-dropdown-button-color               : var(--fs-color-link);
+  --fs-breadcrumb-dropdown-button-border-radius       : var(--fs-spacing-0);
+  --fs-breadcrumb-dropdown-button-transition-property : var(--fs-transition-property);
+  --fs-breadcrumb-dropdown-button-transition-timing   : var(--fs-transition-timing);
+  --fs-breadcrumb-dropdown-button-transition-function : var(--fs-transition-function);
+
+  // --------------------------------------------------------
+  // Structural Styles
+  // --------------------------------------------------------
+
+  width: 100%;
+  padding: var(--fs-breadcrumb-padding);
+
+  @include media(">=notebook") {
+    width: 50%;
+  }
+
+  [data-fs-breadcrumb-list] {
+    display: flex;
+    align-items: center;
+    margin-left: var(--fs-breadcrumb-margin-left);
+    overflow-x: hidden;
+  }
+
+  [data-fs-breadcrumb-list-item] {
+    display: inline-flex;
+    align-items: center;
+    padding: var(--fs-breadcrumb-list-item-padding);
+
+    &:not(:first-child) {
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+
+      @include media("<=tablet") {
+        max-width: var(--fs-breadcrumb-list-item-max-width-mobile);
+      }
+    }
+
+    [data-fs-breadcrumb-link-home] {
+      display: flex;
+      align-items: center;
+      padding: var(--fs-breadcrumb-link-home-padding);
+      border-radius: var(--fs-breadcrumb-link-home-border-radius);
+
+      &:hover, &:focus {
+        background-color: var(--fs-breadcrumb-link-home-hover-bkg-color);
+      }
+
+      svg {
+        color: var(--fs-breadcrumb-link-home-color);
+      }
+    }
+
+    &:nth-child(2) {
+      overflow: visible;
+    }
+
+    &:last-child {
+      color: var(--fs-breadcrumb-list-item-last-text-color);
+    }
+
+    @include media(">=notebook") {
+      &:nth-child(3) {
+        overflow: visible;
+      }
+
+      &:nth-child(2) {
+        overflow: hidden;
+      }
+    }
+  }
+
+  [data-fs-breadcrumb-item] {
+    display: block;
+    width: 100%;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  [data-fs-breadcrumb-divider] {
+    height: var(--fs-breadcrumb-divider-height);
+    margin: var(--fs-breadcrumb-divider-margin);
+    border-left: var(--fs-breadcrumb-divider-border-left-width) solid var(--fs-breadcrumb-divider-border-left-color);
+  }
+
+  [data-fs-breadcrumb-link] {
+    padding: 0;
+
+    &:visited {
+      color: var(--fs-breadcrumb-link-color-visited);
+    }
+  }
+
+  [data-fs-breadcrumb-dropdown-button] {
+    display: flex;
+    align-items: center;
+    margin-left: var(--fs-breadcrumb-dropdown-button-margin-left);
+    color: var(--fs-breadcrumb-dropdown-button-color);
+    cursor: pointer;
+    background-color: transparent;
+    border-width: 0;
+    border-radius: var(--fs-breadcrumb-dropdown-button-border-radius);
+    transition: var(--fs-breadcrumb-dropdown-button-transition-property) var(--fs-breadcrumb-dropdown-button-transition-timing) var(--fs-breadcrumb-dropdown-button-transition-function);
+
+    &:focus, &:focus-visible {
+      @include focus-ring;
+    }
+  }
+
+  &[data-fs-breadcrumb-is-desktop="true"] {
+    @include media("<notebook") {
+      display: none;
+      visibility: hidden;
+    }
+  }
+
+  &[data-fs-breadcrumb-is-desktop="false"] {
+    @include media(">=notebook") {
+      display: none;
+      visibility: hidden;
+    }
+  }
+}
+
+[data-fs-breadcrumb-dropdown-menu] {
+  [data-fs-breadcrumb-dropdown-link] {
+    padding: 0;
+
+    &:visited {
+      color: var(--fs-breadcrumb-link-color-visited);
+    }
+  }
+}

package/src/components/molecules/SearchProductCard/styles.scss

@@ -0,0 +1,68 @@
+[data-fs-search-product-card] {
+  // --------------------------------------------------------
+  // Design Tokens for Search Product Card
+  // --------------------------------------------------------
+
+  // Link
+  --fs-search-product-card-link-padding                   : var(--fs-spacing-1) var(--fs-spacing-3);
+
+  // Image
+  --fs-search-product-card-image-border-radius            : var(--fs-border-radius);
+  --fs-search-product-card-image-margin-right             : var(--fs-spacing-3);
+  --fs-search-product-card-image-size                     : 3.5rem;
+
+  // Title
+  --fs-search-product-card-title-margin-bottom            : var(--fs-spacing-0);
+  --fs-search-product-card-title-size                     : var(--fs-text-size-2);
+  --fs-search-product-card-title-line-height              : 1.2;
+  --fs-search-product-card-title-color                    : var(--fs-color-text);
+
+  // Price
+  --fs-search-product-card-price-gap                      : var(--fs-spacing-1);
+  --fs-search-product-card-price-size                     : var(--fs-text-size-2);
+  --fs-search-product-card-price-listing-size             : var(--fs-text-size-1);
+
+  [data-fs-search-product-card-image] {
+    display: flex;
+    width: var(--fs-search-product-card-image-size);
+    height: var(--fs-search-product-card-image-size);
+    margin-right: var(--fs-search-product-card-image-margin-right);
+    overflow: hidden;
+    border-radius: var(--fs-search-product-card-image-border-radius);
+  }
+
+  [data-fs-search-product-card-title] {
+    margin-bottom: var(--fs-search-product-card-title-margin-bottom);
+    font-size: var(--fs-search-product-card-title-size);
+    font-weight: var(--fs-text-weight-bold);
+    line-height: var(--fs-search-product-card-title-line-height);
+    color: var(--fs-search-product-card-title-color);
+    text-decoration: none;
+    outline: none;
+
+    @include truncate-title;
+  }
+
+  [data-fs-search-product-card-prices] {
+    display: flex;
+    align-items: baseline;
+    column-gap: var(--fs-search-product-card-price-gap);
+
+    [data-fs-price-variant="listing"] {
+      font-size: var(--fs-search-product-card-price-listing-size);
+      line-height: 1.7;
+    }
+
+    [data-fs-price-variant="spot"] {
+      font-size: var(--fs-search-product-card-price-size);
+      color: var(--fs-product-card-price-color);
+    }
+  }
+
+  [data-fs-search-product-card-link] {
+    padding: var(--fs-search-product-card-link-padding);
+    display: flex;
+    align-items: center;
+    text-decoration: none;
+  }
+}

package/src/index.ts

@@ -55,9 +55,6 @@ export type {
   BannerLinkProps,
 } from './components/molecules/Banner'
 
-export { default as Breadcrumb } from './components/molecules/Breadcrumb'
-export type { BreadcrumbProps } from './components/molecules/Breadcrumb'
-
 export { default as Form } from './components/molecules/Form'
 export type { FormProps } from './components/molecules/Form'
 

package/src/styles/components.scss

@@ -18,6 +18,7 @@
 // Molecules
 @import "../components/molecules/Accordion/styles";
 @import "../components/molecules/Alert/styles";
+@import "../components/molecules/Breadcrumb/styles";
 @import "../components/molecules/BuyButton/styles";
 @import "../components/molecules/CartItem/styles";
 @import "../components/molecules/CheckboxField/styles";
@@ -32,6 +33,7 @@
 @import "../components/molecules/QuantitySelector/styles";
 @import "../components/molecules/RadioField/styles";
 @import "../components/molecules/Rating/styles";
+@import "../components/molecules/SearchProductCard/styles";
 @import "../components/molecules/SelectField/styles";
 @import "../components/molecules/Table/styles";
 @import "../components/molecules/Tag/styles";

package/dist/components/molecules/Breadcrumb/Breadcrumb.d.ts

@@ -1,14 +0,0 @@
-import React from 'react';
-import type { HTMLAttributes, ReactNode } from 'react';
-export interface BreadcrumbProps extends HTMLAttributes<HTMLDivElement> {
-    /**
-     * A ReactNode that will be rendered as the Divider icon.
-     */
-    divider?: ReactNode;
-    /**
-     * ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
-     */
-    testId?: string;
-}
-declare const Breadcrumb: React.ForwardRefExoticComponent<BreadcrumbProps & React.RefAttributes<HTMLDivElement>>;
-export default Breadcrumb;

package/dist/components/molecules/Breadcrumb/Breadcrumb.js

@@ -1,38 +0,0 @@
-import React, { forwardRef } from 'react';
-import { List } from '@faststore/components';
-const Divider = ({ divider, testId }) => {
-    const props = {
-        'data-breadcrumb-divider': true,
-        'aria-hidden': true,
-        'data-testid': `${testId}-divider`,
-    };
-    if (React.isValidElement(divider)) {
-        return React.cloneElement(divider, props);
-    }
-    return React.createElement("span", { ...props }, divider ?? '/');
-};
-const ListItem = ({ children, isLastItem, divider, testId, }) => {
-    const props = {
-        'data-testid': `${testId}-item`,
-        'data-breadcrumb-item': isLastItem ? 'current' : true,
-        'aria-current': isLastItem ? 'page' : undefined,
-    };
-    if (!React.isValidElement(children)) {
-        return (React.createElement("li", { "data-breadcrumb-list-item": true },
-            React.createElement("span", { ...props },
-                children,
-                isLastItem ? null : React.createElement(Divider, { divider: divider, testId: testId }))));
-    }
-    return (React.createElement("li", { "data-breadcrumb-list-item": true },
-        React.cloneElement(children, props),
-        isLastItem ? null : React.createElement(Divider, { divider: divider, testId: testId })));
-};
-const Breadcrumb = forwardRef(function Breadcrumb({ children, divider: rawDivider, testId = 'store-breadcrumb', ...otherProps }, ref) {
-    return (React.createElement("nav", { "aria-label": "Breadcrumb", role: "navigation", ref: ref, "data-fs-breadcrumb": true, "data-testid": testId, ...otherProps },
-        React.createElement(List, { as: "ol", "data-breadcrumb-list": true }, React.Children.toArray(children).map((child, index, childrenArray) => {
-            const isLastItem = index === childrenArray.length - 1;
-            return (React.createElement(ListItem, { isLastItem: isLastItem, divider: rawDivider, key: `breadcrumb-${index}`, testId: testId }, child));
-        }))));
-});
-export default Breadcrumb;
-//# sourceMappingURL=Breadcrumb.js.map

package/dist/components/molecules/Breadcrumb/Breadcrumb.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Breadcrumb.js","sourceRoot":"","sources":["../../../../src/components/molecules/Breadcrumb/Breadcrumb.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAGzC,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAA;AAa5C,MAAM,OAAO,GAAwB,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,EAAE,EAAE;IAC3D,MAAM,KAAK,GAAG;QACZ,yBAAyB,EAAE,IAAI;QAC/B,aAAa,EAAE,IAAI;QACnB,aAAa,EAAE,GAAG,MAAM,UAAU;KACnC,CAAA;IAED,IAAI,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,EAAE;QACjC,OAAO,KAAK,CAAC,YAAY,CAAC,OAAO,EAAE,KAAK,CAAC,CAAA;KAC1C;IAED,OAAO,iCAAU,KAAK,IAAG,OAAO,IAAI,GAAG,CAAQ,CAAA;AACjD,CAAC,CAAA;AASD,MAAM,QAAQ,GAAsB,CAAC,EACnC,QAAQ,EACR,UAAU,EACV,OAAO,EACP,MAAM,GACP,EAAE,EAAE;IACH,MAAM,KAAK,GAAG;QACZ,aAAa,EAAE,GAAG,MAAM,OAAO;QAC/B,sBAAsB,EAAE,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI;QACrD,cAAc,EAAE,UAAU,CAAC,CAAC,CAAE,MAAgB,CAAC,CAAC,CAAC,SAAS;KAC3D,CAAA;IAED,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,EAAE;QACnC,OAAO,CACL;YACE,iCAAU,KAAK;gBACZ,QAAQ;gBACR,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,oBAAC,OAAO,IAAC,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,GAAI,CAC7D,CACJ,CACN,CAAA;KACF;IAED,OAAO,CACL;QACG,KAAK,CAAC,YAAY,CAAC,QAAQ,EAAE,KAAK,CAAC;QACnC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,oBAAC,OAAO,IAAC,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,GAAI,CAC/D,CACN,CAAA;AACH,CAAC,CAAA;AAED,MAAM,UAAU,GAAG,UAAU,CAC3B,SAAS,UAAU,CACjB,EACE,QAAQ,EACR,OAAO,EAAE,UAAU,EACnB,MAAM,GAAG,kBAAkB,EAC3B,GAAG,UAAU,EACd,EACD,GAAG;IAEH,OAAO,CACL,2CACa,YAAY,EACvB,IAAI,EAAC,YAAY,EACjB,GAAG,EAAE,GAAG,6CAEK,MAAM,KACf,UAAU;QAEd,oBAAC,IAAI,IAAC,EAAE,EAAC,IAAI,kCACV,KAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,GAAG,CACnC,CAAC,KAAK,EAAE,KAAK,EAAE,aAAa,EAAE,EAAE;YAC9B,MAAM,UAAU,GAAG,KAAK,KAAK,aAAa,CAAC,MAAM,GAAG,CAAC,CAAA;YAErD,OAAO,CACL,oBAAC,QAAQ,IACP,UAAU,EAAE,UAAU,EACtB,OAAO,EAAE,UAAU,EACnB,GAAG,EAAE,cAAc,KAAK,EAAE,EAC1B,MAAM,EAAE,MAAM,IAEb,KAAK,CACG,CACZ,CAAA;QACH,CAAC,CACF,CACI,CACH,CACP,CAAA;AACH,CAAC,CACF,CAAA;AAED,eAAe,UAAU,CAAA"}

package/dist/components/molecules/Breadcrumb/index.d.ts

@@ -1,2 +0,0 @@
-export { default } from './Breadcrumb';
-export type { BreadcrumbProps } from './Breadcrumb';

package/dist/components/molecules/Breadcrumb/index.js

@@ -1,2 +0,0 @@
-export { default } from './Breadcrumb';
-//# sourceMappingURL=index.js.map

package/dist/components/molecules/Breadcrumb/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/molecules/Breadcrumb/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAA"}

package/src/components/molecules/Breadcrumb/Breadcrumb.tsx

@@ -1,111 +0,0 @@
-import React, { forwardRef } from 'react'
-import type { FC, HTMLAttributes, ReactNode } from 'react'
-
-import { List } from '@faststore/components'
-
-export interface BreadcrumbProps extends HTMLAttributes<HTMLDivElement> {
-  /**
-   * A ReactNode that will be rendered as the Divider icon.
-   */
-  divider?: ReactNode
-  /**
-   * ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
-   */
-  testId?: string
-}
-
-const Divider: FC<BreadcrumbProps> = ({ divider, testId }) => {
-  const props = {
-    'data-breadcrumb-divider': true,
-    'aria-hidden': true,
-    'data-testid': `${testId}-divider`,
-  }
-
-  if (React.isValidElement(divider)) {
-    return React.cloneElement(divider, props)
-  }
-
-  return <span {...props}>{divider ?? '/'}</span>
-}
-
-type ListItemProps = {
-  children: ReactNode
-  isLastItem: boolean
-  divider: BreadcrumbProps['divider']
-  testId: string
-}
-
-const ListItem: FC<ListItemProps> = ({
-  children,
-  isLastItem,
-  divider,
-  testId,
-}) => {
-  const props = {
-    'data-testid': `${testId}-item`,
-    'data-breadcrumb-item': isLastItem ? 'current' : true,
-    'aria-current': isLastItem ? ('page' as const) : undefined,
-  }
-
-  if (!React.isValidElement(children)) {
-    return (
-      <li data-breadcrumb-list-item>
-        <span {...props}>
-          {children}
-          {isLastItem ? null : <Divider divider={divider} testId={testId} />}
-        </span>
-      </li>
-    )
-  }
-
-  return (
-    <li data-breadcrumb-list-item>
-      {React.cloneElement(children, props)}
-      {isLastItem ? null : <Divider divider={divider} testId={testId} />}
-    </li>
-  )
-}
-
-const Breadcrumb = forwardRef<HTMLDivElement, BreadcrumbProps>(
-  function Breadcrumb(
-    {
-      children,
-      divider: rawDivider,
-      testId = 'store-breadcrumb',
-      ...otherProps
-    },
-    ref
-  ) {
-    return (
-      <nav
-        aria-label="Breadcrumb"
-        role="navigation"
-        ref={ref}
-        data-fs-breadcrumb
-        data-testid={testId}
-        {...otherProps}
-      >
-        <List as="ol" data-breadcrumb-list>
-          {React.Children.toArray(children).map(
-            (child, index, childrenArray) => {
-              const isLastItem = index === childrenArray.length - 1
-
-              return (
-                <ListItem
-                  isLastItem={isLastItem}
-                  divider={rawDivider}
-                  key={`breadcrumb-${index}`}
-                  testId={testId}
-                >
-                  {child}
-                </ListItem>
-              )
-            }
-          )}
-        </List>
-      </nav>
-    )
-  }
-)
-
-export default Breadcrumb

package/src/components/molecules/Breadcrumb/index.ts

@@ -1,2 +0,0 @@
-export { default } from './Breadcrumb'
-export type { BreadcrumbProps } from './Breadcrumb'