@faststore/ui 1.9.4 → 1.9.10

package/dist/molecules/Dropdown/Dropdown.js

@@ -0,0 +1,67 @@
+import React, { useRef, useMemo, useState, useEffect, useCallback } from 'react';
+import DropdownContext from './contexts/DropdownContext';
+const Dropdown = ({ children, isOpen: isOpenDefault = false, onDismiss, id = 'store-dropdown', }) => {
+    const [isOpen, setIsOpen] = useState(isOpenDefault);
+    const dropdownItemsRef = useRef([]);
+    const selectedDropdownItemIndexRef = useRef(0);
+    const dropdownButtonRef = useRef(null);
+    const close = useCallback(() => {
+        setIsOpen(false);
+        onDismiss?.();
+        dropdownButtonRef.current?.focus();
+    }, [onDismiss]);
+    const open = () => {
+        setIsOpen(true);
+    };
+    const toggle = useCallback(() => {
+        setIsOpen((old) => {
+            if (old) {
+                onDismiss?.();
+                dropdownButtonRef.current?.focus();
+            }
+            return !old;
+        });
+    }, [onDismiss]);
+    useEffect(() => {
+        setIsOpen(isOpenDefault);
+    }, [isOpenDefault]);
+    useEffect(() => {
+        isOpen && dropdownItemsRef?.current[0]?.focus();
+    }, [isOpen]);
+    useEffect(() => {
+        let firstClick = true;
+        const event = (e) => {
+            const someItemWasClicked = dropdownItemsRef?.current.some((item) => e.target === item);
+            if (firstClick) {
+                firstClick = false;
+                return;
+            }
+            !someItemWasClicked && close();
+        };
+        if (isOpen) {
+            document.addEventListener('click', event);
+        }
+        else {
+            document.removeEventListener('click', event);
+        }
+        return () => {
+            document.removeEventListener('click', event);
+        };
+    }, [close, isOpen]);
+    const value = useMemo(() => {
+        return {
+            isOpen,
+            close,
+            open,
+            toggle,
+            dropdownButtonRef,
+            onDismiss,
+            selectedDropdownItemIndexRef,
+            dropdownItemsRef,
+            id,
+        };
+    }, [close, id, isOpen, onDismiss, toggle]);
+    return (React.createElement(DropdownContext.Provider, { value: value }, children));
+};
+export default Dropdown;
+//# sourceMappingURL=Dropdown.js.map

package/dist/molecules/Dropdown/Dropdown.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dropdown.js","sourceRoot":"","sources":["../../../src/molecules/Dropdown/Dropdown.tsx"],"names":[],"mappings":"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"}

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

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

package/dist/molecules/Dropdown/DropdownButton.js

@@ -0,0 +1,11 @@
+import React, { forwardRef, useImperativeHandle } from 'react';
+import { useDropdown } from './hooks/useDropdown';
+const DropdownButton = forwardRef(function Button({ children, testId = 'store-dropdown-button', ...otherProps }, ref) {
+    const { toggle, dropdownButtonRef, isOpen, id } = useDropdown();
+    useImperativeHandle(ref, () => dropdownButtonRef.current, [
+        dropdownButtonRef,
+    ]);
+    return (React.createElement("button", Object.assign({ "data-store-dropdown-button": true, onClick: toggle, "data-testid": testId, ref: dropdownButtonRef, "aria-expanded": isOpen, "aria-haspopup": "menu", "aria-controls": id }, otherProps), children));
+});
+export default DropdownButton;
+//# sourceMappingURL=DropdownButton.js.map

