@faststore/ui 1.9.2 → 1.9.9

package/dist/molecules/Bullets/Bullets.d.ts

@@ -1,35 +1,35 @@
-import type { HTMLAttributes, MouseEvent } from 'react';
-import React from 'react';
-export interface BulletsProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onClick' | 'role'> {
-    /**
-     * Number of bullets that should be rendered.
-     */
-    totalQuantity: number;
-    /**
-     * The currently active bullet (zero-indexed).
-     */
-    activeBullet: number;
-    /**
-     * Event handler for clicks on each bullet. The handler will be called with
-     * the index of the bullet that received the click.
-     */
-    onClick: (e: MouseEvent, bulletIdx: number) => void;
-    /**
-     * ID to find this component in testing tools (e.g.: cypress,
-     * testing-library, and jest).
-     */
-    testId?: string;
-    /**
-     * Function that should be used to generate the aria-label attribute added
-     * to each bullet that is inactive. It receives the bullet index as an
-     * argument so that it can be interpolated in the generated string.
-     */
-    ariaLabelGenerator?: (index: number, isActive: boolean) => string;
-    /**
-     * Function that should be used to generate the aria-controls attribute added
-     * to each bullet. It receives the bullet index as argument and should return a string.
-     */
-    ariaControlsGenerator?: (index: number) => string;
-}
-declare const Bullets: React.ForwardRefExoticComponent<BulletsProps & React.RefAttributes<HTMLDivElement>>;
-export default Bullets;
+import type { HTMLAttributes, MouseEvent } from 'react';
+import React from 'react';
+export interface BulletsProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onClick' | 'role'> {
+    /**
+     * Number of bullets that should be rendered.
+     */
+    totalQuantity: number;
+    /**
+     * The currently active bullet (zero-indexed).
+     */
+    activeBullet: number;
+    /**
+     * Event handler for clicks on each bullet. The handler will be called with
+     * the index of the bullet that received the click.
+     */
+    onClick: (e: MouseEvent, bulletIdx: number) => void;
+    /**
+     * ID to find this component in testing tools (e.g.: cypress,
+     * testing-library, and jest).
+     */
+    testId?: string;
+    /**
+     * Function that should be used to generate the aria-label attribute added
+     * to each bullet that is inactive. It receives the bullet index as an
+     * argument so that it can be interpolated in the generated string.
+     */
+    ariaLabelGenerator?: (index: number, isActive: boolean) => string;
+    /**
+     * Function that should be used to generate the aria-controls attribute added
+     * to each bullet. It receives the bullet index as argument and should return a string.
+     */
+    ariaControlsGenerator?: (index: number) => string;
+}
+declare const Bullets: React.ForwardRefExoticComponent<BulletsProps & React.RefAttributes<HTMLDivElement>>;
+export default Bullets;

package/dist/molecules/Bullets/Bullets.js

@@ -0,0 +1,12 @@
+import React, { forwardRef, useMemo } from 'react';
+import Button from '../../atoms/Button';
+const defaultAriaLabel = (idx, isActive) => isActive ? 'Current page' : `Go to page ${idx + 1}`;
+const Bullets = forwardRef(function Bullets({ totalQuantity, activeBullet, onClick, testId = 'store-bullets', ariaLabelGenerator = defaultAriaLabel, ariaControlsGenerator, ...otherProps }, ref) {
+    const bulletIndexes = useMemo(() => Array(totalQuantity).fill(0), [totalQuantity]);
+    return (React.createElement("div", Object.assign({ ref: ref, "data-store-bullets": true, "data-testid": testId, role: "tablist" }, otherProps), bulletIndexes.map((_, idx) => {
+        const isActive = activeBullet === idx;
+        return (React.createElement(Button, { "data-bullet-item": true, role: "tab", tabIndex: -1, key: idx, testId: `${testId}-item`, onClick: (e) => onClick(e, idx), "aria-label": ariaLabelGenerator(idx, isActive), "aria-controls": ariaControlsGenerator?.(idx), "aria-selected": isActive }));
+    })));
+});
+export default Bullets;
+//# sourceMappingURL=Bullets.js.map

package/dist/molecules/Bullets/Bullets.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Bullets.js","sourceRoot":"","sources":["../../../src/molecules/Bullets/Bullets.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,OAAO,CAAA;AAElD,OAAO,MAAM,MAAM,oBAAoB,CAAA;AAmCvC,MAAM,gBAAgB,GAAG,CAAC,GAAW,EAAE,QAAiB,EAAE,EAAE,CAC1D,QAAQ,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,cAAc,GAAG,GAAG,CAAC,EAAE,CAAA;AAErD,MAAM,OAAO,GAAG,UAAU,CAA+B,SAAS,OAAO,CACvE,EACE,aAAa,EACb,YAAY,EACZ,OAAO,EACP,MAAM,GAAG,eAAe,EACxB,kBAAkB,GAAG,gBAAgB,EACrC,qBAAqB,EACrB,GAAG,UAAU,EACd,EACD,GAAG;IAEH,MAAM,aAAa,GAAG,OAAO,CAC3B,GAAG,EAAE,CAAC,KAAK,CAAC,aAAa,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,EAClC,CAAC,aAAa,CAAC,CAChB,CAAA;IAED,OAAO,CACL,2CACE,GAAG,EAAE,GAAG,6CAEK,MAAM,EACnB,IAAI,EAAC,SAAS,IACV,UAAU,GAEb,aAAa,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,GAAG,EAAE,EAAE;QAC5B,MAAM,QAAQ,GAAG,YAAY,KAAK,GAAG,CAAA;QAErC,OAAO,CACL,oBAAC,MAAM,8BAEL,IAAI,EAAC,KAAK,EACV,QAAQ,EAAE,CAAC,CAAC,EACZ,GAAG,EAAE,GAAG,EACR,MAAM,EAAE,GAAG,MAAM,OAAO,EACxB,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,OAAO,CAAC,CAAC,EAAE,GAAG,CAAC,gBACnB,kBAAkB,CAAC,GAAG,EAAE,QAAQ,CAAC,mBAC9B,qBAAqB,EAAE,CAAC,GAAG,CAAC,mBAC5B,QAAQ,GACvB,CACH,CAAA;IACH,CAAC,CAAC,CACE,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,OAAO,CAAA"}

