@sonic-equipment/ui 0.0.59 → 0.0.61
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/index.d.ts +178 -51
- package/dist/index.js +229 -282
- package/dist/src/buttons/link-button/link-button.d.ts +3 -1
- package/dist/src/global-search/plugins/popular-categories-plugin.d.ts +4 -2
- package/dist/src/shared/api/shop/hooks/wishlist/use-add-wishlist-item-to-current-wishlist.d.ts +3 -0
- package/dist/src/shared/api/shop/hooks/wishlist/use-add-wishlist.d.ts +0 -3
- package/dist/src/shared/api/shop/hooks/wishlist/use-create-current-wishlist.d.ts +1 -0
- package/dist/src/shared/api/shop/hooks/wishlist/use-fetch-all-wishlists-items.d.ts +5 -2
- package/dist/src/shared/api/shop/hooks/wishlist/use-remove-wishlist-item-from-wishlist.d.ts +4 -0
- package/dist/src/shared/api/shop/hooks/wishlist/wishlist.stories.d.ts +1 -0
- package/dist/src/shared/api/shop/services/wishlist-service.d.ts +30 -0
- package/dist/src/shared/providers/favorite-provider.d.ts +3 -0
- package/dist/styles.css +96 -41
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -12,7 +12,7 @@ import { simple } from 'instantsearch.js/es/lib/stateMappings/index.js';
|
|
|
12
12
|
import algoliasearch from 'algoliasearch';
|
|
13
13
|
import ReactDOM from 'react-dom';
|
|
14
14
|
import { createAutocomplete } from '@algolia/autocomplete-core';
|
|
15
|
-
import { getAlgoliaResults,
|
|
15
|
+
import { getAlgoliaResults, parseAlgoliaHitHighlight } from '@algolia/autocomplete-preset-algolia';
|
|
16
16
|
import { createQuerySuggestionsPlugin } from '@algolia/autocomplete-plugin-query-suggestions';
|
|
17
17
|
import { createLocalStorageRecentSearchesPlugin, search } from '@algolia/autocomplete-plugin-recent-searches';
|
|
18
18
|
import { TransitionGroup, Transition } from 'react-transition-group';
|
|
@@ -741,6 +741,43 @@ function useIsAuthenticated() {
|
|
|
741
741
|
return data?.isAuthenticated;
|
|
742
742
|
}
|
|
743
743
|
|
|
744
|
+
async function createWishList() {
|
|
745
|
+
return await request({
|
|
746
|
+
body: '{}',
|
|
747
|
+
headers: {
|
|
748
|
+
'Content-Type': 'application/json',
|
|
749
|
+
},
|
|
750
|
+
method: 'POST',
|
|
751
|
+
url: `${config.SHOP_API_URL}/api/v1/wishlists`,
|
|
752
|
+
});
|
|
753
|
+
}
|
|
754
|
+
async function addWishListItemToWishList({ productId, wishListId, }) {
|
|
755
|
+
return await request({
|
|
756
|
+
body: { productId, qtyOrdered: 1, unitOfMeasure: '' },
|
|
757
|
+
headers: {
|
|
758
|
+
'Content-Type': 'application/json',
|
|
759
|
+
},
|
|
760
|
+
method: 'POST',
|
|
761
|
+
url: `${config.SHOP_API_URL}/api/v1/wishlists/${wishListId}/wishlistlines`,
|
|
762
|
+
});
|
|
763
|
+
}
|
|
764
|
+
async function removeWishListItemFromWishList({ wishListId, wishListItemId, }) {
|
|
765
|
+
return await request({
|
|
766
|
+
method: 'DELETE',
|
|
767
|
+
url: `${config.SHOP_API_URL}/api/v1/wishlists/${wishListId}/wishlistlines/${wishListItemId}`,
|
|
768
|
+
});
|
|
769
|
+
}
|
|
770
|
+
async function getWishLists() {
|
|
771
|
+
return await request({
|
|
772
|
+
url: `${config.SHOP_API_URL}/api/v1/wishlists?page=1&pageSize=999`,
|
|
773
|
+
});
|
|
774
|
+
}
|
|
775
|
+
async function getWishListItemsByWishListId({ wishListId, }) {
|
|
776
|
+
return await request({
|
|
777
|
+
url: `${config.SHOP_API_URL}/api/v1/wishlists/${wishListId}/wishlistlines?page=1&pageSize=999`,
|
|
778
|
+
});
|
|
779
|
+
}
|
|
780
|
+
|
|
744
781
|
function useFetchAllWishListsItems() {
|
|
745
782
|
const queryClient = useQueryClient();
|
|
746
783
|
return useQuery({
|
|
@@ -749,25 +786,17 @@ function useFetchAllWishListsItems() {
|
|
|
749
786
|
// Reuse existing data if available
|
|
750
787
|
queryClient.getQueryData(['wishlists']) ||
|
|
751
788
|
// Otherwise fetch the data
|
|
752
|
-
(await
|
|
753
|
-
credentials: 'include',
|
|
754
|
-
headers: {
|
|
755
|
-
Authorization: `Bearer ${'eyJ0eXAiOiJKV1QiLCJhbGciOiJSUzI1NiIsIng1dCI6IlE5TmxVUmNmS2d6cWoxNzFValZtRkxWQlJMNCIsImtpZCI6IlE5TmxVUmNmS2d6cWoxNzFValZtRkxWQlJMNCJ9.eyJjbGllbnRfaWQiOiJpc2MiLCJzY29wZSI6WyJpc2NhcGkiLCJvZmZsaW5lX2FjY2VzcyJdLCJzdWIiOiI0NzMwZDNkZi04MGFjLTRkOGEtYWJjMy05MTUwZTRjMjZjYjUiLCJhbXIiOlsicGFzc3dvcmQiXSwiYXV0aF90aW1lIjoxNzIyNDk2MzY1LCJpZHAiOiJpZHNydiIsInByZWZlcnJlZF91c2VybmFtZSI6ImIucmllbWVuc0Bzb25pYy1lcXVpcG1lbnQuY29tIiwicm9sZSI6WyJWTUlfQWRtaW4iLCJBZG1pbmlzdHJhdG9yIl0sImlzcyI6Imh0dHBzOi8vc29uaWNlcXVpcG1lbnQuY29tbWVyY2UuaW5zaXRlc2FuZGJveC5jb20vaWRlbnRpdHkiLCJhdWQiOiJodHRwczovL3NvbmljZXF1aXBtZW50LmNvbW1lcmNlLmluc2l0ZXNhbmRib3guY29tL2lkZW50aXR5L3Jlc291cmNlcyIsImV4cCI6MTcyMjUzOTU2NSwibmJmIjoxNzIyNDk2MzY1fQ.OM5e30WgjLyFgm6vASio5wnny8A_Z4XxV_GP5uPrNqWXC_GD2xjKSpNW2GAzr5fGk5MSRpnVpK4NTLtGuEdcwZCXXxmUKTSG7E_nmx0dr3krr1d5Y8kn0gwfsDPT7L_esqxZ2fYWHGp08eKINH1i_F8GqhcAJsFCCc7e1QRnderegYEMEpA59IJ_ZaBNzl8JqqlaC5dDsmuVoJu_YmNiVeqwr31s7POZ3WWENU2hioxksQXVEtTKMxzysA4797iB-diaVaea2OP-UtWUqzDu85VVQSyzLfsR22mvn__yd8EAeWgjRQrABPK8ynE69Tltz004qx-Ah08AvAk2iEYoYf3mg9-VBEp-_35GsXi9PYkJC0VnnqBXp9Bk_-ZkUhLblmp1qtwhiiQt94X2OKa8iMxsez9RKOY60SQNeMF1AhPrWWfjEcyJFQ_-LRipCrj5LQLYm5vAGgVQ0cO_iekQda2xqRLNI-sBEJJ6cc3dQ2xG4_8swNXlE8I8aoDjjz7kTmTeIwpcfcKwdnzXytZaYH9i1SLDyG7zOWb8l-XfW4WerPxFvFx1j8vJzetAaBABGUegOmi3DE5UR2ix2KwpYkkhVGgBcd4foSAjgtDt-xPE2ukeJOrTw1xzBG6EbQotyyvutUkMNJiS53MBgnuovvvdM5EjMYZJCTdq-hrSyBg'}`,
|
|
756
|
-
},
|
|
757
|
-
url: `${config.SHOP_API_URL}/api/v1/wishlists?page=1&pageSize=999`,
|
|
758
|
-
}));
|
|
789
|
+
(await getWishLists());
|
|
759
790
|
// Update the cache with the new or existing data
|
|
760
791
|
queryClient.setQueryData(['wishlists'], body);
|
|
761
792
|
const wishListLines = await Promise.all((body.wishListCollection || []).map(async (wishList) => {
|
|
762
|
-
return await
|
|
763
|
-
|
|
764
|
-
|
|
765
|
-
|
|
766
|
-
|
|
767
|
-
url: `${config.SHOP_API_URL}/api/v1/wishlists/${wishList.id}/wishlistlines?page=1&pageSize=999`,
|
|
768
|
-
});
|
|
793
|
+
return ((await getWishListItemsByWishListId({ wishListId: wishList.id }))
|
|
794
|
+
.wishListLines || []).map(wishListItem => ({
|
|
795
|
+
wishList,
|
|
796
|
+
wishListItem,
|
|
797
|
+
}));
|
|
769
798
|
}));
|
|
770
|
-
return wishListLines.flatMap(
|
|
799
|
+
return wishListLines.flatMap(wishListDetails => wishListDetails);
|
|
771
800
|
},
|
|
772
801
|
queryKey: ['wishlists', '*', 'wishlistlines'],
|
|
773
802
|
});
|
|
@@ -788,11 +817,14 @@ function useFavorite() {
|
|
|
788
817
|
return { signInUrl: state.signInUrl };
|
|
789
818
|
}
|
|
790
819
|
function useFavoriteProduct(productId) {
|
|
791
|
-
const { data:
|
|
820
|
+
const { data: entries, isFetching: isFetchingWishListItems } = useFetchAllWishListsItems();
|
|
792
821
|
const isAuthenticated = useIsAuthenticated();
|
|
822
|
+
const entry = entries?.find(({ wishListItem }) => wishListItem.productId === productId);
|
|
793
823
|
return {
|
|
794
|
-
isFavorite: Boolean(
|
|
824
|
+
isFavorite: Boolean(entry),
|
|
795
825
|
isFetching: isFetchingWishListItems || isAuthenticated === undefined,
|
|
826
|
+
wishList: entry?.wishList,
|
|
827
|
+
wishListItem: entry?.wishListItem,
|
|
796
828
|
};
|
|
797
829
|
}
|
|
798
830
|
|
|
@@ -883,22 +915,22 @@ function SolidHomeIcon(props) {
|
|
|
883
915
|
return (jsx("svg", { xmlns: "http://www.w3.org/2000/svg", ...props, fill: "currentColor", height: "24", viewBox: "0 0 24 24", width: "24", children: jsx("path", { d: "M15.039782,22 C14.6690193,22 14.3684378,21.6994185 14.3684378,21.3286559 L14.3684378,15.6029043 L9.34495251,15.6029043 L9.34495251,21.3286559 C9.34495251,21.6994185 9.04437101,22 8.67345678,22 L3.67134415,22 C3.3005815,22 3,21.6994185 3,21.3286559 L3,9.79560307 C3,9.60127857 3.08412644,9.41665514 3.23055192,9.28917706 L11.4158271,2.16495603 C11.6686612,1.94501466 12.0447291,1.94501466 12.2975632,2.16495603 L20.4828384,9.28917706 C20.6292639,9.41665514 20.7133903,9.60127857 20.7133903,9.79560307 L20.7133903,21.3286559 C20.7133903,21.6994185 20.4128088,22 20.0418946,22 L15.039782,22 Z", fillRule: "evenodd" }) }));
|
|
884
916
|
}
|
|
885
917
|
|
|
886
|
-
var styles$
|
|
918
|
+
var styles$Q = {"breadcrumbs":"breadcrumb-module-CQGse","breadcrumb":"breadcrumb-module-hxhDY","link":"breadcrumb-module-fp2Q6","icon":"breadcrumb-module-uIn3w","previous-icon":"breadcrumb-module-K-wMJ"};
|
|
887
919
|
|
|
888
920
|
function BreadcrumbShort({ links }) {
|
|
889
921
|
const homeLink = links[0];
|
|
890
922
|
const previousLink = links[links.length - 2];
|
|
891
|
-
return (jsx(Breadcrumbs, { className: styles$
|
|
923
|
+
return (jsx(Breadcrumbs, { className: styles$Q.breadcrumbs, children: jsx(Breadcrumb$1, { className: styles$Q.breadcrumb, children: jsxs(RouteLink, { className: styles$Q.link, isDisabled: false, children: [jsx(GlyphsChevronsSlimLeftIcon, { className: styles$Q.icon }), previousLink === undefined || previousLink === homeLink ? (jsx(SolidHomeIcon, { className: styles$Q.icon })) : (jsx("span", { children: previousLink.label }))] }) }) }));
|
|
892
924
|
}
|
|
893
925
|
function BreadcrumbLongItem({ index, isDisabled, link, }) {
|
|
894
|
-
return (jsx(Breadcrumb$1, { className: styles$
|
|
926
|
+
return (jsx(Breadcrumb$1, { className: styles$Q.breadcrumb, children: jsxs(RouteLink, { className: styles$Q.link, href: link.href, isDisabled: isDisabled, children: [jsx(GlyphsChevronsSlimLeftIcon, { className: clsx(styles$Q['previous-icon'], styles$Q.icon) }), link.label] }) }, index));
|
|
895
927
|
}
|
|
896
928
|
function BreadcrumbLong({ links }) {
|
|
897
929
|
const linksWithoutFirst = links.slice(1);
|
|
898
930
|
const homeLink = links[0];
|
|
899
931
|
if (!homeLink)
|
|
900
932
|
return null;
|
|
901
|
-
return (jsxs(Breadcrumbs, { className: styles$
|
|
933
|
+
return (jsxs(Breadcrumbs, { className: styles$Q.breadcrumbs, children: [jsx(Breadcrumb$1, { className: styles$Q.breadcrumb, children: jsx(RouteLink, { className: styles$Q.link, href: homeLink.href, children: jsx(SolidHomeIcon, { className: clsx(styles$Q['home-icon'], styles$Q.icon) }) }) }), linksWithoutFirst.map((link, index) => (jsx(BreadcrumbLongItem, { index: index, isDisabled: linksWithoutFirst.length - 1 === index, link: link }, index)))] }));
|
|
902
934
|
}
|
|
903
935
|
function Breadcrumb({ links }) {
|
|
904
936
|
const { lg } = useBreakpoint();
|
|
@@ -921,10 +953,10 @@ function Button({ _pseudo = 'none', children, className, color = 'primary', cond
|
|
|
921
953
|
onClick: e => e.preventDefault(), onPress: onPress, type: type, children: [icon && iconPosition === 'left' && (jsx("span", { className: buttonStyles.icon, children: icon })), children, withArrow && (jsx(GlyphsArrowBoldCapsRightIcon, { className: buttonStyles['right-arrow-icon'] })), icon && iconPosition === 'right' && (jsx("span", { className: buttonStyles.icon, children: icon }))] }));
|
|
922
954
|
}
|
|
923
955
|
|
|
924
|
-
var styles$
|
|
956
|
+
var styles$P = {"icon-button":"icon-button-module-4PDK-","md":"icon-button-module-k3s9J","lg":"icon-button-module-agk6Y","primary":"icon-button-module-fTeP4","secondary":"icon-button-module-dM0eo"};
|
|
925
957
|
|
|
926
958
|
function IconButton({ children, className, color = 'primary', isDisabled, onPress, size = 'md', type = 'button', }) {
|
|
927
|
-
return (jsx(Button$1, { className: clsx(styles$
|
|
959
|
+
return (jsx(Button$1, { className: clsx(styles$P['icon-button'], styles$P[size], styles$P[color], className), isDisabled: isDisabled,
|
|
928
960
|
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
|
929
961
|
// @ts-expect-error
|
|
930
962
|
onClick: e => e.preventDefault(), onPress: onPress, type: type, children: children }));
|
|
@@ -938,34 +970,34 @@ function StrokeFavoriteIcon(props) {
|
|
|
938
970
|
return (jsx("svg", { xmlns: "http://www.w3.org/2000/svg", ...props, fill: "currentColor", height: "24", viewBox: "0 0 24 24", width: "24", children: jsx("path", { d: "M7.33319295,3.33090958 C5.12714802,3.33090958 3.33232058,5.12348359 3.33232058,7.32679321 C3.33232058,8.18447047 3.64878056,9.03643889 4.29989998,9.93107334 L11.9997744,20.2227497 L19.7053643,9.92401241 C20.351069,9.03643889 20.6673786,8.1846207 20.6673786,7.32679321 C20.6673786,5.12348359 18.8727016,3.33090958 16.6666566,3.33090958 C14.8537801,3.33090958 13.1222748,4.56251549 12.6388611,6.19569283 C12.5552338,6.47843037 12.2951771,6.67253074 11.9999248,6.67253074 C11.7046724,6.67253074 11.4447662,6.47843037 11.3609885,6.19569283 C10.8775748,4.56251549 9.14606944,3.33090958 7.33319295,3.33090958 M11.9997744,22 L11.9997744,22 C11.7898038,22 11.5918659,21.9008466 11.4662746,21.7327364 L3.22718487,10.720545 C2.41106707,9.59905954 2,8.45954615 2,7.32679321 C2,4.3895979 4.39240135,2 7.33319295,2 C9.22488362,2 11.0018124,2.98206975 11.9999248,4.46786903 C12.9978868,2.98206975 14.774966,2 16.6666566,2 C19.6072978,2 22,4.3895979 22,7.32679321 C22,8.45969638 21.5887825,9.59920978 20.777929,10.7136343 L12.5334246,21.7327364 C12.4076829,21.9008466 12.2098954,22 11.9997744,22", fillRule: "evenodd" }) }));
|
|
939
971
|
}
|
|
940
972
|
|
|
941
|
-
var styles$
|
|
973
|
+
var styles$O = {"favorite-button":"favorite-button-module-tXSS3","is-favorite":"favorite-button-module-l557q","favorite-on":"favorite-button-module-6Tsmy","favorite-off":"favorite-button-module-LQauU"};
|
|
942
974
|
|
|
943
975
|
function FavoriteButton({ isDisabled, isFavorite, onPress, }) {
|
|
944
|
-
return (jsx(IconButton, { className: clsx(styles$
|
|
945
|
-
[styles$
|
|
976
|
+
return (jsx(IconButton, { className: clsx(styles$O['favorite-button'], {
|
|
977
|
+
[styles$O['is-favorite']]: isFavorite,
|
|
946
978
|
}), color: "secondary", isDisabled: isDisabled, onPress: onPress, children: isFavorite ? jsx(SolidFavoriteIcon, {}) : jsx(StrokeFavoriteIcon, {}) }));
|
|
947
979
|
}
|
|
948
980
|
|
|
949
|
-
var styles$
|
|
981
|
+
var styles$N = {"link-button":"link-button-module-6i75g","primary":"link-button-module-DRTd0","secondary":"link-button-module-HEqnO","has-underline":"link-button-module-Xc-3N"};
|
|
950
982
|
|
|
951
|
-
function LinkButton({ children, className, href, isDisabled, onPress, route, target, type = href ? 'link' : 'button', }) {
|
|
983
|
+
function LinkButton({ children, className, href, isDisabled, onPress, route, hasUnderline = false, target, color = 'primary', type = href ? 'link' : 'button', }) {
|
|
952
984
|
if (type === 'link') {
|
|
953
|
-
return (jsx(RouteLink, { className: clsx(styles$
|
|
985
|
+
return (jsx(RouteLink, { className: clsx(styles$N['link-button'], styles$N[color], { [styles$N['has-underline']]: hasUnderline }, className), href: href, isDisabled: isDisabled, onPress: onPress, route: route, target: target, children: children }));
|
|
954
986
|
// eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
|
|
955
987
|
}
|
|
956
988
|
else if (type === 'button') {
|
|
957
|
-
return (jsx(RouteButton, { className: clsx(styles$
|
|
989
|
+
return (jsx(RouteButton, { className: clsx(styles$N['link-button'], styles$N[color], { [styles$N['has-underline']]: hasUnderline }, styles$N[color], className), href: href, isDisabled: isDisabled, onPress: onPress, route: route, type: "button", children: children }));
|
|
958
990
|
}
|
|
959
991
|
throw new Error('Invalid type ${type} for LinkButton component');
|
|
960
992
|
}
|
|
961
993
|
|
|
962
|
-
var styles$
|
|
994
|
+
var styles$M = {"field-error":"field-error-module-FXnIg"};
|
|
963
995
|
|
|
964
996
|
function FieldError({ children }) {
|
|
965
|
-
return (jsx(FieldError$1, { className: styles$
|
|
997
|
+
return (jsx(FieldError$1, { className: styles$M['field-error'], children: children }));
|
|
966
998
|
}
|
|
967
999
|
|
|
968
|
-
var styles$
|
|
1000
|
+
var styles$L = {"input-container":"input-module-2woJR","shadow-input":"input-module-pNKEt","lg":"input-module-Dx2qC","md":"input-module-sH6e7","focus":"input-module-hEEuy","growing-input":"input-module-6HwY4"};
|
|
969
1001
|
|
|
970
1002
|
/**
|
|
971
1003
|
* This component is used to create an input that grows as the user types.
|
|
@@ -980,20 +1012,20 @@ const Input = forwardRef(({ _pseudo = 'none', autoGrow, size = 'lg', ...inputPro
|
|
|
980
1012
|
const handleChange = (event) => isControlled
|
|
981
1013
|
? onChange?.(event)
|
|
982
1014
|
: setUncontrolledValue(event.target.value);
|
|
983
|
-
return (jsx("div", { className: clsx(styles$
|
|
1015
|
+
return (jsx("div", { className: clsx(styles$L['input-container'], styles$L[size], styles$L[_pseudo]), children: jsxs("div", { className: clsx({ [styles$L['growing-input']]: autoGrow }), children: [jsx(Input$1, { size: autoGrow ? 1 : undefined, ...props, ref: ref, onChange: handleChange, onClick: e => {
|
|
984
1016
|
e.preventDefault();
|
|
985
1017
|
e.stopPropagation();
|
|
986
1018
|
e.target.focus();
|
|
987
|
-
} }), autoGrow && jsx("span", { className: styles$
|
|
1019
|
+
} }), autoGrow && jsx("span", { className: styles$L['shadow-input'], children: value })] }) }));
|
|
988
1020
|
});
|
|
989
1021
|
Input.displayName = 'Input';
|
|
990
1022
|
|
|
991
|
-
var styles$
|
|
1023
|
+
var styles$K = {"label":"label-module-LGfJt","required":"label-module-oTWaS"};
|
|
992
1024
|
|
|
993
1025
|
function Label({ children, isRequired }) {
|
|
994
1026
|
if (!children)
|
|
995
1027
|
return null;
|
|
996
|
-
return (jsxs(Label$1, { className: styles$
|
|
1028
|
+
return (jsxs(Label$1, { className: styles$K.label, children: [children, isRequired && jsx("span", { className: styles$K.required, children: "*" })] }));
|
|
997
1029
|
}
|
|
998
1030
|
|
|
999
1031
|
function StrokeCollapseIcon(props) {
|
|
@@ -1008,7 +1040,7 @@ function StrokeTrashIcon(props) {
|
|
|
1008
1040
|
return (jsx("svg", { xmlns: "http://www.w3.org/2000/svg", ...props, fill: "currentColor", height: "24", viewBox: "0 0 24 24", width: "24", children: jsx("path", { d: "M7.77273912,6.04398453 L9.07201126,6.04398453 L9.07201126,4.11757519 C9.07201126,3.84748949 9.15880324,3.63104347 9.33238719,3.46823712 C9.50597114,3.30543077 9.73570292,3.22402759 10.0215825,3.22402759 L13.3263825,3.22402759 C13.6186194,3.22402759 13.850313,3.30543077 14.0214633,3.46823712 C14.1926136,3.63104347 14.2781888,3.84748949 14.2781888,4.11757519 L14.2781888,6.04398453 L15.5846129,6.04398453 L15.5846129,4.04352264 C15.5846129,3.40769382 15.3900697,2.90814951 15.0009834,2.5448897 C14.6118971,2.1816299 14.0799703,2 13.405203,2 L9.942762,2 C9.26869007,2 8.73850162,2.1816299 8.35219662,2.5448897 C7.96589162,2.90814951 7.77273912,3.40769382 7.77273912,4.04352264 L7.77273912,6.04398453 Z M3.60955531,6.6940676 L19.7561406,6.6940676 C19.9248076,6.6940676 20.0683931,6.6332263 20.186897,6.51154371 C20.305401,6.38986111 20.3646529,6.242352 20.3646529,6.06901638 C20.3646529,5.9003494 20.3052023,5.75537328 20.186301,5.63408801 C20.0673997,5.51280275 19.9240129,5.45216011 19.7561406,5.45216011 L3.60955531,5.45216011 C3.44734496,5.45216011 3.30519982,5.51300141 3.18311989,5.63468401 C3.06103996,5.75636661 3,5.90114406 3,6.06901638 C3,6.24314666 3.06103996,6.39085444 3.18311989,6.5121397 C3.30519982,6.63342497 3.44734496,6.6940676 3.60955531,6.6940676 Z M7.56920636,22 L15.8049825,22 C16.4210441,22 16.9252074,21.8108208 17.3174724,21.4324624 C17.7097373,21.0541041 17.9209684,20.5545101 17.9511655,19.9336805 L18.6066126,6.5283806 L17.2870766,6.5283806 L16.6578534,19.8059883 C16.6444435,20.0808419 16.5455825,20.3084381 16.3612707,20.4887766 C16.1769588,20.6691152 15.9469787,20.7592845 15.6713303,20.7592845 L7.68497866,20.7592845 C7.41479362,20.7592845 7.18757,20.6677246 7.00330778,20.4846047 C6.81904556,20.3014848 6.72015983,20.0752793 6.70665057,19.8059883 L6.05358753,6.5295726 L4.76996029,6.5295726 L5.41587138,19.9420245 C5.4468632,20.562854 5.65806942,21.0610573 6.04949005,21.4366344 C6.44091068,21.8122115 6.94748278,22 7.56920636,22 Z M9.00213069,19.1375783 C9.15957307,19.1375783 9.2862223,19.0920591 9.38207839,19.0010206 C9.47793448,18.9099822 9.5230812,18.7917017 9.51751857,18.6461793 L9.2314403,8.86811345 C9.22587767,8.72338566 9.17618647,8.60729053 9.0823667,8.51982806 C8.98854694,8.43236558 8.86649184,8.38863435 8.71620142,8.38863435 C8.55945437,8.38863435 8.43436962,8.43395491 8.34094719,8.52459603 C8.24752475,8.61523714 8.20081354,8.73371626 8.20081354,8.88003338 L8.48555081,18.6485633 C8.49121278,18.7988537 8.54055631,18.9179288 8.63358142,19.0057886 C8.72660652,19.0936484 8.84945628,19.1375783 9.00213069,19.1375783 Z M11.6876904,19.1375783 C11.8451328,19.1375783 11.9717821,19.0922578 12.0676381,19.0016166 C12.1634942,18.9109755 12.2114223,18.7924964 12.2114223,18.6461793 L12.2114223,8.88003338 C12.2114223,8.73451092 12.1634942,8.61623047 12.0676381,8.52519202 C11.9717821,8.43415357 11.8451328,8.38863435 11.6876904,8.38863435 C11.5310427,8.38863435 11.4032015,8.43415357 11.3041668,8.52519202 C11.205132,8.61623047 11.1556147,8.73451092 11.1556147,8.88003338 L11.1556147,18.6461793 C11.1556147,18.7924964 11.205132,18.9109755 11.3041668,19.0016166 C11.4032015,19.0922578 11.5310427,19.1375783 11.6876904,19.1375783 Z M14.3635653,19.1387703 C14.516339,19.1387703 14.6392384,19.0948404 14.7322635,19.0069806 C14.8252886,18.9191208 14.8745825,18.802827 14.8801451,18.6580992 L15.1662234,8.88122537 C15.1662234,8.73490825 15.1194873,8.6166278 15.0260152,8.52638402 C14.9325431,8.43614023 14.8070859,8.39101833 14.6496435,8.39101833 C14.4993531,8.39101833 14.3772732,8.4345509 14.2834037,8.52161604 C14.1895343,8.60868118 14.1398183,8.7277563 14.1342556,8.87884138 L13.8483264,18.6485633 C13.8483264,18.7932911 13.8948389,18.9111742 13.987864,19.0022126 C14.0808891,19.0932511 14.2061229,19.1387703 14.3635653,19.1387703 Z" }) }));
|
|
1009
1041
|
}
|
|
1010
1042
|
|
|
1011
|
-
var styles$
|
|
1043
|
+
var styles$J = {"field":"number-field-module-gmnog","button-input-container":"number-field-module-8Lvgh","zoom-in-text":"number-field-module-OlEoa"};
|
|
1012
1044
|
|
|
1013
1045
|
/**
|
|
1014
1046
|
* This component is used to create a number field.
|
|
@@ -1016,7 +1048,7 @@ var styles$K = {"field":"number-field-module-gmnog","button-input-container":"nu
|
|
|
1016
1048
|
*/
|
|
1017
1049
|
function NumberField({ autoFocus, autoGrow, defaultValue, formatOptions = { style: 'decimal', useGrouping: false }, isDisabled, isInvalid, isReadOnly, isRequired, label, maxLength, maxValue, minValue, name, onChange, onInput, onKeyUp, placeholder, showLabel = false, size = 'lg', value, withButtons, }) {
|
|
1018
1050
|
const inputRef = useRef(null);
|
|
1019
|
-
return (jsxs(NumberField$1, { "aria-label": label, autoFocus: autoFocus, className: clsx(styles$
|
|
1051
|
+
return (jsxs(NumberField$1, { "aria-label": label, autoFocus: autoFocus, className: clsx(styles$J.field, styles$J[size]), defaultValue: defaultValue, formatOptions: formatOptions, isDisabled: isDisabled, isInvalid: isInvalid, isReadOnly: isReadOnly, isRequired: isRequired, maxValue: maxValue, minValue: minValue, name: name, onChange: onChange, onInput: onInput, value: value, children: [showLabel && jsx(Label, { isRequired: isRequired, children: label }), jsxs("div", { className: styles$J['button-input-container'], children: [withButtons && (jsx(Button$1, { isDisabled: isDisabled,
|
|
1020
1052
|
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
|
1021
1053
|
// @ts-expect-error
|
|
1022
1054
|
onClick: e => e.preventDefault(), onPressStart: e => e.target.focus(), slot: "decrement", children: (value || 0) <= 1 ? jsx(StrokeTrashIcon, {}) : jsx(StrokeCollapseIcon, {}) })), jsx(Input, { ref: inputRef, autoGrow: autoGrow, maxLength: maxLength, onFocus: e => (e.target.selectionStart = e.target.value.length || 0), onKeyUp: e => onKeyUp?.(e), placeholder: placeholder, size: size }), withButtons && (jsx(Button$1, { isDisabled: isDisabled,
|
|
@@ -1029,7 +1061,7 @@ function SolidCartIcon(props) {
|
|
|
1029
1061
|
return (jsx("svg", { xmlns: "http://www.w3.org/2000/svg", ...props, fill: "currentColor", height: "24", viewBox: "0 0 24 24", width: "24", children: jsx("path", { d: "M7.89619008,16.6656848 C9.33405626,16.6656848 10.4996925,17.831321 10.4996925,19.2690253 C10.4996925,20.7068915 9.33405626,21.8725278 7.89619008,21.8725278 C6.45832389,21.8725278 5.29268766,20.7068915 5.29268766,19.2690253 C5.29268766,17.831321 6.45832389,16.6656848 7.89619008,16.6656848 Z M16.8207199,16.6656848 C18.2585861,16.6656848 19.4242223,17.831321 19.4242223,19.2690253 C19.4242223,20.7068915 18.2585861,21.8725278 16.8207199,21.8725278 C15.3828537,21.8725278 14.2172175,20.7068915 14.2172175,19.2690253 C14.2172175,17.831321 15.3828537,16.6656848 16.8207199,16.6656848 Z M7.89619008,18.0995047 C7.25122196,18.0995047 6.72650762,18.6242191 6.72650762,19.2690253 C6.72650762,19.9139935 7.25122196,20.4387078 7.89619008,20.4387078 C8.54115819,20.4387078 9.06587253,19.9139935 9.06587253,19.2690253 C9.06587253,18.6242191 8.54115819,18.0995047 7.89619008,18.0995047 Z M16.8207199,18.0995047 C16.1757518,18.0995047 15.6510375,18.6242191 15.6510375,19.2690253 C15.6510375,19.9139935 16.1757518,20.4387078 16.8207199,20.4387078 C17.465688,20.4387078 17.9904024,19.9139935 17.9904024,19.2690253 C17.9904024,18.6242191 17.465688,18.0995047 16.8207199,18.0995047 Z M4.58909785,3 C4.6054446,3 4.6206584,3.00372253 4.63668145,3.00485547 C4.65869291,3.00631211 4.68038067,3.0079306 4.70174473,3.01132943 C4.72958275,3.0158612 4.75628783,3.02233516 4.78299291,3.02994206 C4.8001489,3.03479753 4.81698119,3.03949115 4.83365164,3.04564141 C4.8622989,3.05616159 4.88948953,3.06862396 4.91619461,3.08254297 L4.956495,3.10439258 C4.98287638,3.12025378 5.00763927,3.13789532 5.03175477,3.15699349 L5.06736154,3.18645 C5.08921115,3.20603373 5.10911857,3.22707409 5.1283786,3.2492474 C5.13986987,3.26251902 5.1511993,3.27562878 5.16171948,3.28970964 C5.17806623,3.31155925 5.19230894,3.33421811 5.2060661,3.35768621 C5.21626258,3.37500405 5.22597352,3.39216004 5.23455152,3.41028712 C5.24555725,3.43326967 5.25462079,3.45706147 5.26319878,3.48150066 C5.27032014,3.50205548 5.27711779,3.52244845 5.28245881,3.54381251 C5.28860907,3.56825171 5.29249345,3.59317645 5.29605412,3.61858673 C5.29799631,3.63299129 5.30252808,3.64642476 5.30382287,3.66115301 L5.510504,6.30738355 L21.2869744,6.30772748 C21.3139222,6.30835464 21.3370666,6.31256272 21.3603729,6.3151523 C21.3861069,6.31790373 21.4120027,6.31936037 21.4369275,6.32486324 C21.4591008,6.32923316 21.4726961,6.33603082 21.4875862,6.34056259 C21.5163953,6.34914058 21.5452044,6.35723303 21.5722332,6.36920985 C21.5918169,6.37778785 21.6092966,6.38911728 21.6275855,6.39931376 C21.6497588,6.41145243 21.6722559,6.42278186 21.6928107,6.43718642 C21.711747,6.45029618 21.7280937,6.46583368 21.7455734,6.48072379 C21.763215,6.49577574 21.7815039,6.51001845 21.7976888,6.52668889 C21.8132263,6.54287379 21.8261742,6.56067718 21.8400932,6.57815686 C21.8551452,6.59676949 21.8706827,6.61473473 21.8836306,6.634804 C21.8954456,6.65293108 21.9043473,6.67251481 21.9145437,6.69161299 C21.9258732,6.71330075 21.9381737,6.73434111 21.9473991,6.75716182 C21.9559771,6.77868773 21.9614799,6.80134658 21.9679539,6.82368174 C21.9744279,6.8456932 21.9820348,6.86705726 21.9864047,6.89003981 C21.9915839,6.91658304 21.9925549,6.94393552 21.994659,6.97128799 C21.9959538,6.98909138 22,7.00608552 22,7.0242126 C21.9988671,7.05496391 21.994659,7.07794646 21.9922312,7.10109086 C21.9894798,7.1269867 21.9880232,7.15320623 21.9825203,7.17813097 L20.5915903,13.2322533 L20.587706,13.2487619 C20.5797754,13.2835594 20.5681222,13.3164147 20.555498,13.3486227 C20.5524229,13.3567151 20.5499951,13.3651313 20.5465963,13.3730619 C20.5299259,13.4117438 20.5096948,13.4483216 20.4870359,13.4827955 C20.4797527,13.4938012 20.4710129,13.5031884 20.4632441,13.5137086 C20.445117,13.5381478 20.4265044,13.5619396 20.4056259,13.5836274 C20.3944583,13.5952805 20.3823196,13.605477 20.3705046,13.6163208 C20.3505972,13.6344479 20.3302043,13.6517658 20.3083546,13.6674651 C20.2941119,13.6778235 20.2795455,13.6872107 20.2646554,13.6964361 C20.2424821,13.7101932 20.2198233,13.7223319 20.1963552,13.7334995 L20.148286,13.7550254 C20.1214191,13.7655456 20.0935811,13.7734762 20.0654194,13.7807594 C20.0513385,13.7843201 20.037905,13.7888518 20.0235005,13.7916033 C19.9798012,13.8000194 19.9351309,13.8053604 19.8898132,13.8053604 L6.09623539,13.8051986 L6.20774933,15.2317353 L19.411064,15.2317353 C19.8069466,15.2317353 20.1278931,15.5528437 20.1278931,15.9487262 C20.1278931,16.3446088 19.8069466,16.6657172 19.411064,16.6657172 L5.54384488,16.6657172 C5.49593759,16.6657172 5.44932509,16.660538 5.40384553,16.6514744 C5.38863173,16.6483993 5.37471272,16.6425728 5.35998446,16.6386884 C5.33052795,16.6307578 5.30090959,16.6231509 5.27290972,16.6116596 C5.25543003,16.6043764 5.23940699,16.5945036 5.22257469,16.5859256 C5.19910659,16.5741106 5.17547665,16.5627812 5.15362704,16.5485385 C5.13711844,16.5376946 5.12255203,16.5249086 5.10701453,16.5127699 C5.08694526,16.4972324 5.06687599,16.4821804 5.04874891,16.4647007 C5.03434435,16.4509436 5.02204383,16.4357298 5.00893406,16.4208397 C4.99226362,16.4019033 4.97575503,16.3834526 4.96118862,16.3628977 C4.94937364,16.3463891 4.93966271,16.3285858 4.92930437,16.3111061 C4.91668015,16.2899039 4.90437963,16.2688635 4.8940213,16.2462046 C4.88511961,16.2267828 4.87832195,16.2065516 4.87103875,16.1861587 C4.86310815,16.163338 4.8553394,16.1406791 4.84967468,16.1168873 C4.84433367,16.0950377 4.84109669,16.0728644 4.83785971,16.0502055 L4.82992911,16.0045641 L3.92600265,4.43381996 L2.7169909,4.43381996 C2.32110834,4.43381996 2,4.11287347 2,3.7169909 C2,3.32094649 2.32110834,3 2.7169909,3 Z", fillRule: "evenodd" }) }));
|
|
1030
1062
|
}
|
|
1031
1063
|
|
|
1032
|
-
var styles$
|
|
1064
|
+
var styles$I = {"manual-input-container":"add-to-cart-button-module-AWFvQ","left-button-spacer":"add-to-cart-button-module-SS7WM"};
|
|
1033
1065
|
|
|
1034
1066
|
function AddToCartButton({ initialState = 'initial', isDisabled = false, onChange, quantity, }) {
|
|
1035
1067
|
const [currentState, setState] = useState(initialState);
|
|
@@ -1117,7 +1149,7 @@ function ManualInputState({ isDisabled, onCancel, onConfirm, quantity, }) {
|
|
|
1117
1149
|
e.key === 'Enter' && onConfirm(ensureNumber(updatedQuantity));
|
|
1118
1150
|
e.key === 'Escape' && onCancel();
|
|
1119
1151
|
};
|
|
1120
|
-
return (jsxs("div", { className: styles$
|
|
1152
|
+
return (jsxs("div", { className: styles$I['manual-input-container'], children: [jsx("div", { className: styles$I['left-button-spacer'] }), jsx(NumberField, { autoFocus: true, autoGrow: true, defaultValue: quantity ? ensureNumber(quantity) : undefined, formatOptions: {
|
|
1121
1153
|
maximumFractionDigits: 0,
|
|
1122
1154
|
style: 'decimal',
|
|
1123
1155
|
useGrouping: false,
|
|
@@ -1167,12 +1199,12 @@ const ConnectedAddToCartButton = ({ onAddToCart, productId }) => {
|
|
|
1167
1199
|
return (jsx(AddToCartButton, { isDisabled: isPendingDeleteCartLine || isLoadingCartLines || isPendingAddToCart, onChange: handleChange, quantity: quantity }));
|
|
1168
1200
|
};
|
|
1169
1201
|
|
|
1170
|
-
var styles$
|
|
1202
|
+
var styles$H = {"tag":"tag-module-B7r15","body":"tag-module-4cfCf","shape":"tag-module-c7CRb"};
|
|
1171
1203
|
|
|
1172
1204
|
function Tag({ children }) {
|
|
1173
1205
|
if (!children)
|
|
1174
1206
|
return null;
|
|
1175
|
-
return (jsxs("div", { className: styles$
|
|
1207
|
+
return (jsxs("div", { className: styles$H.tag, children: [jsx("div", { className: styles$H.body, children: children }), jsx("svg", { className: styles$H.shape, height: "16", viewBox: "0 0 9 16", width: "9", xmlns: "http://www.w3.org/2000/svg", children: jsx("path", { d: "M1.92461763,0 L0,0 L0,16 L1.92461763,16 L6.4117887,16 L8.87489381,7.57121588 C9.23711515,6.3325062 8.79482383,4.99454094 7.78060408,4.2560794 L1.92461763,0 Z", fill: "currentColor" }) })] }));
|
|
1176
1208
|
}
|
|
1177
1209
|
|
|
1178
1210
|
const IntlContext = createContext({
|
|
@@ -1208,7 +1240,7 @@ function useFormattedMessage() {
|
|
|
1208
1240
|
|
|
1209
1241
|
const FormattedMessage = ({ fallbackValue, id, optional, replacementValues, }) => useFormattedMessage()(id, { fallbackValue, optional, replacementValues });
|
|
1210
1242
|
|
|
1211
|
-
var styles$
|
|
1243
|
+
var styles$G = {"product-price":"product-price-module-oIU1K","original-price":"product-price-module-til0s","is-hidden":"product-price-module-V1NCf","current-price-wrapper":"product-price-module-FfVhl","current-price":"product-price-module-pvy2w","wholes":"product-price-module-GCw07","dot":"product-price-module-N56iV","decimals":"product-price-module-eWOOF","vat":"product-price-module-96DoG"};
|
|
1212
1244
|
|
|
1213
1245
|
const formatPrice = (price) => new Intl.NumberFormat('en-US', {
|
|
1214
1246
|
maximumFractionDigits: 2,
|
|
@@ -1221,22 +1253,22 @@ function ProductPrice({ className, isVatIncluded, originalPrice, price, }) {
|
|
|
1221
1253
|
const priceWithCurrency = formatPrice(price);
|
|
1222
1254
|
const [wholes, decimals] = priceWithCurrency.split('.');
|
|
1223
1255
|
const showOriginalPrice = priceWithCurrency !== originalPriceWithCurrency;
|
|
1224
|
-
return (jsxs("div", { className: clsx(className, styles$
|
|
1225
|
-
[styles$
|
|
1226
|
-
}), children: originalPriceWithCurrency }), jsxs("div", { className: styles$
|
|
1256
|
+
return (jsxs("div", { className: clsx(className, styles$G['product-price']), children: [jsx("span", { className: clsx(styles$G['original-price'], {
|
|
1257
|
+
[styles$G['is-hidden']]: !showOriginalPrice,
|
|
1258
|
+
}), children: originalPriceWithCurrency }), jsxs("div", { className: styles$G['current-price-wrapper'], children: [jsxs("div", { className: styles$G['current-price'], children: [jsx("span", { className: styles$G.wholes, children: wholes }), jsx("span", { className: styles$G.dot, children: "." }), jsx("span", { className: styles$G.decimals, children: decimals })] }), jsx("span", { className: styles$G.vat, children: isVatIncluded ? (jsx(FormattedMessage, { id: "Incl. VAT" })) : (jsx(FormattedMessage, { id: "Excl. VAT" })) })] })] }));
|
|
1227
1259
|
}
|
|
1228
1260
|
|
|
1229
|
-
var styles$
|
|
1261
|
+
var styles$F = {"product-sku":"product-sku-module-ITb8x"};
|
|
1230
1262
|
|
|
1231
1263
|
function ProductSku({ sku }) {
|
|
1232
|
-
return jsx("p", { className: styles$
|
|
1264
|
+
return jsx("p", { className: styles$F['product-sku'], children: sku });
|
|
1233
1265
|
}
|
|
1234
1266
|
|
|
1235
1267
|
function isResponsiveImage(image) {
|
|
1236
1268
|
return Boolean(image.lg);
|
|
1237
1269
|
}
|
|
1238
1270
|
|
|
1239
|
-
var styles$
|
|
1271
|
+
var styles$E = {"image":"image-module-lg7Kj","contain":"image-module-KFEgG","cover":"image-module-tVKFe","has-error":"image-module-LM93B","picture":"image-module-pNYjR"};
|
|
1240
1272
|
|
|
1241
1273
|
function Image({ className, fallbackSrc = 'https://res.cloudinary.com/dkz9eknwh/image/upload/v1716545808/images/product-card/fallback_p6ngjz.svg', fit = 'cover', height, image, loading = 'eager', title, width, }) {
|
|
1242
1274
|
const [hasError, setHasError] = useState(false);
|
|
@@ -1263,22 +1295,22 @@ function ImageComponent({ className, fallbackSrc, fit = 'cover', hasError, image
|
|
|
1263
1295
|
const srcSet = !hasError
|
|
1264
1296
|
? `${image[1]} 1x, ${image[2]} 2x, ${image[3]} 3x`
|
|
1265
1297
|
: undefined;
|
|
1266
|
-
return (jsx("img", { alt: image.altText, className: clsx(styles$
|
|
1267
|
-
[styles$
|
|
1298
|
+
return (jsx("img", { alt: image.altText, className: clsx(styles$E.image, className, styles$E[fit], {
|
|
1299
|
+
[styles$E['has-error']]: hasError,
|
|
1268
1300
|
}), src: !hasError ? image[3] : fallbackSrc, srcSet: srcSet, ...rest }));
|
|
1269
1301
|
}
|
|
1270
1302
|
function PictureComponent({ className, fallbackSrc, fit = 'cover', hasError, image, ...rest }) {
|
|
1271
1303
|
if (!isResponsiveImage(image))
|
|
1272
1304
|
return null;
|
|
1273
|
-
return (jsxs("picture", { className: clsx(styles$
|
|
1274
|
-
[styles$
|
|
1305
|
+
return (jsxs("picture", { className: clsx(styles$E.picture, className), children: [jsx("source", { media: "(max-width: 768px)", srcSet: `${image.sm[1]} 1x, ${image.sm[2]} 2x, ${image.sm[3]} 3x` }), jsx("source", { media: "(max-width: 1439px)", srcSet: `${image.md[1]} 1x, ${image.md[2]} 2x, ${image.md[3]} 3x` }), jsx("source", { media: "(min-width: 1440px)", srcSet: `${image.lg[1]} 1x, ${image.lg[2]} 2x, ${image.lg[3]} 3x` }), jsx("img", { className: clsx(styles$E[fit], {
|
|
1306
|
+
[styles$E['has-error']]: hasError,
|
|
1275
1307
|
}), src: !hasError ? image.lg[3] : fallbackSrc, ...rest })] }));
|
|
1276
1308
|
}
|
|
1277
1309
|
|
|
1278
|
-
var styles$
|
|
1310
|
+
var styles$D = {"product-card":"product-card-module-pLaiB","favorite-button":"product-card-module-tvEdz","content":"product-card-module-e0kMu","top":"product-card-module-Q0VvF","tag":"product-card-module-HkWBE","title":"product-card-module-CStNi","bottom":"product-card-module-kD2tU","image":"product-card-module-p-zoi","price":"product-card-module-irW0D","add-to-cart-button":"product-card-module-SnCvX"};
|
|
1279
1311
|
|
|
1280
1312
|
function ProductCard({ addToCartButton: AddToCartButton, areaSelected, favoriteButton: FavoriteButton, href, id, image, onClick, onMouseDown, onMouseMove, onPress, price, role, sku, tags, title, }) {
|
|
1281
|
-
return (jsxs(RouteLink, { "aria-selected": areaSelected, className: styles$
|
|
1313
|
+
return (jsxs(RouteLink, { "aria-selected": areaSelected, className: styles$D['product-card'], href: href, id: id, onClick: onClick, onMouseDown: onMouseDown, onMouseMove: onMouseMove, onPress: onPress, role: role, children: [jsx("div", { className: styles$D.image, children: jsx(Image, { ...image }) }), jsx("div", { className: styles$D['favorite-button'], children: FavoriteButton && FavoriteButton }), jsxs("div", { className: styles$D.content, children: [jsxs("div", { className: styles$D.top, children: [jsx("div", { className: styles$D.tag, children: tags?.map(tag => (jsx(Tag, { children: jsx(FormattedMessage, { optional: true, fallbackValue: tag, id: `tag.${tag.toLowerCase()}` }) }, tag))) }), jsx("h2", { className: styles$D.title, children: title }), jsx(ProductSku, { sku: sku })] }), jsxs("div", { className: styles$D.bottom, children: [jsx("div", { className: styles$D.price, children: jsx(ProductPrice, { isVatIncluded: price.isVatIncluded, originalPrice: price.originalPrice, price: price.price }) }), jsx("div", { className: styles$D['add-to-cart-button'], children: AddToCartButton })] })] })] }));
|
|
1282
1314
|
}
|
|
1283
1315
|
|
|
1284
1316
|
/**
|
|
@@ -6199,7 +6231,7 @@ const updateOnVirtualData = swiper => {
|
|
|
6199
6231
|
};
|
|
6200
6232
|
|
|
6201
6233
|
/**
|
|
6202
|
-
* Swiper React 11.1.
|
|
6234
|
+
* Swiper React 11.1.10
|
|
6203
6235
|
* Most modern mobile touch slider and framework with hardware accelerated transitions
|
|
6204
6236
|
* https://swiperjs.com
|
|
6205
6237
|
*
|
|
@@ -6207,7 +6239,7 @@ const updateOnVirtualData = swiper => {
|
|
|
6207
6239
|
*
|
|
6208
6240
|
* Released under the MIT License
|
|
6209
6241
|
*
|
|
6210
|
-
* Released on:
|
|
6242
|
+
* Released on: August 21, 2024
|
|
6211
6243
|
*/
|
|
6212
6244
|
|
|
6213
6245
|
|
|
@@ -6588,7 +6620,7 @@ function GlyphsArrowBoldCapsLeftIcon(props) {
|
|
|
6588
6620
|
return (jsx("svg", { xmlns: "http://www.w3.org/2000/svg", ...props, fill: "currentColor", height: "11", viewBox: "0 0 11 11", width: "11", children: jsx("path", { d: "M2.31124163,11 C2.06716529,11 1.91839241,10.7730596 2.04771379,10.5980857 L6.08820761,5.13116556 C6.42092595,4.68081431 6.37243043,4.10595375 5.96732409,3.70073526 L2.70240329,0.432177991 C2.53178078,0.261409485 2.67540212,0 2.93972934,0 L5.48361239,0 C5.57518542,0 5.6619622,0.0340936243 5.72102726,0.0931942463 L8.14882304,2.52367916 C9.1607451,3.53657521 9.28198389,4.9729381 8.45036569,6.09787751 L4.91836426,10.876542 C4.86160851,10.9533653 4.7620417,11 4.65492523,11 L2.31124163,11 Z", fillRule: "evenodd", transform: "matrix(-1 0 0 1 11 0)" }) }));
|
|
6589
6621
|
}
|
|
6590
6622
|
|
|
6591
|
-
var styles$
|
|
6623
|
+
var styles$C = {"carousel":"carousel-module-ealh-","swiper":"carousel-module-IftbN","has-overflow":"carousel-module-tPg7k","slide":"carousel-module-bUMlb","navigation-button":"carousel-module-kcqEE","is-locked":"carousel-module-uCrOA","navigation-button-next":"carousel-module-T7bTr","is-dragging":"carousel-module-34OWD","navigation-button-prev":"carousel-module-984Rr","navigation-buttons":"carousel-module-k7Z4S","navigation-button-wrapper":"carousel-module-Hi-0z","top":"carousel-module-nL-O8","center":"carousel-module-5SGYn"};
|
|
6592
6624
|
|
|
6593
6625
|
function CarouselNavigationButton({ direction, isDisabled = false, }) {
|
|
6594
6626
|
const swiper = useSwiper();
|
|
@@ -6600,8 +6632,8 @@ function CarouselNavigationButton({ direction, isDisabled = false, }) {
|
|
|
6600
6632
|
swiper.slidePrev();
|
|
6601
6633
|
}
|
|
6602
6634
|
}
|
|
6603
|
-
return (jsx(Button$1, { className: clsx(styles$
|
|
6604
|
-
[styles$
|
|
6635
|
+
return (jsx(Button$1, { className: clsx(styles$C['navigation-button'], {
|
|
6636
|
+
[styles$C['is-locked']]: swiper.isLocked,
|
|
6605
6637
|
}), isDisabled: isDisabled, onPress: handleNavigation, children: direction === 'previous' ? (jsx(GlyphsArrowBoldCapsLeftIcon, {})) : (jsx(GlyphsArrowBoldCapsRightIcon, {})) }));
|
|
6606
6638
|
}
|
|
6607
6639
|
|
|
@@ -6616,13 +6648,13 @@ function Carousel({ breakpoints, className, hasNavigation = true, hasOverflow =
|
|
|
6616
6648
|
setIsBeginning(swiper.activeIndex === 0);
|
|
6617
6649
|
}
|
|
6618
6650
|
const showNavigation = hasNavigation && !isLocked;
|
|
6619
|
-
return (jsx("div", { className: clsx(styles$
|
|
6620
|
-
[styles$
|
|
6621
|
-
[styles$
|
|
6651
|
+
return (jsx("div", { className: clsx(styles$C.carousel, className), children: jsxs(Swiper, { breakpoints: breakpoints, className: clsx(styles$C.swiper, {
|
|
6652
|
+
[styles$C['is-dragging']]: isDragging,
|
|
6653
|
+
[styles$C['has-overflow']]: hasOverflow,
|
|
6622
6654
|
}), freeMode: {
|
|
6623
6655
|
enabled: true,
|
|
6624
6656
|
sticky: true,
|
|
6625
|
-
}, modules: [freeMode], onSlideChange: swiper => handleSlideChange(swiper), onSwiper: swiper => setIsLocked(swiper.isLocked), onTouchEnd: () => setIsDragging(false), onTouchStart: () => setIsDragging(true), onUpdate: swiper => handleSlideChange(swiper), slidesPerView: slidesPerView, spaceBetween: spaceBetween, children: [slides.map((slide, index) => (jsx(SwiperSlide, { className: clsx(styles$
|
|
6657
|
+
}, modules: [freeMode], onSlideChange: swiper => handleSlideChange(swiper), onSwiper: swiper => setIsLocked(swiper.isLocked), onTouchEnd: () => setIsDragging(false), onTouchStart: () => setIsDragging(true), onUpdate: swiper => handleSlideChange(swiper), slidesPerView: slidesPerView, spaceBetween: spaceBetween, children: [slides.map((slide, index) => (jsx(SwiperSlide, { className: clsx(styles$C.slide, slideClasses), children: slide }, index))), showNavigation && (jsxs("div", { className: clsx(styles$C['navigation-buttons'], styles$C[navigationButtonsPosition]), children: [jsx("div", { className: clsx(styles$C['navigation-button-wrapper'], styles$C['navigation-button-prev']), children: jsx(CarouselNavigationButton, { direction: "previous", isDisabled: isBeginning }) }), jsx("div", { className: clsx(styles$C['navigation-button-wrapper'], styles$C['navigation-button-next']), children: jsx(CarouselNavigationButton, { direction: "next", isDisabled: isEnd }) })] }))] }) }));
|
|
6626
6658
|
}
|
|
6627
6659
|
|
|
6628
6660
|
function CategoryCarousel({ categoryCards }) {
|
|
@@ -6636,10 +6668,10 @@ function CategoryCarousel({ categoryCards }) {
|
|
|
6636
6668
|
}, slides: categoryCards, spaceBetween: 8 }));
|
|
6637
6669
|
}
|
|
6638
6670
|
|
|
6639
|
-
var styles$
|
|
6671
|
+
var styles$B = {"accordion":"accordion-module-9WvAH","white":"accordion-module-CaVdG","accordion-item":"accordion-module-lf9d-","lg":"accordion-module-0qnae","with-seperators":"accordion-module-yOLrW","indented":"accordion-module-6CcEH","button":"accordion-module--Rwpb","icon":"accordion-module-Y50uq","focus":"accordion-module-M4BZs","panel":"accordion-module-KZjMo","content":"accordion-module-ejMH3","is-open":"accordion-module-W0F1z"};
|
|
6640
6672
|
|
|
6641
6673
|
function Accordion({ children, color = 'black', hasLineSeparator = true, indented, size = 'md', }) {
|
|
6642
|
-
return (jsx("div", { className: clsx({ [styles$
|
|
6674
|
+
return (jsx("div", { className: clsx({ [styles$B.indented]: indented }, styles$B.accordion, styles$B[color], styles$B[size], hasLineSeparator && styles$B['with-seperators']), children: children &&
|
|
6643
6675
|
Children.map(children, child => {
|
|
6644
6676
|
return cloneElement(child, { size });
|
|
6645
6677
|
}) }));
|
|
@@ -6649,7 +6681,7 @@ function GlyphsChevronsSlimDownIcon(props) {
|
|
|
6649
6681
|
return (jsx("svg", { xmlns: "http://www.w3.org/2000/svg", ...props, fill: "currentColor", height: "12", viewBox: "0 0 12 12", width: "12", children: jsx("path", { d: "M6,9 L1,4.06645029 C1.08169007,3.87890406 1.19817561,3.69487412 1.34945663,3.51436046 C1.50073764,3.3338468 1.68216803,3.16239331 1.89374779,3 L5.98800959,7.08347812 L9.9960307,3 C10.2121071,3.16649238 10.4031847,3.33794587 10.5692635,3.51436046 C10.7353424,3.69077505 10.8789212,3.87480499 11,4.06645029 L6,9 Z", fillRule: "evenodd" }) }));
|
|
6650
6682
|
}
|
|
6651
6683
|
|
|
6652
|
-
var styles$
|
|
6684
|
+
var styles$A = {"show-all":"show-all-module-BDp21","panel":"show-all-module-bEdda","content":"show-all-module-RF--F","has-transparency":"show-all-module-30y7l","button":"show-all-module-58e7Q","icon":"show-all-module-fqncI","is-open":"show-all-module-hQeGI"};
|
|
6653
6685
|
|
|
6654
6686
|
const ShowAll = ({ children, hasTransparency = true, initialHeight = 0, isOpen, onToggle, }) => {
|
|
6655
6687
|
const showAllRef = useRef(null);
|
|
@@ -6658,14 +6690,14 @@ const ShowAll = ({ children, hasTransparency = true, initialHeight = 0, isOpen,
|
|
|
6658
6690
|
return;
|
|
6659
6691
|
showAllRef.current.style.setProperty('--initital-height', `${initialHeight}px`);
|
|
6660
6692
|
}, [initialHeight]);
|
|
6661
|
-
return (jsxs("div", { ref: showAllRef, className: clsx(styles$
|
|
6662
|
-
[styles$
|
|
6663
|
-
}), children: [jsx("div", { className: styles$
|
|
6664
|
-
[styles$
|
|
6665
|
-
}), children: children }) }), jsxs(LinkButton, { className: styles$
|
|
6693
|
+
return (jsxs("div", { ref: showAllRef, className: clsx(styles$A['show-all'], {
|
|
6694
|
+
[styles$A['is-open']]: isOpen,
|
|
6695
|
+
}), children: [jsx("div", { className: styles$A.panel, children: jsx("div", { className: clsx(styles$A.content, {
|
|
6696
|
+
[styles$A['has-transparency']]: hasTransparency,
|
|
6697
|
+
}), children: children }) }), jsxs(LinkButton, { className: styles$A.button, onPress: () => onToggle(!isOpen), children: [jsx(GlyphsChevronsSlimDownIcon, { className: styles$A.icon }), isOpen ? (jsx(FormattedMessage, { id: "Show less" })) : (jsx(FormattedMessage, { id: "Show all" }))] })] }));
|
|
6666
6698
|
};
|
|
6667
6699
|
|
|
6668
|
-
var styles$
|
|
6700
|
+
var styles$z = {"multi-select":"multi-select-module-DC7Ix","filter-items":"multi-select-module-cwVFb","hidden":"multi-select-module-o7yHU","filter-item":"multi-select-module-OW-NK"};
|
|
6669
6701
|
|
|
6670
6702
|
function MultiSelect({ amountShown = 3, onChange, options, render, }) {
|
|
6671
6703
|
const shownOptions = options.slice(0, amountShown);
|
|
@@ -6676,28 +6708,28 @@ function MultiSelect({ amountShown = 3, onChange, options, render, }) {
|
|
|
6676
6708
|
options.filter(option => option.isSelected).length === 0) {
|
|
6677
6709
|
return null;
|
|
6678
6710
|
}
|
|
6679
|
-
return (jsxs("div", { className: styles$
|
|
6711
|
+
return (jsxs("div", { className: styles$z['multi-select'], children: [jsx("div", { className: styles$z['filter-items'], children: shownOptions
|
|
6680
6712
|
.concat(isOpen ? [] : hiddenSelectedOptions)
|
|
6681
|
-
.map(option => (jsxs("div", { className: styles$
|
|
6713
|
+
.map(option => (jsxs("div", { className: styles$z['filter-item'], children: [render({ onChange: () => onChange(option), option }), jsxs("span", { children: ["(", option.amount, ")"] })] }, option.value))) }), hiddenOptions.length > 0 && (jsx(ShowAll, { hasTransparency: false, isOpen: isOpen, onToggle: toggle, children: jsx("div", { className: clsx(styles$z['filter-items'], styles$z['hidden']), children: hiddenOptions.map(option => (jsxs("div", { className: styles$z['filter-item'], children: [render({ onChange: () => onChange(option), option }), jsxs("span", { children: ["(", option.amount, ")"] })] }, option.value))) }) }))] }));
|
|
6682
6714
|
}
|
|
6683
6715
|
|
|
6684
|
-
var styles$
|
|
6716
|
+
var styles$y = {"checkbox":"checkbox-module-YNVdd","box":"checkbox-module-UKoyf","checkmark":"checkbox-module-pHIwh","focus":"checkbox-module-v23jy","active":"checkbox-module-7UG-b","color-checkbox":"checkbox-module-nEhvW"};
|
|
6685
6717
|
|
|
6686
6718
|
function Checkbox({ _pseudo = 'none', children, className, isDisabled, isSelected, onChange, value, }) {
|
|
6687
|
-
return (jsxs(Checkbox$1, { className: clsx(className, styles$
|
|
6719
|
+
return (jsxs(Checkbox$1, { className: clsx(className, styles$y.checkbox, styles$y[_pseudo]), isDisabled: isDisabled, isSelected: isSelected, onChange: onChange, value: value, children: [jsx("div", { className: styles$y.box, children: jsx("svg", { "aria-hidden": "true", className: styles$y.checkmark, viewBox: "0 0 18 18", children: jsx("polyline", { points: "1 9 7 14 15 4" }) }) }), children] }));
|
|
6688
6720
|
}
|
|
6689
6721
|
|
|
6690
6722
|
function ColorCheckbox({ _pseudo = 'none', children, className, color, isDisabled, isSelected, onChange, value, }) {
|
|
6691
|
-
return (jsxs(Checkbox$1, { className: clsx(className, styles$
|
|
6723
|
+
return (jsxs(Checkbox$1, { className: clsx(className, styles$y.checkbox, styles$y['color-checkbox'], styles$y[_pseudo]), isDisabled: isDisabled, isSelected: isSelected, onChange: onChange, style: {
|
|
6692
6724
|
'--selected-color': color,
|
|
6693
|
-
}, value: value, children: [jsx("div", { className: styles$
|
|
6725
|
+
}, value: value, children: [jsx("div", { className: styles$y.box }), children] }));
|
|
6694
6726
|
}
|
|
6695
6727
|
|
|
6696
6728
|
function StrokeCheckmarkIcon(props) {
|
|
6697
6729
|
return (jsx("svg", { xmlns: "http://www.w3.org/2000/svg", ...props, fill: "currentColor", height: "24", viewBox: "0 0 24 24", width: "24", children: jsx("path", { d: "M10.8641425,17 C10.6636971,17 10.4855234,16.9548533 10.3296214,16.8645598 C10.1737194,16.7742664 10.0252413,16.6388262 9.88418708,16.4582393 L6.27839644,12.2189616 C6.09279881,11.9857035 6,11.744921 6,11.496614 C6,11.2332581 6.08723088,11.0094056 6.26169265,10.8250564 C6.43615442,10.6407073 6.65330364,10.5485327 6.91314031,10.5485327 C7.06904232,10.5485327 7.21195249,10.5823928 7.34187082,10.6501129 C7.47178916,10.717833 7.59985152,10.8382242 7.72605791,11.0112867 L10.8195991,14.7200903 L16.2405345,6.53047404 C16.4558278,6.17682468 16.7230883,6 17.0423163,6 C17.2873051,6 17.5081663,6.08088789 17.7048998,6.24266366 C17.9016333,6.40443943 18,6.61700527 18,6.88036117 C18,7.00075245 17.9721604,7.12302483 17.9164811,7.24717833 C17.8608018,7.37133183 17.7958426,7.48984199 17.7216036,7.6027088 L11.7884187,16.4469526 C11.5582777,16.8156509 11.2501856,17 10.8641425,17 Z", fillRule: "evenodd" }) }));
|
|
6698
6730
|
}
|
|
6699
6731
|
|
|
6700
|
-
var styles$
|
|
6732
|
+
var styles$x = {"select":"select-module-ui-Wc","sm":"select-module-44a1l","md":"select-module-QUm-8","solid":"select-module-IRd4F","button":"select-module-aMQIQ","chevron":"select-module-00uRU","focus":"select-module-XMc0P","popover":"select-module-z8cWq","listbox":"select-module-S21ba","header":"select-module-4Bm2j","item":"select-module-LgEJO","check":"select-module-lQFw3"};
|
|
6701
6733
|
|
|
6702
6734
|
function Select({ isDisabled = false, label, onChange, options, placeholder, selectedOption, showLabel = true, size = 'md', variant = 'outline', }) {
|
|
6703
6735
|
const selectRef = useRef(null);
|
|
@@ -6714,12 +6746,12 @@ function Select({ isDisabled = false, label, onChange, options, placeholder, sel
|
|
|
6714
6746
|
window.addEventListener('resize', updateWidth);
|
|
6715
6747
|
return () => window.removeEventListener('resize', updateWidth);
|
|
6716
6748
|
}, []);
|
|
6717
|
-
return (jsxs(Select$1, { ref: selectRef, "aria-label": label, className: clsx(styles$
|
|
6749
|
+
return (jsxs(Select$1, { ref: selectRef, "aria-label": label, className: clsx(styles$x.select, styles$x[size], styles$x[variant]), isDisabled: isDisabled, onSelectionChange: selected => onChange(selected), placeholder: placeholder || label, selectedKey: String(selectedOption), children: [showLabel && jsx(Label, { children: label }), jsxs(Button$1, { className: styles$x.button, children: [jsx(SelectValue, {}), jsx(GlyphsChevronsSlimDownIcon, { "aria-hidden": "true", className: styles$x.chevron })] }), jsx(Popover, { ref: ref =>
|
|
6718
6750
|
// Workaround for react/react-aria #1513
|
|
6719
|
-
ref?.addEventListener('touchend', e => e.preventDefault()), className: clsx(styles$
|
|
6751
|
+
ref?.addEventListener('touchend', e => e.preventDefault()), className: clsx(styles$x.popover, styles$x[variant]), placement: "bottom left", triggerRef: selectRef, children: jsx(ListBox, { className: styles$x.listbox, children: jsxs(Section, { children: [jsx(Header, { className: styles$x.header, children: placeholder || label }), Object.entries(options).map(([key, value]) => (jsxs(ListBoxItem, { "aria-label": value, className: styles$x.item, id: key, textValue: value, children: [selectedOption === key && (jsx("span", { slot: "description", children: jsx(StrokeCheckmarkIcon, { className: styles$x.check }) })), jsx("span", { slot: "label", children: value })] }, key)))] }) }) })] }));
|
|
6720
6752
|
}
|
|
6721
6753
|
|
|
6722
|
-
var styles$
|
|
6754
|
+
var styles$w = {"input-container":"textarea-module-C6Xr1","lg":"textarea-module-vksG-","md":"textarea-module-6JrQJ"};
|
|
6723
6755
|
|
|
6724
6756
|
/**
|
|
6725
6757
|
* This component is used to create a textarea that can grow as the user types.
|
|
@@ -6754,7 +6786,7 @@ const TextArea = forwardRef(({ autoGrow, size, ...textAreaProps }, _ref) => {
|
|
|
6754
6786
|
}
|
|
6755
6787
|
updateHeight();
|
|
6756
6788
|
}, [ref, autoGrow, updateHeight, size]);
|
|
6757
|
-
return (jsx("div", { className: styles$
|
|
6789
|
+
return (jsx("div", { className: styles$w['input-container'], children: jsx(TextArea$1, { ...textAreaProps, ref: node => {
|
|
6758
6790
|
ref.current =
|
|
6759
6791
|
node;
|
|
6760
6792
|
textAreaRef.current = node;
|
|
@@ -6765,7 +6797,7 @@ const TextArea = forwardRef(({ autoGrow, size, ...textAreaProps }, _ref) => {
|
|
|
6765
6797
|
});
|
|
6766
6798
|
TextArea.displayName = 'TextArea';
|
|
6767
6799
|
|
|
6768
|
-
var styles$
|
|
6800
|
+
var styles$v = {"field":"text-field-module-JeaK0"};
|
|
6769
6801
|
|
|
6770
6802
|
/**
|
|
6771
6803
|
* This component is used to create a text field.
|
|
@@ -6773,7 +6805,7 @@ var styles$w = {"field":"text-field-module-JeaK0"};
|
|
|
6773
6805
|
* This field can also grow when a user types in text.
|
|
6774
6806
|
*/
|
|
6775
6807
|
function TextField({ autoFocus, autoGrow, defaultValue, isDisabled, isInvalid, isMultiline, isReadOnly, isRequired, label, maxLength, name, onChange, onInput, onKeyUp, placeholder, rows, showLabel = false, size = 'lg', value, }) {
|
|
6776
|
-
return (jsxs(TextField$1, { "aria-label": label, autoFocus: autoFocus, className: clsx(styles$
|
|
6808
|
+
return (jsxs(TextField$1, { "aria-label": label, autoFocus: autoFocus, className: clsx(styles$v.field, styles$v[size]), defaultValue: defaultValue, isDisabled: isDisabled, isInvalid: isInvalid, isReadOnly: isReadOnly, isRequired: isRequired, maxLength: maxLength, name: name, onChange: value => {
|
|
6777
6809
|
onChange?.(value);
|
|
6778
6810
|
}, onInput: onInput, onKeyUp: e => onKeyUp?.(e), value: value, children: [showLabel && jsx(Label, { isRequired: isRequired, children: label }), isMultiline ? (jsx(TextArea, { autoGrow: autoGrow, placeholder: placeholder, rows: rows, size: size })) : (jsx(Input, { autoGrow: autoGrow, placeholder: placeholder, size: size })), jsx(FieldError, {})] }));
|
|
6779
6811
|
}
|
|
@@ -6783,31 +6815,31 @@ function IntlProvider({ children, formatMessage, languageCode: _languageCode, })
|
|
|
6783
6815
|
return (jsx(IntlContext.Provider, { value: { formatMessage, languageCode, updateLanguageCode }, children: children }));
|
|
6784
6816
|
}
|
|
6785
6817
|
|
|
6786
|
-
var styles$
|
|
6818
|
+
var styles$u = {"progress-circle":"progress-circle-module-4nweP","spin":"progress-circle-module-kCf7K"};
|
|
6787
6819
|
|
|
6788
6820
|
function ProgressCircle({ className }) {
|
|
6789
|
-
return (jsxs("svg", { className: clsx(styles$
|
|
6821
|
+
return (jsxs("svg", { className: clsx(styles$u['progress-circle'], className), viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", xmlnsXlink: "http://www.w3.org/1999/xlink", children: [jsx("title", { children: "Spinner" }), jsxs("defs", { children: [jsx("pattern", { height: "100%", id: "pattern-1", patternUnits: "objectBoundingBox", width: "100%", children: jsx("use", { xlinkHref: "#image-2" }) }), jsx("image", { height: "24", id: "image-2", width: "24", xlinkHref: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAGKADAAQAAAABAAAAGAAAAADiNXWtAAAB7UlEQVRIDZ2VSaoCQQyG01rOoBtBr+YZXXsFL+BGEHcqDuCE89SPL480hdpiGYil3an/S1KDUavViq/Xq1wul8RPp5Ocz2dhPB6PiR8OB42RAHO5XE7D4zgW/PF4CM/u97tks1n1TCYjURSpB2hraALglw8BQGXOuQQSKk68y+fzL9lRBQAqAUIlVkUoxBUKBZ3sC1irbrdbUoX/PgTyAqDXmFVBBVRCFfYuGMBk67UvRCUA2FFAfgKUSiWhFTgQA9ESjLVgC7NWwEPNFYtFFUEICJnigAxCFbvd7jcAFVi/gbDoCALmOzCMAzebzUILEFculxVgOwcIDqRSqaiTBDadToMhziYDwBgNRmW0rdFoSLPZ1PeDwUDHbz+iTqejyv5VYHuekbVggavVqkLq9fq32hqnLTJxdgmijPQeYSqs1Woa3G63g8QJ1haZKMJkjDgLjLi/Nbvd7m8ARCxry9x2jyn2ej2ZTCb28+tRK/Azpy3vrN/vy2azeffq4zM9aLTFP1jPM4bDoWbPH06o6WXn9/lZgDMxGo1kuVwG/5uhlfkkTsB4PJb5fC7b7VYPH89C7P9GS5nBLYr4er2W/X6vhy4lNPXxR8BisdDWkD13Ee0KtVQAgqvVSncO2XNlc3WEWirAxLmmgf0K+ANZ6DTlvO5jwwAAAABJRU5ErkJggg==" })] }), jsx("g", { fill: "none", fillRule: "evenodd", id: "Page-1", stroke: "none", strokeWidth: "1", children: jsx("path", { d: "M12,0 C18.627417,0 24,5.372583 24,12 C24,14.7277828 23.0855773,17.3196292 21.4324752,19.4188392 C19.1717866,22.2895997 15.7255176,24 12,24 C11.2636203,24 10.6666667,23.4030463 10.6666667,22.6666667 C10.6666667,21.930287 11.2636203,21.3333333 12,21.3333333 C14.8994206,21.3333333 17.5771113,20.0043823 19.3374325,17.7690188 C20.6234737,16.1359252 21.3333333,14.1238938 21.3333333,12 C21.3333333,6.84534234 17.1546577,2.66666667 12,2.66666667 C6.84534234,2.66666667 2.66666667,6.84534234 2.66666667,12 C2.66666667,14.4546154 3.61656005,16.756214 5.28844833,18.485859 C5.80023235,19.015323 5.78589988,19.8594213 5.25643588,20.3712053 C4.72697187,20.8829893 3.88287357,20.8686569 3.37108955,20.3391928 C1.22326178,18.1171666 0,15.1531945 0,12 C0,5.372583 5.372583,0 12,0 Z", fill: "url(#pattern-1)", fillRule: "nonzero", id: "Spinner" }) })] }));
|
|
6790
6822
|
}
|
|
6791
6823
|
|
|
6792
|
-
var styles$
|
|
6824
|
+
var styles$t = {"product-grid":"product-overview-grid-module-bzys-","loading-panel":"product-overview-grid-module-XikkF","fade-in":"product-overview-grid-module-A6CS7","progress-circle":"product-overview-grid-module-DWnnI","fade-in-spinner":"product-overview-grid-module-r-wvY","grid-item":"product-overview-grid-module-MlUVA"};
|
|
6793
6825
|
|
|
6794
6826
|
function ProductOverviewGrid({ children, isLoading, }) {
|
|
6795
|
-
return (jsxs("div", { className: styles$
|
|
6827
|
+
return (jsxs("div", { className: styles$t['product-grid'], children: [Children.map(children, (child, index) => (jsx("div", { className: styles$t['grid-item'], children: child }, index))), isLoading && (jsx("div", { className: styles$t['loading-panel'], children: jsx(ProgressCircle, { className: styles$t['progress-circle'] }) }))] }));
|
|
6796
6828
|
}
|
|
6797
6829
|
|
|
6798
|
-
var styles$
|
|
6830
|
+
var styles$s = {"loading-overlay":"loading-overlay-module-L67Gy"};
|
|
6799
6831
|
|
|
6800
6832
|
function LoadingOverlay() {
|
|
6801
|
-
return (jsx("div", { className: styles$
|
|
6833
|
+
return (jsx("div", { className: styles$s['loading-overlay'], children: jsx(ProgressCircle, {}) }));
|
|
6802
6834
|
}
|
|
6803
6835
|
|
|
6804
|
-
var styles$
|
|
6836
|
+
var styles$r = {"page-container":"page-container-module-PYmbC","inner-page-container":"page-container-module-uD8GF"};
|
|
6805
6837
|
|
|
6806
6838
|
function PageContainer({ children, className, }) {
|
|
6807
|
-
return (jsx("div", { className: styles$
|
|
6839
|
+
return (jsx("div", { className: styles$r['page-container'], children: jsx("div", { className: clsx(styles$r['inner-page-container'], className), children: children }) }));
|
|
6808
6840
|
}
|
|
6809
6841
|
|
|
6810
|
-
var styles$
|
|
6842
|
+
var styles$q = {"heading":"heading-module-pMC65","uppercase":"heading-module-6spgX","italic":"heading-module-XXMDM","xxl":"heading-module-Kn3ZN","xl":"heading-module--hZs-","l":"heading-module-WrJRY","m":"heading-module-hTexc","s":"heading-module-7W29m","xs":"heading-module-SgaLB","xxs":"heading-module-33en7"};
|
|
6811
6843
|
|
|
6812
6844
|
const sizeToTag = {
|
|
6813
6845
|
l: 'h3',
|
|
@@ -6820,21 +6852,21 @@ const sizeToTag = {
|
|
|
6820
6852
|
};
|
|
6821
6853
|
function Heading({ children, className, italic, size = 'xxl', tag, uppercase, }) {
|
|
6822
6854
|
return createElement$1(tag || sizeToTag[size], {
|
|
6823
|
-
className: clsx(className, styles$
|
|
6824
|
-
[styles$
|
|
6825
|
-
[styles$
|
|
6855
|
+
className: clsx(className, styles$q.heading, styles$q[size], {
|
|
6856
|
+
[styles$q.uppercase]: uppercase,
|
|
6857
|
+
[styles$q.italic]: italic,
|
|
6826
6858
|
}),
|
|
6827
6859
|
}, children);
|
|
6828
6860
|
}
|
|
6829
6861
|
|
|
6830
|
-
var styles$
|
|
6862
|
+
var styles$p = {"page":"page-module-XtZ9Y","breadcrumb":"page-module-ohh9z","title":"page-module-TEmve"};
|
|
6831
6863
|
|
|
6832
6864
|
function PageTitle({ children }) {
|
|
6833
6865
|
const { lg, xxl } = useBreakpoint();
|
|
6834
|
-
return (jsx(Heading, { italic: true, uppercase: true, className: styles$
|
|
6866
|
+
return (jsx(Heading, { italic: true, uppercase: true, className: styles$p.title, size: xxl ? 'xl' : lg ? 'm' : 's', tag: "h1", children: children }));
|
|
6835
6867
|
}
|
|
6836
6868
|
function Page({ breadCrumb, children, className, title }) {
|
|
6837
|
-
return (jsxs(PageContainer, { className: clsx(styles$
|
|
6869
|
+
return (jsxs(PageContainer, { className: clsx(styles$p.page, className), children: [jsx("div", { className: styles$p.breadcrumb, children: jsx(Breadcrumb, { links: breadCrumb }) }), title && jsx(PageTitle, { children: title }), children] }));
|
|
6838
6870
|
}
|
|
6839
6871
|
|
|
6840
6872
|
const useSidebar = () => {
|
|
@@ -6876,12 +6908,12 @@ function GlyphsChevronsBoldDownIcon(props) {
|
|
|
6876
6908
|
function AccordionItem({ _pseudo = 'none', children, className, id, initialIsOpen = false, isDisabled = false, size, title, }) {
|
|
6877
6909
|
const { isOpen, toggle } = useDisclosure(initialIsOpen);
|
|
6878
6910
|
const panelId = `panel-${id}`;
|
|
6879
|
-
return (jsxs("div", { className: clsx(className, styles$
|
|
6880
|
-
[styles$
|
|
6881
|
-
}), children: [jsx("h3", { children: jsxs("button", { "aria-controls": panelId, "aria-expanded": isOpen, className: clsx(styles$
|
|
6911
|
+
return (jsxs("div", { className: clsx(className, styles$B['accordion-item'], {
|
|
6912
|
+
[styles$B['is-open']]: isOpen,
|
|
6913
|
+
}), children: [jsx("h3", { children: jsxs("button", { "aria-controls": panelId, "aria-expanded": isOpen, className: clsx(styles$B.button, styles$B[_pseudo]), disabled: isDisabled, id: id, onClick: toggle, type: "button", children: [title, jsx("span", { className: styles$B.icon, children: size === 'lg' ? (jsx(GlyphsChevronsBoldDownIcon, {})) : (jsx(GlyphsChevronsSlimDownIcon, {})) })] }) }), jsx("div", { "aria-labelledby": id, className: styles$B.panel, id: panelId, role: "region", children: jsx("div", { className: styles$B.content, children: children }) })] }));
|
|
6882
6914
|
}
|
|
6883
6915
|
|
|
6884
|
-
var styles$
|
|
6916
|
+
var styles$o = {"filter-section":"filter-section-module-q1Ob8","default":"filter-section-module-JkP09","with-action":"filter-section-module-9qc6L","header":"filter-section-module-zi2ZE","title":"filter-section-module-hWVv-","content":"filter-section-module-15-YW"};
|
|
6885
6917
|
|
|
6886
6918
|
function FilterSection({ ...props }) {
|
|
6887
6919
|
const variant = props.variant;
|
|
@@ -6899,16 +6931,16 @@ function FilterSection({ ...props }) {
|
|
|
6899
6931
|
/* eslint-enable @typescript-eslint/no-unnecessary-condition */
|
|
6900
6932
|
}
|
|
6901
6933
|
function CollapsibleFilterSection({ children, initialIsOpen = true, title, variant, }) {
|
|
6902
|
-
return (jsx("section", { className: clsx(styles$
|
|
6934
|
+
return (jsx("section", { className: clsx(styles$o['filter-section'], styles$o[variant]), children: jsx(Accordion, { children: jsx(AccordionItem, { id: title, initialIsOpen: initialIsOpen, title: jsx("span", { className: styles$o['accordion-title'], children: jsx(FormattedMessage, { optional: true, fallbackValue: title, id: `facet.${title.toLowerCase()}` }) }), children: children }) }) }));
|
|
6903
6935
|
}
|
|
6904
6936
|
function WithActionFilterSection({ button, children, title, variant, }) {
|
|
6905
|
-
return (jsxs("section", { className: clsx(styles$
|
|
6937
|
+
return (jsxs("section", { className: clsx(styles$o['filter-section'], styles$o[variant]), children: [jsxs("div", { className: styles$o.header, children: [jsx("h3", { className: styles$o.title, children: title }), jsx("div", { children: button })] }), jsx("div", { className: styles$o.content, children: children })] }));
|
|
6906
6938
|
}
|
|
6907
6939
|
function DefaultFilterSection({ children, title, variant, }) {
|
|
6908
|
-
return (jsxs("section", { className: clsx(styles$
|
|
6940
|
+
return (jsxs("section", { className: clsx(styles$o['filter-section'], styles$o[variant]), children: [jsx("h3", { className: styles$o.title, children: title }), jsx("div", { className: styles$o.content, children: children })] }));
|
|
6909
6941
|
}
|
|
6910
6942
|
|
|
6911
|
-
var styles$
|
|
6943
|
+
var styles$n = {"filter-panel":"algolia-filter-panel-module-GfhOO","scroll-container":"algolia-filter-panel-module-4ubB1","category":"algolia-filter-panel-module-LKet3","is-active":"algolia-filter-panel-module-yf8kI","count":"algolia-filter-panel-module-uAHPx","button":"algolia-filter-panel-module-ABOYv"};
|
|
6912
6944
|
|
|
6913
6945
|
function AlgoliaActiveCategories() {
|
|
6914
6946
|
const { items: categories } = useHierarchicalMenu({
|
|
@@ -6929,8 +6961,8 @@ function Categories({ categories, path: _path, }) {
|
|
|
6929
6961
|
.map(category => {
|
|
6930
6962
|
const path = _path + '/' + category.label;
|
|
6931
6963
|
const isActive = !category.data || !category.data.some(c => c.isRefined);
|
|
6932
|
-
return (jsxs(Fragment, { children: [jsx(RouteLink, { className: clsx(styles$
|
|
6933
|
-
[styles$
|
|
6964
|
+
return (jsxs(Fragment, { children: [jsx(RouteLink, { className: clsx(styles$n.category, {
|
|
6965
|
+
[styles$n['is-active']]: isActive,
|
|
6934
6966
|
}), href: path, isDisabled: isActive, children: category.label }), category.data && (jsx(Categories, { categories: category.data, path: path }))] }, category.value));
|
|
6935
6967
|
});
|
|
6936
6968
|
}
|
|
@@ -6939,22 +6971,24 @@ function StrokeCloseboxIcon(props) {
|
|
|
6939
6971
|
return (jsx("svg", { xmlns: "http://www.w3.org/2000/svg", ...props, height: "24", viewBox: "0 0 24 24", width: "24", children: jsx("path", { d: "M8,8 L16,16 M16,8 L8,16", fill: "currentColor", stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "1.4" }) }));
|
|
6940
6972
|
}
|
|
6941
6973
|
|
|
6942
|
-
var styles$
|
|
6974
|
+
var styles$m = {"active-filter-item":"active-filters-module-Rrmhy","category":"active-filters-module-u9TTE","active-filter-value":"active-filters-module-CIuPU"};
|
|
6943
6975
|
|
|
6944
6976
|
const ActiveFilters = ({ onClearAllFilters, onClearFilter, selectedFilterCategories, }) => {
|
|
6945
6977
|
if (selectedFilterCategories.length === 0)
|
|
6946
6978
|
return null;
|
|
6947
|
-
return (jsx(FilterSection, { button: jsx(LinkButton, { onPress: onClearAllFilters, children: jsx(FormattedMessage, { id: "Clear filters" }) }), title: "Chosen filters", variant: "with-action", children: selectedFilterCategories.map((category, index) => (jsx("section", { className: styles$
|
|
6979
|
+
return (jsx(FilterSection, { button: jsx(LinkButton, { onPress: onClearAllFilters, children: jsx(FormattedMessage, { id: "Clear filters" }) }), title: "Chosen filters", variant: "with-action", children: selectedFilterCategories.map((category, index) => (jsx("section", { className: styles$m.category, children: category.filters.map(filter => (jsxs("div", { className: styles$m['active-filter-item'], children: [jsxs("span", { children: [jsxs("span", { children: [category.label, ": "] }), jsx("span", { className: styles$m['active-filter-value'], children: filter.label })] }), jsx(IconButton, { color: "secondary", onPress: () => onClearFilter(category.label, filter), children: jsx(StrokeCloseboxIcon, {}) })] }, `${category.label}-${filter.value}`))) }, `${category.label}-${index}`))) }));
|
|
6948
6980
|
};
|
|
6949
6981
|
|
|
6950
6982
|
function AlgoliaActiveFilters() {
|
|
6951
6983
|
const { items, refine } = useCurrentRefinements();
|
|
6952
|
-
const { refine: clearAllFilters } = useClearRefinements();
|
|
6953
6984
|
const itemsToIgnore = [
|
|
6954
6985
|
'hierarchicalCategories.lvl0',
|
|
6955
6986
|
'hierarchicalCategories.lvl1',
|
|
6956
6987
|
'hierarchicalCategories.lvl2',
|
|
6957
6988
|
];
|
|
6989
|
+
const { refine: clearAllFilters } = useClearRefinements({
|
|
6990
|
+
excludedAttributes: itemsToIgnore,
|
|
6991
|
+
});
|
|
6958
6992
|
const itemsToDisplay = items.filter(item => !itemsToIgnore.includes(item.label));
|
|
6959
6993
|
const selectedFilterCategories = itemsToDisplay
|
|
6960
6994
|
.sort((a, b) => (a.label.localeCompare(b.label) ? 1 : -1))
|
|
@@ -6983,9 +7017,9 @@ function AlgoliaCategoriesFilters() {
|
|
|
6983
7017
|
const t = useFormattedMessage();
|
|
6984
7018
|
if (categories.length <= 0)
|
|
6985
7019
|
return null;
|
|
6986
|
-
return (jsx(FilterSection, { title: t('facet.categories'), variant: "default", children: categories.map(({ count, isRefined, value }) => (jsxs("button", { className: clsx(styles$
|
|
6987
|
-
[styles$
|
|
6988
|
-
}), onClick: () => refine(value), type: "button", children: [jsx("span", { children: value }), " ", jsxs("span", { className: styles$
|
|
7020
|
+
return (jsx(FilterSection, { title: t('facet.categories'), variant: "default", children: categories.map(({ count, isRefined, value }) => (jsxs("button", { className: clsx(styles$n.category, {
|
|
7021
|
+
[styles$n['is-active']]: isRefined,
|
|
7022
|
+
}), onClick: () => refine(value), type: "button", children: [jsx("span", { children: value }), " ", jsxs("span", { className: styles$n.count, children: ["(", count, ")"] })] }, value))) }));
|
|
6989
7023
|
}
|
|
6990
7024
|
|
|
6991
7025
|
function AlgoliaMultiSelectFilterSection({ attribute, }) {
|
|
@@ -7017,23 +7051,23 @@ function AlgoliaResultsCount() {
|
|
|
7017
7051
|
|
|
7018
7052
|
function PanelCloseButton() {
|
|
7019
7053
|
const { toggle } = useSidebarActions();
|
|
7020
|
-
return (jsx("div", { className: styles$
|
|
7054
|
+
return (jsx("div", { className: styles$n.button, children: jsxs(Button, { withArrow: true, onPress: toggle, size: "md", children: [jsx(FormattedMessage, { id: "Show" }), " ", jsx(AlgoliaResultsCount, {})] }) }));
|
|
7021
7055
|
}
|
|
7022
7056
|
function AlgoliaFilterPanel({ showActiveCategories = false, showCategoriesFilters = false, }) {
|
|
7023
7057
|
const { attributesToRender } = useDynamicWidgets({
|
|
7024
7058
|
maxValuesPerFacet: 100,
|
|
7025
7059
|
});
|
|
7026
|
-
return (jsx("div", { className: styles$
|
|
7060
|
+
return (jsx("div", { className: styles$n['filter-panel'], children: jsxs("div", { className: styles$n['scroll-container'], children: [showActiveCategories && jsx(AlgoliaActiveCategories, {}), showCategoriesFilters && jsx(AlgoliaCategoriesFilters, {}), jsx(AlgoliaActiveFilters, {}), attributesToRender.length > 0 && (jsx("section", { children: attributesToRender.map((attribute, index) => (jsx(AlgoliaMultiSelectFilterSection, { attribute: attribute }, `attribute-${index}`))) })), jsx(PanelCloseButton, {})] }) }));
|
|
7027
7061
|
}
|
|
7028
7062
|
|
|
7029
7063
|
function GlyphsChevronsSlimRightIcon(props) {
|
|
7030
7064
|
return (jsx("svg", { xmlns: "http://www.w3.org/2000/svg", ...props, fill: "currentColor", height: "12", viewBox: "0 0 12 12", width: "12", children: jsx("path", { d: "M9,6 L4.06645029,1 C3.87890406,1.08169007 3.69487412,1.19817561 3.51436046,1.34945663 C3.3338468,1.50073764 3.16239331,1.68216803 3,1.89374779 L7.08347812,5.98800959 L3,9.9960307 C3.16649238,10.2121071 3.33794587,10.4031847 3.51436046,10.5692635 C3.69077505,10.7353424 3.87480499,10.8789212 4.06645029,11 L9,6 Z", fillRule: "evenodd" }) }));
|
|
7031
7065
|
}
|
|
7032
7066
|
|
|
7033
|
-
var styles$
|
|
7067
|
+
var styles$l = {"pagination":"pagination-module-k4OgY","page-number-container":"pagination-module-oq89A"};
|
|
7034
7068
|
|
|
7035
7069
|
function Pagination({ currentPage, onChange, totalPages, }) {
|
|
7036
|
-
return (jsxs("div", { className: styles$
|
|
7070
|
+
return (jsxs("div", { className: styles$l.pagination, children: [jsx(IconButton, { isDisabled: currentPage === 1, onPress: () => onChange(currentPage - 1), children: jsx(GlyphsChevronsSlimLeftIcon, {}) }), jsxs("div", { className: styles$l['page-number-container'], children: [jsx(NumberField, { autoGrow: true, label: "current-page", maxValue: totalPages, minValue: 1, onChange: onChange, value: currentPage }), jsx(FormattedMessage, { id: "of" }), jsx("div", { children: totalPages })] }), jsx(IconButton, { isDisabled: currentPage >= totalPages, onPress: () => onChange(currentPage + 1), children: jsx(GlyphsChevronsSlimRightIcon, {}) })] }));
|
|
7037
7071
|
}
|
|
7038
7072
|
|
|
7039
7073
|
function AlgoliaPagination({ onChange }) {
|
|
@@ -7194,156 +7228,83 @@ function useAlgoliaInsights() {
|
|
|
7194
7228
|
sendEvents: Parameters<ReturnType<typeof makeSendEvents>>;
|
|
7195
7229
|
*/
|
|
7196
7230
|
|
|
7197
|
-
var styles$
|
|
7231
|
+
var styles$k = {"modal-overlay":"modal-module-rVFJc","modal-fade":"modal-module-63Uyl","modal":"modal-module-6vlFt","modal-zoom":"modal-module-aPJ7X"};
|
|
7198
7232
|
|
|
7199
7233
|
function Modal({ children, className, isDismissable, isKeyboardDismissDisabled, isOpen, onOpenChange, }) {
|
|
7200
|
-
return (jsx(ModalOverlay, { className: clsx(styles$
|
|
7234
|
+
return (jsx(ModalOverlay, { className: clsx(styles$k['modal-overlay'], className), isDismissable: isDismissable, isKeyboardDismissDisabled: isKeyboardDismissDisabled, isOpen: isOpen, onOpenChange: onOpenChange, children: jsx(Modal$1, { className: styles$k.modal, children: children }) }));
|
|
7201
7235
|
}
|
|
7202
7236
|
|
|
7203
|
-
var styles$
|
|
7237
|
+
var styles$j = {"header":"dialog-module-ZnsAe","heading":"dialog-module-SwpuZ","close":"dialog-module-Y7Tqg","content":"dialog-module-Koqia","footer":"dialog-module-y7Axm"};
|
|
7204
7238
|
|
|
7205
7239
|
function Footer({ close }) {
|
|
7206
7240
|
return (jsx(Button, { onPress: close, size: "md", children: "Close" }));
|
|
7207
7241
|
}
|
|
7208
7242
|
function Dialog({ allowClose = true, children, className, footer = Footer, hideTitle, isDismissable, isKeyboardDismissDisabled, isOpen, onOpenChange, onSubmit, title, validationErrors, }) {
|
|
7209
|
-
return (jsx(Modal, { className: clsx(styles$
|
|
7243
|
+
return (jsx(Modal, { className: clsx(styles$j['modal-overlay'], className), isDismissable: isDismissable, isKeyboardDismissDisabled: isKeyboardDismissDisabled, isOpen: isOpen, onOpenChange: onOpenChange, children: jsx(Dialog$1, { "aria-label": title, children: ({ close }) => (jsxs(Form, { onSubmit: onSubmit || (e => e.preventDefault), validationErrors: validationErrors, children: [jsxs("header", { className: styles$j.header, children: [!hideTitle && (jsx(Heading, { className: styles$j.heading, size: "xs", children: title })), jsx("div", { className: styles$j.close, children: jsx(IconButton, { color: "secondary", isDisabled: !allowClose, onPress: close, children: jsx(StrokeCloseboxIcon, {}) }) })] }), jsx("div", { className: styles$j.content, children: children instanceof Function ? children({ close }) : children }), jsx("footer", { className: styles$j.footer, children: footer instanceof Function ? footer({ close }) : footer })] })) }) }));
|
|
7210
7244
|
}
|
|
7211
7245
|
|
|
7212
|
-
|
|
7213
|
-
|
|
7214
|
-
|
|
7215
|
-
|
|
7216
|
-
}
|
|
7246
|
+
function SignInDialog({ isOpen, onOpenChange }) {
|
|
7247
|
+
const t = useFormattedMessage();
|
|
7248
|
+
const { signInUrl } = useFavorite();
|
|
7249
|
+
return (jsxs(Dialog, { isDismissable: true, isOpen: isOpen, onOpenChange: onOpenChange, title: t('Please Sign In'), children: [t('You must '), jsx(LinkButton, { href: `${signInUrl}?returnUrl=${encodeURIComponent(window.location.pathname + window.location.search)}`, onPress: () => onOpenChange(false), type: "link", children: t('sign in') }), t(' to your account to manage your lists.')] }));
|
|
7217
7250
|
}
|
|
7218
|
-
|
|
7251
|
+
|
|
7252
|
+
function useAddWishListItemToCurrentWishList() {
|
|
7219
7253
|
const queryClient = useQueryClient();
|
|
7220
7254
|
return useMutation({
|
|
7221
|
-
mutationFn: async ({
|
|
7222
|
-
|
|
7223
|
-
|
|
7224
|
-
|
|
7225
|
-
|
|
7226
|
-
|
|
7227
|
-
|
|
7228
|
-
method: 'POST',
|
|
7229
|
-
url: `${config.SHOP_API_URL}/api/v1/wishlists`,
|
|
7230
|
-
});
|
|
7255
|
+
mutationFn: async ({ productId }) => {
|
|
7256
|
+
let wishList = queryClient.getQueryData([
|
|
7257
|
+
'wishlist',
|
|
7258
|
+
'current',
|
|
7259
|
+
]);
|
|
7260
|
+
if (!wishList) {
|
|
7261
|
+
wishList = await createWishList();
|
|
7231
7262
|
queryClient.removeQueries({ queryKey: ['wishlists'] });
|
|
7232
|
-
|
|
7233
|
-
}
|
|
7234
|
-
catch (error) {
|
|
7235
|
-
if (error instanceof BadRequestError &&
|
|
7236
|
-
error.body?.message === 'Name already exists') {
|
|
7237
|
-
throw new WishListNameAlreadyExistsError();
|
|
7238
|
-
}
|
|
7239
|
-
throw error;
|
|
7263
|
+
queryClient.setQueryData(['wishlist', 'current'], wishList);
|
|
7240
7264
|
}
|
|
7241
|
-
|
|
7242
|
-
|
|
7243
|
-
|
|
7244
|
-
|
|
7245
|
-
|
|
7246
|
-
|
|
7247
|
-
queryFn: async () => {
|
|
7248
|
-
return await request({
|
|
7249
|
-
credentials: 'include',
|
|
7250
|
-
headers: {
|
|
7251
|
-
Authorization: `Bearer ${'eyJ0eXAiOiJKV1QiLCJhbGciOiJSUzI1NiIsIng1dCI6IlE5TmxVUmNmS2d6cWoxNzFValZtRkxWQlJMNCIsImtpZCI6IlE5TmxVUmNmS2d6cWoxNzFValZtRkxWQlJMNCJ9.eyJjbGllbnRfaWQiOiJpc2MiLCJzY29wZSI6WyJpc2NhcGkiLCJvZmZsaW5lX2FjY2VzcyJdLCJzdWIiOiI0NzMwZDNkZi04MGFjLTRkOGEtYWJjMy05MTUwZTRjMjZjYjUiLCJhbXIiOlsicGFzc3dvcmQiXSwiYXV0aF90aW1lIjoxNzIyNDk2MzY1LCJpZHAiOiJpZHNydiIsInByZWZlcnJlZF91c2VybmFtZSI6ImIucmllbWVuc0Bzb25pYy1lcXVpcG1lbnQuY29tIiwicm9sZSI6WyJWTUlfQWRtaW4iLCJBZG1pbmlzdHJhdG9yIl0sImlzcyI6Imh0dHBzOi8vc29uaWNlcXVpcG1lbnQuY29tbWVyY2UuaW5zaXRlc2FuZGJveC5jb20vaWRlbnRpdHkiLCJhdWQiOiJodHRwczovL3NvbmljZXF1aXBtZW50LmNvbW1lcmNlLmluc2l0ZXNhbmRib3guY29tL2lkZW50aXR5L3Jlc291cmNlcyIsImV4cCI6MTcyMjUzOTU2NSwibmJmIjoxNzIyNDk2MzY1fQ.OM5e30WgjLyFgm6vASio5wnny8A_Z4XxV_GP5uPrNqWXC_GD2xjKSpNW2GAzr5fGk5MSRpnVpK4NTLtGuEdcwZCXXxmUKTSG7E_nmx0dr3krr1d5Y8kn0gwfsDPT7L_esqxZ2fYWHGp08eKINH1i_F8GqhcAJsFCCc7e1QRnderegYEMEpA59IJ_ZaBNzl8JqqlaC5dDsmuVoJu_YmNiVeqwr31s7POZ3WWENU2hioxksQXVEtTKMxzysA4797iB-diaVaea2OP-UtWUqzDu85VVQSyzLfsR22mvn__yd8EAeWgjRQrABPK8ynE69Tltz004qx-Ah08AvAk2iEYoYf3mg9-VBEp-_35GsXi9PYkJC0VnnqBXp9Bk_-ZkUhLblmp1qtwhiiQt94X2OKa8iMxsez9RKOY60SQNeMF1AhPrWWfjEcyJFQ_-LRipCrj5LQLYm5vAGgVQ0cO_iekQda2xqRLNI-sBEJJ6cc3dQ2xG4_8swNXlE8I8aoDjjz7kTmTeIwpcfcKwdnzXytZaYH9i1SLDyG7zOWb8l-XfW4WerPxFvFx1j8vJzetAaBABGUegOmi3DE5UR2ix2KwpYkkhVGgBcd4foSAjgtDt-xPE2ukeJOrTw1xzBG6EbQotyyvutUkMNJiS53MBgnuovvvdM5EjMYZJCTdq-hrSyBg'}`,
|
|
7252
|
-
},
|
|
7253
|
-
url: `${config.SHOP_API_URL}/api/v1/wishlists?page=1&pageSize=999`,
|
|
7265
|
+
await addWishListItemToWishList({
|
|
7266
|
+
productId,
|
|
7267
|
+
wishListId: wishList.id,
|
|
7268
|
+
});
|
|
7269
|
+
queryClient.removeQueries({
|
|
7270
|
+
queryKey: ['wishlists', '*', 'wishlistlines'],
|
|
7254
7271
|
});
|
|
7255
7272
|
},
|
|
7256
|
-
queryKey: ['wishlists'],
|
|
7257
7273
|
});
|
|
7258
7274
|
}
|
|
7259
7275
|
|
|
7260
|
-
|
|
7261
|
-
|
|
7262
|
-
function InnerAddToFavoriteDialog({ isOpen, onCancel, onSubmit, }) {
|
|
7263
|
-
const t = useFormattedMessage();
|
|
7264
|
-
const { data: newWishListId, error: addWishListError, isPending, isSuccess, mutate: addWishList, } = useAddWishList();
|
|
7265
|
-
const { data: wishLists, error: fetchWishListError, isFetching, } = useFetchWishLists();
|
|
7266
|
-
const [selectedWishListid, setSelectedWishListId] = useState();
|
|
7267
|
-
const [isCreatingNewList, setIsCreatingNewList] = useState(false);
|
|
7268
|
-
const [newWishListName, setNewWishListName] = useState('');
|
|
7269
|
-
const isLoading = isPending || isFetching;
|
|
7270
|
-
useEffect(() => {
|
|
7271
|
-
if (!isSuccess || !newWishListId || !isOpen)
|
|
7272
|
-
return;
|
|
7273
|
-
onSubmit(newWishListId);
|
|
7274
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
7275
|
-
}, [isSuccess]);
|
|
7276
|
-
const wishListOptions = wishLists?.wishListCollection?.reduce((options, list) => ({ ...options, [list.id]: list.name }), { new: t('Create new list') }) || { new: t('Create new list') };
|
|
7277
|
-
const allowSubmit = Boolean(!isLoading && (isCreatingNewList ? newWishListName : selectedWishListid));
|
|
7278
|
-
const allowCancel = !isLoading;
|
|
7279
|
-
function handleOnSubmit() {
|
|
7280
|
-
if (isCreatingNewList) {
|
|
7281
|
-
return addWishList({ name: newWishListName.trim() });
|
|
7282
|
-
}
|
|
7283
|
-
selectedWishListid && onSubmit(selectedWishListid);
|
|
7284
|
-
}
|
|
7285
|
-
return (jsx(Dialog, { allowClose: !isLoading, footer: jsxs("div", { className: styles$j['footer-button-panel'], children: [jsx(Button, { isDisabled: !allowSubmit, onPress: handleOnSubmit, type: "submit", children: t('Submit') }), jsx(Button, { color: "secondary", isDisabled: !allowCancel, onPress: onCancel, variant: "outline", children: t('Cancel') })] }), isDismissable: true, isKeyboardDismissDisabled: false, isOpen: isOpen, onOpenChange: onCancel, onSubmit: handleOnSubmit, title: t('Add to list'), validationErrors: addWishListError
|
|
7286
|
-
? {
|
|
7287
|
-
wishListName: addWishListError instanceof WishListNameAlreadyExistsError
|
|
7288
|
-
? t('List name already exists')
|
|
7289
|
-
: t('An unexpected error occured'),
|
|
7290
|
-
}
|
|
7291
|
-
: undefined, children: isFetching ? (jsxs("div", { className: styles$j['loading-panel'], children: [jsx("p", { children: "Loading..." }), jsx(ProgressCircle, {})] })) : fetchWishListError ? (jsx("div", { children: t('An unexpected error occured') })) : (jsxs("div", { className: styles$j.content, children: [jsx(Select, { isDisabled: isLoading, label: t('Select a list'), onChange: wishListId => {
|
|
7292
|
-
const isCreateNewList = wishListId === 'new';
|
|
7293
|
-
setIsCreatingNewList(isCreateNewList);
|
|
7294
|
-
setSelectedWishListId(isCreateNewList ? undefined : wishListId);
|
|
7295
|
-
}, options: wishListOptions, selectedOption: selectedWishListid, variant: "solid" }), isCreatingNewList && (jsx(TextField, { autoFocus: true, isRequired: true, showLabel: true, isDisabled: isLoading, label: t('New list name'), maxLength: 100, name: "wishListName", onChange: setNewWishListName, placeholder: t('New list name'), value: newWishListName }))] })) }));
|
|
7296
|
-
}
|
|
7297
|
-
function AddToFavoriteDialog({ isOpen, onCancel, onSubmit, }) {
|
|
7298
|
-
/* The inner component is explicitly unmounted to
|
|
7299
|
-
* clear out all state between opening and closing
|
|
7300
|
-
* of the dialog*/
|
|
7301
|
-
if (!isOpen)
|
|
7302
|
-
return null;
|
|
7303
|
-
return (jsx(InnerAddToFavoriteDialog, { isOpen: isOpen, onCancel: onCancel, onSubmit: onSubmit }));
|
|
7304
|
-
}
|
|
7305
|
-
|
|
7306
|
-
function SignInDialog({ isOpen, onOpenChange }) {
|
|
7307
|
-
const t = useFormattedMessage();
|
|
7308
|
-
const { signInUrl } = useFavorite();
|
|
7309
|
-
return (jsxs(Dialog, { isDismissable: true, isOpen: isOpen, onOpenChange: onOpenChange, title: t('Please Sign In'), children: [t('You must '), jsx(LinkButton, { href: `${signInUrl}?returnUrl=${encodeURIComponent(window.location.pathname + window.location.search)}`, onPress: () => onOpenChange(false), type: "link", children: t('sign in') }), t(' to your account to manage your lists.')] }));
|
|
7310
|
-
}
|
|
7311
|
-
|
|
7312
|
-
function useAddWishListItemToWishList() {
|
|
7276
|
+
function useRemoveWishListItemFromCurrentWishList() {
|
|
7313
7277
|
const queryClient = useQueryClient();
|
|
7314
7278
|
return useMutation({
|
|
7315
|
-
mutationFn: async ({
|
|
7316
|
-
await
|
|
7317
|
-
body: { productId, qtyOrdered: 1, unitOfMeasure: '' },
|
|
7318
|
-
headers: {
|
|
7319
|
-
'Content-Type': 'application/json',
|
|
7320
|
-
},
|
|
7321
|
-
method: 'POST',
|
|
7322
|
-
url: `${config.SHOP_API_URL}/api/v1/wishlists/${wishListId}/wishlistlines`,
|
|
7323
|
-
});
|
|
7279
|
+
mutationFn: async ({ wishListId, wishListItemId }) => {
|
|
7280
|
+
await removeWishListItemFromWishList({ wishListId, wishListItemId });
|
|
7324
7281
|
queryClient.removeQueries({ queryKey: ['wishlists'] });
|
|
7282
|
+
queryClient.removeQueries({ queryKey: ['wishlist'] });
|
|
7325
7283
|
},
|
|
7326
7284
|
});
|
|
7327
7285
|
}
|
|
7328
7286
|
|
|
7329
7287
|
function ConnectedFavoriteButton({ productId }) {
|
|
7330
|
-
const { isFavorite, isFetching } = useFavoriteProduct(productId);
|
|
7288
|
+
const { isFavorite, isFetching, wishList, wishListItem } = useFavoriteProduct(productId);
|
|
7331
7289
|
const isAuthenticated = useIsAuthenticated();
|
|
7332
7290
|
const [showSignInDialog, setShowSignInDialog] = useState(false);
|
|
7333
|
-
const
|
|
7334
|
-
const { mutate:
|
|
7291
|
+
const { mutate: addWishListItemToCurrentWishList } = useAddWishListItemToCurrentWishList();
|
|
7292
|
+
const { mutate: removeWishListItemFromWishList } = useRemoveWishListItemFromCurrentWishList();
|
|
7335
7293
|
function onFavorite() {
|
|
7336
|
-
if (isFavorite)
|
|
7337
|
-
return alert('Deleting a favorite is not supported');
|
|
7338
7294
|
if (!isAuthenticated) {
|
|
7339
7295
|
return setShowSignInDialog(true);
|
|
7340
7296
|
}
|
|
7341
|
-
|
|
7297
|
+
if (wishList && wishListItem) {
|
|
7298
|
+
removeWishListItemFromWishList({
|
|
7299
|
+
wishListId: wishList.id,
|
|
7300
|
+
wishListItemId: wishListItem.id,
|
|
7301
|
+
});
|
|
7302
|
+
}
|
|
7303
|
+
else {
|
|
7304
|
+
addWishListItemToCurrentWishList({ productId });
|
|
7305
|
+
}
|
|
7342
7306
|
}
|
|
7343
|
-
return (jsxs(Fragment, { children: [jsx(FavoriteButton, { isDisabled: isFetching, isFavorite: isFavorite, onPress: onFavorite }), jsx(
|
|
7344
|
-
setShowAddToFavoriteDialog(false);
|
|
7345
|
-
addWishListItem({ productId, wishListId });
|
|
7346
|
-
} }), jsx(SignInDialog, { isOpen: showSignInDialog, onOpenChange: setShowSignInDialog })] }));
|
|
7307
|
+
return (jsxs(Fragment, { children: [jsx(FavoriteButton, { isDisabled: isFetching, isFavorite: isFavorite, onPress: onFavorite }), jsx(SignInDialog, { isOpen: showSignInDialog, onOpenChange: setShowSignInDialog })] }));
|
|
7347
7308
|
}
|
|
7348
7309
|
|
|
7349
7310
|
function ConnectedProductCard({ onAddToCart, productId, ...props }) {
|
|
@@ -7469,6 +7430,9 @@ function createQueryStringRouting({ algoliaIndex, categoryPages, }) {
|
|
|
7469
7430
|
if (state.page) {
|
|
7470
7431
|
queryString.page = state.page.toString();
|
|
7471
7432
|
}
|
|
7433
|
+
else {
|
|
7434
|
+
delete queryString.page;
|
|
7435
|
+
}
|
|
7472
7436
|
if (!categoryPages &&
|
|
7473
7437
|
state.hierarchicalMenu?.['hierarchicalCategories.lvl0']) {
|
|
7474
7438
|
queryString.category =
|
|
@@ -7575,6 +7539,9 @@ const offlineSearchClient = {
|
|
|
7575
7539
|
|
|
7576
7540
|
const createSonicSearchClient = ({ apiKey, appId, host, }) => {
|
|
7577
7541
|
const searchClient = algoliasearch(appId, apiKey);
|
|
7542
|
+
if (!host) {
|
|
7543
|
+
return searchClient;
|
|
7544
|
+
}
|
|
7578
7545
|
const read = searchClient.transporter.read;
|
|
7579
7546
|
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
|
7580
7547
|
// @ts-ignore
|
|
@@ -7724,7 +7691,11 @@ function ProductListingPage({ pageUrl, searchClient: _searchClient, }) {
|
|
|
7724
7691
|
return (jsx(ProductListingPageProvider, { data: data, error: error, isError: isError, isLoading: isFetching, children: jsx(AlgoliaProvider, { categoryPages: data.categoryPages, languageCode: languageCode, offlineSearchClient: offlineSearchClient, searchClient: searchClient, children: jsx(Page, { breadCrumb: data.breadCrumb, className: styles$e['product-listing'], title: category.slice().pop(), children: jsx(ProductListingPageContent, { promoCards: data.promoCards?.top }) }) }) }));
|
|
7725
7692
|
}
|
|
7726
7693
|
function ProductListingPageContent({ promoCards, }) {
|
|
7727
|
-
return (jsxs(Fragment, { children: [promoCards?.length && (jsx("section", { className: styles$e.promos, children: jsx(PromoCards, { promoCardsData: promoCards }) })), jsx("section", { className: styles$e.categories, children: jsx(ConnectedCategoryCarousel, {}) }), jsxs("section", { className: styles$e['action-bar'], children: [jsx("div", { className: styles$e['sidebar-toggle'], children: jsx(ToggleSidebarButton, {}) }), jsx("span", { className: styles$e.count, children: jsx(AlgoliaResultsCount, {}) }), jsx("div", { className: styles$e.sort, children: jsx(AlgoliaSortBy, {}) })] }), jsx("section", { children: jsxs("div", { className: styles$e['product-grid-container'], children: [jsx(Sidebar, { children: jsx(AlgoliaFilterPanel, { showActiveCategories: true }) }), jsxs("div", { className: styles$e['product-grid'], children: [jsx(ProductOverview, {}), jsx("div", { className: styles$e.pagination, children: jsx(AlgoliaPagination, { onChange: () =>
|
|
7694
|
+
return (jsxs(Fragment, { children: [promoCards?.length && (jsx("section", { className: styles$e.promos, children: jsx(PromoCards, { promoCardsData: promoCards }) })), jsx("section", { className: styles$e.categories, children: jsx(ConnectedCategoryCarousel, {}) }), jsxs("section", { className: styles$e['action-bar'], children: [jsx("div", { className: styles$e['sidebar-toggle'], children: jsx(ToggleSidebarButton, {}) }), jsx("span", { className: styles$e.count, children: jsx(AlgoliaResultsCount, {}) }), jsx("div", { className: styles$e.sort, children: jsx(AlgoliaSortBy, {}) })] }), jsx("section", { children: jsxs("div", { className: styles$e['product-grid-container'], children: [jsx(Sidebar, { children: jsx(AlgoliaFilterPanel, { showActiveCategories: true }) }), jsxs("div", { className: styles$e['product-grid'], children: [jsx(ProductOverview, {}), jsx("div", { className: styles$e.pagination, children: jsx(AlgoliaPagination, { onChange: () => {
|
|
7695
|
+
setTimeout(() => {
|
|
7696
|
+
scrollToTop();
|
|
7697
|
+
}, 100);
|
|
7698
|
+
} }) })] })] }) })] }));
|
|
7728
7699
|
}
|
|
7729
7700
|
|
|
7730
7701
|
var styles$d = {"search-results":"search-results-page-module-M7SIu","header":"search-results-page-module-DpNT-","action-bar":"search-results-page-module-RJoMk","sidebar-toggle":"search-results-page-module-SzLQb","sort":"search-results-page-module-cgonp","count":"search-results-page-module-hunZp","categories":"search-results-page-module-n2lSj","product-grid-container":"search-results-page-module-TK-iE","product-grid":"search-results-page-module-HWUnk","pagination":"search-results-page-module-SZYiA"};
|
|
@@ -7858,28 +7829,23 @@ const popularCategoriesPlugin = ({ productsIndexName, searchClient, }) => {
|
|
|
7858
7829
|
getSources() {
|
|
7859
7830
|
return [
|
|
7860
7831
|
{
|
|
7861
|
-
getItemInputValue({ item }) {
|
|
7862
|
-
return item.label;
|
|
7863
|
-
},
|
|
7864
7832
|
getItems() {
|
|
7865
|
-
return
|
|
7833
|
+
return getAlgoliaResults({
|
|
7866
7834
|
queries: [
|
|
7867
7835
|
{
|
|
7868
|
-
facet: 'hierarchicalCategories.lvl0',
|
|
7869
7836
|
indexName: productsIndexName,
|
|
7870
7837
|
params: {
|
|
7871
|
-
|
|
7872
|
-
maxFacetHits: 16,
|
|
7873
|
-
sortFacetValuesBy: 'count',
|
|
7838
|
+
ruleContexts: ['no-results'],
|
|
7874
7839
|
},
|
|
7875
7840
|
},
|
|
7876
7841
|
],
|
|
7877
7842
|
searchClient,
|
|
7843
|
+
transformResponse({ results }) {
|
|
7844
|
+
return (results[0]?.userData?.[0]
|
|
7845
|
+
?.noResultsCategories || []);
|
|
7846
|
+
},
|
|
7878
7847
|
});
|
|
7879
7848
|
},
|
|
7880
|
-
onSelect({ setIsOpen }) {
|
|
7881
|
-
setIsOpen(true);
|
|
7882
|
-
},
|
|
7883
7849
|
sourceId: 'popularCategoriesPlugin',
|
|
7884
7850
|
},
|
|
7885
7851
|
];
|
|
@@ -8190,17 +8156,11 @@ function ConnectedSearchInput() {
|
|
|
8190
8156
|
var styles$8 = {"categories-grid":"categories-grid-module-C751R","category":"categories-grid-module-7OZS1"};
|
|
8191
8157
|
|
|
8192
8158
|
function CategoriesGrid({ categories }) {
|
|
8193
|
-
|
|
8194
|
-
|
|
8195
|
-
|
|
8196
|
-
|
|
8197
|
-
|
|
8198
|
-
2: 'https://images.sonic-equipment.com/categories/Wire_strippers_Pliers.webp',
|
|
8199
|
-
3: 'https://images.sonic-equipment.com/categories/Wire_strippers_Pliers.webp',
|
|
8200
|
-
altText: '',
|
|
8201
|
-
},
|
|
8202
|
-
title: '',
|
|
8203
|
-
}, title: "Bits & Bits Sets" }) }, index))) }));
|
|
8159
|
+
return (jsx("div", { className: styles$8['categories-grid'], children: categories.map(category => (jsx("div", { className: styles$8['category'], children: jsx(CategoryCard, { withArrow: true, href: category.href, image: {
|
|
8160
|
+
fit: 'contain',
|
|
8161
|
+
image: category.image,
|
|
8162
|
+
title: category.title,
|
|
8163
|
+
}, title: category.title }, category.title) }, category.title))) }));
|
|
8204
8164
|
}
|
|
8205
8165
|
|
|
8206
8166
|
var styles$7 = {"search-section":"search-section-module-qaTiw","header":"search-section-module-E--U2","title":"search-section-module-AHlDR","content":"search-section-module-VZlvZ"};
|
|
@@ -8209,7 +8169,7 @@ function SearchSection({ button, children, className, title, }) {
|
|
|
8209
8169
|
return (jsxs("div", { className: clsx(styles$7['search-section'], className), children: [jsxs("div", { className: styles$7.header, children: [title && jsx("h2", { className: styles$7.title, children: title }), button && button] }), jsx("div", { className: styles$7.content, children: children })] }));
|
|
8210
8170
|
}
|
|
8211
8171
|
|
|
8212
|
-
var styles$6 = {"section-container":"search-content-module-ZMwlB","content":"search-content-module-KIok6","left":"search-content-module-YRLIf","right":"search-content-module-qK5sg","button-container":"search-content-module-w-ORq","show-all-button":"search-content-module-bO1Q0","product-results":"search-content-module-bcFCH","no-results-text":"search-content-module-H-FX2","
|
|
8172
|
+
var styles$6 = {"section-container":"search-content-module-ZMwlB","content":"search-content-module-KIok6","left":"search-content-module-YRLIf","right":"search-content-module-qK5sg","button-container":"search-content-module-w-ORq","show-all-button":"search-content-module-bO1Q0","product-results":"search-content-module-bcFCH","no-results-text":"search-content-module-H-FX2","query":"search-content-module-LbQnK","suggestions":"search-content-module-mhiBZ","list":"search-content-module-coPAt"};
|
|
8213
8173
|
|
|
8214
8174
|
function SectionContainer({ buttons, leftContent, rightContent, }) {
|
|
8215
8175
|
return (jsxs("div", { className: styles$6['section-container'], children: [jsxs("div", { className: styles$6['content'], children: [jsx("div", { className: styles$6['left'], children: leftContent }), jsx("div", { className: styles$6['right'], children: rightContent })] }), jsx("div", { className: styles$6['button-container'], children: buttons })] }));
|
|
@@ -8221,28 +8181,15 @@ function NoResults() {
|
|
|
8221
8181
|
function NotFound() {
|
|
8222
8182
|
const { state } = useAlgoliaSearch();
|
|
8223
8183
|
const t = useFormattedMessage();
|
|
8224
|
-
return (jsx(SearchSection, { title: t('Sorry, we could not find matches for'), children: jsx("div", { className: styles$6['no-results-text'], children: jsxs("div", { className: styles$6.section, children: [jsxs("
|
|
8184
|
+
return (jsx(SearchSection, { title: t('Sorry, we could not find matches for'), children: jsx("div", { className: styles$6['no-results-text'], children: jsxs("div", { className: styles$6.section, children: [jsxs("p", { className: styles$6.query, children: ["'", state.query, "'"] }), jsxs("div", { className: styles$6.suggestions, children: [jsx("p", { children: jsx(FormattedMessage, { id: "You could try" }) }), jsxs("ul", { className: styles$6.list, children: [jsx("li", { children: jsx(FormattedMessage, { id: "Searching again using more general terms" }) }), jsx("li", { children: jsx(FormattedMessage, { id: "Double check your spelling" }) }), jsx("li", { children: jsx(FormattedMessage, { id: "Use fewer keywords" }) }), jsx("li", { children: jsx(FormattedMessage, { id: "Exploring our products by category" }) })] })] })] }) }) }));
|
|
8225
8185
|
}
|
|
8226
8186
|
function PopularCategoriesSection() {
|
|
8227
|
-
const {
|
|
8187
|
+
const { popularCategories: collection } = useAlgoliaSearch();
|
|
8228
8188
|
const t = useFormattedMessage();
|
|
8229
8189
|
if (!collection)
|
|
8230
8190
|
return null;
|
|
8231
|
-
const { items
|
|
8232
|
-
return (jsx(SearchSection, { title: t('Explore by categories'), children: jsx(CategoriesGrid, { categories: items
|
|
8233
|
-
...autocomplete.getItemProps({
|
|
8234
|
-
item,
|
|
8235
|
-
source: source,
|
|
8236
|
-
}),
|
|
8237
|
-
href: '/',
|
|
8238
|
-
image: {
|
|
8239
|
-
1: '/',
|
|
8240
|
-
2: '/',
|
|
8241
|
-
3: '/',
|
|
8242
|
-
altText: item.label,
|
|
8243
|
-
},
|
|
8244
|
-
title: item.label,
|
|
8245
|
-
})) }) }));
|
|
8191
|
+
const { items } = collection;
|
|
8192
|
+
return (jsx(SearchSection, { title: t('Explore by categories'), children: jsx("div", { className: styles$6['categories-grid-container'], children: jsx(CategoriesGrid, { categories: items }) }) }));
|
|
8246
8193
|
}
|
|
8247
8194
|
|
|
8248
8195
|
function Highlight({ attribute, hit, tagName = 'mark', }) {
|
|
@@ -8291,7 +8238,7 @@ function RecentSearchesSection() {
|
|
|
8291
8238
|
return null;
|
|
8292
8239
|
}
|
|
8293
8240
|
const { items, source } = collection;
|
|
8294
|
-
return (jsx(SearchSection, { button: jsx(LinkButton, { onPress: () => items.forEach(item => source.onRemove(item.id)), children: jsx(FormattedMessage, { id: "Clear" }) }), title: t('Recent searches'), children: jsx(SearchList, { ...autocomplete.getListProps({ source }), children: items.map(item => (jsx(SearchListItem, { ...autocomplete.getItemProps({
|
|
8241
|
+
return (jsx(SearchSection, { button: jsx(LinkButton, { color: "secondary", hasUnderline: true, onPress: () => items.forEach(item => source.onRemove(item.id)), children: jsx(FormattedMessage, { id: "Clear" }) }), title: t('Recent searches'), children: jsx(SearchList, { ...autocomplete.getListProps({ source }), children: items.map(item => (jsx(SearchListItem, { ...autocomplete.getItemProps({
|
|
8295
8242
|
item,
|
|
8296
8243
|
source: source,
|
|
8297
8244
|
}), icon: jsx(StrokeSearchIcon, {}), isRemovable: true, onRemove: () => source.onRemove(item.id), text: jsx(Highlight, { attribute: "label", hit: item }) }, item.id))) }) }));
|
|
@@ -8302,7 +8249,7 @@ function QuickAccessSection() {
|
|
|
8302
8249
|
if (!collection)
|
|
8303
8250
|
return;
|
|
8304
8251
|
const { items } = collection;
|
|
8305
|
-
return (jsx(SearchSection, { title: t('Quick access'), children: jsx("div", { className: styles$3['quick-access-section'], children: jsx(Carousel, { className: styles$3['quick-access-carousel'], hasNavigation: false, hasOverflow: false, navigationButtonsPosition: "center", slides: items.map((item, index) => (jsx(
|
|
8252
|
+
return (jsx(SearchSection, { title: t('Quick access'), children: jsx("div", { className: styles$3['quick-access-section'], children: jsx(Carousel, { className: styles$3['quick-access-carousel'], hasNavigation: false, hasOverflow: false, navigationButtonsPosition: "center", slides: items.map((item, index) => (jsx(RouteLink, { className: styles$3['quick-access-card'], href: item.action.url, children: jsx(Image, { height: 343, image: item.image, title: item.image.altText, width: 192 }) }, index))), spaceBetween: 16 }) }) }));
|
|
8306
8253
|
}
|
|
8307
8254
|
|
|
8308
8255
|
var styles$2 = {"slide":"product-carousel-module-XVTB1"};
|
|
@@ -8317,8 +8264,8 @@ function StrokeRecentIcon(props) {
|
|
|
8317
8264
|
|
|
8318
8265
|
function WithResults() {
|
|
8319
8266
|
const { state } = useAlgoliaSearch();
|
|
8320
|
-
const
|
|
8321
|
-
return (jsx("div", { children: jsx(SectionContainer, { buttons: jsxs(RouteButton, { className: clsx(styles$6['show-all-button'], buttonStyles.button, buttonStyles.secondary, buttonStyles.outline, buttonStyles.md), href: `/search?keyword=${state.query}`, children: [jsx(FormattedMessage, { id: "See all results" }), "
|
|
8267
|
+
const { close } = useGlobalSearchDisclosure();
|
|
8268
|
+
return (jsx("div", { children: jsx(SectionContainer, { buttons: jsxs(RouteButton, { className: clsx(styles$6['show-all-button'], buttonStyles.button, buttonStyles.secondary, buttonStyles.outline, buttonStyles.md), href: `/search?keyword=${state.query}`, onPress: close, children: [jsx(FormattedMessage, { id: "See all results" }), ")", jsx(GlyphsArrowBoldCapsRightIcon, { className: buttonStyles['right-arrow-icon'] })] }), leftContent: jsx(SuggestionsSection, {}), rightContent: jsx(ProductResultsSection, {}) }) }));
|
|
8322
8269
|
}
|
|
8323
8270
|
function SuggestionsSection() {
|
|
8324
8271
|
const { autocomplete, categories, querySuggestions, recentSearches } = useAlgoliaSearch();
|