package/dist/molecules/Dropdown/DropdownButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DropdownButton.js","sourceRoot":"","sources":["../../../src/molecules/Dropdown/DropdownButton.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,mBAAmB,EAAE,MAAM,OAAO,CAAA;AAE9D,OAAO,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAA;AAUjD,MAAM,cAAc,GAAG,UAAU,CAC/B,SAAS,MAAM,CACb,EAAE,QAAQ,EAAE,MAAM,GAAG,uBAAuB,EAAE,GAAG,UAAU,EAAE,EAC7D,GAAG;IAEH,MAAM,EAAE,MAAM,EAAE,iBAAiB,EAAE,MAAM,EAAE,EAAE,EAAE,GAAG,WAAW,EAAE,CAAA;IAE/D,mBAAmB,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,iBAAkB,CAAC,OAAQ,EAAE;QAC1D,iBAAiB;KAClB,CAAC,CAAA;IAEF,OAAO,CACL,kFAEE,OAAO,EAAE,MAAM,iBACF,MAAM,EACnB,GAAG,EAAE,iBAAiB,mBACP,MAAM,mBACP,MAAM,mBACL,EAAE,IACb,UAAU,GAEb,QAAQ,CACF,CACV,CAAA;AACH,CAAC,CACF,CAAA;AAED,eAAe,cAAc,CAAA"}

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

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

package/dist/molecules/Dropdown/DropdownItem.js

@@ -0,0 +1,26 @@
+import React, { useImperativeHandle, forwardRef, useRef, useState } from 'react';
+import { useDropdown } from './hooks/useDropdown';
+const DropdownItem = forwardRef(function Button({ children, onClick, testId = 'store-dropdown-item', ...otherProps }, ref) {
+    const { dropdownItemsRef, selectedDropdownItemIndexRef, close } = useDropdown();
+    const [dropdownItemIndex, setDropdownItemIndex] = useState(0);
+    const dropdownItemRef = useRef();
+    const addToRefs = (el) => {
+        if (el && !dropdownItemsRef?.current.includes(el)) {
+            dropdownItemsRef?.current.push(el);
+            setDropdownItemIndex(dropdownItemsRef?.current.findIndex((element) => element === el) ?? 0);
+        }
+        dropdownItemRef.current = el;
+    };
+    const onFocusItem = () => {
+        selectedDropdownItemIndexRef.current = dropdownItemIndex;
+        dropdownItemsRef?.current[selectedDropdownItemIndexRef.current]?.focus();
+    };
+    const handleOnClickItem = (event) => {
+        onClick?.(event);
+        close?.();
+    };
+    useImperativeHandle(ref, () => dropdownItemRef.current, []);
+    return (React.createElement("button", Object.assign({ "data-store-dropdown-item": true, "data-testid": testId, ref: addToRefs, onFocus: onFocusItem, onMouseEnter: onFocusItem, onClick: handleOnClickItem, role: "menuitem", tabIndex: -1, "data-index": dropdownItemIndex }, otherProps), children));
+});
+export default DropdownItem;
+//# sourceMappingURL=DropdownItem.js.map