package/dist/molecules/Bullets/index.d.ts

@@ -1,2 +1,2 @@
-export { default } from './Bullets';
-export type { BulletsProps } from './Bullets';
+export { default } from './Bullets';
+export type { BulletsProps } from './Bullets';

package/dist/molecules/Bullets/index.js

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

package/dist/molecules/Bullets/index.js.map

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

package/dist/molecules/Card/Card.d.ts

@@ -1,10 +1,10 @@
-import React from 'react';
-import type { HTMLAttributes } from 'react';
-export interface CardProps extends HTMLAttributes<HTMLDivElement> {
-    /**
-     * ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
-     */
-    testId?: string;
-}
-declare const Card: React.ForwardRefExoticComponent<CardProps & React.RefAttributes<HTMLDivElement>>;
-export default Card;
+import React from 'react';
+import type { HTMLAttributes } from 'react';
+export interface CardProps extends HTMLAttributes<HTMLDivElement> {
+    /**
+     * ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
+     */
+    testId?: string;
+}
+declare const Card: React.ForwardRefExoticComponent<CardProps & React.RefAttributes<HTMLDivElement>>;
+export default Card;

package/dist/molecules/Card/Card.js

@@ -0,0 +1,6 @@
+import React, { forwardRef } from 'react';
+const Card = forwardRef(function Card({ testId = 'store-card', children, ...otherProps }, ref) {
+    return (React.createElement("article", Object.assign({ ref: ref, "data-store-card": true, "data-testid": testId }, otherProps), children));
+});
+export default Card;
+//# sourceMappingURL=Card.js.map

package/dist/molecules/Card/Card.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Card.js","sourceRoot":"","sources":["../../../src/molecules/Card/Card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAUzC,MAAM,IAAI,GAAG,UAAU,CAA4B,SAAS,IAAI,CAC9D,EAAE,MAAM,GAAG,YAAY,EAAE,QAAQ,EAAE,GAAG,UAAU,EAAE,EAClD,GAAG;IAEH,OAAO,CACL,+CAAS,GAAG,EAAE,GAAG,0CAA+B,MAAM,IAAM,UAAU,GACnE,QAAQ,CACD,CACX,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,IAAI,CAAA"}

package/dist/molecules/Card/CardActions.d.ts

@@ -1,10 +1,10 @@
-import React from 'react';
-import type { HTMLAttributes } from 'react';
-export interface CardActionsProps extends HTMLAttributes<HTMLDivElement> {
-    /**
-     * ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
-     */
-    testId?: string;
-}
-declare const CardActions: React.ForwardRefExoticComponent<CardActionsProps & React.RefAttributes<HTMLDivElement>>;
-export default CardActions;
+import React from 'react';
+import type { HTMLAttributes } from 'react';
+export interface CardActionsProps extends HTMLAttributes<HTMLDivElement> {
+    /**
+     * ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
+     */
+    testId?: string;
+}
+declare const CardActions: React.ForwardRefExoticComponent<CardActionsProps & React.RefAttributes<HTMLDivElement>>;
+export default CardActions;

package/dist/molecules/Card/CardActions.js

@@ -0,0 +1,6 @@
+import React, { forwardRef } from 'react';
+const CardActions = forwardRef(function CardActions({ testId = 'store-card-actions', children, ...otherProps }, ref) {
+    return (React.createElement("div", Object.assign({ ref: ref, "data-card-actions": true, "data-testid": testId }, otherProps), children));
+});
+export default CardActions;
+//# sourceMappingURL=CardActions.js.map

package/dist/molecules/Card/CardActions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CardActions.js","sourceRoot":"","sources":["../../../src/molecules/Card/CardActions.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAUzC,MAAM,WAAW,GAAG,UAAU,CAC5B,SAAS,WAAW,CAClB,EAAE,MAAM,GAAG,oBAAoB,EAAE,QAAQ,EAAE,GAAG,UAAU,EAAE,EAC1D,GAAG;IAEH,OAAO,CACL,2CAAK,GAAG,EAAE,GAAG,4CAAiC,MAAM,IAAM,UAAU,GACjE,QAAQ,CACL,CACP,CAAA;AACH,CAAC,CACF,CAAA;AAED,eAAe,WAAW,CAAA"}

package/dist/molecules/Card/CardContent.d.ts

