@faststore/ui 2.0.37-alpha.0 → 2.0.38-alpha.0

package/CHANGELOG.md

@@ -3,6 +3,15 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [2.0.38-alpha.0](https://github.com/vtex/faststore/compare/v2.0.37-alpha.0...v2.0.38-alpha.0) (2023-01-09)
+
+
+### Features
+
+* Adds `Accordion` component  ([#1567](https://github.com/vtex/faststore/issues/1567)) ([0173e20](https://github.com/vtex/faststore/commit/0173e20b162d53d8faae0791e08110f335c6d6f6))
+
+
+
 ## 2.0.37-alpha.0 (2023-01-06)
 
 

package/dist/index.d.ts

@@ -47,8 +47,6 @@ export { default as PriceRange } from './components/molecules/PriceRange';
 export type { PriceRangeProps } from './components/molecules/PriceRange';
 export { default as RadioGroup, RadioOption, } from './components/molecules/RadioGroup';
 export type { RadioGroupProps, RadioOptionProps, } from './components/molecules/RadioGroup';
-export { default as Accordion, AccordionItem, AccordionButton, AccordionPanel, } from './components/molecules/Accordion';
-export type { AccordionProps, AccordionItemProps, AccordionButtonProps, AccordionPanelProps, } from './components/molecules/Accordion';
 export { default as Form } from './components/molecules/Form';
 export type { FormProps } from './components/molecules/Form';
 export { default as Alert } from './components/molecules/Alert';

package/dist/index.js

@@ -25,7 +25,6 @@ export { default as Breadcrumb } from './components/molecules/Breadcrumb';
 export { default as LoadingButton } from './components/molecules/LoadingButton';
 export { default as PriceRange } from './components/molecules/PriceRange';
 export { default as RadioGroup, RadioOption, } from './components/molecules/RadioGroup';
-export { default as Accordion, AccordionItem, AccordionButton, AccordionPanel, } from './components/molecules/Accordion';
 export { default as Form } from './components/molecules/Form';
 export { default as Alert } from './components/molecules/Alert';
 export { default as QuantitySelector } from './components/molecules/QuantitySelector';

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
+{"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,MAAM,EAAE,MAAM,2BAA2B,CAAA;AAG7D,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,6BAA6B,CAAA;AAGjE,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,4BAA4B,CAAA;AAG/D,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,8BAA8B,CAAA;AAGnE,YAAY;AACZ,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,oCAAoC,CAAA;AAG3E,OAAO,EACL,OAAO,IAAI,IAAI,EACf,WAAW,EACX,SAAS,GACV,MAAM,6BAA6B,CAAA;AAOpC,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,qCAAqC,CAAA;AAG7E,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,qCAAqC,CAAA;AAG7E,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,wCAAwC,CAAA;AAGnF,OAAO,EACL,OAAO,IAAI,WAAW,EACtB,gBAAgB,EAChB,kBAAkB,EAClB,kBAAkB,GACnB,MAAM,oCAAoC,CAAA;AAQ3C,OAAO,EACL,OAAO,IAAI,IAAI,EACf,SAAS,EACT,WAAW,EACX,WAAW,GACZ,MAAM,6BAA6B,CAAA;AAQpC,OAAO,EACL,OAAO,IAAI,QAAQ,EACnB,eAAe,EACf,eAAe,EACf,aAAa,EACb,cAAc,EACd,eAAe,EACf,aAAa,GACd,MAAM,iCAAiC,CAAA;AAWxC,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,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,8BAA8B,CAAA;AAG/D,OAAO,EACL,OAAO,IAAI,MAAM,EACjB,aAAa,EACb,WAAW,EACX,UAAU,GACX,MAAM,+BAA+B,CAAA;AAQtC,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,uCAAuC,CAAA;AAGjF,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,mCAAmC,CAAA;AAGzE,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,sCAAsC,CAAA;AAG/E,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,mCAAmC,CAAA;AAGzE,OAAO,EACL,OAAO,IAAI,UAAU,EACrB,WAAW,GACZ,MAAM,mCAAmC,CAAA;AAM1C,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,6BAA6B,CAAA;AAG7D,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,8BAA8B,CAAA;AAG/D,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,yCAAyC,CAAA;AAGrF,OAAO,EACL,OAAO,IAAI,QAAQ,EACnB,cAAc,EACd,YAAY,EACZ,YAAY,GACb,MAAM,iCAAiC,CAAA;AAQxC,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.37-alpha.0",
+  "version": "2.0.38-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": "dac60f1c06a9df8faf33752ec8f8c9737fed677d"
+  "gitHead": "ff1e76f11da2b7183fdef1a81917cae479a162a4"
 }

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

@@ -0,0 +1,70 @@
+[data-fs-accordion] {
+  // --------------------------------------------------------
+  // Design Tokens for Accordion
+  // --------------------------------------------------------
+
+  // Item
+  --fs-accordion-item-border-bottom-width           : var(--fs-border-width);
+  --fs-accordion-item-border-bottom-color           : var(--fs-border-color-light);
+
+  // Button
+  --fs-accordion-button-padding                     : var(--fs-spacing-3) 0;
+  --fs-accordion-button-font-size                   : var(--fs-text-size-3);
+  --fs-accordion-button-font-weight                 : var(--fs-text-weight-bold);
+  --fs-accordion-button-line-height                 : 1.2;
+  --fs-accordion-button-color                       : var(--fs-color-text);
+  --fs-accordion-button-bkg-color                   : transparent;
+
+  // Panel
+  --fs-accordion-panel-padding-bottom               : var(--fs-spacing-4);
+
+  // --------------------------------------------------------
+  // Structural Styles
+  // --------------------------------------------------------
+
+  display: flex;
+  flex-direction: column;
+  justify-content: space-around;
+  width: 100%;
+
+  [data-fs-accordion-item] {
+    border-bottom: var(--fs-accordion-item-border-bottom-width) solid var(--fs-accordion-item-border-bottom-color);
+
+    @include media(">=notebook") {
+      &:last-child {
+        border-bottom: 0;
+      }
+    }
+  }
+
+  [data-fs-accordion-button] {
+    display: inline-flex;
+    align-items: center;
+    justify-content: space-between;
+    width: 100%;
+    padding: var(--fs-accordion-button-padding);
+    font-size: var(--fs-accordion-button-font-size);
+    font-weight: var(--fs-accordion-button-font-weight);
+    line-height: var(--fs-accordion-button-line-height);
+    color: var(--fs-accordion-button-color);
+    cursor: pointer;
+    background-color: var(--fs-accordion-button-bkg-color);
+    border: 0;
+
+    [data-fs-icon] {
+      display: flex;
+
+      [data-icon] {
+        display: none;
+      }
+
+      [data-icon="expanded"], [data-icon="collapsed"] {
+        display: initial;
+      }
+    }
+  }
+
+  [data-fs-accordion-panel] {
+    padding-bottom: var(--fs-accordion-panel-padding-bottom);
+  }
+}

package/src/index.ts

@@ -137,19 +137,6 @@ export type {
   RadioOptionProps,
 } from './components/molecules/RadioGroup'
 
-export {
-  default as Accordion,
-  AccordionItem,
-  AccordionButton,
-  AccordionPanel,
-} from './components/molecules/Accordion'
-export type {
-  AccordionProps,
-  AccordionItemProps,
-  AccordionButtonProps,
-  AccordionPanelProps,
-} from './components/molecules/Accordion'
-
 export { default as Form } from './components/molecules/Form'
 export type { FormProps } from './components/molecules/Form'
 

package/src/styles/components.scss

@@ -13,6 +13,7 @@
 @import "../components/atoms/SROnly/styles";
 
 // Molecules
+@import "../components/molecules/Accordion/styles";
 @import "../components/molecules/BuyButton/styles";
 @import "../components/molecules/CheckboxField/styles";
 @import "../components/molecules/DiscountBadge/styles";

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

@@ -1,26 +0,0 @@
-import type { HTMLAttributes } from 'react';
-import React from 'react';
-interface AccordionContext {
-    indices: Set<number>;
-    onChange: (index: number) => void;
-    numberOfItems: number;
-}
-declare const AccordionContext: React.Context<AccordionContext | undefined>;
-export interface AccordionProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {
-    /**
-     * ID to find this component in testing tools (e.g.: cypress,
-     * testing-library, and jest).
-     */
-    testId?: string;
-    /**
-     * Indices that indicate which accordion items are opened.
-     */
-    indices: Iterable<number>;
-    /**
-     * Function that is triggered when an accordion item is opened/closed.
-     */
-    onChange: (index: number) => void;
-}
-declare const Accordion: React.ForwardRefExoticComponent<AccordionProps & React.RefAttributes<HTMLDivElement>>;
-export declare function useAccordion(): AccordionContext;
-export default Accordion;

package/dist/components/molecules/Accordion/Accordion.js

@@ -1,21 +0,0 @@
-import React, { useContext, cloneElement, forwardRef, createContext, } from 'react';
-const AccordionContext = createContext(undefined);
-const Accordion = forwardRef(function Accordion({ testId = 'store-accordion', indices, onChange, children, ...otherProps }, ref) {
-    const childrenWithIndex = React.Children.map(children, (child, index) => cloneElement(child, { index: child.props.index ?? index }));
-    const context = {
-        indices: new Set(indices),
-        onChange,
-        numberOfItems: childrenWithIndex.length,
-    };
-    return (React.createElement(AccordionContext.Provider, { value: context },
-        React.createElement("div", { ref: ref, "data-fs-accordion": true, "data-testid": testId, role: "region", ...otherProps }, childrenWithIndex)));
-});
-export function useAccordion() {
-    const context = useContext(AccordionContext);
-    if (context === undefined) {
-        throw new Error('Do not use Accordion components outside the Accordion context.');
-    }
-    return context;
-}
-export default Accordion;
-//# sourceMappingURL=Accordion.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"Accordion.js","sourceRoot":"","sources":["../../../../src/components/molecules/Accordion/Accordion.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EACZ,UAAU,EACV,YAAY,EACZ,UAAU,EACV,aAAa,GACd,MAAM,OAAO,CAAA;AAQd,MAAM,gBAAgB,GAAG,aAAa,CAA+B,SAAS,CAAC,CAAA;AAmB/E,MAAM,SAAS,GAAG,UAAU,CAAiC,SAAS,SAAS,CAC7E,EAAE,MAAM,GAAG,iBAAiB,EAAE,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,UAAU,EAAE,EAC1E,GAAG;IAEH,MAAM,iBAAiB,GAAG,KAAK,CAAC,QAAQ,CAAC,GAAG,CAC1C,QAAwB,EACxB,CAAC,KAAK,EAAE,KAAK,EAAE,EAAE,CAAC,YAAY,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,KAAK,IAAI,KAAK,EAAE,CAAC,CAC7E,CAAA;IAED,MAAM,OAAO,GAAG;QACd,OAAO,EAAE,IAAI,GAAG,CAAC,OAAO,CAAC;QACzB,QAAQ;QACR,aAAa,EAAE,iBAAiB,CAAC,MAAM;KACxC,CAAA;IAED,OAAO,CACL,oBAAC,gBAAgB,CAAC,QAAQ,IAAC,KAAK,EAAE,OAAO;QACvC,6BACE,GAAG,EAAE,GAAG,4CAEK,MAAM,EACnB,IAAI,EAAC,QAAQ,KACT,UAAU,IAEb,iBAAiB,CACd,CACoB,CAC7B,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,MAAM,UAAU,YAAY;IAC1B,MAAM,OAAO,GAAG,UAAU,CAAC,gBAAgB,CAAC,CAAA;IAE5C,IAAI,OAAO,KAAK,SAAS,EAAE;QACzB,MAAM,IAAI,KAAK,CACb,gEAAgE,CACjE,CAAA;KACF;IAED,OAAO,OAAO,CAAA;AAChB,CAAC;AAED,eAAe,SAAS,CAAA"}

package/dist/components/molecules/Accordion/AccordionButton.d.ts

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

package/dist/components/molecules/Accordion/AccordionButton.js

@@ -1,37 +0,0 @@
-import React, { forwardRef } from 'react';
-import { useAccordion } from './Accordion';
-import { useAccordionItem } from './AccordionItem';
-import { Button } from '@faststore/components';
-const AccordionButton = forwardRef(function AccordionButton({ testId = 'store-accordion-button', children, ...otherProps }, ref) {
-    const { indices, onChange, numberOfItems } = useAccordion();
-    const { index, panel, button, prefixId } = useAccordionItem();
-    const onKeyDown = (event) => {
-        if (!['ArrowDown', 'ArrowUp'].includes(event.key)) {
-            return;
-        }
-        const getNext = () => {
-            const next = Number(index) + 1 === numberOfItems ? 0 : Number(index) + 1;
-            return document.getElementById(`${prefixId && `${prefixId}-`}button--${next}`);
-        };
-        const getPrevious = () => {
-            const previous = Number(index) - 1 < 0 ? numberOfItems - 1 : Number(index) - 1;
-            return document.getElementById(`${prefixId && `${prefixId}-`}button--${previous}`);
-        };
-        switch (event.key) {
-            case 'ArrowDown':
-                event.preventDefault();
-                getNext()?.focus();
-                break;
-            case 'ArrowUp':
-                event.preventDefault();
-                getPrevious()?.focus();
-                break;
-            default:
-        }
-    };
-    return (React.createElement(Button, { ref: ref, id: button, "aria-expanded": indices.has(index), "aria-controls": panel, "data-accordion-button": true, "data-testid": testId, onKeyDown: onKeyDown, onClick: () => {
-            onChange(index);
-        }, ...otherProps }, children));
-});
-export default AccordionButton;
-//# sourceMappingURL=AccordionButton.js.map

package/dist/components/molecules/Accordion/AccordionButton.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"AccordionButton.js","sourceRoot":"","sources":["../../../../src/components/molecules/Accordion/AccordionButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAEzC,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAA;AAC1C,OAAO,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAA;AAElD,OAAO,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAA;AAU9C,MAAM,eAAe,GAAG,UAAU,CAChC,SAAS,eAAe,CACtB,EAAE,MAAM,GAAG,wBAAwB,EAAE,QAAQ,EAAE,GAAG,UAAU,EAAE,EAC9D,GAAG;IAEH,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,GAAG,YAAY,EAAE,CAAA;IAC3D,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,GAAG,gBAAgB,EAAE,CAAA;IAE7D,MAAM,SAAS,GAAG,CAAC,KAA0B,EAAE,EAAE;QAC/C,IAAI,CAAC,CAAC,WAAW,EAAE,SAAS,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,EAAE;YACjD,OAAM;SACP;QAED,MAAM,OAAO,GAAG,GAAG,EAAE;YACnB,MAAM,IAAI,GAAG,MAAM,CAAC,KAAK,CAAC,GAAG,CAAC,KAAK,aAAa,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,GAAG,CAAC,CAAA;YAExE,OAAO,QAAQ,CAAC,cAAc,CAC5B,GAAG,QAAQ,IAAI,GAAG,QAAQ,GAAG,WAAW,IAAI,EAAE,CAC/C,CAAA;QACH,CAAC,CAAA;QAED,MAAM,WAAW,GAAG,GAAG,EAAE;YACvB,MAAM,QAAQ,GACZ,MAAM,CAAC,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,aAAa,GAAG,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,GAAG,CAAC,CAAA;YAE/D,OAAO,QAAQ,CAAC,cAAc,CAC5B,GAAG,QAAQ,IAAI,GAAG,QAAQ,GAAG,WAAW,QAAQ,EAAE,CACnD,CAAA;QACH,CAAC,CAAA;QAED,QAAQ,KAAK,CAAC,GAAG,EAAE;YACjB,KAAK,WAAW;gBACd,KAAK,CAAC,cAAc,EAAE,CAAA;gBACtB,OAAO,EAAE,EAAE,KAAK,EAAE,CAAA;gBAClB,MAAK;YAEP,KAAK,SAAS;gBACZ,KAAK,CAAC,cAAc,EAAE,CAAA;gBACtB,WAAW,EAAE,EAAE,KAAK,EAAE,CAAA;gBACtB,MAAK;YAEP,QAAQ;SACT;IACH,CAAC,CAAA;IAED,OAAO,CACL,oBAAC,MAAM,IACL,GAAG,EAAE,GAAG,EACR,EAAE,EAAE,MAAM,mBACK,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC,mBAClB,KAAK,gDAEP,MAAM,EACnB,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,GAAG,EAAE;YACZ,QAAQ,CAAC,KAAK,CAAC,CAAA;QACjB,CAAC,KACG,UAAU,IAEb,QAAQ,CACF,CACV,CAAA;AACH,CAAC,CACF,CAAA;AAED,eAAe,eAAe,CAAA"}

package/dist/components/molecules/Accordion/AccordionItem.d.ts

@@ -1,31 +0,0 @@
-import type { ElementType, HTMLAttributes, ReactElement } from 'react';
-import React from 'react';
-import type { PolymorphicComponentPropsWithRef } from '../../../typings';
-interface AccordionItemContext {
-    index: number;
-    panel: string;
-    button: string;
-    prefixId: string;
-}
-declare const AccordionItemContext: React.Context<AccordionItemContext | undefined>;
-interface Props extends HTMLAttributes<HTMLDivElement> {
-    /**
-     * ID to find this component in testing tools (e.g.: cypress,
-     * testing-library, and jest).
-     */
-    testId?: string;
-    /**
-     * Index of the current accordion item within the accordion.
-     */
-    index?: number;
-    /**
-     * Namespace ID prefix for the current Accordion item's panel and button
-     * to avoid ID duplication when multiple instances are on the same page.
-     */
-    prefixId?: string;
-}
-export type AccordionItemProps<C extends ElementType> = PolymorphicComponentPropsWithRef<C, Props>;
-type AccordionItemComponent = <C extends ElementType = 'div'>(props: AccordionItemProps<C>) => ReactElement | null;
-declare const AccordionItem: AccordionItemComponent;
-export declare function useAccordionItem(): AccordionItemContext;
-export default AccordionItem;

package/dist/components/molecules/Accordion/AccordionItem.js

@@ -1,22 +0,0 @@
-import React, { createContext, forwardRef, useContext } from 'react';
-const AccordionItemContext = createContext(undefined);
-const AccordionItem = forwardRef(function AccordionItem({ testId = 'store-accordion-item', children, prefixId = '', index = 0, as: MaybeComponent, ...otherProps }, ref) {
-    const Component = MaybeComponent ?? 'div';
-    const context = {
-        index,
-        prefixId,
-        panel: `${prefixId && `${prefixId}-`}panel--${index}`,
-        button: `${prefixId && `${prefixId}-`}button--${index}`,
-    };
-    return (React.createElement(AccordionItemContext.Provider, { value: context },
-        React.createElement(Component, { ref: ref, "data-accordion-item": true, "data-testid": testId, ...otherProps }, children)));
-});
-export function useAccordionItem() {
-    const context = useContext(AccordionItemContext);
-    if (context === undefined) {
-        throw new Error('Do not use AccordionItem components outside the AccordionItem context.');
-    }
-    return context;
-}
-export default AccordionItem;
-//# sourceMappingURL=AccordionItem.js.map

package/dist/components/molecules/Accordion/AccordionItem.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"AccordionItem.js","sourceRoot":"","sources":["../../../../src/components/molecules/Accordion/AccordionItem.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,aAAa,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAapE,MAAM,oBAAoB,GAAG,aAAa,CACxC,SAAS,CACV,CAAA;AA2BD,MAAM,aAAa,GAA2B,UAAU,CAAC,SAAS,aAAa,CAG7E,EACE,MAAM,GAAG,sBAAsB,EAC/B,QAAQ,EACR,QAAQ,GAAG,EAAE,EACb,KAAK,GAAG,CAAC,EACT,EAAE,EAAE,cAAc,EAClB,GAAG,UAAU,EACS,EACxB,GAAsB;IAEtB,MAAM,SAAS,GAAG,cAAc,IAAI,KAAK,CAAA;IAEzC,MAAM,OAAO,GAAG;QACd,KAAK;QACL,QAAQ;QACR,KAAK,EAAE,GAAG,QAAQ,IAAI,GAAG,QAAQ,GAAG,UAAU,KAAK,EAAE;QACrD,MAAM,EAAE,GAAG,QAAQ,IAAI,GAAG,QAAQ,GAAG,WAAW,KAAK,EAAE;KACxD,CAAA;IAED,OAAO,CACL,oBAAC,oBAAoB,CAAC,QAAQ,IAAC,KAAK,EAAE,OAAO;QAC3C,oBAAC,SAAS,IACR,GAAG,EAAE,GAAG,8CAEK,MAAM,KACf,UAAU,IAEb,QAAQ,CACC,CACkB,CACjC,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,MAAM,UAAU,gBAAgB;IAC9B,MAAM,OAAO,GAAG,UAAU,CAAC,oBAAoB,CAAC,CAAA;IAEhD,IAAI,OAAO,KAAK,SAAS,EAAE;QACzB,MAAM,IAAI,KAAK,CACb,wEAAwE,CACzE,CAAA;KACF;IAED,OAAO,OAAO,CAAA;AAChB,CAAC;AAED,eAAe,aAAa,CAAA"}

package/dist/components/molecules/Accordion/AccordionPanel.d.ts

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

package/dist/components/molecules/Accordion/AccordionPanel.js

@@ -1,10 +0,0 @@
-import React, { forwardRef } from 'react';
-import { useAccordion } from './Accordion';
-import { useAccordionItem } from './AccordionItem';
-const AccordionPanel = forwardRef(function AccordionPanel({ testId = 'store-accordion-panel', children, ...otherProps }, ref) {
-    const { indices } = useAccordion();
-    const { index, button, panel } = useAccordionItem();
-    return (React.createElement("div", { ref: ref, id: panel, "aria-labelledby": button, role: "region", "data-accordion-panel": true, "data-testid": testId, hidden: !indices.has(index), ...otherProps }, children));
-});
-export default AccordionPanel;
-//# sourceMappingURL=AccordionPanel.js.map

package/dist/components/molecules/Accordion/AccordionPanel.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"AccordionPanel.js","sourceRoot":"","sources":["../../../../src/components/molecules/Accordion/AccordionPanel.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAEzC,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAA;AAC1C,OAAO,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAA;AAUlD,MAAM,cAAc,GAAG,UAAU,CAC/B,SAAS,cAAc,CACrB,EAAE,MAAM,GAAG,uBAAuB,EAAE,QAAQ,EAAE,GAAG,UAAU,EAAE,EAC7D,GAAG;IAEH,MAAM,EAAE,OAAO,EAAE,GAAG,YAAY,EAAE,CAAA;IAClC,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,gBAAgB,EAAE,CAAA;IAEnD,OAAO,CACL,6BACE,GAAG,EAAE,GAAG,EACR,EAAE,EAAE,KAAK,qBACQ,MAAM,EACvB,IAAI,EAAC,QAAQ,+CAEA,MAAM,EACnB,MAAM,EAAE,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC,KACvB,UAAU,IAEb,QAAQ,CACL,CACP,CAAA;AACH,CAAC,CACF,CAAA;AAED,eAAe,cAAc,CAAA"}

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

@@ -1,8 +0,0 @@
-export { default } from './Accordion';
-export type { AccordionProps } from './Accordion';
-export { default as AccordionItem } from './AccordionItem';
-export type { AccordionItemProps } from './AccordionItem';
-export { default as AccordionButton } from './AccordionButton';
-export type { AccordionButtonProps } from './AccordionButton';
-export { default as AccordionPanel } from './AccordionPanel';
-export type { AccordionPanelProps } from './AccordionPanel';

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

@@ -1,5 +0,0 @@
-export { default } from './Accordion';
-export { default as AccordionItem } from './AccordionItem';
-export { default as AccordionButton } from './AccordionButton';
-export { default as AccordionPanel } from './AccordionPanel';
-//# sourceMappingURL=index.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/molecules/Accordion/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAA;AAGrC,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAG1D,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mBAAmB,CAAA;AAG9D,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAA"}

package/src/components/molecules/Accordion/Accordion.tsx

@@ -1,76 +0,0 @@
-import type { HTMLAttributes, ReactElement } from 'react'
-import React, {
-  useContext,
-  cloneElement,
-  forwardRef,
-  createContext,
-} from 'react'
-
-interface AccordionContext {
-  indices: Set<number>
-  onChange: (index: number) => void
-  numberOfItems: number
-}
-
-const AccordionContext = createContext<AccordionContext | undefined>(undefined)
-
-export interface AccordionProps
-  extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {
-  /**
-   * ID to find this component in testing tools (e.g.: cypress,
-   * testing-library, and jest).
-   */
-  testId?: string
-  /**
-   * Indices that indicate which accordion items are opened.
-   */
-  indices: Iterable<number>
-  /**
-   * Function that is triggered when an accordion item is opened/closed.
-   */
-  onChange: (index: number) => void
-}
-
-const Accordion = forwardRef<HTMLDivElement, AccordionProps>(function Accordion(
-  { testId = 'store-accordion', indices, onChange, children, ...otherProps },
-  ref
-) {
-  const childrenWithIndex = React.Children.map(
-    children as ReactElement,
-    (child, index) => cloneElement(child, { index: child.props.index ?? index })
-  )
-
-  const context = {
-    indices: new Set(indices),
-    onChange,
-    numberOfItems: childrenWithIndex.length,
-  }
-
-  return (
-    <AccordionContext.Provider value={context}>
-      <div
-        ref={ref}
-        data-fs-accordion
-        data-testid={testId}
-        role="region"
-        {...otherProps}
-      >
-        {childrenWithIndex}
-      </div>
-    </AccordionContext.Provider>
-  )
-})
-
-export function useAccordion() {
-  const context = useContext(AccordionContext)
-
-  if (context === undefined) {
-    throw new Error(
-      'Do not use Accordion components outside the Accordion context.'
-    )
-  }
-
-  return context
-}
-
-export default Accordion

package/src/components/molecules/Accordion/AccordionButton.tsx

@@ -1,81 +0,0 @@
-import React, { forwardRef } from 'react'
-
-import { useAccordion } from './Accordion'
-import { useAccordionItem } from './AccordionItem'
-
-import { Button } from '@faststore/components'
-import type { ButtonProps } from '@faststore/components'
-
-export interface AccordionButtonProps extends ButtonProps {
-  /**
-   * ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
-   */
-  testId?: string
-}
-
-const AccordionButton = forwardRef<HTMLButtonElement, AccordionButtonProps>(
-  function AccordionButton(
-    { testId = 'store-accordion-button', children, ...otherProps },
-    ref
-  ) {
-    const { indices, onChange, numberOfItems } = useAccordion()
-    const { index, panel, button, prefixId } = useAccordionItem()
-
-    const onKeyDown = (event: React.KeyboardEvent) => {
-      if (!['ArrowDown', 'ArrowUp'].includes(event.key)) {
-        return
-      }
-
-      const getNext = () => {
-        const next = Number(index) + 1 === numberOfItems ? 0 : Number(index) + 1
-
-        return document.getElementById(
-          `${prefixId && `${prefixId}-`}button--${next}`
-        )
-      }
-
-      const getPrevious = () => {
-        const previous =
-          Number(index) - 1 < 0 ? numberOfItems - 1 : Number(index) - 1
-
-        return document.getElementById(
-          `${prefixId && `${prefixId}-`}button--${previous}`
-        )
-      }
-
-      switch (event.key) {
-        case 'ArrowDown':
-          event.preventDefault()
-          getNext()?.focus()
-          break
-
-        case 'ArrowUp':
-          event.preventDefault()
-          getPrevious()?.focus()
-          break
-
-        default:
-      }
-    }
-
-    return (
-      <Button
-        ref={ref}
-        id={button}
-        aria-expanded={indices.has(index)}
-        aria-controls={panel}
-        data-accordion-button
-        data-testid={testId}
-        onKeyDown={onKeyDown}
-        onClick={() => {
-          onChange(index)
-        }}
-        {...otherProps}
-      >
-        {children}
-      </Button>
-    )
-  }
-)
-
-export default AccordionButton

package/src/components/molecules/Accordion/AccordionItem.tsx

@@ -1,92 +0,0 @@
-import type { ElementType, HTMLAttributes, ReactElement } from 'react'
-import React, { createContext, forwardRef, useContext } from 'react'
-import type {
-  PolymorphicComponentPropsWithRef,
-  PolymorphicRef,
-} from '../../../typings'
-
-interface AccordionItemContext {
-  index: number
-  panel: string
-  button: string
-  prefixId: string
-}
-
-const AccordionItemContext = createContext<AccordionItemContext | undefined>(
-  undefined
-)
-
-interface Props extends HTMLAttributes<HTMLDivElement> {
-  /**
-   * ID to find this component in testing tools (e.g.: cypress,
-   * testing-library, and jest).
-   */
-  testId?: string
-  /**
-   * Index of the current accordion item within the accordion.
-   */
-  index?: number
-  /**
-   * Namespace ID prefix for the current Accordion item's panel and button
-   * to avoid ID duplication when multiple instances are on the same page.
-   */
-  prefixId?: string
-}
-
-export type AccordionItemProps<
-  C extends ElementType
-> = PolymorphicComponentPropsWithRef<C, Props>
-
-type AccordionItemComponent = <C extends ElementType = 'div'>(
-  props: AccordionItemProps<C>
-) => ReactElement | null
-
-const AccordionItem: AccordionItemComponent = forwardRef(function AccordionItem<
-  C extends ElementType = 'div'
->(
-  {
-    testId = 'store-accordion-item',
-    children,
-    prefixId = '',
-    index = 0,
-    as: MaybeComponent,
-    ...otherProps
-  }: AccordionItemProps<C>,
-  ref: PolymorphicRef<C>
-) {
-  const Component = MaybeComponent ?? 'div'
-
-  const context = {
-    index,
-    prefixId,
-    panel: `${prefixId && `${prefixId}-`}panel--${index}`,
-    button: `${prefixId && `${prefixId}-`}button--${index}`,
-  }
-
-  return (
-    <AccordionItemContext.Provider value={context}>
-      <Component
-        ref={ref}
-        data-accordion-item
-        data-testid={testId}
-        {...otherProps}
-      >
-        {children}
-      </Component>
-    </AccordionItemContext.Provider>
-  )
-})
-
-export function useAccordionItem() {
-  const context = useContext(AccordionItemContext)
-
-  if (context === undefined) {
-    throw new Error(
-      'Do not use AccordionItem components outside the AccordionItem context.'
-    )
-  }
-
-  return context
-}
-
-export default AccordionItem

package/src/components/molecules/Accordion/AccordionPanel.tsx

@@ -1,40 +0,0 @@
-import type { HTMLAttributes } from 'react'
-import React, { forwardRef } from 'react'
-
-import { useAccordion } from './Accordion'
-import { useAccordionItem } from './AccordionItem'
-
-export interface AccordionPanelProps
-  extends Omit<HTMLAttributes<HTMLDivElement>, 'role'> {
-  /**
-   * ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
-   */
-  testId?: string
-}
-
-const AccordionPanel = forwardRef<HTMLDivElement, AccordionPanelProps>(
-  function AccordionPanel(
-    { testId = 'store-accordion-panel', children, ...otherProps },
-    ref
-  ) {
-    const { indices } = useAccordion()
-    const { index, button, panel } = useAccordionItem()
-
-    return (
-      <div
-        ref={ref}
-        id={panel}
-        aria-labelledby={button}
-        role="region"
-        data-accordion-panel
-        data-testid={testId}
-        hidden={!indices.has(index)}
-        {...otherProps}
-      >
-        {children}
-      </div>
-    )
-  }
-)
-
-export default AccordionPanel

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

@@ -1,11 +0,0 @@
-export { default } from './Accordion'
-export type { AccordionProps } from './Accordion'
-
-export { default as AccordionItem } from './AccordionItem'
-export type { AccordionItemProps } from './AccordionItem'
-
-export { default as AccordionButton } from './AccordionButton'
-export type { AccordionButtonProps } from './AccordionButton'
-
-export { default as AccordionPanel } from './AccordionPanel'
-export type { AccordionPanelProps } from './AccordionPanel'