package/dist/molecules/Dropdown/DropdownItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DropdownItem.js","sourceRoot":"","sources":["../../../src/molecules/Dropdown/DropdownItem.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,mBAAmB,EAAE,UAAU,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAEhF,OAAO,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAA;AAUjD,MAAM,YAAY,GAAG,UAAU,CAC7B,SAAS,MAAM,CACb,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,GAAG,qBAAqB,EAAE,GAAG,UAAU,EAAE,EACpE,GAAG;IAEH,MAAM,EAAE,gBAAgB,EAAE,4BAA4B,EAAE,KAAK,EAAE,GAC7D,WAAW,EAAE,CAAA;IAEf,MAAM,CAAC,iBAAiB,EAAE,oBAAoB,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAA;IAC7D,MAAM,eAAe,GAAG,MAAM,EAAqB,CAAA;IAEnD,MAAM,SAAS,GAAG,CAAC,EAAqB,EAAE,EAAE;QAC1C,IAAI,EAAE,IAAI,CAAC,gBAAgB,EAAE,OAAO,CAAC,QAAQ,CAAC,EAAE,CAAC,EAAE;YACjD,gBAAgB,EAAE,OAAO,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;YAClC,oBAAoB,CAClB,gBAAgB,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,OAAO,KAAK,EAAE,CAAC,IAAI,CAAC,CACtE,CAAA;SACF;QAED,eAAe,CAAC,OAAO,GAAG,EAAE,CAAA;IAC9B,CAAC,CAAA;IAED,MAAM,WAAW,GAAG,GAAG,EAAE;QACvB,4BAA6B,CAAC,OAAO,GAAG,iBAAiB,CAAA;QACzD,gBAAgB,EAAE,OAAO,CAAC,4BAA6B,CAAC,OAAO,CAAC,EAAE,KAAK,EAAE,CAAA;IAC3E,CAAC,CAAA;IAED,MAAM,iBAAiB,GAAG,CACxB,KAAsD,EACtD,EAAE;QACF,OAAO,EAAE,CAAC,KAAK,CAAC,CAAA;QAChB,KAAK,EAAE,EAAE,CAAA;IACX,CAAC,CAAA;IAED,mBAAmB,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,eAAe,CAAC,OAAQ,EAAE,EAAE,CAAC,CAAA;IAE5D,OAAO,CACL,+FAEe,MAAM,EACnB,GAAG,EAAE,SAAS,EACd,OAAO,EAAE,WAAW,EACpB,YAAY,EAAE,WAAW,EACzB,OAAO,EAAE,iBAAiB,EAC1B,IAAI,EAAC,UAAU,EACf,QAAQ,EAAE,CAAC,CAAC,gBACA,iBAAiB,IACzB,UAAU,GAEb,QAAQ,CACF,CACV,CAAA;AACH,CAAC,CACF,CAAA;AAED,eAAe,YAAY,CAAA"}

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

@@ -1,22 +1,22 @@
-import type { AriaAttributes, KeyboardEvent, PropsWithChildren, MouseEvent, ReactNode } from 'react';
-import React from 'react';
-import type { ModalContentProps } from '../Modal/ModalContent';
-export interface DropdownMenuProps extends ModalContentProps {
-    /**
-     * ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
-     */
-    testId?: string;
-    /**
-     * Identifies the element (or elements) that labels the current element.
-     * @see aria-labelledby https://www.w3.org/TR/wai-aria-1.1/#aria-labelledby
-     */
-    'aria-labelledby'?: AriaAttributes['aria-label'];
-    /**
-     * This function is called whenever the user hits "Escape" or clicks outside
-     * the dialog.
-     */
-    onDismiss?: (event: MouseEvent | KeyboardEvent) => void;
-    children: ReactNode[] | ReactNode;
-}
-declare const DropdownMenu: ({ children, testId, style, ...otherProps }: PropsWithChildren<DropdownMenuProps>) => React.ReactPortal | null;
-export default DropdownMenu;
+import type { AriaAttributes, KeyboardEvent, PropsWithChildren, MouseEvent, ReactNode } from 'react';
+import React from 'react';
+import type { ModalContentProps } from '../Modal/ModalContent';
+export interface DropdownMenuProps extends ModalContentProps {
+    /**
+     * ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
+     */
+    testId?: string;
+    /**
+     * Identifies the element (or elements) that labels the current element.
+     * @see aria-labelledby https://www.w3.org/TR/wai-aria-1.1/#aria-labelledby
+     */
+    'aria-labelledby'?: AriaAttributes['aria-label'];
+    /**
+     * This function is called whenever the user hits "Escape" or clicks outside
+     * the dialog.
+     */
+    onDismiss?: (event: MouseEvent | KeyboardEvent) => void;
+    children: ReactNode[] | ReactNode;
+}
+declare const DropdownMenu: ({ children, testId, style, ...otherProps }: PropsWithChildren<DropdownMenuProps>) => React.ReactPortal | null;
+export default DropdownMenu;

package/dist/molecules/Dropdown/DropdownMenu.js