@@ -1,10 +1,10 @@
-import type { HTMLAttributes } from 'react';
-import React from 'react';
-export interface CardContentProps extends HTMLAttributes<HTMLElement> {
-    /**
-     * ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
-     */
-    testId?: string;
-}
-declare const CardContent: React.ForwardRefExoticComponent<CardContentProps & React.RefAttributes<HTMLElement>>;
-export default CardContent;
+import type { HTMLAttributes } from 'react';
+import React from 'react';
+export interface CardContentProps extends HTMLAttributes<HTMLElement> {
+    /**
+     * ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
+     */
+    testId?: string;
+}
+declare const CardContent: React.ForwardRefExoticComponent<CardContentProps & React.RefAttributes<HTMLElement>>;
+export default CardContent;

package/dist/molecules/Card/CardContent.js

@@ -0,0 +1,6 @@
+import React, { forwardRef } from 'react';
+const CardContent = forwardRef(function CardContent({ testId = 'store-card-content', children, ...otherProps }, ref) {
+    return (React.createElement("section", Object.assign({ ref: ref, "data-card-content": true, "data-testid": testId }, otherProps), children));
+});
+export default CardContent;
+//# sourceMappingURL=CardContent.js.map

package/dist/molecules/Card/CardContent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CardContent.js","sourceRoot":"","sources":["../../../src/molecules/Card/CardContent.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AASzC,MAAM,WAAW,GAAG,UAAU,CAC5B,SAAS,WAAW,CAClB,EAAE,MAAM,GAAG,oBAAoB,EAAE,QAAQ,EAAE,GAAG,UAAU,EAAE,EAC1D,GAAG;IAEH,OAAO,CACL,+CAAS,GAAG,EAAE,GAAG,4CAAiC,MAAM,IAAM,UAAU,GACrE,QAAQ,CACD,CACX,CAAA;AACH,CAAC,CACF,CAAA;AAED,eAAe,WAAW,CAAA"}

package/dist/molecules/Card/CardImage.d.ts

@@ -1,10 +1,10 @@
-import type { HTMLAttributes } from 'react';
-import React from 'react';
-export interface CardImageProps extends HTMLAttributes<HTMLDivElement> {
-    /**
-     * ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
-     */
-    testId?: string;
-}
-declare const CardImage: React.ForwardRefExoticComponent<CardImageProps & React.RefAttributes<HTMLDivElement>>;
-export default CardImage;
+import type { HTMLAttributes } from 'react';
+import React from 'react';
+export interface CardImageProps extends HTMLAttributes<HTMLDivElement> {
+    /**
+     * ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
+     */
+    testId?: string;
+}
+declare const CardImage: React.ForwardRefExoticComponent<CardImageProps & React.RefAttributes<HTMLDivElement>>;
+export default CardImage;

package/dist/molecules/Card/CardImage.js

@@ -0,0 +1,6 @@
+import React, { forwardRef } from 'react';
+const CardImage = forwardRef(function CardImage({ testId = 'store-card-image', children, ...otherProps }, ref) {
+    return (React.createElement("div", Object.assign({ ref: ref, "data-card-image": true, "data-testid": testId }, otherProps), children));
+});
+export default CardImage;
+//# sourceMappingURL=CardImage.js.map

package/dist/molecules/Card/CardImage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CardImage.js","sourceRoot":"","sources":["../../../src/molecules/Card/CardImage.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AASzC,MAAM,SAAS,GAAG,UAAU,CAAiC,SAAS,SAAS,CAC7E,EAAE,MAAM,GAAG,kBAAkB,EAAE,QAAQ,EAAE,GAAG,UAAU,EAAE,EACxD,GAAG;IAEH,OAAO,CACL,2CAAK,GAAG,EAAE,GAAG,0CAA+B,MAAM,IAAM,UAAU,GAC/D,QAAQ,CACL,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,SAAS,CAAA"}

package/dist/molecules/Card/index.d.ts

@@ -1,8 +1,8 @@
-export { default } from './Card';
-export type { CardProps } from './Card';
-export { default as CardImage } from './CardImage';
-export type { CardImageProps } from './CardImage';
-export { default as CardContent } from './CardContent';
-export type { CardContentProps } from './CardContent';
-export { default as CardActions } from './CardActions';
-export type { CardActionsProps } from './CardActions';
+export { default } from './Card';
+export type { CardProps } from './Card';
+export { default as CardImage } from './CardImage';
+export type { CardImageProps } from './CardImage';
+export { default as CardContent } from './CardContent';
+export type { CardContentProps } from './CardContent';
+export { default as CardActions } from './CardActions';
+export type { CardActionsProps } from './CardActions';

package/dist/molecules/Card/index.js

@@ -0,0 +1,5 @@
+export { default } from './Card';
+export { default as CardImage } from './CardImage';
+export { default as CardContent } from './CardContent';
+export { default as CardActions } from './CardActions';
+//# sourceMappingURL=index.js.map

package/dist/molecules/Card/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/molecules/Card/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAA;AAGhC,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAA;AAGlD,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAA;AAGtD,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAA"}

package/dist/molecules/Carousel/Arrows.d.ts

@@ -1,12 +1,12 @@
-/// <reference types="react" />
-interface IconProps {
-    size?: {
-        width: number;
-        height: number;
-    };
-    viewBox?: string;
-    color?: string;
-}
-export declare const LeftArrowIcon: ({ size, viewBox, color, }: IconProps) => JSX.Element;
-export declare const RightArrowIcon: ({ size, viewBox, color, }: IconProps) => JSX.Element;
-export {};
+/// <reference types="react" />
+interface IconProps {
+    size?: {
+        width: number;
+        height: number;
+    };
+    viewBox?: string;
+    color?: string;
+}
+export declare const LeftArrowIcon: ({ size, viewBox, color, }: IconProps) => JSX.Element;
+export declare const RightArrowIcon: ({ size, viewBox, color, }: IconProps) => JSX.Element;
+export {};

