@faststore/components 3.41.3 → 3.44.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/hooks/UIProvider.d.ts +10 -1
- package/dist/cjs/hooks/UIProvider.js +24 -0
- package/dist/cjs/hooks/UIProvider.js.map +1 -1
- package/dist/cjs/hooks/index.d.ts +2 -1
- package/dist/cjs/hooks/index.js +5 -3
- package/dist/cjs/hooks/index.js.map +1 -1
- package/dist/cjs/hooks/useOnClickOutside.d.ts +4 -0
- package/dist/cjs/hooks/useOnClickOutside.js +33 -0
- package/dist/cjs/hooks/useOnClickOutside.js.map +1 -0
- package/dist/cjs/index.d.ts +2 -0
- package/dist/cjs/index.js +4 -2
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/molecules/Modal/Modal.d.ts +14 -6
- package/dist/cjs/molecules/Modal/Modal.js +13 -4
- package/dist/cjs/molecules/Modal/Modal.js.map +1 -1
- package/dist/cjs/molecules/Popover/Popover.d.ts +67 -0
- package/dist/cjs/molecules/Popover/Popover.js +65 -0
- package/dist/cjs/molecules/Popover/Popover.js.map +1 -0
- package/dist/cjs/molecules/Popover/index.d.ts +2 -0
- package/dist/cjs/molecules/Popover/index.js +9 -0
- package/dist/cjs/molecules/Popover/index.js.map +1 -0
- package/dist/cjs/molecules/RegionBar/RegionBar.d.ts +13 -4
- package/dist/cjs/molecules/RegionBar/RegionBar.js +5 -3
- package/dist/cjs/molecules/RegionBar/RegionBar.js.map +1 -1
- package/dist/cjs/molecules/SearchProducts/SearchProductItemContent.d.ts +24 -0
- package/dist/cjs/molecules/SearchProducts/SearchProductItemContent.js +9 -3
- package/dist/cjs/molecules/SearchProducts/SearchProductItemContent.js.map +1 -1
- package/dist/cjs/molecules/SearchProducts/SearchProductItemControl.d.ts +50 -0
- package/dist/cjs/molecules/SearchProducts/SearchProductItemControl.js +62 -0
- package/dist/cjs/molecules/SearchProducts/SearchProductItemControl.js.map +1 -0
- package/dist/cjs/organisms/RegionModal/RegionModal.d.ts +10 -1
- package/dist/cjs/organisms/RegionModal/RegionModal.js +15 -8
- package/dist/cjs/organisms/RegionModal/RegionModal.js.map +1 -1
- package/dist/cjs/organisms/SKUMatrix/SKUMatrixSidebar.js +1 -1
- package/dist/cjs/organisms/SKUMatrix/SKUMatrixSidebar.js.map +1 -1
- package/dist/cjs/organisms/ShippingSimulation/ShippingSimulation.d.ts +2 -2
- package/dist/esm/hooks/UIProvider.d.ts +10 -1
- package/dist/esm/hooks/UIProvider.js +24 -0
- package/dist/esm/hooks/UIProvider.js.map +1 -1
- package/dist/esm/hooks/index.d.ts +2 -1
- package/dist/esm/hooks/index.js +2 -1
- package/dist/esm/hooks/index.js.map +1 -1
- package/dist/esm/hooks/useOnClickOutside.d.ts +4 -0
- package/dist/esm/hooks/useOnClickOutside.js +29 -0
- package/dist/esm/hooks/useOnClickOutside.js.map +1 -0
- package/dist/esm/index.d.ts +2 -0
- package/dist/esm/index.js +1 -0
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/molecules/Modal/Modal.d.ts +14 -6
- package/dist/esm/molecules/Modal/Modal.js +13 -4
- package/dist/esm/molecules/Modal/Modal.js.map +1 -1
- package/dist/esm/molecules/Popover/Popover.d.ts +67 -0
- package/dist/esm/molecules/Popover/Popover.js +62 -0
- package/dist/esm/molecules/Popover/Popover.js.map +1 -0
- package/dist/esm/molecules/Popover/index.d.ts +2 -0
- package/dist/esm/molecules/Popover/index.js +2 -0
- package/dist/esm/molecules/Popover/index.js.map +1 -0
- package/dist/esm/molecules/RegionBar/RegionBar.d.ts +13 -4
- package/dist/esm/molecules/RegionBar/RegionBar.js +5 -3
- package/dist/esm/molecules/RegionBar/RegionBar.js.map +1 -1
- package/dist/esm/molecules/SearchProducts/SearchProductItemContent.d.ts +24 -0
- package/dist/esm/molecules/SearchProducts/SearchProductItemContent.js +10 -4
- package/dist/esm/molecules/SearchProducts/SearchProductItemContent.js.map +1 -1
- package/dist/esm/molecules/SearchProducts/SearchProductItemControl.d.ts +50 -0
- package/dist/esm/molecules/SearchProducts/SearchProductItemControl.js +59 -0
- package/dist/esm/molecules/SearchProducts/SearchProductItemControl.js.map +1 -0
- package/dist/esm/organisms/RegionModal/RegionModal.d.ts +10 -1
- package/dist/esm/organisms/RegionModal/RegionModal.js +15 -8
- package/dist/esm/organisms/RegionModal/RegionModal.js.map +1 -1
- package/dist/esm/organisms/SKUMatrix/SKUMatrixSidebar.js +1 -1
- package/dist/esm/organisms/SKUMatrix/SKUMatrixSidebar.js.map +1 -1
- package/dist/esm/organisms/ShippingSimulation/ShippingSimulation.d.ts +2 -2
- package/package.json +2 -2
- package/src/hooks/UIProvider.tsx +48 -1
- package/src/hooks/index.ts +2 -1
- package/src/hooks/useOnClickOutside.ts +40 -0
- package/src/index.ts +2 -0
- package/src/molecules/Modal/Modal.tsx +29 -8
- package/src/molecules/Popover/Popover.tsx +209 -0
- package/src/molecules/Popover/index.tsx +2 -0
- package/src/molecules/RegionBar/RegionBar.tsx +21 -5
- package/src/molecules/SearchProducts/SearchProductItemContent.tsx +61 -10
- package/src/molecules/SearchProducts/SearchProductItemControl.tsx +199 -0
- package/src/organisms/RegionModal/RegionModal.tsx +29 -7
- package/src/organisms/SKUMatrix/SKUMatrixSidebar.tsx +1 -1
- package/src/organisms/ShippingSimulation/ShippingSimulation.tsx +2 -2
|
@@ -0,0 +1,67 @@
|
|
|
1
|
+
import React, { type HTMLAttributes, type ReactNode, type RefObject } from 'react';
|
|
2
|
+
/**
|
|
3
|
+
* Specifies Popover position.
|
|
4
|
+
*/
|
|
5
|
+
export type Side = 'bottom' | 'top';
|
|
6
|
+
/**
|
|
7
|
+
* Specifies tooltip alignment.
|
|
8
|
+
*/
|
|
9
|
+
export type Alignment = 'start' | 'center' | 'end';
|
|
10
|
+
/**
|
|
11
|
+
* Combines side + alignment (e.g., "top-start").
|
|
12
|
+
*/
|
|
13
|
+
export type Placement = `${Side}-${Alignment}`;
|
|
14
|
+
export interface PopoverProps extends Omit<HTMLAttributes<HTMLDivElement>, 'content'> {
|
|
15
|
+
/**
|
|
16
|
+
* The Popover header's title.
|
|
17
|
+
*/
|
|
18
|
+
title?: string;
|
|
19
|
+
/**
|
|
20
|
+
* Content of the Popover.
|
|
21
|
+
*/
|
|
22
|
+
content: ReactNode;
|
|
23
|
+
/**
|
|
24
|
+
* Defines the side or side-alignment (e.g., "bottom-start", "bottom-center") of the Popover.
|
|
25
|
+
*/
|
|
26
|
+
placement?: Placement;
|
|
27
|
+
/**
|
|
28
|
+
* If the Popover can be closed by a button.
|
|
29
|
+
*/
|
|
30
|
+
dismissible?: boolean;
|
|
31
|
+
/**
|
|
32
|
+
* Called when the Popover is dismissed.
|
|
33
|
+
*/
|
|
34
|
+
onDismiss?: () => void;
|
|
35
|
+
/**
|
|
36
|
+
* Callback when the Popover is fully rendered and positioned.
|
|
37
|
+
*/
|
|
38
|
+
onEntered?: () => void;
|
|
39
|
+
/**
|
|
40
|
+
* Close button aria-label.
|
|
41
|
+
*/
|
|
42
|
+
closeButtonAriaLabel?: string;
|
|
43
|
+
/**
|
|
44
|
+
* Controls whether the Popover is open.
|
|
45
|
+
*/
|
|
46
|
+
isOpen: boolean;
|
|
47
|
+
/**
|
|
48
|
+
* ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
|
|
49
|
+
*/
|
|
50
|
+
testId?: string;
|
|
51
|
+
/**
|
|
52
|
+
* Offset value for top position (e.g.: 12).
|
|
53
|
+
* @default '8'
|
|
54
|
+
*/
|
|
55
|
+
offsetTop?: number;
|
|
56
|
+
/**
|
|
57
|
+
* Offset value for left position (e.g.: 12).
|
|
58
|
+
* @default '0'
|
|
59
|
+
*/
|
|
60
|
+
offsetLeft?: number;
|
|
61
|
+
/**
|
|
62
|
+
* Reference to the trigger element that opens the Popover.
|
|
63
|
+
*/
|
|
64
|
+
triggerRef?: RefObject<HTMLElement>;
|
|
65
|
+
}
|
|
66
|
+
declare const Popover: React.ForwardRefExoticComponent<PopoverProps & React.RefAttributes<HTMLDivElement>>;
|
|
67
|
+
export default Popover;
|
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
import React, { forwardRef, useCallback, useEffect, useRef, useState, } from 'react';
|
|
2
|
+
import Icon from '../../atoms/Icon';
|
|
3
|
+
import IconButton from '../IconButton';
|
|
4
|
+
import { useOnClickOutside, useUI } from '../../hooks';
|
|
5
|
+
const calculatePosition = (rect, placement, offsetTop, offsetLeft) => {
|
|
6
|
+
const { top, left, height } = rect;
|
|
7
|
+
switch (true) {
|
|
8
|
+
case placement.startsWith('top'):
|
|
9
|
+
return {
|
|
10
|
+
top: top + height + window.scrollY - offsetTop,
|
|
11
|
+
left: left + window.scrollX + offsetLeft,
|
|
12
|
+
};
|
|
13
|
+
case placement.startsWith('bottom'):
|
|
14
|
+
return {
|
|
15
|
+
top: top + height + window.scrollY + offsetTop,
|
|
16
|
+
left: left + window.scrollX + offsetLeft,
|
|
17
|
+
};
|
|
18
|
+
default:
|
|
19
|
+
return { top: 0, left: 0 };
|
|
20
|
+
}
|
|
21
|
+
};
|
|
22
|
+
const Popover = forwardRef(function Popover({ title, content, placement = 'bottom-start', dismissible = false, onDismiss, isOpen, triggerRef: propTriggerRef, offsetTop = 8, offsetLeft = 0, closeButtonAriaLabel = 'Close Popover', testId = 'fs-popover', style, onEntered, ...otherProps }, ref) {
|
|
23
|
+
// Use forwarded ref or internal ref for fallback
|
|
24
|
+
const popoverRef = ref || useRef(null);
|
|
25
|
+
const [popoverPosition, setPopoverPosition] = useState({ top: 0, left: 0 });
|
|
26
|
+
const { popover, closePopover } = useUI();
|
|
27
|
+
const contextTriggerRef = popover.triggerRef;
|
|
28
|
+
// Use the propTriggerRef if provided, otherwise fallback to contextTriggerRef
|
|
29
|
+
const triggerRef = propTriggerRef || contextTriggerRef;
|
|
30
|
+
useEffect(() => {
|
|
31
|
+
if (!isOpen || !triggerRef?.current)
|
|
32
|
+
return;
|
|
33
|
+
// Set the position according to the trigger element and placement
|
|
34
|
+
const rect = triggerRef.current.getBoundingClientRect();
|
|
35
|
+
setPopoverPosition(calculatePosition(rect, placement, offsetTop, offsetLeft));
|
|
36
|
+
// Trigger the onEntered callback after positioning
|
|
37
|
+
if (onEntered) {
|
|
38
|
+
onEntered();
|
|
39
|
+
}
|
|
40
|
+
}, [isOpen, triggerRef, offsetTop, offsetLeft, placement]);
|
|
41
|
+
const handleDismiss = useCallback(() => {
|
|
42
|
+
closePopover();
|
|
43
|
+
onDismiss?.();
|
|
44
|
+
}, [closePopover, onDismiss]);
|
|
45
|
+
useOnClickOutside(isOpen ? popoverRef : undefined, handleDismiss);
|
|
46
|
+
const handleKeyDown = useCallback((event) => {
|
|
47
|
+
if (event.key === 'Escape') {
|
|
48
|
+
handleDismiss();
|
|
49
|
+
}
|
|
50
|
+
}, [handleDismiss]);
|
|
51
|
+
if (!isOpen) {
|
|
52
|
+
return null;
|
|
53
|
+
}
|
|
54
|
+
return (React.createElement("div", { "data-fs-popover": true, role: "dialog", ref: popoverRef, "data-fs-popover-placement": placement, onKeyDown: handleKeyDown, "data-testid": testId, style: { position: 'absolute', ...popoverPosition, ...style }, ...otherProps },
|
|
55
|
+
React.createElement("header", { "data-fs-popover-header": true },
|
|
56
|
+
title && React.createElement("h3", { "data-fs-popover-header-title": true }, title),
|
|
57
|
+
dismissible && (React.createElement(IconButton, { "data-fs-popover-header-dismiss-button": true, size: "small", variant: "tertiary", icon: React.createElement(Icon, { name: "X", width: 20, height: 20 }), "aria-label": closeButtonAriaLabel, onClick: handleDismiss }))),
|
|
58
|
+
React.createElement("div", { "data-fs-popover-content": true }, content),
|
|
59
|
+
React.createElement("span", { "data-fs-popover-indicator": true, "aria-hidden": "true" })));
|
|
60
|
+
});
|
|
61
|
+
export default Popover;
|
|
62
|
+
//# sourceMappingURL=Popover.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Popover.js","sourceRoot":"","sources":["../../../../src/molecules/Popover/Popover.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/molecules/Popover/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAA"}
|
|
@@ -1,8 +1,12 @@
|
|
|
1
|
-
import type { HTMLAttributes, ReactNode } from 'react';
|
|
1
|
+
import type { HTMLAttributes, ReactNode, RefAttributes } from 'react';
|
|
2
2
|
import React from 'react';
|
|
3
|
-
export interface RegionBarProps extends HTMLAttributes<HTMLDivElement> {
|
|
3
|
+
export interface RegionBarProps extends HTMLAttributes<HTMLDivElement>, RefAttributes<HTMLDivElement> {
|
|
4
4
|
/**
|
|
5
|
-
*
|
|
5
|
+
* City to be displayed in the component.
|
|
6
|
+
*/
|
|
7
|
+
city?: string;
|
|
8
|
+
/**
|
|
9
|
+
* Postal code string to be display in the component.
|
|
6
10
|
*/
|
|
7
11
|
postalCode?: string;
|
|
8
12
|
/**
|
|
@@ -25,6 +29,11 @@ export interface RegionBarProps extends HTMLAttributes<HTMLDivElement> {
|
|
|
25
29
|
* A React component that will be rendered as an icon.
|
|
26
30
|
*/
|
|
27
31
|
buttonIcon?: ReactNode;
|
|
32
|
+
/**
|
|
33
|
+
* Boolean to control whether postal code should be visible or not.
|
|
34
|
+
* @default true
|
|
35
|
+
*/
|
|
36
|
+
shouldDisplayPostalCode?: boolean;
|
|
28
37
|
}
|
|
29
|
-
declare const RegionBar: React.ForwardRefExoticComponent<RegionBarProps &
|
|
38
|
+
declare const RegionBar: React.ForwardRefExoticComponent<Omit<RegionBarProps, "ref"> & RefAttributes<HTMLDivElement>>;
|
|
30
39
|
export default RegionBar;
|
|
@@ -1,11 +1,13 @@
|
|
|
1
1
|
import React, { forwardRef } from 'react';
|
|
2
2
|
import { Button } from '../../';
|
|
3
|
-
const RegionBar = forwardRef(function RegionBar({ postalCode, icon, label, editLabel, buttonIcon, onButtonClick, ...otherProps }, ref) {
|
|
3
|
+
const RegionBar = forwardRef(function RegionBar({ city, postalCode, icon, label, editLabel, buttonIcon, onButtonClick, shouldDisplayPostalCode = true, ...otherProps }, ref) {
|
|
4
4
|
return (React.createElement("div", { ref: ref, "data-fs-region-bar": true, ...otherProps },
|
|
5
5
|
React.createElement(Button, { variant: "tertiary", iconPosition: "right", onClick: onButtonClick, icon: buttonIcon },
|
|
6
6
|
!!icon && icon,
|
|
7
|
-
postalCode ? (React.createElement(React.Fragment, null,
|
|
8
|
-
React.createElement("span", { "data-fs-region-bar-postal-code": true },
|
|
7
|
+
city && postalCode ? (React.createElement(React.Fragment, null,
|
|
8
|
+
React.createElement("span", { "data-fs-region-bar-postal-code": true },
|
|
9
|
+
city,
|
|
10
|
+
shouldDisplayPostalCode && `, ${postalCode}`),
|
|
9
11
|
!!editLabel && React.createElement("span", { "data-fs-region-bar-cta": true }, editLabel))) : (React.createElement("span", { "data-fs-region-bar-message": true }, label)))));
|
|
10
12
|
});
|
|
11
13
|
export default RegionBar;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RegionBar.js","sourceRoot":"","sources":["../../../../src/molecules/RegionBar/RegionBar.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAEzC,OAAO,EAAE,MAAM,EAAE,MAAM,QAAQ,CAAA;
|
|
1
|
+
{"version":3,"file":"RegionBar.js","sourceRoot":"","sources":["../../../../src/molecules/RegionBar/RegionBar.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAEzC,OAAO,EAAE,MAAM,EAAE,MAAM,QAAQ,CAAA;AAwC/B,MAAM,SAAS,GAAG,UAAU,CAAiC,SAAS,SAAS,CAC7E,EACE,IAAI,EACJ,UAAU,EACV,IAAI,EACJ,KAAK,EACL,SAAS,EACT,UAAU,EACV,aAAa,EACb,uBAAuB,GAAG,IAAI,EAC9B,GAAG,UAAU,EACd,EACD,GAAG;IAEH,OAAO,CACL,6BAAK,GAAG,EAAE,GAAG,iCAAyB,UAAU;QAC9C,oBAAC,MAAM,IACL,OAAO,EAAC,UAAU,EAClB,YAAY,EAAC,OAAO,EACpB,OAAO,EAAE,aAAa,EACtB,IAAI,EAAE,UAAU;YAEf,CAAC,CAAC,IAAI,IAAI,IAAI;YACd,IAAI,IAAI,UAAU,CAAC,CAAC,CAAC,CACpB;gBACE;oBACG,IAAI;oBACJ,uBAAuB,IAAI,KAAK,UAAU,EAAE,CACxC;gBACN,CAAC,CAAC,SAAS,IAAI,gEAA8B,SAAS,CAAQ,CAC9D,CACJ,CAAC,CAAC,CAAC,CACF,oEAAkC,KAAK,CAAQ,CAChD,CACM,CACL,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,SAAS,CAAA"}
|
|
@@ -9,6 +9,30 @@ export interface SearchProductItemContentProps {
|
|
|
9
9
|
* Specifies product's prices.
|
|
10
10
|
*/
|
|
11
11
|
price: PriceDefinition;
|
|
12
|
+
/**
|
|
13
|
+
* Quick order settings.
|
|
14
|
+
*/
|
|
15
|
+
quickOrder?: {
|
|
16
|
+
enabled: boolean;
|
|
17
|
+
outOfStockLabel: string;
|
|
18
|
+
availability: boolean;
|
|
19
|
+
hasVariants: boolean;
|
|
20
|
+
skuMatrixControl: React.ReactNode;
|
|
21
|
+
quantity: number;
|
|
22
|
+
min?: number;
|
|
23
|
+
max?: number;
|
|
24
|
+
onChangeQuantity(value: number): void;
|
|
25
|
+
buyProps?: {
|
|
26
|
+
onClick: (e: React.MouseEvent<HTMLButtonElement>) => void;
|
|
27
|
+
'data-testid': string;
|
|
28
|
+
'data-sku': string;
|
|
29
|
+
'data-seller': string;
|
|
30
|
+
};
|
|
31
|
+
};
|
|
32
|
+
/**
|
|
33
|
+
* Event emitted when value is out of the min and max bounds
|
|
34
|
+
*/
|
|
35
|
+
onValidateBlur?: (min: number, maxValue: number, quantity: number) => void;
|
|
12
36
|
}
|
|
13
37
|
declare const SearchProductItemContent: React.ForwardRefExoticComponent<SearchProductItemContentProps & React.RefAttributes<HTMLElement>>;
|
|
14
38
|
export default SearchProductItemContent;
|
|
@@ -1,9 +1,15 @@
|
|
|
1
|
-
import React, { forwardRef } from 'react';
|
|
1
|
+
import React, { forwardRef, useCallback } from 'react';
|
|
2
2
|
import { ProductPrice } from '../..';
|
|
3
|
-
|
|
3
|
+
import SearchProductItemControl from './SearchProductItemControl';
|
|
4
|
+
const SearchProductItemContent = forwardRef(function SearchProductItemContent({ price, title, quickOrder, onValidateBlur, ...otherProps }, ref) {
|
|
5
|
+
const renderProductItemContent = useCallback(() => {
|
|
6
|
+
return (React.createElement(React.Fragment, null,
|
|
7
|
+
React.createElement("p", { "data-fs-search-product-item-title": true }, title),
|
|
8
|
+
price.value !== 0 && (React.createElement(ProductPrice, { "data-fs-search-product-item-prices": true, listPrice: price.listPrice, value: price.value, formatter: price.formatter }))));
|
|
9
|
+
}, [price.formatter, price.listPrice, price.value, title]);
|
|
4
10
|
return (React.createElement("section", { ref: ref, "data-fs-search-product-item-content": true, ...otherProps },
|
|
5
|
-
|
|
6
|
-
|
|
11
|
+
!quickOrder?.enabled && renderProductItemContent(),
|
|
12
|
+
quickOrder?.enabled && (React.createElement(SearchProductItemControl, { outOfStockLabel: quickOrder.outOfStockLabel, availability: quickOrder.availability, hasVariants: quickOrder.hasVariants, skuMatrixControl: quickOrder.skuMatrixControl, quantity: quickOrder.quantity, onChangeQuantity: quickOrder.onChangeQuantity, max: quickOrder.max, onValidateBlur: onValidateBlur, ...quickOrder.buyProps }, renderProductItemContent()))));
|
|
7
13
|
});
|
|
8
14
|
export default SearchProductItemContent;
|
|
9
15
|
//# sourceMappingURL=SearchProductItemContent.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SearchProductItemContent.js","sourceRoot":"","sources":["../../../../src/molecules/SearchProducts/SearchProductItemContent.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"SearchProductItemContent.js","sourceRoot":"","sources":["../../../../src/molecules/SearchProducts/SearchProductItemContent.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,OAAO,CAAA;AACtD,OAAO,EAAE,YAAY,EAAE,MAAM,OAAO,CAAA;AACpC,OAAO,wBAAwB,MAAM,4BAA4B,CAAA;AAuCjE,MAAM,wBAAwB,GAAG,UAAU,CAGzC,SAAS,wBAAwB,CACjC,EAAE,KAAK,EAAE,KAAK,EAAE,UAAU,EAAE,cAAc,EAAE,GAAG,UAAU,EAAE,EAC3D,GAAG;IAEH,MAAM,wBAAwB,GAAG,WAAW,CAAC,GAAG,EAAE;QAChD,OAAO,CACL;YACE,wEAAsC,KAAK,CAAK;YAC/C,KAAK,CAAC,KAAK,KAAK,CAAC,IAAI,CACpB,oBAAC,YAAY,gDAEX,SAAS,EAAE,KAAK,CAAC,SAAS,EAC1B,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,SAAS,EAAE,KAAK,CAAC,SAAS,GAC1B,CACH,CACA,CACJ,CAAA;IACH,CAAC,EAAE,CAAC,KAAK,CAAC,SAAS,EAAE,KAAK,CAAC,SAAS,EAAE,KAAK,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC,CAAA;IAE1D,OAAO,CACL,iCAAS,GAAG,EAAE,GAAG,kDAA0C,UAAU;QAClE,CAAC,UAAU,EAAE,OAAO,IAAI,wBAAwB,EAAE;QAElD,UAAU,EAAE,OAAO,IAAI,CACtB,oBAAC,wBAAwB,IACvB,eAAe,EAAE,UAAU,CAAC,eAAe,EAC3C,YAAY,EAAE,UAAU,CAAC,YAAY,EACrC,WAAW,EAAE,UAAU,CAAC,WAAW,EACnC,gBAAgB,EAAE,UAAU,CAAC,gBAAgB,EAC7C,QAAQ,EAAE,UAAU,CAAC,QAAQ,EAC7B,gBAAgB,EAAE,UAAU,CAAC,gBAAgB,EAC7C,GAAG,EAAE,UAAU,CAAC,GAAG,EACnB,cAAc,EAAE,cAAc,KAC1B,UAAU,CAAC,QAAQ,IAEtB,wBAAwB,EAAE,CACF,CAC5B,CACO,CACX,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,wBAAwB,CAAA"}
|
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
import React, { type HTMLAttributes } from 'react';
|
|
2
|
+
import type { MouseEvent, ReactNode } from 'react';
|
|
3
|
+
export interface SearchProductItemControlProps extends Omit<HTMLAttributes<HTMLDivElement>, 'children' | 'onClick'> {
|
|
4
|
+
/**
|
|
5
|
+
* Renders child elements.
|
|
6
|
+
*/
|
|
7
|
+
children: ReactNode;
|
|
8
|
+
/**
|
|
9
|
+
* Specifies the label for out-of-stock products.
|
|
10
|
+
*/
|
|
11
|
+
outOfStockLabel: string;
|
|
12
|
+
/**
|
|
13
|
+
* Specifies whether the product is available.
|
|
14
|
+
*/
|
|
15
|
+
availability: boolean;
|
|
16
|
+
/**
|
|
17
|
+
* Specifies whether the product has variations.
|
|
18
|
+
*/
|
|
19
|
+
hasVariants: boolean;
|
|
20
|
+
/**
|
|
21
|
+
* Renders the elements of the SKUMatrix.
|
|
22
|
+
*/
|
|
23
|
+
skuMatrixControl: ReactNode;
|
|
24
|
+
/**
|
|
25
|
+
* The maximum value the input can receive
|
|
26
|
+
*/
|
|
27
|
+
max?: number;
|
|
28
|
+
/**
|
|
29
|
+
* The minimum value the input can receive
|
|
30
|
+
*/
|
|
31
|
+
min?: number;
|
|
32
|
+
/**
|
|
33
|
+
* Specifies the quantity to be added to the cart.
|
|
34
|
+
*/
|
|
35
|
+
quantity: number;
|
|
36
|
+
/**
|
|
37
|
+
* Callback that fires when the add to cart button is clicked.
|
|
38
|
+
*/
|
|
39
|
+
onClick?: (e: MouseEvent<HTMLButtonElement>) => void;
|
|
40
|
+
/**
|
|
41
|
+
* Callback that fires when the input value changes.
|
|
42
|
+
*/
|
|
43
|
+
onChangeQuantity: (value: number) => void;
|
|
44
|
+
/**
|
|
45
|
+
* Event emitted when value is out of the min and max bounds
|
|
46
|
+
*/
|
|
47
|
+
onValidateBlur?: (min: number, maxValue: number, quantity: number) => void;
|
|
48
|
+
}
|
|
49
|
+
declare const SearchProductItemControl: React.ForwardRefExoticComponent<SearchProductItemControlProps & React.RefAttributes<HTMLDivElement>>;
|
|
50
|
+
export default SearchProductItemControl;
|
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
import React, { forwardRef, useCallback, useState, } from 'react';
|
|
2
|
+
import { Badge, Icon, IconButton, Input, Loader, QuantitySelector } from '../..';
|
|
3
|
+
const SearchProductItemControl = forwardRef(function SearchProductItemControl({ availability, children, hasVariants, skuMatrixControl, quantity, outOfStockLabel, min = 1, max = undefined, onClick, onChangeQuantity, onValidateBlur, ...otherProps }, ref) {
|
|
4
|
+
const [statusAddToCart, setStatusAddToCart] = useState('default');
|
|
5
|
+
const showSKUMatrixControl = availability && hasVariants;
|
|
6
|
+
function stopPropagationClick(e) {
|
|
7
|
+
e.preventDefault();
|
|
8
|
+
e.stopPropagation();
|
|
9
|
+
}
|
|
10
|
+
function handleAddToCart(event) {
|
|
11
|
+
if (onClick) {
|
|
12
|
+
setStatusAddToCart('inProgress');
|
|
13
|
+
setTimeout(() => {
|
|
14
|
+
setStatusAddToCart('completed');
|
|
15
|
+
onClick(event);
|
|
16
|
+
}, 1000);
|
|
17
|
+
setTimeout(() => {
|
|
18
|
+
setStatusAddToCart('default');
|
|
19
|
+
onChangeQuantity(1);
|
|
20
|
+
}, 2000);
|
|
21
|
+
}
|
|
22
|
+
}
|
|
23
|
+
const getIcon = useCallback(() => {
|
|
24
|
+
switch (statusAddToCart) {
|
|
25
|
+
case 'inProgress':
|
|
26
|
+
return React.createElement(Loader, null);
|
|
27
|
+
case 'completed':
|
|
28
|
+
return React.createElement(Icon, { name: "Checked", width: 24, height: 24 });
|
|
29
|
+
default:
|
|
30
|
+
return React.createElement(Icon, { name: "ShoppingCart", width: 24, height: 24 });
|
|
31
|
+
}
|
|
32
|
+
}, [statusAddToCart]);
|
|
33
|
+
function validateBlur() {
|
|
34
|
+
const maxValue = max ?? (min ? Math.max(quantity, min) : quantity);
|
|
35
|
+
const isOutOfBounds = quantity > maxValue || quantity < min;
|
|
36
|
+
const minQuantity = quantity < min ? min : quantity;
|
|
37
|
+
const realQuantity = quantity > maxValue ? maxValue : minQuantity;
|
|
38
|
+
if (isOutOfBounds) {
|
|
39
|
+
onValidateBlur?.(min, maxValue, realQuantity);
|
|
40
|
+
}
|
|
41
|
+
onChangeQuantity(realQuantity);
|
|
42
|
+
}
|
|
43
|
+
return (React.createElement("div", { ref: ref, "data-fs-search-product-item-control": true, ...otherProps },
|
|
44
|
+
React.createElement("div", { "data-fs-search-product-item-control-content": true },
|
|
45
|
+
!availability && (React.createElement(Badge, { "data-fs-search-product-item-control-badge": true, variant: "warning" }, outOfStockLabel)),
|
|
46
|
+
children),
|
|
47
|
+
availability && !hasVariants && (React.createElement("div", { "data-fs-search-product-item-control-actions": true, role: "group", "aria-hidden": true, tabIndex: -1, onKeyDown: () => { }, onClick: stopPropagationClick },
|
|
48
|
+
React.createElement("div", { "data-fs-search-product-item-control-actions-desktop": true },
|
|
49
|
+
React.createElement(QuantitySelector, { disabled: statusAddToCart !== 'default', max: max, onValidateBlur: onValidateBlur, initial: quantity, onChange: onChangeQuantity })),
|
|
50
|
+
React.createElement("div", { "data-fs-search-product-item-control-actions-mobile": true },
|
|
51
|
+
React.createElement(Input, { "data-fs-product-item-control-input": true, min: 1, value: quantity, onChange: (e) => onChangeQuantity(e.target.value ? Number(e.target.value) : 0), onBlur: validateBlur, onInput: (event) => {
|
|
52
|
+
const input = event.currentTarget;
|
|
53
|
+
input.value = input.value.replace(/\D/g, '');
|
|
54
|
+
} })),
|
|
55
|
+
React.createElement(IconButton, { variant: "primary", "aria-label": "Add product to cart", onClick: handleAddToCart, disabled: statusAddToCart === 'inProgress', icon: getIcon() }))),
|
|
56
|
+
showSKUMatrixControl && (React.createElement("div", { onClick: stopPropagationClick, "aria-hidden": true, tabIndex: -1, onKeyDown: () => { } }, skuMatrixControl))));
|
|
57
|
+
});
|
|
58
|
+
export default SearchProductItemControl;
|
|
59
|
+
//# sourceMappingURL=SearchProductItemControl.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SearchProductItemControl.js","sourceRoot":"","sources":["../../../../src/molecules/SearchProducts/SearchProductItemControl.tsx"],"names":[],"mappings":"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"}
|
|
@@ -43,6 +43,10 @@ export interface RegionModalProps extends Omit<ModalProps, 'children'> {
|
|
|
43
43
|
* Postal code input's label.
|
|
44
44
|
*/
|
|
45
45
|
inputLabel?: string;
|
|
46
|
+
/**
|
|
47
|
+
* The text displayed on the InputField Button. Suggestion: maximum 9 characters.
|
|
48
|
+
*/
|
|
49
|
+
inputButtonActionText?: string;
|
|
46
50
|
/**
|
|
47
51
|
* Enables fadeOut effect on modal after onSubmit function
|
|
48
52
|
*/
|
|
@@ -67,6 +71,11 @@ export interface RegionModalProps extends Omit<ModalProps, 'children'> {
|
|
|
67
71
|
* Callback function when the input clear button is clicked.
|
|
68
72
|
*/
|
|
69
73
|
onClear?: () => void;
|
|
74
|
+
/**
|
|
75
|
+
* Determines if the modal can be dismissed using the close button or the Escape key.
|
|
76
|
+
* @default true
|
|
77
|
+
*/
|
|
78
|
+
dismissible?: boolean;
|
|
70
79
|
}
|
|
71
|
-
declare function RegionModal({ testId, title, description, closeButtonAriaLabel, idkPostalCodeLinkProps, errorMessage, inputRef, inputValue, inputLabel, fadeOutOnSubmit, overlayProps, onClose, onInput, onSubmit, onClear, ...otherProps }: RegionModalProps): React.JSX.Element;
|
|
80
|
+
declare function RegionModal({ testId, title, description, closeButtonAriaLabel, idkPostalCodeLinkProps, errorMessage, inputRef, inputValue, inputLabel, inputButtonActionText, fadeOutOnSubmit, overlayProps, onClose, onInput, onSubmit, onClear, dismissible, ...otherProps }: RegionModalProps): React.JSX.Element;
|
|
72
81
|
export default RegionModal;
|
|
@@ -1,19 +1,26 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { InputField, Link, Modal, ModalBody, ModalHeader } from '../..';
|
|
3
|
-
function RegionModal({ testId = 'fs-region-modal', title = 'Set your location', description = '
|
|
4
|
-
return (React.createElement(Modal, { "data-fs-region-modal": true, testId: testId, overlayProps: overlayProps, title: "Region modal", "aria-label": "Region modal",
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
3
|
+
function RegionModal({ testId = 'fs-region-modal', title = 'Set your location', description = 'Offers and availability vary by location.', closeButtonAriaLabel = 'Close Region Modal', idkPostalCodeLinkProps, errorMessage, inputRef, inputValue, inputLabel = 'Postal Code', inputButtonActionText = 'Apply', fadeOutOnSubmit, overlayProps, onClose, onInput, onSubmit, onClear, dismissible = true, ...otherProps }) {
|
|
4
|
+
return (React.createElement(Modal, { "data-fs-region-modal": true, testId: testId, overlayProps: overlayProps, title: "Region modal", "aria-label": "Region modal", disableEscapeKeyDown: !dismissible, onEntered: () => {
|
|
5
|
+
if (inputRef?.current) {
|
|
6
|
+
inputRef.current.focus();
|
|
7
|
+
}
|
|
8
|
+
}, ...otherProps }, ({ fadeOut }) => (React.createElement(React.Fragment, null,
|
|
9
|
+
React.createElement(ModalHeader, { ...(dismissible && {
|
|
10
|
+
onClose: () => {
|
|
11
|
+
fadeOut();
|
|
12
|
+
onClear?.();
|
|
13
|
+
onClose?.();
|
|
14
|
+
},
|
|
15
|
+
}), title: title, description: description, closeBtnProps: {
|
|
9
16
|
'aria-label': closeButtonAriaLabel,
|
|
10
17
|
} }),
|
|
11
18
|
React.createElement(ModalBody, null,
|
|
12
|
-
React.createElement(InputField, { "data-fs-region-modal-input": true, id: `${testId}-input-field`, inputRef: inputRef, label: inputLabel, actionable: true, value: inputValue, onInput: (event) => onInput?.(event), onSubmit: () => {
|
|
19
|
+
React.createElement(InputField, { "data-fs-region-modal-input": true, id: `${testId}-input-field`, inputRef: inputRef, label: inputLabel, actionable: true, value: inputValue, buttonActionText: inputButtonActionText, onInput: (event) => onInput?.(event), onSubmit: () => {
|
|
13
20
|
onSubmit?.();
|
|
14
21
|
fadeOutOnSubmit ? fadeOut() : null;
|
|
15
22
|
}, onClear: () => onClear?.(), error: errorMessage }),
|
|
16
|
-
React.createElement(Link, { "data-fs-region-modal-link": true, ...idkPostalCodeLinkProps }))))));
|
|
23
|
+
idkPostalCodeLinkProps && (React.createElement(Link, { "data-fs-region-modal-link": true, ...idkPostalCodeLinkProps })))))));
|
|
17
24
|
}
|
|
18
25
|
export default RegionModal;
|
|
19
26
|
//# sourceMappingURL=RegionModal.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RegionModal.js","sourceRoot":"","sources":["../../../../src/organisms/RegionModal/RegionModal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,KAAK,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"RegionModal.js","sourceRoot":"","sources":["../../../../src/organisms/RegionModal/RegionModal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,KAAK,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,OAAO,CAAA;AAqFvE,SAAS,WAAW,CAAC,EACnB,MAAM,GAAG,iBAAiB,EAC1B,KAAK,GAAG,mBAAmB,EAC3B,WAAW,GAAG,2CAA2C,EACzD,oBAAoB,GAAG,oBAAoB,EAC3C,sBAAsB,EACtB,YAAY,EACZ,QAAQ,EACR,UAAU,EACV,UAAU,GAAG,aAAa,EAC1B,qBAAqB,GAAG,OAAO,EAC/B,eAAe,EACf,YAAY,EACZ,OAAO,EACP,OAAO,EACP,QAAQ,EACR,OAAO,EACP,WAAW,GAAG,IAAI,EAClB,GAAG,UAAU,EACI;IACjB,OAAO,CACL,oBAAC,KAAK,kCAEJ,MAAM,EAAE,MAAM,EACd,YAAY,EAAE,YAAY,EAC1B,KAAK,EAAC,cAAc,gBACT,cAAc,EACzB,oBAAoB,EAAE,CAAC,WAAW,EAClC,SAAS,EAAE,GAAG,EAAE;YACd,IAAI,QAAQ,EAAE,OAAO,EAAE,CAAC;gBACtB,QAAQ,CAAC,OAAO,CAAC,KAAK,EAAE,CAAA;YAC1B,CAAC;QACH,CAAC,KACG,UAAU,IAEb,CAAC,EAAE,OAAO,EAAE,EAAE,EAAE,CAAC,CAChB;QACE,oBAAC,WAAW,OACN,CAAC,WAAW,IAAI;gBAClB,OAAO,EAAE,GAAG,EAAE;oBACZ,OAAO,EAAE,CAAA;oBACT,OAAO,EAAE,EAAE,CAAA;oBACX,OAAO,EAAE,EAAE,CAAA;gBACb,CAAC;aACF,CAAC,EACF,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,WAAW,EACxB,aAAa,EAAE;gBACb,YAAY,EAAE,oBAAoB;aACnC,GACD;QACF,oBAAC,SAAS;YACR,oBAAC,UAAU,wCAET,EAAE,EAAE,GAAG,MAAM,cAAc,EAC3B,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,UAAU,EACjB,UAAU,QACV,KAAK,EAAE,UAAU,EACjB,gBAAgB,EAAE,qBAAqB,EACvC,OAAO,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,OAAO,EAAE,CAAC,KAAK,CAAC,EACpC,QAAQ,EAAE,GAAG,EAAE;oBACb,QAAQ,EAAE,EAAE,CAAA;oBACZ,eAAe,CAAC,CAAC,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC,IAAI,CAAA;gBACpC,CAAC,EACD,OAAO,EAAE,GAAG,EAAE,CAAC,OAAO,EAAE,EAAE,EAC1B,KAAK,EAAE,YAAY,GACnB;YACD,sBAAsB,IAAI,CACzB,oBAAC,IAAI,0CAA+B,sBAAsB,GAAI,CAC/D,CACS,CACX,CACJ,CACK,CACT,CAAA;AACH,CAAC;AAED,eAAe,WAAW,CAAA"}
|
|
@@ -17,7 +17,7 @@ function SKUMatrixSidebar({ title, direction = 'rightSide', size = 'partial', ch
|
|
|
17
17
|
}), { amount: 0, subtotal: 0 });
|
|
18
18
|
}, [allVariantProducts]);
|
|
19
19
|
function resetQuantityItems() {
|
|
20
|
-
setAllVariantProducts((prev) => prev.map((item) => ({ ...item,
|
|
20
|
+
setAllVariantProducts((prev) => prev.map((item) => ({ ...item, selectedCount: 0 })));
|
|
21
21
|
}
|
|
22
22
|
function onClose() {
|
|
23
23
|
resetQuantityItems();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SKUMatrixSidebar.js","sourceRoot":"","sources":["../../../../src/organisms/SKUMatrix/SKUMatrixSidebar.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAA;AACtC,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,gBAAgB,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACjE,OAAO,IAAI,MAAM,kBAAkB,CAAA;AACnC,OAAO,KAA8B,MAAM,mBAAmB,CAAA;AAC9D,OAAO,EAAE,aAAa,EAAE,YAAY,EAAE,KAAK,EAAE,MAAM,aAAa,CAAA;AAChE,OAAO,EACL,KAAK,EACL,SAAS,EACT,SAAS,EACT,SAAS,EACT,QAAQ,GACT,MAAM,uBAAuB,CAAA;AAC9B,OAAO,SAAS,EAAE,EAAE,eAAe,EAAuB,MAAM,cAAc,CAAA;AAY9E,MAAM,sBAAsB,GAA4C,CAAC,EACvE,GAAG,EACH,GAAG,EACH,GAAG,UAAU,EACd,EAAE,EAAE,CAAC,6BAAK,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,KAAM,UAAU,GAAI,CAAA;AAyCjD,SAAS,gBAAgB,CAAC,EACxB,KAAK,EACL,SAAS,GAAG,WAAW,EACvB,IAAI,GAAG,SAAS,EAChB,QAAQ,EACR,OAAO,EACP,OAAO,EACP,SAAS,EACT,cAAc,GAAG,sBAAsB,EACvC,QAAQ,EAAE,EAAE,OAAO,EAAE,gBAAgB,EAAE,GAAG,QAAQ,EAAE,EACpD,YAAY,EACZ,GAAG,UAAU,EACS;IACtB,MAAM,EACJ,MAAM,EACN,SAAS,EACT,qBAAqB,EACrB,kBAAkB,EAClB,oBAAoB,GACrB,GAAG,YAAY,EAAE,CAAA;IAClB,MAAM,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,CAAA;IAC7B,MAAM,EAAE,IAAI,EAAE,GAAG,aAAa,EAAE,CAAA;IAEhC,MAAM,WAAW,GAAG,OAAO,CAAC,GAAG,EAAE;QAC/B,OAAO,kBAAkB,CAAC,MAAM,CAC9B,CAAC,GAAG,EAAE,OAAO,EAAE,EAAE,CAAC,CAAC;YACjB,MAAM,EAAE,GAAG,CAAC,MAAM,GAAG,OAAO,CAAC,aAAa;YAC1C,QAAQ,EAAE,GAAG,CAAC,QAAQ,GAAG,OAAO,CAAC,aAAa,GAAG,OAAO,CAAC,KAAK;SAC/D,CAAC,EACF,EAAE,MAAM,EAAE,CAAC,EAAE,QAAQ,EAAE,CAAC,EAAE,CAC3B,CAAA;IACH,CAAC,EAAE,CAAC,kBAAkB,CAAC,CAAC,CAAA;IAExB,SAAS,kBAAkB;QACzB,qBAAqB,CAAC,CAAC,IAAI,EAAE,EAAE,CAC7B,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,EAAE,GAAG,IAAI,EAAE,
|
|
1
|
+
{"version":3,"file":"SKUMatrixSidebar.js","sourceRoot":"","sources":["../../../../src/organisms/SKUMatrix/SKUMatrixSidebar.tsx"],"names":[],"mappings":"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"}
|
|
@@ -54,9 +54,9 @@ interface Address {
|
|
|
54
54
|
*/
|
|
55
55
|
reference?: string;
|
|
56
56
|
/**
|
|
57
|
-
* Address geoCoordinates
|
|
57
|
+
* Address geoCoordinates. [longitude, latitude]
|
|
58
58
|
*/
|
|
59
|
-
geoCoordinates?: [number];
|
|
59
|
+
geoCoordinates?: [number, number];
|
|
60
60
|
}
|
|
61
61
|
export interface ShippingSimulationProps extends HTMLAttributes<HTMLDivElement> {
|
|
62
62
|
/**
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@faststore/components",
|
|
3
|
-
"version": "3.
|
|
3
|
+
"version": "3.44.0",
|
|
4
4
|
"main": "dist/cjs/index.js",
|
|
5
5
|
"module": "dist/esm/index.js",
|
|
6
6
|
"typings": "dist/esm/index.d.ts",
|
|
@@ -56,5 +56,5 @@
|
|
|
56
56
|
"volta": {
|
|
57
57
|
"extends": "../../package.json"
|
|
58
58
|
},
|
|
59
|
-
"gitHead": "
|
|
59
|
+
"gitHead": "14c097d5af92dbe8a6bf8e07e91ce4b343a827a7"
|
|
60
60
|
}
|
package/src/hooks/UIProvider.tsx
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type { PropsWithChildren, ReactNode } from 'react'
|
|
1
|
+
import type { PropsWithChildren, ReactNode, RefObject } from 'react'
|
|
2
2
|
import React, { createContext, useContext, useMemo, useReducer } from 'react'
|
|
3
3
|
|
|
4
4
|
export interface Toast {
|
|
@@ -8,6 +8,11 @@ export interface Toast {
|
|
|
8
8
|
icon?: ReactNode
|
|
9
9
|
}
|
|
10
10
|
|
|
11
|
+
export interface Popover {
|
|
12
|
+
isOpen: boolean
|
|
13
|
+
triggerRef?: RefObject<HTMLElement>
|
|
14
|
+
}
|
|
15
|
+
|
|
11
16
|
interface State {
|
|
12
17
|
/** Cart sidebar */
|
|
13
18
|
cart: boolean
|
|
@@ -17,7 +22,10 @@ interface State {
|
|
|
17
22
|
navbar: boolean
|
|
18
23
|
/** Search page filter slider */
|
|
19
24
|
filter: boolean
|
|
25
|
+
/** Toast notifications */
|
|
20
26
|
toasts: Toast[]
|
|
27
|
+
/** Region Popover */
|
|
28
|
+
popover: Popover
|
|
21
29
|
}
|
|
22
30
|
|
|
23
31
|
type UIElement = 'navbar' | 'cart' | 'modal' | 'filter'
|
|
@@ -38,6 +46,16 @@ type Action =
|
|
|
38
46
|
| {
|
|
39
47
|
type: 'popToast'
|
|
40
48
|
}
|
|
49
|
+
| {
|
|
50
|
+
type: 'openPopover'
|
|
51
|
+
payload: {
|
|
52
|
+
isOpen: boolean
|
|
53
|
+
triggerRef?: RefObject<HTMLElement>
|
|
54
|
+
}
|
|
55
|
+
}
|
|
56
|
+
| {
|
|
57
|
+
type: 'closePopover'
|
|
58
|
+
}
|
|
41
59
|
|
|
42
60
|
const reducer = (state: State, action: Action): State => {
|
|
43
61
|
const { type } = action
|
|
@@ -89,6 +107,26 @@ const reducer = (state: State, action: Action): State => {
|
|
|
89
107
|
}
|
|
90
108
|
}
|
|
91
109
|
|
|
110
|
+
case 'openPopover': {
|
|
111
|
+
return {
|
|
112
|
+
...state,
|
|
113
|
+
popover: {
|
|
114
|
+
isOpen: true,
|
|
115
|
+
triggerRef: action.payload.triggerRef,
|
|
116
|
+
},
|
|
117
|
+
}
|
|
118
|
+
}
|
|
119
|
+
|
|
120
|
+
case 'closePopover': {
|
|
121
|
+
return {
|
|
122
|
+
...state,
|
|
123
|
+
popover: {
|
|
124
|
+
isOpen: false,
|
|
125
|
+
triggerRef: undefined,
|
|
126
|
+
},
|
|
127
|
+
}
|
|
128
|
+
}
|
|
129
|
+
|
|
92
130
|
default:
|
|
93
131
|
throw new Error(`Action ${type} not implemented`)
|
|
94
132
|
}
|
|
@@ -100,6 +138,10 @@ const initializer = (): State => ({
|
|
|
100
138
|
navbar: false,
|
|
101
139
|
filter: false,
|
|
102
140
|
toasts: [],
|
|
141
|
+
popover: {
|
|
142
|
+
isOpen: false,
|
|
143
|
+
triggerRef: undefined,
|
|
144
|
+
},
|
|
103
145
|
})
|
|
104
146
|
|
|
105
147
|
interface Context extends State {
|
|
@@ -113,6 +155,8 @@ interface Context extends State {
|
|
|
113
155
|
closeModal: () => void
|
|
114
156
|
pushToast: (data: Toast) => void
|
|
115
157
|
popToast: () => void
|
|
158
|
+
openPopover: (popover: Popover) => void
|
|
159
|
+
closePopover: () => void
|
|
116
160
|
}
|
|
117
161
|
|
|
118
162
|
const UIContext = createContext<Context | undefined>(undefined)
|
|
@@ -133,6 +177,9 @@ function UIProvider({ children }: PropsWithChildren<unknown>) {
|
|
|
133
177
|
pushToast: (toast: Toast) =>
|
|
134
178
|
dispatch({ type: 'pushToast', payload: toast }),
|
|
135
179
|
popToast: () => dispatch({ type: 'popToast' }),
|
|
180
|
+
openPopover: (popover: Popover) =>
|
|
181
|
+
dispatch({ type: 'openPopover', payload: popover }),
|
|
182
|
+
closePopover: () => dispatch({ type: 'closePopover' }),
|
|
136
183
|
}),
|
|
137
184
|
[]
|
|
138
185
|
)
|