@@ -0,0 +1,65 @@
+import React from 'react';
+import { createPortal } from 'react-dom';
+import { useDropdown } from './hooks/useDropdown';
+import { useDropdownPosition } from './hooks/useDropdownPosition';
+/*
+ * This component is based on @reach/dialog.
+ * https://github.com/reach/reach-ui/blob/main/packages/dialog/src/index.tsx
+ * https://reach.tech/dialog
+ */
+const DropdownMenu = ({ children, testId = 'store-dropdown-menu', style, ...otherProps }) => {
+    const { isOpen, close, dropdownItemsRef, selectedDropdownItemIndexRef, id } = useDropdown();
+    const dropdownPosition = useDropdownPosition();
+    const childrenLength = React.Children.toArray(children).length;
+    const handleDownPress = () => {
+        if (selectedDropdownItemIndexRef.current < childrenLength - 1) {
+            selectedDropdownItemIndexRef.current++;
+        }
+        else {
+            selectedDropdownItemIndexRef.current = 0;
+        }
+        dropdownItemsRef?.current[selectedDropdownItemIndexRef.current]?.focus();
+    };
+    const handleUpPress = () => {
+        if (selectedDropdownItemIndexRef.current > 0) {
+            selectedDropdownItemIndexRef.current--;
+        }
+        else {
+            selectedDropdownItemIndexRef.current = childrenLength - 1;
+        }
+        dropdownItemsRef?.current[selectedDropdownItemIndexRef.current]?.focus();
+    };
+    const handleHomePress = () => {
+        selectedDropdownItemIndexRef.current = 0;
+        dropdownItemsRef?.current[selectedDropdownItemIndexRef.current]?.focus();
+    };
+    const handleEndPress = () => {
+        selectedDropdownItemIndexRef.current = childrenLength - 1;
+        dropdownItemsRef?.current[selectedDropdownItemIndexRef.current]?.focus();
+    };
+    const handleEscapePress = () => {
+        close?.();
+    };
+    const handleBackdropKeyDown = (event) => {
+        if (event.defaultPrevented || event.key === 'Enter') {
+            return;
+        }
+        event.preventDefault();
+        event.key === 'Escape' && handleEscapePress();
+        event.key === 'ArrowDown' && handleDownPress();
+        event.key === 'ArrowUp' && handleUpPress();
+        event.key === 'Home' && handleHomePress();
+        event.key === 'End' && handleEndPress();
+        event.stopPropagation();
+    };
+    const clearChildrenReferences = () => {
+        dropdownItemsRef.current = [];
+        return null;
+    };
+    return isOpen
+        ? createPortal(React.createElement("div", { role: "presentation", "data-store-dropdown-overlay": true, onKeyDown: handleBackdropKeyDown, "data-testid": `${testId}-overlay` },
+            React.createElement("div", Object.assign({ role: "menu", "aria-orientation": "vertical", "data-store-dropdown-menu": true, "data-testid": testId, style: { ...dropdownPosition, ...style }, id: id }, otherProps), children)), document.body)
+        : clearChildrenReferences();
+};
+export default DropdownMenu;
+//# sourceMappingURL=DropdownMenu.js.map

package/dist/molecules/Dropdown/DropdownMenu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DropdownMenu.js","sourceRoot":"","sources":["../../../src/molecules/Dropdown/DropdownMenu.tsx"],"names":[],"mappings":"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"}

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