package/dist/molecules/Carousel/Arrows.js

@@ -0,0 +1,6 @@
+import React from 'react';
+export const LeftArrowIcon = ({ size = { width: 25, height: 25 }, viewBox = '0 0 16 16', color = 'currentColor', }) => (React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", xmlnsXlink: "http://www.w3.org/1999/xlink", viewBox: viewBox, width: size.width, height: size.height },
+    React.createElement("path", { d: "M11 1L4 8L11 15", strokeWidth: "2", strokeMiterlimit: "10", strokeLinecap: "round", strokeLinejoin: "round", stroke: color, fill: "none" })));
+export const RightArrowIcon = ({ size = { width: 25, height: 25 }, viewBox = '0 0 16 16', color = 'currentColor', }) => (React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", xmlnsXlink: "http://www.w3.org/1999/xlink", viewBox: viewBox, width: size.width, height: size.height },
+    React.createElement("path", { d: "M5 15L12 8L5 1", strokeWidth: "2", strokeMiterlimit: "10", strokeLinecap: "round", strokeLinejoin: "round", stroke: color, fill: "none" })));
+//# sourceMappingURL=Arrows.js.map

package/dist/molecules/Carousel/Arrows.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Arrows.js","sourceRoot":"","sources":["../../../src/molecules/Carousel/Arrows.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAWzB,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,EAC5B,IAAI,GAAG,EAAE,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,EAChC,OAAO,GAAG,WAAW,EACrB,KAAK,GAAG,cAAc,GACZ,EAAE,EAAE,CAAC,CACf,6BACE,KAAK,EAAC,4BAA4B,EAClC,UAAU,EAAC,8BAA8B,EACzC,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,MAAM,EAAE,IAAI,CAAC,MAAM;IAEnB,8BACE,CAAC,EAAC,iBAAiB,EACnB,WAAW,EAAC,GAAG,EACf,gBAAgB,EAAC,IAAI,EACrB,aAAa,EAAC,OAAO,EACrB,cAAc,EAAC,OAAO,EACtB,MAAM,EAAE,KAAK,EACb,IAAI,EAAC,MAAM,GACX,CACE,CACP,CAAA;AAED,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,EAC7B,IAAI,GAAG,EAAE,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,EAChC,OAAO,GAAG,WAAW,EACrB,KAAK,GAAG,cAAc,GACZ,EAAE,EAAE,CAAC,CACf,6BACE,KAAK,EAAC,4BAA4B,EAClC,UAAU,EAAC,8BAA8B,EACzC,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,MAAM,EAAE,IAAI,CAAC,MAAM;IAEnB,8BACE,CAAC,EAAC,gBAAgB,EAClB,WAAW,EAAC,GAAG,EACf,gBAAgB,EAAC,IAAI,EACrB,aAAa,EAAC,OAAO,EACrB,cAAc,EAAC,OAAO,EACtB,MAAM,EAAE,KAAK,EACb,IAAI,EAAC,MAAM,GACX,CACE,CACP,CAAA"}

package/dist/molecules/Carousel/Carousel.d.ts

@@ -1,16 +1,16 @@
-import type { PropsWithChildren } from 'react';
-import type { SwipeableProps } from 'react-swipeable';
-export interface CarouselProps extends SwipeableProps {
-    id?: string;
-    testId?: string;
-    infiniteMode?: boolean;
-    controls?: 'complete' | 'navigationArrows' | 'paginationBullets';
-    transition?: {
-        duration: number;
-        property: string;
-        delay?: number;
-        timing?: string;
-    };
-}
-declare function Carousel({ infiniteMode, controls, testId, transition, children, id, ...swipeableConfigOverrides }: PropsWithChildren<CarouselProps>): JSX.Element;
-export default Carousel;
+import type { PropsWithChildren } from 'react';
+import type { SwipeableProps } from 'react-swipeable';
+export interface CarouselProps extends SwipeableProps {
+    id?: string;
+    testId?: string;
+    infiniteMode?: boolean;
+    controls?: 'complete' | 'navigationArrows' | 'paginationBullets';
+    transition?: {
+        duration: number;
+        property: string;
+        delay?: number;
+        timing?: string;
+    };
+}
+declare function Carousel({ infiniteMode, controls, testId, transition, children, id, ...swipeableConfigOverrides }: PropsWithChildren<CarouselProps>): JSX.Element;
+export default Carousel;

package/dist/molecules/Carousel/Carousel.js

@@ -0,0 +1,124 @@
+import React, { useMemo } from 'react';
+import { RightArrowIcon, LeftArrowIcon } from './Arrows';
+import useSlider from '../../hooks/useSlider/useSlider';
+import useSlideVisibility from './hooks/useSlideVisibility';
+import Bullets from '../Bullets';
+import IconButton from '../IconButton';
+const createTransformValues = (infinite, totalItems) => {
+    const transformMap = {};
+    const slideWidth = 100 / totalItems;
+    for (let idx = 0; idx < totalItems; ++idx) {
+        const currIdx = infinite ? idx - 1 : idx;
+        const transformValue = -(slideWidth * idx);
+        transformMap[currIdx] = transformValue;
+    }
+    return transformMap;
+};
+function Carousel({ infiniteMode = true, controls = 'complete', testId = 'store-carousel', transition = {
+    duration: 400,
+    property: 'transform',
+}, children, id = 'store-carousel', ...swipeableConfigOverrides }) {
+    const childrenArray = React.Children.toArray(children);
+    const childrenCount = childrenArray.length;
+    const numberOfSlides = infiniteMode ? childrenCount + 2 : childrenCount;
+    const slidingTransition = `${transition.property} ${transition.duration}ms ${transition.timing ?? ''} ${transition.delay ?? ''}`;
+    const showNavigationArrows = controls === 'complete' || controls === 'navigationArrows';
+    const showPaginationBullets = controls === 'complete' || controls === 'paginationBullets';
+    const transformValues = useMemo(() => createTransformValues(infiniteMode, numberOfSlides), [numberOfSlides, infiniteMode]);
+    const { handlers, slide, sliderState, sliderDispatch } = useSlider({
+        totalItems: childrenCount,
+        itemsPerPage: 1,
+        infiniteMode,
+        ...swipeableConfigOverrides,
+    });
+    const { isItemVisible, shouldRenderItem } = useSlideVisibility({
+        itemsPerPage: sliderState.itemsPerPage,
+        currentSlide: sliderState.currentItem,
+        totalItems: childrenCount,
+    });
+    const postRenderedSlides = infiniteMode && children ? childrenArray.slice(0, 1) : [];
+    const preRenderedSlides = infiniteMode && children ? childrenArray.slice(childrenCount - 1) : [];
+    const slides = preRenderedSlides.concat(children ?? [], postRenderedSlides);
+    const slidePrevious = () => {
+        if (sliderState.sliding ||
+            (!infiniteMode && sliderState.currentPage === 0)) {
+            return;
+        }
+        slide('previous', sliderDispatch);
+    };
+    const slideNext = () => {
+        if (sliderState.sliding ||
+            (!infiniteMode && sliderState.currentPage === childrenCount - 1)) {
+            return;
+        }
+        slide('next', sliderDispatch);
+    };
+    // accessible behavior for tablist
+    const handleBulletsKeyDown = (event) => {
+        switch (event.key) {
+            case 'ArrowLeft': {
+                slidePrevious();
+                break;
+            }
+            case 'ArrowRight': {
+                slideNext();
+                break;
+            }
+            case 'Home': {
+                slide(0, sliderDispatch);
+                break;
+            }
+            case 'End': {
+                slide(childrenCount - 1, sliderDispatch);
+                break;
+            }
+            default:
+        }
+    };
+    return (React.createElement("section", { id: id, "data-store-carousel": true, "data-testid": testId, "aria-label": "carousel", "aria-roledescription": "carousel" },
+        React.createElement("div", Object.assign({ "data-carousel-track-container": true, style: { overflow: 'hidden', width: '100%' } }, handlers),
+            React.createElement("div", { "data-carousel-track": true, style: {
+                    display: 'flex',
+                    transition: sliderState.sliding ? slidingTransition : undefined,
+                    width: `${numberOfSlides * 100}%`,
+                    transform: `translate3d(${transformValues[sliderState.currentPage]}%, 0, 0)`,
+                }, onTransitionEnd: () => {
+                    sliderDispatch({
+                        type: 'STOP_SLIDE',
+                    });
+                    if (sliderState.currentItem >= childrenCount) {
+                        sliderDispatch({
+                            type: 'GO_TO_PAGE',
+                            payload: {
+                                pageIndex: 0,
+                                shouldSlide: false,
+                            },
+                        });
+                    }
+                    if (sliderState.currentItem < 0) {
+                        sliderDispatch({
+                            type: 'GO_TO_PAGE',
+                            payload: {
+                                pageIndex: sliderState.totalPages - 1,
+                                shouldSlide: false,
+                            },
+                        });
+                    }
+                }, "aria-live": "polite" }, slides.map((currentSlide, idx) => (React.createElement("div", { role: "tabpanel", "aria-roledescription": "slide", key: idx, id: `carousel-item-${idx}`, "data-carousel-item": true, style: { width: '100%' }, "data-visible": isItemVisible(idx - Number(infiniteMode)) || undefined }, shouldRenderItem(idx - Number(infiniteMode))
+                ? currentSlide
+                : null))))),
+        showNavigationArrows && (React.createElement("div", { "data-carousel-controls": true },
+            React.createElement(IconButton, { "aria-label": "previous", "data-arrow": "left", "aria-controls": id, onClick: slidePrevious, icon: React.createElement(LeftArrowIcon, null) }),
+            React.createElement(IconButton, { "aria-label": "next", "data-arrow": "right", "aria-controls": id, onClick: slideNext, icon: React.createElement(RightArrowIcon, null) }))),
+        showPaginationBullets && (React.createElement("div", { "data-carousel-bullets": true },
+            React.createElement(Bullets, { tabIndex: 0, totalQuantity: childrenCount, activeBullet: sliderState.currentPage, onClick: (_, idx) => {
+                    if (sliderState.sliding) {
+                        return;
+                    }
+                    slide(idx, sliderDispatch);
+                }, ariaControlsGenerator: (idx) => `carousel-item-${idx}`, onKeyDown: handleBulletsKeyDown, onFocus: (event) => {
+                    event.currentTarget.focus();
+                } })))));
+}
+export default Carousel;
+//# sourceMappingURL=Carousel.js.map