@@ -1,41 +1,41 @@
-/// <reference types="react" />
-export declare type DropdownContextState = {
-    /**
-     * Control de Dropdown state as Opened (true) or Closed (false).
-     */
-    isOpen: boolean;
-    /**
-     * Reference to DropdownButton, used to calculate a position for the DropdownMenu.
-     */
-    dropdownButtonRef: React.RefObject<HTMLButtonElement> | null;
-    /**
-     * Reference to a selected DropdownItem, used to manipulate focus.
-     */
-    selectedDropdownItemIndexRef: React.MutableRefObject<number> | null;
-    /**
-     * Array of References to dropdownItems in a DropdownMenu.
-     */
-    dropdownItemsRef: React.MutableRefObject<HTMLButtonElement[]> | null;
-    /**
-     * Close DropdownMenu event inherited from Modal.
-     */
-    onDismiss?(): void;
-    /**
-     * Function responsible for close the DropdownMenu in this context.
-     */
-    close?(): void;
-    /**
-     * Function responsible for open the DropdownMenu in this context.
-     */
-    open?(): void;
-    /**
-     * Function responsible for switch the the DropdownMenu state in this context.
-     */
-    toggle?(): void;
-    /**
-     * Identifier to be used in aria-controls
-     */
-    id: string;
-};
-declare const DropdownContext: import("react").Context<DropdownContextState>;
-export default DropdownContext;
+/// <reference types="react" />
+export declare type DropdownContextState = {
+    /**
+     * Control de Dropdown state as Opened (true) or Closed (false).
+     */
+    isOpen: boolean;
+    /**
+     * Reference to DropdownButton, used to calculate a position for the DropdownMenu.
+     */
+    dropdownButtonRef: React.RefObject<HTMLButtonElement> | null;
+    /**
+     * Reference to a selected DropdownItem, used to manipulate focus.
+     */
+    selectedDropdownItemIndexRef: React.MutableRefObject<number> | null;
+    /**
+     * Array of References to dropdownItems in a DropdownMenu.
+     */
+    dropdownItemsRef: React.MutableRefObject<HTMLButtonElement[]> | null;
+    /**
+     * Close DropdownMenu event inherited from Modal.
+     */
+    onDismiss?(): void;
+    /**
+     * Function responsible for close the DropdownMenu in this context.
+     */
+    close?(): void;
+    /**
+     * Function responsible for open the DropdownMenu in this context.
+     */
+    open?(): void;
+    /**
+     * Function responsible for switch the the DropdownMenu state in this context.
+     */
+    toggle?(): void;
+    /**
+     * Identifier to be used in aria-controls
+     */
+    id: string;
+};
+declare const DropdownContext: import("react").Context<DropdownContextState>;
+export default DropdownContext;

package/dist/molecules/Dropdown/contexts/DropdownContext.js

@@ -0,0 +1,11 @@
+import { createContext } from 'react';
+const defaultState = {
+    isOpen: false,
+    dropdownButtonRef: null,
+    selectedDropdownItemIndexRef: null,
+    dropdownItemsRef: null,
+    id: 'store-dropdown',
+};
+const DropdownContext = createContext(defaultState);
+export default DropdownContext;
+//# sourceMappingURL=DropdownContext.js.map

package/dist/molecules/Dropdown/contexts/DropdownContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DropdownContext.js","sourceRoot":"","sources":["../../../../src/molecules/Dropdown/contexts/DropdownContext.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAA;AA0CrC,MAAM,YAAY,GAAyB;IACzC,MAAM,EAAE,KAAK;IACb,iBAAiB,EAAE,IAAI;IACvB,4BAA4B,EAAE,IAAI;IAClC,gBAAgB,EAAE,IAAI;IACtB,EAAE,EAAE,gBAAgB;CACrB,CAAA;AAED,MAAM,eAAe,GAAG,aAAa,CAAuB,YAAY,CAAC,CAAA;AAEzE,eAAe,eAAe,CAAA"}

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

@@ -1,6 +1,6 @@
-import type { DropdownContextState } from '../contexts/DropdownContext';
-/**
- * Hook to use the Dropdown context.
- * @returns Dropdown context.
- */
-export declare const useDropdown: () => DropdownContextState;
+import type { DropdownContextState } from '../contexts/DropdownContext';
+/**
+ * Hook to use the Dropdown context.
+ * @returns Dropdown context.
+ */
+export declare const useDropdown: () => DropdownContextState;

package/dist/molecules/Dropdown/hooks/useDropdown.js