package/dist/molecules/Carousel/Carousel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Carousel.js","sourceRoot":"","sources":["../../../src/molecules/Carousel/Carousel.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAA;AAGtC,OAAO,EAAE,cAAc,EAAE,aAAa,EAAE,MAAM,UAAU,CAAA;AACxD,OAAO,SAAS,MAAM,iCAAiC,CAAA;AACvD,OAAO,kBAAkB,MAAM,4BAA4B,CAAA;AAC3D,OAAO,OAAO,MAAM,YAAY,CAAA;AAChC,OAAO,UAAU,MAAM,eAAe,CAAA;AAEtC,MAAM,qBAAqB,GAAG,CAAC,QAAiB,EAAE,UAAkB,EAAE,EAAE;IACtE,MAAM,YAAY,GAA2B,EAAE,CAAA;IAC/C,MAAM,UAAU,GAAG,GAAG,GAAG,UAAU,CAAA;IAEnC,KAAK,IAAI,GAAG,GAAG,CAAC,EAAE,GAAG,GAAG,UAAU,EAAE,EAAE,GAAG,EAAE;QACzC,MAAM,OAAO,GAAG,QAAQ,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,CAAA;QACxC,MAAM,cAAc,GAAG,CAAC,CAAC,UAAU,GAAG,GAAG,CAAC,CAAA;QAE1C,YAAY,CAAC,OAAO,CAAC,GAAG,cAAc,CAAA;KACvC;IAED,OAAO,YAAY,CAAA;AACrB,CAAC,CAAA;AAeD,SAAS,QAAQ,CAAC,EAChB,YAAY,GAAG,IAAI,EACnB,QAAQ,GAAG,UAAU,EACrB,MAAM,GAAG,gBAAgB,EACzB,UAAU,GAAG;IACX,QAAQ,EAAE,GAAG;IACb,QAAQ,EAAE,WAAW;CACtB,EACD,QAAQ,EACR,EAAE,GAAG,gBAAgB,EACrB,GAAG,wBAAwB,EACM;IACjC,MAAM,aAAa,GAAG,KAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAA;IACtD,MAAM,aAAa,GAAG,aAAa,CAAC,MAAM,CAAA;IAC1C,MAAM,cAAc,GAAG,YAAY,CAAC,CAAC,CAAC,aAAa,GAAG,CAAC,CAAC,CAAC,CAAC,aAAa,CAAA;IACvE,MAAM,iBAAiB,GAAG,GAAG,UAAU,CAAC,QAAQ,IAAI,UAAU,CAAC,QAAQ,MACrE,UAAU,CAAC,MAAM,IAAI,EACvB,IAAI,UAAU,CAAC,KAAK,IAAI,EAAE,EAAE,CAAA;IAE5B,MAAM,oBAAoB,GACxB,QAAQ,KAAK,UAAU,IAAI,QAAQ,KAAK,kBAAkB,CAAA;IAE5D,MAAM,qBAAqB,GACzB,QAAQ,KAAK,UAAU,IAAI,QAAQ,KAAK,mBAAmB,CAAA;IAE7D,MAAM,eAAe,GAAG,OAAO,CAC7B,GAAG,EAAE,CAAC,qBAAqB,CAAC,YAAY,EAAE,cAAc,CAAC,EACzD,CAAC,cAAc,EAAE,YAAY,CAAC,CAC/B,CAAA;IAED,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,WAAW,EAAE,cAAc,EAAE,GAAG,SAAS,CAAC;QACjE,UAAU,EAAE,aAAa;QACzB,YAAY,EAAE,CAAC;QACf,YAAY;QACZ,GAAG,wBAAwB;KAC5B,CAAC,CAAA;IAEF,MAAM,EAAE,aAAa,EAAE,gBAAgB,EAAE,GAAG,kBAAkB,CAAC;QAC7D,YAAY,EAAE,WAAW,CAAC,YAAY;QACtC,YAAY,EAAE,WAAW,CAAC,WAAW;QACrC,UAAU,EAAE,aAAa;KAC1B,CAAC,CAAA;IAEF,MAAM,kBAAkB,GACtB,YAAY,IAAI,QAAQ,CAAC,CAAC,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAA;IAE3D,MAAM,iBAAiB,GACrB,YAAY,IAAI,QAAQ,CAAC,CAAC,CAAC,aAAa,CAAC,KAAK,CAAC,aAAa,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAA;IAExE,MAAM,MAAM,GAAG,iBAAiB,CAAC,MAAM,CACpC,QAAgB,IAAI,EAAE,EACvB,kBAAkB,CACnB,CAAA;IAED,MAAM,aAAa,GAAG,GAAG,EAAE;QACzB,IACE,WAAW,CAAC,OAAO;YACnB,CAAC,CAAC,YAAY,IAAI,WAAW,CAAC,WAAW,KAAK,CAAC,CAAC,EAChD;YACA,OAAM;SACP;QAED,KAAK,CAAC,UAAU,EAAE,cAAc,CAAC,CAAA;IACnC,CAAC,CAAA;IAED,MAAM,SAAS,GAAG,GAAG,EAAE;QACrB,IACE,WAAW,CAAC,OAAO;YACnB,CAAC,CAAC,YAAY,IAAI,WAAW,CAAC,WAAW,KAAK,aAAa,GAAG,CAAC,CAAC,EAChE;YACA,OAAM;SACP;QAED,KAAK,CAAC,MAAM,EAAE,cAAc,CAAC,CAAA;IAC/B,CAAC,CAAA;IAED,kCAAkC;IAClC,MAAM,oBAAoB,GAAG,CAAC,KAAoB,EAAE,EAAE;QACpD,QAAQ,KAAK,CAAC,GAAG,EAAE;YACjB,KAAK,WAAW,CAAC,CAAC;gBAChB,aAAa,EAAE,CAAA;gBACf,MAAK;aACN;YAED,KAAK,YAAY,CAAC,CAAC;gBACjB,SAAS,EAAE,CAAA;gBACX,MAAK;aACN;YAED,KAAK,MAAM,CAAC,CAAC;gBACX,KAAK,CAAC,CAAC,EAAE,cAAc,CAAC,CAAA;gBACxB,MAAK;aACN;YAED,KAAK,KAAK,CAAC,CAAC;gBACV,KAAK,CAAC,aAAa,GAAG,CAAC,EAAE,cAAc,CAAC,CAAA;gBACxC,MAAK;aACN;YAED,QAAQ;SACT;IACH,CAAC,CAAA;IAED,OAAO,CACL,iCACE,EAAE,EAAE,EAAE,8CAEO,MAAM,gBACR,UAAU,0BACA,UAAU;QAE/B,kFAEE,KAAK,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,EAAE,IACxC,QAAQ;YAEZ,0DAEE,KAAK,EAAE;oBACL,OAAO,EAAE,MAAM;oBACf,UAAU,EAAE,WAAW,CAAC,OAAO,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,SAAS;oBAC/D,KAAK,EAAE,GAAG,cAAc,GAAG,GAAG,GAAG;oBACjC,SAAS,EAAE,eACT,eAAe,CAAC,WAAW,CAAC,WAAW,CACzC,UAAU;iBACX,EACD,eAAe,EAAE,GAAG,EAAE;oBACpB,cAAc,CAAC;wBACb,IAAI,EAAE,YAAY;qBACnB,CAAC,CAAA;oBAEF,IAAI,WAAW,CAAC,WAAW,IAAI,aAAa,EAAE;wBAC5C,cAAc,CAAC;4BACb,IAAI,EAAE,YAAY;4BAClB,OAAO,EAAE;gCACP,SAAS,EAAE,CAAC;gCACZ,WAAW,EAAE,KAAK;6BACnB;yBACF,CAAC,CAAA;qBACH;oBAED,IAAI,WAAW,CAAC,WAAW,GAAG,CAAC,EAAE;wBAC/B,cAAc,CAAC;4BACb,IAAI,EAAE,YAAY;4BAClB,OAAO,EAAE;gCACP,SAAS,EAAE,WAAW,CAAC,UAAU,GAAG,CAAC;gCACrC,WAAW,EAAE,KAAK;6BACnB;yBACF,CAAC,CAAA;qBACH;gBACH,CAAC,eACS,QAAQ,IAEjB,MAAM,CAAC,GAAG,CAAC,CAAC,YAAY,EAAE,GAAG,EAAE,EAAE,CAAC,CACjC,6BACE,IAAI,EAAC,UAAU,0BACM,OAAO,EAC5B,GAAG,EAAE,GAAG,EACR,EAAE,EAAE,iBAAiB,GAAG,EAAE,8BAE1B,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,kBAEtB,aAAa,CAAC,GAAG,GAAG,MAAM,CAAC,YAAY,CAAC,CAAC,IAAI,SAAS,IAGvD,gBAAgB,CAAC,GAAG,GAAG,MAAM,CAAC,YAAY,CAAC,CAAC;gBAC3C,CAAC,CAAC,YAAY;gBACd,CAAC,CAAC,IAAI,CACJ,CACP,CAAC,CACE,CACF;QAEL,oBAAoB,IAAI,CACvB;YACE,oBAAC,UAAU,kBACE,UAAU,gBACV,MAAM,mBACF,EAAE,EACjB,OAAO,EAAE,aAAa,EACtB,IAAI,EAAE,oBAAC,aAAa,OAAG,GACvB;YACF,oBAAC,UAAU,kBACE,MAAM,gBACN,OAAO,mBACH,EAAE,EACjB,OAAO,EAAE,SAAS,EAClB,IAAI,EAAE,oBAAC,cAAc,OAAG,GACxB,CACE,CACP;QAEA,qBAAqB,IAAI,CACxB;YACE,oBAAC,OAAO,IACN,QAAQ,EAAE,CAAC,EACX,aAAa,EAAE,aAAa,EAC5B,YAAY,EAAE,WAAW,CAAC,WAAW,EACrC,OAAO,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,EAAE;oBAClB,IAAI,WAAW,CAAC,OAAO,EAAE;wBACvB,OAAM;qBACP;oBAED,KAAK,CAAC,GAAG,EAAE,cAAc,CAAC,CAAA;gBAC5B,CAAC,EACD,qBAAqB,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,iBAAiB,GAAG,EAAE,EACtD,SAAS,EAAE,oBAAoB,EAC/B,OAAO,EAAE,CAAC,KAAK,EAAE,EAAE;oBACjB,KAAK,CAAC,aAAa,CAAC,KAAK,EAAE,CAAA;gBAC7B,CAAC,GACD,CACE,CACP,CACO,CACX,CAAA;AACH,CAAC;AAED,eAAe,QAAQ,CAAA"}