@@ -0,0 +1,14 @@
+import { useContext } from 'react';
+import DropdownContext from '../contexts/DropdownContext';
+/**
+ * Hook to use the Dropdown context.
+ * @returns Dropdown context.
+ */
+export const useDropdown = () => {
+    const context = useContext(DropdownContext);
+    if (context === undefined) {
+        throw new Error('Do not use useDropdown hook outside the Dropdown context.');
+    }
+    return context;
+};
+//# sourceMappingURL=useDropdown.js.map

package/dist/molecules/Dropdown/hooks/useDropdown.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDropdown.js","sourceRoot":"","sources":["../../../../src/molecules/Dropdown/hooks/useDropdown.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAGlC,OAAO,eAAe,MAAM,6BAA6B,CAAA;AAEzD;;;GAGG;AACH,MAAM,CAAC,MAAM,WAAW,GAAG,GAAG,EAAE;IAC9B,MAAM,OAAO,GAAG,UAAU,CAAuB,eAAe,CAAC,CAAA;IAEjE,IAAI,OAAO,KAAK,SAAS,EAAE;QACzB,MAAM,IAAI,KAAK,CAAC,2DAA2D,CAAC,CAAA;KAC7E;IAED,OAAO,OAAO,CAAA;AAChB,CAAC,CAAA"}

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

@@ -1,8 +1,8 @@
-/// <reference types="react" />
-declare type DropdownPosition = Pick<React.CSSProperties, 'position' | 'top' | 'left'>;
-/**
- * Hook used to find the DropdownMenu position in relation to DropdownButton
- * @returns Style with positions.
- */
-export declare const useDropdownPosition: () => DropdownPosition;
-export {};
+/// <reference types="react" />
+declare type DropdownPosition = Pick<React.CSSProperties, 'position' | 'top' | 'left'>;
+/**
+ * Hook used to find the DropdownMenu position in relation to DropdownButton
+ * @returns Style with positions.
+ */
+export declare const useDropdownPosition: () => DropdownPosition;
+export {};

package/dist/molecules/Dropdown/hooks/useDropdownPosition.js

@@ -0,0 +1,25 @@
+import { useDropdown } from './useDropdown';
+/**
+ * Hook used to find the DropdownMenu position in relation to DropdownButton
+ * @returns Style with positions.
+ */
+export const useDropdownPosition = () => {
+    const { dropdownButtonRef } = useDropdown();
+    // Necessary to use this component in SSR
+    const isBrowser = typeof window !== 'undefined';
+    const buttonRect = dropdownButtonRef?.current?.getBoundingClientRect();
+    const topLevel = buttonRect?.top ?? 0;
+    const topOffset = buttonRect?.height ?? 0;
+    const leftLevel = buttonRect?.left ?? 0;
+    // The scroll properties fix the position of DropdownMenu when the scroll is activated.
+    const scrollTop = isBrowser ? document?.documentElement?.scrollTop : 0;
+    const scrollLeft = isBrowser ? document?.documentElement?.scrollLeft : 0;
+    const topPosition = topLevel + topOffset + scrollTop;
+    const leftPosition = leftLevel + scrollLeft;
+    return {
+        position: 'absolute',
+        top: topPosition,
+        left: leftPosition,
+    };
+};
+//# sourceMappingURL=useDropdownPosition.js.map