package/dist/molecules/Carousel/hooks/useSlideVisibility.d.ts

@@ -1,9 +1,9 @@
-export interface UseSlideVisibilityArgs {
-    currentSlide: number;
-    itemsPerPage: number;
-    totalItems: number;
-}
-export default function useSlideVisibility({ currentSlide, itemsPerPage, totalItems, }: UseSlideVisibilityArgs): {
-    shouldRenderItem: (index: number) => boolean;
-    isItemVisible: (index: number) => boolean;
-};
+export interface UseSlideVisibilityArgs {
+    currentSlide: number;
+    itemsPerPage: number;
+    totalItems: number;
+}
+export default function useSlideVisibility({ currentSlide, itemsPerPage, totalItems, }: UseSlideVisibilityArgs): {
+    shouldRenderItem: (index: number) => boolean;
+    isItemVisible: (index: number) => boolean;
+};

package/dist/molecules/Carousel/hooks/useSlideVisibility.js

@@ -0,0 +1,29 @@
+import { useRef, useEffect } from 'react';
+function isSlideVisible({ itemsPerPage, currentSlide, slideIdx, totalItems, }) {
+    const isClonedSlide = currentSlide < 0 || currentSlide >= totalItems;
+    const isVisible = slideIdx >= currentSlide && slideIdx < currentSlide + itemsPerPage;
+    return isClonedSlide || isVisible;
+}
+export default function useSlideVisibility({ currentSlide, itemsPerPage, totalItems, }) {
+    /** Keeps track of slides that have been visualized before.
+     * We want to keep rendering them because the issue is mostly rendering
+     * slides that might never be viewed; On the other hand, hiding slides
+     * that were visible causes visual glitches */
+    const visitedSlides = useRef(new Set());
+    useEffect(() => {
+        for (let i = 0; i < itemsPerPage; i++) {
+            visitedSlides.current.add(currentSlide + i);
+        }
+    }, [currentSlide, itemsPerPage]);
+    const isItemVisible = (index) => isSlideVisible({
+        slideIdx: index,
+        currentSlide,
+        itemsPerPage,
+        totalItems,
+    });
+    const shouldRenderItem = (index) => {
+        return visitedSlides.current.has(index) || isItemVisible(index);
+    };
+    return { shouldRenderItem, isItemVisible };
+}
+//# sourceMappingURL=useSlideVisibility.js.map