package/dist/molecules/Dropdown/hooks/useDropdownPosition.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDropdownPosition.js","sourceRoot":"","sources":["../../../../src/molecules/Dropdown/hooks/useDropdownPosition.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAI3C;;;GAGG;AACH,MAAM,CAAC,MAAM,mBAAmB,GAAG,GAAqB,EAAE;IACxD,MAAM,EAAE,iBAAiB,EAAE,GAAG,WAAW,EAAE,CAAA;IAE3C,yCAAyC;IACzC,MAAM,SAAS,GAAG,OAAO,MAAM,KAAK,WAAW,CAAA;IAE/C,MAAM,UAAU,GAAG,iBAAiB,EAAE,OAAO,EAAE,qBAAqB,EAAE,CAAA;IACtE,MAAM,QAAQ,GAAG,UAAU,EAAE,GAAG,IAAI,CAAC,CAAA;IACrC,MAAM,SAAS,GAAG,UAAU,EAAE,MAAM,IAAI,CAAC,CAAA;IACzC,MAAM,SAAS,GAAG,UAAU,EAAE,IAAI,IAAI,CAAC,CAAA;IAEvC,uFAAuF;IACvF,MAAM,SAAS,GAAG,SAAS,CAAC,CAAC,CAAC,QAAQ,EAAE,eAAe,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC,CAAA;IACtE,MAAM,UAAU,GAAG,SAAS,CAAC,CAAC,CAAC,QAAQ,EAAE,eAAe,EAAE,UAAU,CAAC,CAAC,CAAC,CAAC,CAAA;IAExE,MAAM,WAAW,GAAG,QAAQ,GAAG,SAAS,GAAG,SAAS,CAAA;IAEpD,MAAM,YAAY,GAAG,SAAS,GAAG,UAAU,CAAA;IAE3C,OAAO;QACL,QAAQ,EAAE,UAAU;QACpB,GAAG,EAAE,WAAW;QAChB,IAAI,EAAE,YAAY;KACnB,CAAA;AACH,CAAC,CAAA"}

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

@@ -1,8 +1,8 @@
-export { default } from './Dropdown';
-export type { DropdownProps } from './Dropdown';
-export { default as DropdownButton } from './DropdownButton';
-export type { DropdownButtonProps } from './DropdownButton';
-export { default as DropdownItem } from './DropdownItem';
-export type { DropdownItemProps } from './DropdownItem';
-export { default as DropdownMenu } from './DropdownMenu';
-export type { DropdownMenuProps } from './DropdownMenu';
+export { default } from './Dropdown';
+export type { DropdownProps } from './Dropdown';
+export { default as DropdownButton } from './DropdownButton';
+export type { DropdownButtonProps } from './DropdownButton';
+export { default as DropdownItem } from './DropdownItem';
+export type { DropdownItemProps } from './DropdownItem';
+export { default as DropdownMenu } from './DropdownMenu';
+export type { DropdownMenuProps } from './DropdownMenu';

package/dist/molecules/Dropdown/index.js

@@ -0,0 +1,5 @@
+export { default } from './Dropdown';
+export { default as DropdownButton } from './DropdownButton';
+export { default as DropdownItem } from './DropdownItem';
+export { default as DropdownMenu } from './DropdownMenu';
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/molecules/Dropdown/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAA;AAGpC,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAA;AAG5D,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAGxD,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAA"}

package/dist/molecules/Dropdown/stories/assets/Caret.d.ts

@@ -1,2 +1,2 @@
-/// <reference types="react" />
-export declare const Caret: () => JSX.Element;
+/// <reference types="react" />
+export declare const Caret: () => JSX.Element;

package/dist/molecules/Dropdown/stories/assets/Caret.js

@@ -0,0 +1,4 @@
+import React from 'react';
+export const Caret = () => (React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "feather feather-chevron-down", style: { display: 'inline' } },
+    React.createElement("polyline", { points: "6 9 12 15 18 9" })));
+//# sourceMappingURL=Caret.js.map

package/dist/molecules/Dropdown/stories/assets/Caret.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Caret.js","sourceRoot":"","sources":["../../../../../src/molecules/Dropdown/stories/assets/Caret.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,MAAM,CAAC,MAAM,KAAK,GAAG,GAAG,EAAE,CAAC,CACzB,6BACE,KAAK,EAAC,4BAA4B,EAClC,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,cAAc,EACrB,WAAW,EAAC,GAAG,EACf,aAAa,EAAC,OAAO,EACrB,cAAc,EAAC,OAAO,EACtB,SAAS,EAAC,8BAA8B,EACxC,KAAK,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE;IAE5B,kCAAU,MAAM,EAAC,gBAAgB,GAAG,CAChC,CACP,CAAA"}