package/dist/molecules/Carousel/hooks/useSlideVisibility.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSlideVisibility.js","sourceRoot":"","sources":["../../../../src/molecules/Carousel/hooks/useSlideVisibility.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAezC,SAAS,cAAc,CAAC,EACtB,YAAY,EACZ,YAAY,EACZ,QAAQ,EACR,UAAU,GACS;IACnB,MAAM,aAAa,GAAG,YAAY,GAAG,CAAC,IAAI,YAAY,IAAI,UAAU,CAAA;IACpE,MAAM,SAAS,GACb,QAAQ,IAAI,YAAY,IAAI,QAAQ,GAAG,YAAY,GAAG,YAAY,CAAA;IAEpE,OAAO,aAAa,IAAI,SAAS,CAAA;AACnC,CAAC;AAED,MAAM,CAAC,OAAO,UAAU,kBAAkB,CAAC,EACzC,YAAY,EACZ,YAAY,EACZ,UAAU,GACa;IACvB;;;kDAG8C;IAC9C,MAAM,aAAa,GAAG,MAAM,CAAc,IAAI,GAAG,EAAE,CAAC,CAAA;IAEpD,SAAS,CAAC,GAAG,EAAE;QACb,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,YAAY,EAAE,CAAC,EAAE,EAAE;YACrC,aAAa,CAAC,OAAO,CAAC,GAAG,CAAC,YAAY,GAAG,CAAC,CAAC,CAAA;SAC5C;IACH,CAAC,EAAE,CAAC,YAAY,EAAE,YAAY,CAAC,CAAC,CAAA;IAEhC,MAAM,aAAa,GAAG,CAAC,KAAa,EAAE,EAAE,CACtC,cAAc,CAAC;QACb,QAAQ,EAAE,KAAK;QACf,YAAY;QACZ,YAAY;QACZ,UAAU;KACX,CAAC,CAAA;IAEJ,MAAM,gBAAgB,GAAG,CAAC,KAAa,EAAE,EAAE;QACzC,OAAO,aAAa,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC,IAAI,aAAa,CAAC,KAAK,CAAC,CAAA;IACjE,CAAC,CAAA;IAED,OAAO,EAAE,gBAAgB,EAAE,aAAa,EAAE,CAAA;AAC5C,CAAC"}

package/dist/molecules/Carousel/index.d.ts

@@ -1,2 +1,2 @@
-export { default } from './Carousel';
-export * from './Carousel';
+export { default } from './Carousel';
+export * from './Carousel';

package/dist/molecules/Carousel/index.js

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

package/dist/molecules/Carousel/index.js.map

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

package/dist/molecules/Dropdown/Dropdown.d.ts

@@ -1,9 +1,9 @@
-import type { ReactNode } from 'react';
-export declare type DropdownProps = {
-    children: ReactNode;
-    onDismiss?(): void;
-    isOpen?: boolean;
-    id?: string;
-};
-declare const Dropdown: ({ children, isOpen: isOpenDefault, onDismiss, id, }: DropdownProps) => JSX.Element;
-export default Dropdown;
+import type { ReactNode } from 'react';
+export declare type DropdownProps = {
+    children: ReactNode;
+    onDismiss?(): void;
+    isOpen?: boolean;
+    id?: string;
+};
+declare const Dropdown: ({ children, isOpen: isOpenDefault, onDismiss, id, }: DropdownProps) => JSX.Element;
+export default Dropdown;