package/dist/molecules/Form/Form.d.ts

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

package/dist/molecules/Form/Form.js

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

package/dist/molecules/Form/Form.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Form.js","sourceRoot":"","sources":["../../../src/molecules/Form/Form.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAUzC,MAAM,IAAI,GAAG,UAAU,CAA6B,SAAS,IAAI,CAC/D,EAAE,MAAM,GAAG,YAAY,EAAE,QAAQ,EAAE,GAAG,UAAU,EAAE,EAClD,GAAG;IAEH,OAAO,CACL,4CAAM,GAAG,EAAE,GAAG,0CAA+B,MAAM,IAAM,UAAU,GAChE,QAAQ,CACJ,CACR,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,IAAI,CAAA"}

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

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

package/dist/molecules/Form/index.js

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

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

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

package/dist/molecules/IconButton/IconButton.d.ts

@@ -1,19 +1,19 @@
-import type { ReactNode } from 'react';
-import React from 'react';
-import type { ButtonProps } from '../../atoms/Button';
-export interface Props extends Omit<ButtonProps, 'children' | 'aria-label'> {
-    /**
-     * ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
-     */
-    testId?: string;
-    /**
-     * A React component that will be rendered as an icon.
-     */
-    icon: ReactNode;
-    /**
-     * Label to be required for accessibility.
-     */
-    'aria-label': string;
-}
-declare const IconButton: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLButtonElement>>;
-export default IconButton;
+import type { ReactNode } from 'react';
+import React from 'react';
+import type { ButtonProps } from '../../atoms/Button';
+export interface Props extends Omit<ButtonProps, 'children' | 'aria-label'> {
+    /**
+     * ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
+     */
+    testId?: string;
+    /**
+     * A React component that will be rendered as an icon.
+     */
+    icon: ReactNode;
+    /**
+     * Label to be required for accessibility.
+     */
+    'aria-label': string;
+}
+declare const IconButton: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLButtonElement>>;
+export default IconButton;

package/dist/molecules/IconButton/IconButton.js

@@ -0,0 +1,9 @@
+import React, { forwardRef } from 'react';
+import Button from '../../atoms/Button';
+import Icon from '../../atoms/Icon';
+const IconButton = forwardRef(function IconButton({ icon, testId = 'store-icon-button', ...buttonProps }, ref) {
+    return (React.createElement(Button, Object.assign({ ref: ref, "data-store-icon-button": true, testId: testId }, buttonProps),
+        React.createElement(Icon, { component: icon })));
+});
+export default IconButton;
+//# sourceMappingURL=IconButton.js.map

package/dist/molecules/IconButton/IconButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"IconButton.js","sourceRoot":"","sources":["../../../src/molecules/IconButton/IconButton.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAEzC,OAAO,MAAM,MAAM,oBAAoB,CAAA;AAEvC,OAAO,IAAI,MAAM,kBAAkB,CAAA;AAkBnC,MAAM,UAAU,GAAG,UAAU,CAA2B,SAAS,UAAU,CACzE,EAAE,IAAI,EAAE,MAAM,GAAG,mBAAmB,EAAE,GAAG,WAAW,EAAE,EACtD,GAAG;IAEH,OAAO,CACL,oBAAC,MAAM,kBAAC,GAAG,EAAE,GAAG,kCAAyB,MAAM,EAAE,MAAM,IAAM,WAAW;QACtE,oBAAC,IAAI,IAAC,SAAS,EAAE,IAAI,GAAI,CAClB,CACV,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,UAAU,CAAA"}

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

@@ -1,2 +1,2 @@
-export { default } from './IconButton';
-export type { Props as IconButtonProps } from './IconButton';
+export { default } from './IconButton';
+export type { Props as IconButtonProps } from './IconButton';