@sonic-equipment/ui 0.0.72 → 0.0.73
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 +2 -1
- package/dist/index.js +179 -112
- package/dist/src/media/image-grid/images-grid.d.ts +7 -0
- package/dist/src/media/image-grid/images-grid.stories.d.ts +11 -0
- package/dist/src/shared/routing/route-provider.d.ts +1 -0
- package/dist/styles.css +78 -10
- package/package.json +1 -1
package/dist/index.d.ts
CHANGED
|
@@ -4105,6 +4105,7 @@ interface RouteProviderProps {
|
|
|
4105
4105
|
navigate: NavigateFn;
|
|
4106
4106
|
}
|
|
4107
4107
|
declare function RouteProvider({ children, navigate }: RouteProviderProps): react_jsx_runtime.JSX.Element;
|
|
4108
|
+
declare function useOnNavigate(callback?: NavigateFn): NavigateFn;
|
|
4108
4109
|
declare function useNavigate(): NavigateFn;
|
|
4109
4110
|
|
|
4110
4111
|
interface LinkProps$1
|
|
@@ -4919,4 +4920,4 @@ declare function ReactQueryContainer({ children }: {
|
|
|
4919
4920
|
children: ReactNode;
|
|
4920
4921
|
}): react_jsx_runtime.JSX.Element;
|
|
4921
4922
|
|
|
4922
|
-
export { Accordion, type AccountCollectionModel, type AccountModel, type AccountPaymentProfileCollectionModel, type AccountPaymentProfileModel, type AccountSettingsModel, type AccountShipToCollectionModel, type AccountShipToModel, type AccountsReceivableDto$1 as AccountsReceivableDto, type AddProductToCurrentCartParams$1 as AddProductToCurrentCartParams, AddToCartButton, type AddressFieldCollectionModel, type AddressFieldDisplayCollectionModel, type AddressFieldDisplayModel, type AgingBucketDto$1 as AgingBucketDto, AlgoliaActiveCategories, AlgoliaCategoriesFilters, AlgoliaFilterPanel, type AlgoliaFilterPanelProps, AlgoliaInsightsProvider, AlgoliaInsightsProviderContext, type AlgoliaInsightsProviderState, AlgoliaMultiSelectFilterSection, AlgoliaPagination, AlgoliaProvider, AlgoliaResultsCount, AlgoliaSortBy, type AttributeTypeDto, type AttributeTypeFacetModel, type AttributeTypeModel, type AttributeValueDto, type AttributeValueFacetModel, type AttributeValueModel, type AuthenticationResponse$1 as AuthenticationResponse, type AutocompleteItemModel, type AutocompleteModel, type AutocompleteProductCollectionModel, type AutocompleteProductModel, type AvailabilityDto$2 as AvailabilityDto, AvailabilityMessageType$2 as AvailabilityMessageType, BadRequestError, BadgeImagePlacementValues, type BadgeModel, BadgeStyleValues, BadgeTypeValues, type BaseAddressModel, type BaseModel$1 as BaseModel, type BillToCollectionModel, type BillToModel$1 as BillToModel, type BrandAlphabetLetterModel, type BrandAlphabetModel, type BrandAutocompleteModel, type BrandCategoryCollectionModel, type BrandCategoryModel, type BrandCollectionModel, type BrandDto$2 as BrandDto, type BrandModel, type BrandProductLineCollectionModel, type BrandProductLineModel, type BreadCrumbModel, Breadcrumb, type BreadcrumbLink$1 as BreadcrumbLink, type BreadcrumbProps, type BreakPriceDto$2 as BreakPriceDto, type BreakPriceRfqModel, type BudgetCalendarCollectionModel, type BudgetCalendarModel, type BudgetCollectionModel, type BudgetLineModel, type BudgetModel, Button, type ButtonProps, type CalculationMethod, type CarrierDto, type CartCollectionModel, type CartLineCollectionModel, type CartLineModel$2 as CartLineModel, type CartModel, CartProvider, type CartSettingsModel, type CatalogPageModel, CategoryCarousel, type CategoryCarouselProps, type CategoryCollectionModel, type CategoryFacetModel, type CategoryModel, Checkbox, type CheckboxProps$1 as CheckboxProps, type ChildTraitValueModel, ColorCheckbox, type ColorCheckboxProps, type ConfigSectionDto, type ConfigSectionModel, type ConfigSectionOptionDto, type ConfigurationModel, ConnectedAddToCartButton, type ContactUsModel, type ContentModel, type CostCodeDto, type CostCodeModel$1 as CostCodeModel, type CountryCollectionModel, type CountryModel$1 as CountryModel, type CreateSessionRequestBody, type CreditCardBillingAddressDto, type CreditCardDto, type CrossSellCollectionModel, type CurrencyCollectionModel, type CurrencyModel$1 as CurrencyModel, CurrencyPositioningType$1 as CurrencyPositioningType, type CustomerCostCodeDto, type CustomerOrderTaxDto, type CustomerSettingsModel, type CustomerValidationDto$1 as CustomerValidationDto, type DashboardPanelCollectionModel, type DashboardPanelModel, type DealerCollectionModel, type DealerModel, type DetailModel, type DocumentDto, type DocumentModel, type ECheckDto, type Environment, type FacetModel, FavoriteButton, type FavoriteButtonProps, FavoriteProvider, type FieldScoreDetailedDto, type FieldScoreDetailedModel, type FieldScoreDto, type FieldScoreModel, type FieldValidationDto$1 as FieldValidationDto, type FilterOption, FilterSection, type Filters, ForbiddenRequestError, FormattedMessage, type FormattedMessageFunction, type FormattedMessageProps, GlobalSearch, GlobalSearchDisclosureContext, GlobalSearchProvider, GlobalStateProvider, GlobalStateProviderContext, IconButton, type IconButtonProps, Image, type ImageModel, InternalServerErrorRequest, IntlProvider, type InventoryAvailabilityDto, type InventoryWarehousesDto, type InvoiceCollectionModel, type InvoiceHistoryTaxDto, type InvoiceLineModel, type InvoiceModel, type InvoiceSettingsModel, type JobQuoteCollectionModel, type JobQuoteLineModel, type JobQuoteModel, type LanguageCollectionModel, type LanguageModel$1 as LanguageModel, type LegacyConfigurationDto, Link, type LinkProps, LoadingOverlay, type MessageCollectionModel, type MessageModel, type MobileAppSettingsModel, type MobileContentModel, type MobilePageDto, type MobileWidgetDto, MultiSelect, type MultiSelectProps, type NavigateFn, type NavigateOptions, NotFoundRequestError, NumberField, type NumberFieldSize, type OrderApprovalCollectionModel, type OrderCollectionModel, type OrderHistoryTaxDto, type OrderLineModel, type OrderModel, type OrderPromotionModel, type OrderRequestModel, type OrderSettingsModel, type OrderStatusMappingCollectionModel, type OrderStatusMappingModel, Page, PageContainer, type PageProps, type PaginationModel$1 as PaginationModel, type PaymentMethodDto, type PaymentOptionsDto, type PersonaModel$1 as PersonaModel, type PoRequisitionModel, type PriceFacetModel, type PriceRangeModel, type PricingRfqModel, type ProductAutocompleteItemModel, type ProductAvailabilityModel, ProductCard, type ProductCardProps, type ProductCollectionModel, ProductDetailsPage, type ProductDetailsPageProps, type ProductDto, type ProductHit$1 as ProductHit, type ProductImageDto, type ProductInventoryDto, type ProductLineDto, type ProductLineModel, ProductListingPage, type ProductListingPageProps, type ProductModel, ProductOverviewGrid, type ProductOverviewGridProps, ProductPrice, type ProductPriceDto$2 as ProductPriceDto, type ProductPriceModel, type ProductPriceProps, type ProductSettingsModel, ProductSku, type ProductSkuProps, type ProductSubscriptionDto$2 as ProductSubscriptionDto, type ProductSubscriptionModel, type ProductUnitOfMeasureDto$1 as ProductUnitOfMeasureDto, type ProfileTransactionRequestModel, ProgressCircle, type ProgressCircleProps, type PromotionCollectionModel, type PromotionModel, type QuoteCollectionModel, type QuoteLineModel, type QuoteModel, type QuoteSettingsModel, ReactQueryContainer, type RealTimeCartInventoryModel, type RealTimeInventoryModel, type RealTimePricingModel, type RefinementListItem, type RelatedProductDto, RequestError, type RequestHeaders, type RequisitionCollectionModel, type RequisitionLineCollectionModel, type RequisitionLineModel, type RequisitionModel, type RmaLineDto, type RmaModel, RouteButton, RouteLink, RouteProvider, type RouteProviderProps, type SalespersonModel, type ScoreExplanationDto, type ScoreExplanationModel, SearchResultsPage, SearchRoot, type SectionOptionDto$2 as SectionOptionDto, type SectionOptionModel, Select, type SelectProps, type SessionModel$1 as SessionModel, type SessionRequestModel, type SettingsCollectionModel, type SetupRequestModel, type ShareEntityModel, type ShareOrderModel, type ShipToCollectionModel, type ShipToModel$1 as ShipToModel, type ShipViaDto, type ShipmentPackageDto, type ShipmentPackageLineDto, ShowAll, type ShowAllProps, Sidebar, SidebarDetectBreakpoint, type SidebarProps, SidebarProvider, type SiteMessageCollectionModel, type SiteMessageModel, type SortOptionModel$1 as SortOptionModel, type SpecificationDto, type SpecificationModel, type StateCollectionModel, type StateModel$1 as StateModel, type StyleTraitDto, type StyleValueDto, type StyledProductDto, type SuggestionModel, type TellAFriendModel, TextField, TimeoutRequestError, type TraitValueModel, type TranslationDictionaryCollectionModel, type TranslationDictionaryModel, type TranslationId, UnauthorizedRequestError, type UnitOfMeasureModel, UnprocessableContentRequestError, type UpdateCartLineParams, type UpdateGlobalState$1 as UpdateGlobalState, type UpdateWishListLineCollectionModel, type UseAlgoliaEventResult, VariantDisplayTypeValues, type VariantTraitModel, type VmiBinCollectionModel, type VmiBinCountModel, type VmiBinModel, type VmiCountCollectionModel, type VmiCountModel, type VmiLocationCollectionModel, type VmiLocationModel, type VmiNoteCollectionModel, type VmiNoteModel, type VmiUserImportCollectionModel, type VmiUserImportModel, type VmiUserModel, type WarehouseCollectionModel, type WarehouseDto, type WarehouseModel$1 as WarehouseModel, type WebsiteModel, type WebsiteSettingsModel, type WishListCollectionModel$1 as WishListCollectionModel, type WishListEmailScheduleModel$1 as WishListEmailScheduleModel, type WishListLine$1 as WishListLine, type WishListLineCollectionModel$1 as WishListLineCollectionModel, type WishListLineModel$1 as WishListLineModel, type WishListLines$1 as WishListLines, type WishListModel$1 as WishListModel, WishListNameAlreadyExistsError, type WishListSettingsModel, type WishListShareModel$1 as WishListShareModel, addProductToCurrentCart, addWishListItemToWishList, config, configPerEnvironment, createSession, createSonicSearchClient, createWishList, deleteCartLineById, deleteWishList, deleteWishListItemFromWishList, environment, environments, fetchCurrentCartLines, fetchTranslations, getSession, getWishList, getWishListItemsByWishListId, getWishLists, isRequestError, request, signIn, signOut, transformAlgoliaProductHitToProductHit, updateCartLineById, useAddProductToCurrentCart, useAddWishListItemToCurrentWishList, useAddWishListItemToWishList, useAlgolia, useAlgoliaInsights, useAlgoliaSearch, useBreakpoint, useCartEvents, useCreateWishList, useDebouncedCallback, useDeleteCartLineById, useDeleteWishListItemFromWishList, useDisclosure, useFavorite, useFavoriteProduct, useFeatureFlags, useFetchAllWishListsItems, useFetchCurrentCartLines, useFetchTranslations, useFetchWishLists, useFormattedMessage, useGlobalSearchDisclosure, useGlobalState, useIsAuthenticated, useIsBreakpoint, useNavigate, useScrollLock, useSession, useSignIn, useSignOut, useUpdateCartLineById, userToken };
|
|
4923
|
+
export { Accordion, type AccountCollectionModel, type AccountModel, type AccountPaymentProfileCollectionModel, type AccountPaymentProfileModel, type AccountSettingsModel, type AccountShipToCollectionModel, type AccountShipToModel, type AccountsReceivableDto$1 as AccountsReceivableDto, type AddProductToCurrentCartParams$1 as AddProductToCurrentCartParams, AddToCartButton, type AddressFieldCollectionModel, type AddressFieldDisplayCollectionModel, type AddressFieldDisplayModel, type AgingBucketDto$1 as AgingBucketDto, AlgoliaActiveCategories, AlgoliaCategoriesFilters, AlgoliaFilterPanel, type AlgoliaFilterPanelProps, AlgoliaInsightsProvider, AlgoliaInsightsProviderContext, type AlgoliaInsightsProviderState, AlgoliaMultiSelectFilterSection, AlgoliaPagination, AlgoliaProvider, AlgoliaResultsCount, AlgoliaSortBy, type AttributeTypeDto, type AttributeTypeFacetModel, type AttributeTypeModel, type AttributeValueDto, type AttributeValueFacetModel, type AttributeValueModel, type AuthenticationResponse$1 as AuthenticationResponse, type AutocompleteItemModel, type AutocompleteModel, type AutocompleteProductCollectionModel, type AutocompleteProductModel, type AvailabilityDto$2 as AvailabilityDto, AvailabilityMessageType$2 as AvailabilityMessageType, BadRequestError, BadgeImagePlacementValues, type BadgeModel, BadgeStyleValues, BadgeTypeValues, type BaseAddressModel, type BaseModel$1 as BaseModel, type BillToCollectionModel, type BillToModel$1 as BillToModel, type BrandAlphabetLetterModel, type BrandAlphabetModel, type BrandAutocompleteModel, type BrandCategoryCollectionModel, type BrandCategoryModel, type BrandCollectionModel, type BrandDto$2 as BrandDto, type BrandModel, type BrandProductLineCollectionModel, type BrandProductLineModel, type BreadCrumbModel, Breadcrumb, type BreadcrumbLink$1 as BreadcrumbLink, type BreadcrumbProps, type BreakPriceDto$2 as BreakPriceDto, type BreakPriceRfqModel, type BudgetCalendarCollectionModel, type BudgetCalendarModel, type BudgetCollectionModel, type BudgetLineModel, type BudgetModel, Button, type ButtonProps, type CalculationMethod, type CarrierDto, type CartCollectionModel, type CartLineCollectionModel, type CartLineModel$2 as CartLineModel, type CartModel, CartProvider, type CartSettingsModel, type CatalogPageModel, CategoryCarousel, type CategoryCarouselProps, type CategoryCollectionModel, type CategoryFacetModel, type CategoryModel, Checkbox, type CheckboxProps$1 as CheckboxProps, type ChildTraitValueModel, ColorCheckbox, type ColorCheckboxProps, type ConfigSectionDto, type ConfigSectionModel, type ConfigSectionOptionDto, type ConfigurationModel, ConnectedAddToCartButton, type ContactUsModel, type ContentModel, type CostCodeDto, type CostCodeModel$1 as CostCodeModel, type CountryCollectionModel, type CountryModel$1 as CountryModel, type CreateSessionRequestBody, type CreditCardBillingAddressDto, type CreditCardDto, type CrossSellCollectionModel, type CurrencyCollectionModel, type CurrencyModel$1 as CurrencyModel, CurrencyPositioningType$1 as CurrencyPositioningType, type CustomerCostCodeDto, type CustomerOrderTaxDto, type CustomerSettingsModel, type CustomerValidationDto$1 as CustomerValidationDto, type DashboardPanelCollectionModel, type DashboardPanelModel, type DealerCollectionModel, type DealerModel, type DetailModel, type DocumentDto, type DocumentModel, type ECheckDto, type Environment, type FacetModel, FavoriteButton, type FavoriteButtonProps, FavoriteProvider, type FieldScoreDetailedDto, type FieldScoreDetailedModel, type FieldScoreDto, type FieldScoreModel, type FieldValidationDto$1 as FieldValidationDto, type FilterOption, FilterSection, type Filters, ForbiddenRequestError, FormattedMessage, type FormattedMessageFunction, type FormattedMessageProps, GlobalSearch, GlobalSearchDisclosureContext, GlobalSearchProvider, GlobalStateProvider, GlobalStateProviderContext, IconButton, type IconButtonProps, Image, type ImageModel, InternalServerErrorRequest, IntlProvider, type InventoryAvailabilityDto, type InventoryWarehousesDto, type InvoiceCollectionModel, type InvoiceHistoryTaxDto, type InvoiceLineModel, type InvoiceModel, type InvoiceSettingsModel, type JobQuoteCollectionModel, type JobQuoteLineModel, type JobQuoteModel, type LanguageCollectionModel, type LanguageModel$1 as LanguageModel, type LegacyConfigurationDto, Link, type LinkProps, LoadingOverlay, type MessageCollectionModel, type MessageModel, type MobileAppSettingsModel, type MobileContentModel, type MobilePageDto, type MobileWidgetDto, MultiSelect, type MultiSelectProps, type NavigateFn, type NavigateOptions, NotFoundRequestError, NumberField, type NumberFieldSize, type OrderApprovalCollectionModel, type OrderCollectionModel, type OrderHistoryTaxDto, type OrderLineModel, type OrderModel, type OrderPromotionModel, type OrderRequestModel, type OrderSettingsModel, type OrderStatusMappingCollectionModel, type OrderStatusMappingModel, Page, PageContainer, type PageProps, type PaginationModel$1 as PaginationModel, type PaymentMethodDto, type PaymentOptionsDto, type PersonaModel$1 as PersonaModel, type PoRequisitionModel, type PriceFacetModel, type PriceRangeModel, type PricingRfqModel, type ProductAutocompleteItemModel, type ProductAvailabilityModel, ProductCard, type ProductCardProps, type ProductCollectionModel, ProductDetailsPage, type ProductDetailsPageProps, type ProductDto, type ProductHit$1 as ProductHit, type ProductImageDto, type ProductInventoryDto, type ProductLineDto, type ProductLineModel, ProductListingPage, type ProductListingPageProps, type ProductModel, ProductOverviewGrid, type ProductOverviewGridProps, ProductPrice, type ProductPriceDto$2 as ProductPriceDto, type ProductPriceModel, type ProductPriceProps, type ProductSettingsModel, ProductSku, type ProductSkuProps, type ProductSubscriptionDto$2 as ProductSubscriptionDto, type ProductSubscriptionModel, type ProductUnitOfMeasureDto$1 as ProductUnitOfMeasureDto, type ProfileTransactionRequestModel, ProgressCircle, type ProgressCircleProps, type PromotionCollectionModel, type PromotionModel, type QuoteCollectionModel, type QuoteLineModel, type QuoteModel, type QuoteSettingsModel, ReactQueryContainer, type RealTimeCartInventoryModel, type RealTimeInventoryModel, type RealTimePricingModel, type RefinementListItem, type RelatedProductDto, RequestError, type RequestHeaders, type RequisitionCollectionModel, type RequisitionLineCollectionModel, type RequisitionLineModel, type RequisitionModel, type RmaLineDto, type RmaModel, RouteButton, RouteLink, RouteProvider, type RouteProviderProps, type SalespersonModel, type ScoreExplanationDto, type ScoreExplanationModel, SearchResultsPage, SearchRoot, type SectionOptionDto$2 as SectionOptionDto, type SectionOptionModel, Select, type SelectProps, type SessionModel$1 as SessionModel, type SessionRequestModel, type SettingsCollectionModel, type SetupRequestModel, type ShareEntityModel, type ShareOrderModel, type ShipToCollectionModel, type ShipToModel$1 as ShipToModel, type ShipViaDto, type ShipmentPackageDto, type ShipmentPackageLineDto, ShowAll, type ShowAllProps, Sidebar, SidebarDetectBreakpoint, type SidebarProps, SidebarProvider, type SiteMessageCollectionModel, type SiteMessageModel, type SortOptionModel$1 as SortOptionModel, type SpecificationDto, type SpecificationModel, type StateCollectionModel, type StateModel$1 as StateModel, type StyleTraitDto, type StyleValueDto, type StyledProductDto, type SuggestionModel, type TellAFriendModel, TextField, TimeoutRequestError, type TraitValueModel, type TranslationDictionaryCollectionModel, type TranslationDictionaryModel, type TranslationId, UnauthorizedRequestError, type UnitOfMeasureModel, UnprocessableContentRequestError, type UpdateCartLineParams, type UpdateGlobalState$1 as UpdateGlobalState, type UpdateWishListLineCollectionModel, type UseAlgoliaEventResult, VariantDisplayTypeValues, type VariantTraitModel, type VmiBinCollectionModel, type VmiBinCountModel, type VmiBinModel, type VmiCountCollectionModel, type VmiCountModel, type VmiLocationCollectionModel, type VmiLocationModel, type VmiNoteCollectionModel, type VmiNoteModel, type VmiUserImportCollectionModel, type VmiUserImportModel, type VmiUserModel, type WarehouseCollectionModel, type WarehouseDto, type WarehouseModel$1 as WarehouseModel, type WebsiteModel, type WebsiteSettingsModel, type WishListCollectionModel$1 as WishListCollectionModel, type WishListEmailScheduleModel$1 as WishListEmailScheduleModel, type WishListLine$1 as WishListLine, type WishListLineCollectionModel$1 as WishListLineCollectionModel, type WishListLineModel$1 as WishListLineModel, type WishListLines$1 as WishListLines, type WishListModel$1 as WishListModel, WishListNameAlreadyExistsError, type WishListSettingsModel, type WishListShareModel$1 as WishListShareModel, addProductToCurrentCart, addWishListItemToWishList, config, configPerEnvironment, createSession, createSonicSearchClient, createWishList, deleteCartLineById, deleteWishList, deleteWishListItemFromWishList, environment, environments, fetchCurrentCartLines, fetchTranslations, getSession, getWishList, getWishListItemsByWishListId, getWishLists, isRequestError, request, signIn, signOut, transformAlgoliaProductHitToProductHit, updateCartLineById, useAddProductToCurrentCart, useAddWishListItemToCurrentWishList, useAddWishListItemToWishList, useAlgolia, useAlgoliaInsights, useAlgoliaSearch, useBreakpoint, useCartEvents, useCreateWishList, useDebouncedCallback, useDeleteCartLineById, useDeleteWishListItemFromWishList, useDisclosure, useFavorite, useFavoriteProduct, useFeatureFlags, useFetchAllWishListsItems, useFetchCurrentCartLines, useFetchTranslations, useFetchWishLists, useFormattedMessage, useGlobalSearchDisclosure, useGlobalState, useIsAuthenticated, useIsBreakpoint, useNavigate, useOnNavigate, useScrollLock, useSession, useSignIn, useSignOut, useUpdateCartLineById, userToken };
|
package/dist/index.js
CHANGED
|
@@ -767,6 +767,10 @@ function useAddWishListItemToCurrentWishList() {
|
|
|
767
767
|
},
|
|
768
768
|
]);
|
|
769
769
|
},
|
|
770
|
+
onError() {
|
|
771
|
+
queryClient.removeQueries({ queryKey: ['wishlists'] });
|
|
772
|
+
queryClient.removeQueries({ queryKey: ['wishlistlines'] });
|
|
773
|
+
},
|
|
770
774
|
});
|
|
771
775
|
}
|
|
772
776
|
|
|
@@ -821,6 +825,10 @@ function useDeleteWishListItemFromWishList() {
|
|
|
821
825
|
queryClient.setQueryData(['wishlistlines'], wishListLines.filter(line => line.wishListItem.id !== wishListItemId));
|
|
822
826
|
}
|
|
823
827
|
},
|
|
828
|
+
onError() {
|
|
829
|
+
queryClient.removeQueries({ queryKey: ['wishlists'] });
|
|
830
|
+
queryClient.removeQueries({ queryKey: ['wishlistlines'] });
|
|
831
|
+
},
|
|
824
832
|
});
|
|
825
833
|
}
|
|
826
834
|
|
|
@@ -1126,12 +1134,28 @@ function RouteProvider({ children, navigate }) {
|
|
|
1126
1134
|
useGlobalState('routing', { navigate });
|
|
1127
1135
|
return jsx(Fragment, { children: children });
|
|
1128
1136
|
}
|
|
1137
|
+
const onNavigateCallbacks = [];
|
|
1138
|
+
function useOnNavigate(callback) {
|
|
1139
|
+
useEffect(() => {
|
|
1140
|
+
if (!callback)
|
|
1141
|
+
return;
|
|
1142
|
+
onNavigateCallbacks.push(callback);
|
|
1143
|
+
return () => {
|
|
1144
|
+
onNavigateCallbacks.splice(onNavigateCallbacks.indexOf(callback), 1);
|
|
1145
|
+
};
|
|
1146
|
+
}, [callback]);
|
|
1147
|
+
return (href, options) => {
|
|
1148
|
+
onNavigateCallbacks.forEach(cb => cb(href, options));
|
|
1149
|
+
};
|
|
1150
|
+
}
|
|
1129
1151
|
function useNavigate() {
|
|
1130
1152
|
const [state] = useGlobalState('routing');
|
|
1153
|
+
const trigger = useOnNavigate();
|
|
1131
1154
|
if (!state) {
|
|
1132
1155
|
throw new Error('RouteProvider not found');
|
|
1133
1156
|
}
|
|
1134
1157
|
return (href, options) => {
|
|
1158
|
+
trigger(href, options);
|
|
1135
1159
|
if (href.toLowerCase().startsWith('http')) {
|
|
1136
1160
|
return (window.location.href = href);
|
|
1137
1161
|
}
|
|
@@ -1139,7 +1163,7 @@ function useNavigate() {
|
|
|
1139
1163
|
};
|
|
1140
1164
|
}
|
|
1141
1165
|
|
|
1142
|
-
var styles$
|
|
1166
|
+
var styles$U = {"link":"link-module-xLqBn","primary":"link-module-bGD6u","secondary":"link-module-v31wH","has-underline":"link-module-UuCEp"};
|
|
1143
1167
|
|
|
1144
1168
|
function Link({ children, className, color = 'primary', hasUnderline, onClick: _onClick, ...props }) {
|
|
1145
1169
|
function onClick(e) {
|
|
@@ -1148,7 +1172,7 @@ function Link({ children, className, color = 'primary', hasUnderline, onClick: _
|
|
|
1148
1172
|
return;
|
|
1149
1173
|
e.preventDefault();
|
|
1150
1174
|
}
|
|
1151
|
-
return (jsx(Link$1, { className: clsx({ [styles$
|
|
1175
|
+
return (jsx(Link$1, { className: clsx({ [styles$U['has-underline']]: hasUnderline }, styles$U['link'], styles$U[color], className),
|
|
1152
1176
|
// Workaround for adobe/react-spectrum #963
|
|
1153
1177
|
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
|
1154
1178
|
// @ts-ignore
|
|
@@ -1247,24 +1271,24 @@ function SolidHomeIcon(props) {
|
|
|
1247
1271
|
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" }) }));
|
|
1248
1272
|
}
|
|
1249
1273
|
|
|
1250
|
-
var styles$
|
|
1274
|
+
var styles$T = {"breadcrumbs":"breadcrumb-module-CQGse","breadcrumb":"breadcrumb-module-hxhDY","link":"breadcrumb-module-fp2Q6","icon":"breadcrumb-module-uIn3w","previous-icon":"breadcrumb-module-K-wMJ"};
|
|
1251
1275
|
|
|
1252
1276
|
function BreadcrumbShort({ links }) {
|
|
1253
1277
|
const homeLink = links[0];
|
|
1254
1278
|
const previousLink = links[links.length - 2];
|
|
1255
1279
|
const isHomeLink = previousLink === undefined || previousLink === homeLink;
|
|
1256
1280
|
const href = previousLink?.href || homeLink?.href;
|
|
1257
|
-
return (jsx(Breadcrumbs, { className: styles$
|
|
1281
|
+
return (jsx(Breadcrumbs, { className: styles$T.breadcrumbs, children: jsx(Breadcrumb$1, { className: styles$T.breadcrumb, children: jsxs(RouteLink, { className: styles$T.link, href: href, isDisabled: false, children: [jsx(GlyphsChevronsSlimLeftIcon, { className: styles$T.icon }), isHomeLink ? (jsx(SolidHomeIcon, { className: styles$T.icon })) : (jsx("span", { children: previousLink.label }))] }) }) }));
|
|
1258
1282
|
}
|
|
1259
1283
|
function BreadcrumbLongItem({ index, isDisabled, link, }) {
|
|
1260
|
-
return (jsx(Breadcrumb$1, { className: styles$
|
|
1284
|
+
return (jsx(Breadcrumb$1, { className: styles$T.breadcrumb, children: jsxs(RouteLink, { className: styles$T.link, color: "secondary", href: link.href, isDisabled: isDisabled, children: [jsx(GlyphsChevronsSlimLeftIcon, { className: clsx(styles$T['previous-icon'], styles$T.icon) }), link.label] }) }, index));
|
|
1261
1285
|
}
|
|
1262
1286
|
function BreadcrumbLong({ links }) {
|
|
1263
1287
|
const linksWithoutFirst = links.slice(1);
|
|
1264
1288
|
const homeLink = links[0];
|
|
1265
1289
|
if (!homeLink)
|
|
1266
1290
|
return null;
|
|
1267
|
-
return (jsxs(Breadcrumbs, { className: styles$
|
|
1291
|
+
return (jsxs(Breadcrumbs, { className: styles$T.breadcrumbs, children: [jsx(Breadcrumb$1, { className: styles$T.breadcrumb, children: jsx(RouteLink, { className: styles$T.link, href: homeLink.href, children: jsx(SolidHomeIcon, { className: clsx(styles$T['home-icon'], styles$T.icon) }) }) }), linksWithoutFirst.map((link, index) => (jsx(BreadcrumbLongItem, { index: index, isDisabled: linksWithoutFirst.length - 1 === index, link: link }, index)))] }));
|
|
1268
1292
|
}
|
|
1269
1293
|
function Breadcrumb({ links }) {
|
|
1270
1294
|
const { lg } = useBreakpoint();
|
|
@@ -1273,10 +1297,10 @@ function Breadcrumb({ links }) {
|
|
|
1273
1297
|
return lg ? BreadcrumbLong({ links }) : BreadcrumbShort({ links });
|
|
1274
1298
|
}
|
|
1275
1299
|
|
|
1276
|
-
var styles$
|
|
1300
|
+
var styles$S = {"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"};
|
|
1277
1301
|
|
|
1278
1302
|
function IconButton({ children, className, color = 'primary', isDisabled, onPress, size = 'md', type = 'button', }) {
|
|
1279
|
-
return (jsx(Button$1, { className: clsx(styles$
|
|
1303
|
+
return (jsx(Button$1, { className: clsx(styles$S['icon-button'], styles$S[size], styles$S[color], className), isDisabled: isDisabled,
|
|
1280
1304
|
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
|
1281
1305
|
// @ts-expect-error
|
|
1282
1306
|
onClick: e => e.preventDefault(), onPress: onPress, type: type, children: children }));
|
|
@@ -1290,21 +1314,21 @@ function StrokeFavoriteIcon(props) {
|
|
|
1290
1314
|
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" }) }));
|
|
1291
1315
|
}
|
|
1292
1316
|
|
|
1293
|
-
var styles$
|
|
1317
|
+
var styles$R = {"favorite-button":"favorite-button-module-tXSS3","is-favorite":"favorite-button-module-l557q","favorite-on":"favorite-button-module-6Tsmy","favorite-off":"favorite-button-module-LQauU"};
|
|
1294
1318
|
|
|
1295
1319
|
function FavoriteButton({ isDisabled, isFavorite, onPress, }) {
|
|
1296
|
-
return (jsx(IconButton, { className: clsx(styles$
|
|
1297
|
-
[styles$
|
|
1320
|
+
return (jsx(IconButton, { className: clsx(styles$R['favorite-button'], {
|
|
1321
|
+
[styles$R['is-favorite']]: isFavorite,
|
|
1298
1322
|
}), color: "secondary", isDisabled: isDisabled, onPress: onPress, children: isFavorite ? jsx(SolidFavoriteIcon, {}) : jsx(StrokeFavoriteIcon, {}) }));
|
|
1299
1323
|
}
|
|
1300
1324
|
|
|
1301
|
-
var styles$
|
|
1325
|
+
var styles$Q = {"field-error":"field-error-module-FXnIg"};
|
|
1302
1326
|
|
|
1303
1327
|
function FieldError({ children }) {
|
|
1304
|
-
return (jsx(FieldError$1, { className: styles$
|
|
1328
|
+
return (jsx(FieldError$1, { className: styles$Q['field-error'], children: children }));
|
|
1305
1329
|
}
|
|
1306
1330
|
|
|
1307
|
-
var styles$
|
|
1331
|
+
var styles$P = {"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"};
|
|
1308
1332
|
|
|
1309
1333
|
/**
|
|
1310
1334
|
* This component is used to create an input that grows as the user types.
|
|
@@ -1320,20 +1344,20 @@ const Input = forwardRef(({ _pseudo = 'none', autoGrow, size = 'lg', ...inputPro
|
|
|
1320
1344
|
? onChange?.(event)
|
|
1321
1345
|
: setUncontrolledValue(event.target.value);
|
|
1322
1346
|
const { pressProps } = usePress({});
|
|
1323
|
-
return (jsx("div", { className: clsx(styles$
|
|
1347
|
+
return (jsx("div", { className: clsx(styles$P['input-container'], styles$P[size], styles$P[_pseudo]), children: jsxs("div", { className: clsx({ [styles$P['growing-input']]: autoGrow }), children: [jsx(Input$1, { size: autoGrow ? 1 : undefined, ...props, ...pressProps, ref: ref, onChange: handleChange, onClick: e => {
|
|
1324
1348
|
e.preventDefault();
|
|
1325
1349
|
e.stopPropagation();
|
|
1326
1350
|
e.target.focus();
|
|
1327
|
-
} }), autoGrow && jsx("span", { className: styles$
|
|
1351
|
+
} }), autoGrow && jsx("span", { className: styles$P['shadow-input'], children: value })] }) }));
|
|
1328
1352
|
});
|
|
1329
1353
|
Input.displayName = 'Input';
|
|
1330
1354
|
|
|
1331
|
-
var styles$
|
|
1355
|
+
var styles$O = {"label":"label-module-LGfJt","required":"label-module-oTWaS"};
|
|
1332
1356
|
|
|
1333
1357
|
function Label({ children, isRequired }) {
|
|
1334
1358
|
if (!children)
|
|
1335
1359
|
return null;
|
|
1336
|
-
return (jsxs(Label$1, { className: styles$
|
|
1360
|
+
return (jsxs(Label$1, { className: styles$O.label, children: [children, isRequired && jsx("span", { className: styles$O.required, children: "*" })] }));
|
|
1337
1361
|
}
|
|
1338
1362
|
|
|
1339
1363
|
function StrokeCollapseIcon(props) {
|
|
@@ -1348,7 +1372,7 @@ function StrokeTrashIcon(props) {
|
|
|
1348
1372
|
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" }) }));
|
|
1349
1373
|
}
|
|
1350
1374
|
|
|
1351
|
-
var styles$
|
|
1375
|
+
var styles$N = {"field":"number-field-module-gmnog","button-input-container":"number-field-module-8Lvgh","zoom-in-text":"number-field-module-OlEoa"};
|
|
1352
1376
|
|
|
1353
1377
|
/**
|
|
1354
1378
|
* This component is used to create a number field.
|
|
@@ -1356,7 +1380,7 @@ var styles$M = {"field":"number-field-module-gmnog","button-input-container":"nu
|
|
|
1356
1380
|
*/
|
|
1357
1381
|
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, }) {
|
|
1358
1382
|
const inputRef = useRef(null);
|
|
1359
|
-
return (jsxs(NumberField$1, { "aria-label": label, autoFocus: autoFocus, className: clsx(styles$
|
|
1383
|
+
return (jsxs(NumberField$1, { "aria-label": label, autoFocus: autoFocus, className: clsx(styles$N.field, styles$N[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$N['button-input-container'], children: [withButtons && (jsx(Button$1, { isDisabled: isDisabled,
|
|
1360
1384
|
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
|
1361
1385
|
// @ts-expect-error
|
|
1362
1386
|
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,
|
|
@@ -1369,7 +1393,7 @@ function SolidCartIcon(props) {
|
|
|
1369
1393
|
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" }) }));
|
|
1370
1394
|
}
|
|
1371
1395
|
|
|
1372
|
-
var styles$
|
|
1396
|
+
var styles$M = {"manual-input-container":"add-to-cart-button-module-AWFvQ","left-button-spacer":"add-to-cart-button-module-SS7WM"};
|
|
1373
1397
|
|
|
1374
1398
|
function AddToCartButton({ initialState = 'initial', isDisabled = false, onChange, quantity, }) {
|
|
1375
1399
|
const [currentState, setState] = useState(initialState);
|
|
@@ -1457,7 +1481,7 @@ function ManualInputState({ isDisabled, onCancel, onConfirm, quantity, }) {
|
|
|
1457
1481
|
e.key === 'Enter' && onConfirm(ensureNumber(updatedQuantity));
|
|
1458
1482
|
e.key === 'Escape' && onCancel();
|
|
1459
1483
|
};
|
|
1460
|
-
return (jsxs("div", { className: styles$
|
|
1484
|
+
return (jsxs("div", { className: styles$M['manual-input-container'], children: [jsx("div", { className: styles$M['left-button-spacer'] }), jsx(NumberField, { autoFocus: true, autoGrow: true, defaultValue: quantity ? ensureNumber(quantity) : undefined, formatOptions: {
|
|
1461
1485
|
maximumFractionDigits: 0,
|
|
1462
1486
|
style: 'decimal',
|
|
1463
1487
|
useGrouping: false,
|
|
@@ -1507,12 +1531,12 @@ const ConnectedAddToCartButton = ({ onAddToCart, productId }) => {
|
|
|
1507
1531
|
return (jsx(AddToCartButton, { isDisabled: isPendingDeleteCartLine || isLoadingCartLines || isPendingAddToCart, onChange: handleChange, quantity: quantity }));
|
|
1508
1532
|
};
|
|
1509
1533
|
|
|
1510
|
-
var styles$
|
|
1534
|
+
var styles$L = {"tag":"tag-module-B7r15","body":"tag-module-4cfCf","shape":"tag-module-c7CRb"};
|
|
1511
1535
|
|
|
1512
1536
|
function Tag({ children }) {
|
|
1513
1537
|
if (!children)
|
|
1514
1538
|
return null;
|
|
1515
|
-
return (jsxs("div", { className: styles$
|
|
1539
|
+
return (jsxs("div", { className: styles$L.tag, children: [jsx("div", { className: styles$L.body, children: children }), jsx("svg", { className: styles$L.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" }) })] }));
|
|
1516
1540
|
}
|
|
1517
1541
|
|
|
1518
1542
|
const IntlContext = createContext({
|
|
@@ -1548,7 +1572,7 @@ function useFormattedMessage() {
|
|
|
1548
1572
|
|
|
1549
1573
|
const FormattedMessage = ({ fallbackValue, id, optional, replacementValues, }) => useFormattedMessage()(id, { fallbackValue, optional, replacementValues });
|
|
1550
1574
|
|
|
1551
|
-
var styles$
|
|
1575
|
+
var styles$K = {"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"};
|
|
1552
1576
|
|
|
1553
1577
|
const formatPrice = (price) => new Intl.NumberFormat('en-US', {
|
|
1554
1578
|
maximumFractionDigits: 2,
|
|
@@ -1561,22 +1585,22 @@ function ProductPrice({ className, isVatIncluded, originalPrice, price, }) {
|
|
|
1561
1585
|
const priceWithCurrency = formatPrice(price);
|
|
1562
1586
|
const [wholes, decimals] = priceWithCurrency.split('.');
|
|
1563
1587
|
const showOriginalPrice = priceWithCurrency !== originalPriceWithCurrency;
|
|
1564
|
-
return (jsxs("div", { className: clsx(className, styles$
|
|
1565
|
-
[styles$
|
|
1566
|
-
}), children: originalPriceWithCurrency }), jsxs("div", { className: styles$
|
|
1588
|
+
return (jsxs("div", { className: clsx(className, styles$K['product-price']), children: [jsx("span", { className: clsx(styles$K['original-price'], {
|
|
1589
|
+
[styles$K['is-hidden']]: !showOriginalPrice,
|
|
1590
|
+
}), children: originalPriceWithCurrency }), jsxs("div", { className: styles$K['current-price-wrapper'], children: [jsxs("div", { className: styles$K['current-price'], children: [jsx("span", { className: styles$K.wholes, children: wholes }), jsx("span", { className: styles$K.dot, children: "." }), jsx("span", { className: styles$K.decimals, children: decimals })] }), jsx("span", { className: styles$K.vat, children: isVatIncluded ? (jsx(FormattedMessage, { id: "Incl. VAT" })) : (jsx(FormattedMessage, { id: "Excl. VAT" })) })] })] }));
|
|
1567
1591
|
}
|
|
1568
1592
|
|
|
1569
|
-
var styles$
|
|
1593
|
+
var styles$J = {"product-sku":"product-sku-module-ITb8x"};
|
|
1570
1594
|
|
|
1571
1595
|
function ProductSku({ sku }) {
|
|
1572
|
-
return (jsx("p", { className: styles$
|
|
1596
|
+
return (jsx("p", { className: styles$J['product-sku'], "data-test-selector": "productNumber", children: sku }));
|
|
1573
1597
|
}
|
|
1574
1598
|
|
|
1575
1599
|
function isResponsiveImage(image) {
|
|
1576
1600
|
return Boolean(image.lg);
|
|
1577
1601
|
}
|
|
1578
1602
|
|
|
1579
|
-
var styles$
|
|
1603
|
+
var styles$I = {"image":"image-module-lg7Kj","contain":"image-module-KFEgG","cover":"image-module-tVKFe","has-error":"image-module-LM93B","picture":"image-module-pNYjR"};
|
|
1580
1604
|
|
|
1581
1605
|
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, }) {
|
|
1582
1606
|
const [hasError, setHasError] = useState(false);
|
|
@@ -1603,22 +1627,22 @@ function ImageComponent({ className, fallbackSrc, fit = 'cover', hasError, image
|
|
|
1603
1627
|
const srcSet = !hasError
|
|
1604
1628
|
? `${image[1]} 1x, ${image[2]} 2x, ${image[3]} 3x`
|
|
1605
1629
|
: undefined;
|
|
1606
|
-
return (jsx("img", { alt: image.altText, className: clsx(styles$
|
|
1607
|
-
[styles$
|
|
1630
|
+
return (jsx("img", { alt: image.altText, className: clsx(styles$I.image, className, styles$I[fit], {
|
|
1631
|
+
[styles$I['has-error']]: hasError,
|
|
1608
1632
|
}), src: !hasError ? image[3] : fallbackSrc, srcSet: srcSet, ...rest }));
|
|
1609
1633
|
}
|
|
1610
1634
|
function PictureComponent({ className, fallbackSrc, fit = 'cover', hasError, image, ...rest }) {
|
|
1611
1635
|
if (!isResponsiveImage(image))
|
|
1612
1636
|
return null;
|
|
1613
|
-
return (jsxs("picture", { className: clsx(styles$
|
|
1614
|
-
[styles$
|
|
1637
|
+
return (jsxs("picture", { className: clsx(styles$I.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$I[fit], {
|
|
1638
|
+
[styles$I['has-error']]: hasError,
|
|
1615
1639
|
}), src: !hasError ? image.lg[3] : fallbackSrc, ...rest })] }));
|
|
1616
1640
|
}
|
|
1617
1641
|
|
|
1618
|
-
var styles$
|
|
1642
|
+
var styles$H = {"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"};
|
|
1619
1643
|
|
|
1620
1644
|
function ProductCard({ addToCartButton: AddToCartButton, areaSelected, favoriteButton: FavoriteButton, href, id, image, onClick, onMouseDown, onMouseMove, onPress, price, role, sku, tags, title, }) {
|
|
1621
|
-
return (jsxs(RouteLink, { "aria-selected": areaSelected, className: styles$
|
|
1645
|
+
return (jsxs(RouteLink, { "aria-selected": areaSelected, className: styles$H['product-card'], "data-product-id": sku, href: href, id: id, onClick: onClick, onMouseDown: onMouseDown, onMouseMove: onMouseMove, onPress: onPress, role: role, children: [jsx("div", { className: styles$H.image, children: jsx(Image, { ...image }) }), jsx("div", { className: styles$H['favorite-button'], children: FavoriteButton && FavoriteButton }), jsxs("div", { className: styles$H.content, children: [jsxs("div", { className: styles$H.top, children: [jsx("div", { className: styles$H.tag, children: tags?.map(tag => (jsx(Tag, { children: jsx(FormattedMessage, { optional: true, fallbackValue: tag, id: `tag.${tag.toLowerCase()}` }) }, tag))) }), jsx("h2", { className: styles$H.title, children: title }), jsx(ProductSku, { sku: sku })] }), jsxs("div", { className: styles$H.bottom, children: [jsx("div", { className: styles$H.price, children: jsx(ProductPrice, { isVatIncluded: price.isVatIncluded, originalPrice: price.originalPrice, price: price.price }) }), jsx("div", { className: styles$H['add-to-cart-button'], children: AddToCartButton })] })] })] }));
|
|
1622
1646
|
}
|
|
1623
1647
|
|
|
1624
1648
|
/**
|
|
@@ -6933,7 +6957,7 @@ function GlyphsArrowBoldCapsLeftIcon(props) {
|
|
|
6933
6957
|
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)" }) }));
|
|
6934
6958
|
}
|
|
6935
6959
|
|
|
6936
|
-
var styles$
|
|
6960
|
+
var styles$G = {"carousel":"carousel-module-ealh-","swiper":"carousel-module-IftbN","is-ready":"carousel-module-RCpfc","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"};
|
|
6937
6961
|
|
|
6938
6962
|
function CarouselNavigationButton({ direction, isDisabled = false, }) {
|
|
6939
6963
|
const swiper = useSwiper();
|
|
@@ -6945,8 +6969,8 @@ function CarouselNavigationButton({ direction, isDisabled = false, }) {
|
|
|
6945
6969
|
swiper.slidePrev();
|
|
6946
6970
|
}
|
|
6947
6971
|
}
|
|
6948
|
-
return (jsx(Button$1, { className: clsx(styles$
|
|
6949
|
-
[styles$
|
|
6972
|
+
return (jsx(Button$1, { className: clsx(styles$G['navigation-button'], {
|
|
6973
|
+
[styles$G['is-locked']]: swiper.isLocked,
|
|
6950
6974
|
}), isDisabled: isDisabled, onPress: handleNavigation, children: direction === 'previous' ? (jsx(GlyphsArrowBoldCapsLeftIcon, {})) : (jsx(GlyphsArrowBoldCapsRightIcon, {})) }));
|
|
6951
6975
|
}
|
|
6952
6976
|
|
|
@@ -6963,29 +6987,29 @@ function Carousel({ breakpoints, className, hasNavigation = true, hasOverflow =
|
|
|
6963
6987
|
}
|
|
6964
6988
|
if (slides.length === 0)
|
|
6965
6989
|
return null;
|
|
6966
|
-
return (jsx("div", { className: clsx(styles$
|
|
6967
|
-
[styles$
|
|
6968
|
-
[styles$
|
|
6969
|
-
[styles$
|
|
6990
|
+
return (jsx("div", { className: clsx(styles$G.carousel, className), children: jsxs(Swiper, { breakpoints: breakpoints, className: clsx(styles$G.swiper, {
|
|
6991
|
+
[styles$G['is-dragging']]: isDragging,
|
|
6992
|
+
[styles$G['has-overflow']]: hasOverflow,
|
|
6993
|
+
[styles$G['is-ready']]: isReady,
|
|
6970
6994
|
}), freeMode: {
|
|
6971
6995
|
enabled: true,
|
|
6972
6996
|
sticky: true,
|
|
6973
|
-
}, modules: [freeMode], onReachBeginning: () => setIsBeginning(true), onReachEnd: () => setIsEnd(true), onResize: swiper =>
|
|
6997
|
+
}, modules: [freeMode], onReachBeginning: () => setIsBeginning(true), onReachEnd: () => setIsEnd(true), onResize: swiper => handleSlideChange(swiper), onSlideChange: swiper => handleSlideChange(swiper), onSliderMove: () => setIsDragging(true), onSlidesUpdated: () => {
|
|
6974
6998
|
if (!isReady)
|
|
6975
6999
|
setIsReady(true);
|
|
6976
|
-
}, onSwiper: swiper => handleSlideChange(swiper), onTouchEnd: () => setIsDragging(false), onUpdate: swiper => handleSlideChange(swiper), slidesPerView: slidesPerView, spaceBetween: spaceBetween, children: [slides.map((slide, index) => (jsx(SwiperSlide, { className: clsx(styles$
|
|
7000
|
+
}, onSwiper: swiper => handleSlideChange(swiper), onTouchEnd: () => setIsDragging(false), onUpdate: swiper => handleSlideChange(swiper), slidesPerGroupAuto: true, slidesPerView: slidesPerView, spaceBetween: spaceBetween, children: [slides.map((slide, index) => (jsx(SwiperSlide, { className: clsx(styles$G.slide, slideClasses), children: slide }, index))), hasNavigation && isLocked === false && (jsxs("div", { className: clsx(styles$G['navigation-buttons'], styles$G[navigationButtonsPosition]), children: [jsx("div", { className: clsx(styles$G['navigation-button-wrapper'], styles$G['navigation-button-prev']), children: jsx(CarouselNavigationButton, { direction: "previous", isDisabled: isBeginning }) }), jsx("div", { className: clsx(styles$G['navigation-button-wrapper'], styles$G['navigation-button-next']), children: jsx(CarouselNavigationButton, { direction: "next", isDisabled: isEnd }) })] }))] }) }));
|
|
6977
7001
|
}
|
|
6978
7002
|
|
|
6979
|
-
var styles$
|
|
7003
|
+
var styles$F = {"slide":"category-carousel-module-muLq-"};
|
|
6980
7004
|
|
|
6981
7005
|
function CategoryCarousel({ categoryCards }) {
|
|
6982
|
-
return jsx(Carousel, { slideClasses: styles$
|
|
7006
|
+
return jsx(Carousel, { slideClasses: styles$F.slide, slides: categoryCards });
|
|
6983
7007
|
}
|
|
6984
7008
|
|
|
6985
|
-
var styles$
|
|
7009
|
+
var styles$E = {"accordion":"accordion-module-9WvAH","white":"accordion-module-CaVdG","accordion-item":"accordion-module-lf9d-","lg":"accordion-module-0qnae","with-seperators":"accordion-module-yOLrW","border-top":"accordion-module-J1-Eb","border-bottom":"accordion-module-4LI1K","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"};
|
|
6986
7010
|
|
|
6987
7011
|
function Accordion({ borderPosition = 'bottom', children, color = 'black', hasLineSeparator = true, indented, size = 'md', }) {
|
|
6988
|
-
return (jsx("div", { className: clsx({ [styles$
|
|
7012
|
+
return (jsx("div", { className: clsx({ [styles$E.indented]: indented }, styles$E.accordion, styles$E[color], styles$E[size], styles$E[`border-${borderPosition}`], hasLineSeparator && styles$E['with-seperators']), children: children &&
|
|
6989
7013
|
Children.map(children, child => {
|
|
6990
7014
|
return cloneElement(child, { size });
|
|
6991
7015
|
}) }));
|
|
@@ -6995,7 +7019,7 @@ function GlyphsChevronsSlimDownIcon(props) {
|
|
|
6995
7019
|
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" }) }));
|
|
6996
7020
|
}
|
|
6997
7021
|
|
|
6998
|
-
var styles$
|
|
7022
|
+
var styles$D = {"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"};
|
|
6999
7023
|
|
|
7000
7024
|
const ShowAll = ({ children, hasTransparency = true, initialHeight = 0, isOpen, onToggle, }) => {
|
|
7001
7025
|
const showAllRef = useRef(null);
|
|
@@ -7004,14 +7028,14 @@ const ShowAll = ({ children, hasTransparency = true, initialHeight = 0, isOpen,
|
|
|
7004
7028
|
return;
|
|
7005
7029
|
showAllRef.current.style.setProperty('--initital-height', `${initialHeight}px`);
|
|
7006
7030
|
}, [initialHeight]);
|
|
7007
|
-
return (jsxs("div", { ref: showAllRef, className: clsx(styles$
|
|
7008
|
-
[styles$
|
|
7009
|
-
}), children: [jsx("div", { className: styles$
|
|
7010
|
-
[styles$
|
|
7011
|
-
}), children: children }) }), jsxs(RouteLink, { className: styles$
|
|
7031
|
+
return (jsxs("div", { ref: showAllRef, className: clsx(styles$D['show-all'], {
|
|
7032
|
+
[styles$D['is-open']]: isOpen,
|
|
7033
|
+
}), children: [jsx("div", { className: styles$D.panel, children: jsx("div", { className: clsx(styles$D.content, {
|
|
7034
|
+
[styles$D['has-transparency']]: hasTransparency,
|
|
7035
|
+
}), children: children }) }), jsxs(RouteLink, { className: styles$D.button, color: "secondary", onPress: () => onToggle(!isOpen), children: [jsx(GlyphsChevronsSlimDownIcon, { className: styles$D.icon }), isOpen ? (jsx(FormattedMessage, { id: "Show less" })) : (jsx(FormattedMessage, { id: "Show all" }))] })] }));
|
|
7012
7036
|
};
|
|
7013
7037
|
|
|
7014
|
-
var styles$
|
|
7038
|
+
var styles$C = {"multi-select":"multi-select-module-DC7Ix","filter-items":"multi-select-module-cwVFb","hidden":"multi-select-module-o7yHU","filter-item":"multi-select-module-OW-NK"};
|
|
7015
7039
|
|
|
7016
7040
|
function MultiSelect({ amountShown = 3, onChange, options, render, }) {
|
|
7017
7041
|
const shownOptions = options.slice(0, amountShown);
|
|
@@ -7022,28 +7046,28 @@ function MultiSelect({ amountShown = 3, onChange, options, render, }) {
|
|
|
7022
7046
|
options.filter(option => option.isSelected).length === 0) {
|
|
7023
7047
|
return null;
|
|
7024
7048
|
}
|
|
7025
|
-
return (jsxs("div", { className: styles$
|
|
7049
|
+
return (jsxs("div", { className: styles$C['multi-select'], children: [jsx("div", { className: styles$C['filter-items'], children: shownOptions
|
|
7026
7050
|
.concat(isOpen ? [] : hiddenSelectedOptions)
|
|
7027
|
-
.map(option => (jsxs("div", { className: styles$
|
|
7051
|
+
.map(option => (jsxs("div", { className: styles$C['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$C['filter-items'], styles$C['hidden']), children: hiddenOptions.map(option => (jsxs("div", { className: styles$C['filter-item'], children: [render({ onChange: () => onChange(option), option }), jsxs("span", { children: ["(", option.amount, ")"] })] }, option.value))) }) }))] }));
|
|
7028
7052
|
}
|
|
7029
7053
|
|
|
7030
|
-
var styles$
|
|
7054
|
+
var styles$B = {"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"};
|
|
7031
7055
|
|
|
7032
7056
|
function Checkbox({ _pseudo = 'none', children, className, isDisabled, isSelected, onChange, value, }) {
|
|
7033
|
-
return (jsxs(Checkbox$1, { className: clsx(className, styles$
|
|
7057
|
+
return (jsxs(Checkbox$1, { className: clsx(className, styles$B.checkbox, styles$B[_pseudo]), isDisabled: isDisabled, isSelected: isSelected, onChange: onChange, value: value, children: [jsx("div", { className: styles$B.box, children: jsx("svg", { "aria-hidden": "true", className: styles$B.checkmark, viewBox: "0 0 18 18", children: jsx("polyline", { points: "1 9 7 14 15 4" }) }) }), children] }));
|
|
7034
7058
|
}
|
|
7035
7059
|
|
|
7036
7060
|
function ColorCheckbox({ _pseudo = 'none', children, className, color, isDisabled, isSelected, onChange, value, }) {
|
|
7037
|
-
return (jsxs(Checkbox$1, { className: clsx(className, styles$
|
|
7061
|
+
return (jsxs(Checkbox$1, { className: clsx(className, styles$B.checkbox, styles$B['color-checkbox'], styles$B[_pseudo]), isDisabled: isDisabled, isSelected: isSelected, onChange: onChange, style: {
|
|
7038
7062
|
'--selected-color': color,
|
|
7039
|
-
}, value: value, children: [jsx("div", { className: styles$
|
|
7063
|
+
}, value: value, children: [jsx("div", { className: styles$B.box }), children] }));
|
|
7040
7064
|
}
|
|
7041
7065
|
|
|
7042
7066
|
function StrokeCheckmarkIcon(props) {
|
|
7043
7067
|
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" }) }));
|
|
7044
7068
|
}
|
|
7045
7069
|
|
|
7046
|
-
var styles$
|
|
7070
|
+
var styles$A = {"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"};
|
|
7047
7071
|
|
|
7048
7072
|
function Select({ isDisabled = false, label, onChange, options, placeholder, selectedOption, showLabel = true, size = 'md', variant = 'outline', }) {
|
|
7049
7073
|
const selectRef = useRef(null);
|
|
@@ -7060,12 +7084,12 @@ function Select({ isDisabled = false, label, onChange, options, placeholder, sel
|
|
|
7060
7084
|
window.addEventListener('resize', updateWidth);
|
|
7061
7085
|
return () => window.removeEventListener('resize', updateWidth);
|
|
7062
7086
|
}, []);
|
|
7063
|
-
return (jsxs(Select$1, { ref: selectRef, "aria-label": label, className: clsx(styles$
|
|
7087
|
+
return (jsxs(Select$1, { ref: selectRef, "aria-label": label, className: clsx(styles$A.select, styles$A[size], styles$A[variant]), isDisabled: isDisabled, onSelectionChange: selected => onChange(selected), placeholder: placeholder || label, selectedKey: String(selectedOption), children: [showLabel && jsx(Label, { children: label }), jsxs(Button$1, { className: styles$A.button, children: [jsx(SelectValue, {}), jsx(GlyphsChevronsSlimDownIcon, { "aria-hidden": "true", className: styles$A.chevron })] }), jsx(Popover, { ref: ref =>
|
|
7064
7088
|
// Workaround for react/react-aria #1513
|
|
7065
|
-
ref?.addEventListener('touchend', e => e.preventDefault()), className: clsx(styles$
|
|
7089
|
+
ref?.addEventListener('touchend', e => e.preventDefault()), className: clsx(styles$A.popover, styles$A[variant]), placement: "bottom left", triggerRef: selectRef, children: jsx(ListBox, { className: styles$A.listbox, children: jsxs(Section, { children: [jsx(Header, { className: styles$A.header, children: placeholder || label }), Object.entries(options).map(([key, value]) => (jsxs(ListBoxItem, { "aria-label": value, className: styles$A.item, id: key, textValue: value, children: [selectedOption === key && (jsx("span", { slot: "description", children: jsx(StrokeCheckmarkIcon, { className: styles$A.check }) })), jsx("span", { slot: "label", children: value })] }, key)))] }) }) })] }));
|
|
7066
7090
|
}
|
|
7067
7091
|
|
|
7068
|
-
var styles$
|
|
7092
|
+
var styles$z = {"input-container":"textarea-module-C6Xr1","lg":"textarea-module-vksG-","md":"textarea-module-6JrQJ"};
|
|
7069
7093
|
|
|
7070
7094
|
/**
|
|
7071
7095
|
* This component is used to create a textarea that can grow as the user types.
|
|
@@ -7100,7 +7124,7 @@ const TextArea = forwardRef(({ autoGrow, size, ...textAreaProps }, _ref) => {
|
|
|
7100
7124
|
}
|
|
7101
7125
|
updateHeight();
|
|
7102
7126
|
}, [ref, autoGrow, updateHeight, size]);
|
|
7103
|
-
return (jsx("div", { className: styles$
|
|
7127
|
+
return (jsx("div", { className: styles$z['input-container'], children: jsx(TextArea$1, { ...textAreaProps, ref: node => {
|
|
7104
7128
|
ref.current =
|
|
7105
7129
|
node;
|
|
7106
7130
|
textAreaRef.current = node;
|
|
@@ -7111,7 +7135,7 @@ const TextArea = forwardRef(({ autoGrow, size, ...textAreaProps }, _ref) => {
|
|
|
7111
7135
|
});
|
|
7112
7136
|
TextArea.displayName = 'TextArea';
|
|
7113
7137
|
|
|
7114
|
-
var styles$
|
|
7138
|
+
var styles$y = {"field":"text-field-module-JeaK0"};
|
|
7115
7139
|
|
|
7116
7140
|
/**
|
|
7117
7141
|
* This component is used to create a text field.
|
|
@@ -7119,7 +7143,7 @@ var styles$x = {"field":"text-field-module-JeaK0"};
|
|
|
7119
7143
|
* This field can also grow when a user types in text.
|
|
7120
7144
|
*/
|
|
7121
7145
|
function TextField({ autoFocus, autoGrow, defaultValue, isDisabled, isInvalid, isMultiline, isReadOnly, isRequired, label, maxLength, name, onChange, onInput, onKeyUp, placeholder, rows, showLabel = false, size = 'lg', value, }) {
|
|
7122
|
-
return (jsxs(TextField$1, { "aria-label": label, autoFocus: autoFocus, className: clsx(styles$
|
|
7146
|
+
return (jsxs(TextField$1, { "aria-label": label, autoFocus: autoFocus, className: clsx(styles$y.field, styles$y[size]), defaultValue: defaultValue, isDisabled: isDisabled, isInvalid: isInvalid, isReadOnly: isReadOnly, isRequired: isRequired, maxLength: maxLength, name: name, onChange: value => {
|
|
7123
7147
|
onChange?.(value);
|
|
7124
7148
|
}, 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, {})] }));
|
|
7125
7149
|
}
|
|
@@ -7129,31 +7153,31 @@ function IntlProvider({ children, formatMessage, languageCode: _languageCode, })
|
|
|
7129
7153
|
return (jsx(IntlContext.Provider, { value: { formatMessage, languageCode, updateLanguageCode }, children: children }));
|
|
7130
7154
|
}
|
|
7131
7155
|
|
|
7132
|
-
var styles$
|
|
7156
|
+
var styles$x = {"progress-circle":"progress-circle-module-4nweP","spin":"progress-circle-module-kCf7K"};
|
|
7133
7157
|
|
|
7134
7158
|
function ProgressCircle({ className }) {
|
|
7135
|
-
return (jsxs("svg", { className: clsx(styles$
|
|
7159
|
+
return (jsxs("svg", { className: clsx(styles$x['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" }) })] }));
|
|
7136
7160
|
}
|
|
7137
7161
|
|
|
7138
|
-
var styles$
|
|
7162
|
+
var styles$w = {"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"};
|
|
7139
7163
|
|
|
7140
7164
|
function ProductOverviewGrid({ children, isLoading, }) {
|
|
7141
|
-
return (jsxs("div", { className: styles$
|
|
7165
|
+
return (jsxs("div", { className: styles$w['product-grid'], children: [Children.map(children, (child, index) => (jsx("div", { className: styles$w['grid-item'], children: child }, index))), isLoading && (jsx("div", { className: styles$w['loading-panel'], children: jsx(ProgressCircle, { className: styles$w['progress-circle'] }) }))] }));
|
|
7142
7166
|
}
|
|
7143
7167
|
|
|
7144
|
-
var styles$
|
|
7168
|
+
var styles$v = {"loading-overlay":"loading-overlay-module-L67Gy"};
|
|
7145
7169
|
|
|
7146
7170
|
function LoadingOverlay() {
|
|
7147
|
-
return (jsx("div", { className: styles$
|
|
7171
|
+
return (jsx("div", { className: styles$v['loading-overlay'], children: jsx(ProgressCircle, {}) }));
|
|
7148
7172
|
}
|
|
7149
7173
|
|
|
7150
|
-
var styles$
|
|
7174
|
+
var styles$u = {"page-container":"page-container-module-PYmbC","inner-page-container":"page-container-module-uD8GF"};
|
|
7151
7175
|
|
|
7152
7176
|
function PageContainer({ children, className, }) {
|
|
7153
|
-
return (jsx("div", { className: styles$
|
|
7177
|
+
return (jsx("div", { className: styles$u['page-container'], children: jsx("div", { className: clsx(styles$u['inner-page-container'], className), children: children }) }));
|
|
7154
7178
|
}
|
|
7155
7179
|
|
|
7156
|
-
var styles$
|
|
7180
|
+
var styles$t = {"heading":"heading-module-pMC65","uppercase":"heading-module-6spgX","italic":"heading-module-XXMDM","bold":"heading-module-xvrxo","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"};
|
|
7157
7181
|
|
|
7158
7182
|
const sizeToTag = {
|
|
7159
7183
|
l: 'h3',
|
|
@@ -7166,41 +7190,41 @@ const sizeToTag = {
|
|
|
7166
7190
|
};
|
|
7167
7191
|
function Heading({ bold = true, children, className, italic, size = 'xxl', tag, uppercase, }) {
|
|
7168
7192
|
return createElement$1(tag || sizeToTag[size], {
|
|
7169
|
-
className: clsx(className, styles$
|
|
7170
|
-
[styles$
|
|
7171
|
-
[styles$
|
|
7172
|
-
[styles$
|
|
7193
|
+
className: clsx(className, styles$t.heading, styles$t[size], {
|
|
7194
|
+
[styles$t.uppercase]: uppercase,
|
|
7195
|
+
[styles$t.italic]: italic,
|
|
7196
|
+
[styles$t.bold]: bold,
|
|
7173
7197
|
}),
|
|
7174
7198
|
}, children);
|
|
7175
7199
|
}
|
|
7176
7200
|
|
|
7177
|
-
var styles$
|
|
7201
|
+
var styles$s = {"page":"page-module-XtZ9Y","breadcrumb":"page-module-ohh9z","title":"page-module-TEmve"};
|
|
7178
7202
|
|
|
7179
7203
|
function PageTitle({ children }) {
|
|
7180
7204
|
const { lg, xxl } = useBreakpoint();
|
|
7181
|
-
return (jsx(Heading, { italic: true, uppercase: true, className: styles$
|
|
7205
|
+
return (jsx(Heading, { italic: true, uppercase: true, className: styles$s.title, size: xxl ? 'xl' : lg ? 'm' : 's', tag: "h1", children: children }));
|
|
7182
7206
|
}
|
|
7183
7207
|
function Page({ breadCrumb, children, className, title }) {
|
|
7184
|
-
return (jsxs(PageContainer, { className: clsx(styles$
|
|
7208
|
+
return (jsxs(PageContainer, { className: clsx(styles$s.page, className), children: [jsx("div", { className: styles$s.breadcrumb, children: jsx(Breadcrumb, { links: breadCrumb }) }), title && jsx(PageTitle, { children: title }), children] }));
|
|
7185
7209
|
}
|
|
7186
7210
|
|
|
7187
7211
|
function StrokeCloseboxIcon(props) {
|
|
7188
7212
|
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" }) }));
|
|
7189
7213
|
}
|
|
7190
7214
|
|
|
7191
|
-
var styles$
|
|
7215
|
+
var styles$r = {"modal-overlay":"modal-module-rVFJc","modal-fade":"modal-module-63Uyl","modal":"modal-module-6vlFt","modal-zoom":"modal-module-aPJ7X"};
|
|
7192
7216
|
|
|
7193
7217
|
function Modal({ children, className, isDismissable, isKeyboardDismissDisabled, isOpen, onOpenChange, }) {
|
|
7194
|
-
return (jsx(ModalOverlay, { className: clsx(styles$
|
|
7218
|
+
return (jsx(ModalOverlay, { className: clsx(styles$r['modal-overlay'], className), isDismissable: isDismissable, isKeyboardDismissDisabled: isKeyboardDismissDisabled, isOpen: isOpen, onOpenChange: onOpenChange, children: jsx(Modal$1, { className: styles$r.modal, children: children }) }));
|
|
7195
7219
|
}
|
|
7196
7220
|
|
|
7197
|
-
var styles$
|
|
7221
|
+
var styles$q = {"header":"dialog-module-ZnsAe","heading":"dialog-module-SwpuZ","close":"dialog-module-Y7Tqg","content":"dialog-module-Koqia","footer":"dialog-module-y7Axm"};
|
|
7198
7222
|
|
|
7199
7223
|
function Footer({ close }) {
|
|
7200
7224
|
return (jsx(Button, { onPress: close, size: "md", children: "Close" }));
|
|
7201
7225
|
}
|
|
7202
7226
|
function Dialog({ allowClose = true, children, className, footer = Footer, hideTitle, isDismissable, isKeyboardDismissDisabled, isOpen, onOpenChange, onSubmit, title, validationErrors, }) {
|
|
7203
|
-
return (jsx(Modal, { className: clsx(styles$
|
|
7227
|
+
return (jsx(Modal, { className: clsx(styles$q['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$q.header, children: [!hideTitle && (jsx(Heading, { className: styles$q.heading, size: "xs", children: title })), jsx("div", { className: styles$q.close, children: jsx(IconButton, { color: "secondary", isDisabled: !allowClose, onPress: close, children: jsx(StrokeCloseboxIcon, {}) }) })] }), jsx("div", { className: styles$q.content, children: children instanceof Function ? children({ close }) : children }), jsx("footer", { className: styles$q.footer, children: footer instanceof Function ? footer({ close }) : footer })] })) }) }));
|
|
7204
7228
|
}
|
|
7205
7229
|
|
|
7206
7230
|
function SignInDialog({ isOpen, onOpenChange }) {
|
|
@@ -7212,14 +7236,16 @@ function SignInDialog({ isOpen, onOpenChange }) {
|
|
|
7212
7236
|
function ConnectedFavoriteButton({ onFavorite: _onFavorite, productId, }) {
|
|
7213
7237
|
const { refetch } = useSession();
|
|
7214
7238
|
const isAuthenticated = useIsAuthenticated();
|
|
7215
|
-
const { isFavorite, isFetching, wishList, wishListItem } = useFavoriteProduct(productId);
|
|
7239
|
+
const { isFavorite: _isFavorite, isFetching, wishList, wishListItem, } = useFavoriteProduct(productId);
|
|
7216
7240
|
const [showSignInDialog, setShowSignInDialog] = useState(false);
|
|
7217
|
-
const { error, mutate: addWishListItemToCurrentWishList } = useAddWishListItemToCurrentWishList();
|
|
7218
|
-
const { mutate: deleteWishListItemFromWishList } = useDeleteWishListItemFromWishList();
|
|
7241
|
+
const { error: addWishListItemToCurrentWishListError, mutate: addWishListItemToCurrentWishList, } = useAddWishListItemToCurrentWishList();
|
|
7242
|
+
const { error: deleteWishListItemFromWishListError, mutate: deleteWishListItemFromWishList, } = useDeleteWishListItemFromWishList();
|
|
7243
|
+
const [isFavorite, setIsFavorite] = useState(_isFavorite);
|
|
7219
7244
|
function onFavorite() {
|
|
7220
7245
|
if (!isAuthenticated) {
|
|
7221
7246
|
return setShowSignInDialog(true);
|
|
7222
7247
|
}
|
|
7248
|
+
setIsFavorite(currentValue => !currentValue);
|
|
7223
7249
|
if (wishList && wishListItem) {
|
|
7224
7250
|
deleteWishListItemFromWishList({
|
|
7225
7251
|
wishListId: wishList.id,
|
|
@@ -7232,12 +7258,22 @@ function ConnectedFavoriteButton({ onFavorite: _onFavorite, productId, }) {
|
|
|
7232
7258
|
}
|
|
7233
7259
|
}
|
|
7234
7260
|
useEffect(() => {
|
|
7235
|
-
|
|
7236
|
-
|
|
7261
|
+
setIsFavorite(_isFavorite);
|
|
7262
|
+
}, [_isFavorite]);
|
|
7263
|
+
useEffect(() => {
|
|
7264
|
+
setIsFavorite(Boolean(wishList && wishListItem));
|
|
7265
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
7266
|
+
}, [
|
|
7267
|
+
addWishListItemToCurrentWishListError,
|
|
7268
|
+
deleteWishListItemFromWishListError,
|
|
7269
|
+
]);
|
|
7270
|
+
useEffect(() => {
|
|
7271
|
+
if (addWishListItemToCurrentWishListError instanceof ForbiddenRequestError ||
|
|
7272
|
+
addWishListItemToCurrentWishListError instanceof UnauthorizedRequestError) {
|
|
7237
7273
|
refetch();
|
|
7238
7274
|
return setShowSignInDialog(true);
|
|
7239
7275
|
}
|
|
7240
|
-
}, [
|
|
7276
|
+
}, [addWishListItemToCurrentWishListError, refetch]);
|
|
7241
7277
|
if (isFetching)
|
|
7242
7278
|
return null;
|
|
7243
7279
|
return (jsxs(Fragment, { children: [jsx(FavoriteButton, { isDisabled: isFetching, isFavorite: isFavorite, onPress: onFavorite }), jsx(SignInDialog, { isOpen: showSignInDialog, onOpenChange: setShowSignInDialog })] }));
|
|
@@ -7247,10 +7283,10 @@ function ConnectedProductCard({ onAddToCart, onFavorite, productId, ...props })
|
|
|
7247
7283
|
return (jsx(ProductCard, { ...props, addToCartButton: jsx(ConnectedAddToCartButton, { onAddToCart: onAddToCart, productId: productId }), favoriteButton: jsx(ConnectedFavoriteButton, { onFavorite: onFavorite, productId: productId }) }));
|
|
7248
7284
|
}
|
|
7249
7285
|
|
|
7250
|
-
var styles$
|
|
7286
|
+
var styles$p = {"slide":"product-carousel-module-XVTB1"};
|
|
7251
7287
|
|
|
7252
7288
|
function ProductCarousel({ hasOverflow = false, productCards, }) {
|
|
7253
|
-
return (jsx(Carousel, { hasOverflow: hasOverflow, navigationButtonsPosition: "center", slideClasses: styles$
|
|
7289
|
+
return (jsx(Carousel, { hasOverflow: hasOverflow, navigationButtonsPosition: "center", slideClasses: styles$p.slide, slides: productCards, spaceBetween: 16 }));
|
|
7254
7290
|
}
|
|
7255
7291
|
|
|
7256
7292
|
function useLanguageCode() {
|
|
@@ -7258,6 +7294,41 @@ function useLanguageCode() {
|
|
|
7258
7294
|
return languageCode;
|
|
7259
7295
|
}
|
|
7260
7296
|
|
|
7297
|
+
var styles$o = {"images-grid":"images-grid-module-i5868","grid-item":"images-grid-module-nY9-n","clickable":"images-grid-module-Ruktz"};
|
|
7298
|
+
|
|
7299
|
+
const mainImagePosition = {
|
|
7300
|
+
1: 0,
|
|
7301
|
+
2: 0,
|
|
7302
|
+
3: 0,
|
|
7303
|
+
4: 0,
|
|
7304
|
+
5: 2,
|
|
7305
|
+
};
|
|
7306
|
+
function ImagesGrid({ images, onSelectImage }) {
|
|
7307
|
+
const isXl = useIsBreakpoint('xl');
|
|
7308
|
+
if (images.length > 5) {
|
|
7309
|
+
images = images.slice(0, 5);
|
|
7310
|
+
}
|
|
7311
|
+
const positionIndex = mainImagePosition[images.length] || 0;
|
|
7312
|
+
const imageList = [
|
|
7313
|
+
...images.slice(1, positionIndex + 1),
|
|
7314
|
+
images[0],
|
|
7315
|
+
...images.slice(positionIndex + 1),
|
|
7316
|
+
];
|
|
7317
|
+
function handleKeydown(event, image) {
|
|
7318
|
+
if (event.key === 'Enter' || event.key === ' ') {
|
|
7319
|
+
event.preventDefault();
|
|
7320
|
+
onSelectImage?.(image, images.indexOf(image));
|
|
7321
|
+
}
|
|
7322
|
+
}
|
|
7323
|
+
if (!isXl) {
|
|
7324
|
+
// TODO: Implement mobile thumbs swiper
|
|
7325
|
+
return jsx("div", { children: "Mobile thumbs swiper" });
|
|
7326
|
+
}
|
|
7327
|
+
return (jsx("div", { className: styles$o['images-grid'], "data-count": images.length, children: imageList.map((image, index) => image && (jsx("div", { "aria-label": onSelectImage ? `Open image ${index}` : undefined, className: clsx(styles$o['grid-item'], {
|
|
7328
|
+
[styles$o.clickable]: Boolean(onSelectImage),
|
|
7329
|
+
}), onClick: () => onSelectImage?.(image, images.indexOf(image)), onKeyDown: event => handleKeydown(event, image), role: onSelectImage ? 'button' : undefined, tabIndex: onSelectImage ? 0 : undefined, children: jsx(Image, { fit: "cover", image: image, title: image.altText }) }, index))) }));
|
|
7330
|
+
}
|
|
7331
|
+
|
|
7261
7332
|
function ErrorPage({ error }) {
|
|
7262
7333
|
useEffect(() => {
|
|
7263
7334
|
setTimeout(() => {
|
|
@@ -7315,12 +7386,7 @@ function ProductDetailsPage({ pageUrl }) {
|
|
|
7315
7386
|
if (!data || isFetching)
|
|
7316
7387
|
return jsx(LoadingPage, {});
|
|
7317
7388
|
const { breadCrumb, included, product, recentlyViewed } = data;
|
|
7318
|
-
return (jsx(Page, { breadCrumb: breadCrumb, children: jsx(ProductDetailsPageLayout, { imageGallery: jsx("div", { style: {
|
|
7319
|
-
display: 'grid',
|
|
7320
|
-
gap: '1rem',
|
|
7321
|
-
gridTemplateColumns: 'repeat(auto-fit, minmax(200px, 1fr))',
|
|
7322
|
-
padding: '1rem',
|
|
7323
|
-
}, children: product.images.map((image, index) => (jsx(Image, { fit: "contain", height: 200, image: image, title: image.altText, width: 200 }, index))) }), included: jsxs("div", { style: {
|
|
7389
|
+
return (jsx(Page, { breadCrumb: breadCrumb, children: jsx(ProductDetailsPageLayout, { imageGallery: jsx(ImagesGrid, { images: product.images }), included: jsxs("div", { style: {
|
|
7324
7390
|
alignItems: 'center',
|
|
7325
7391
|
display: 'flex',
|
|
7326
7392
|
flexDirection: 'column',
|
|
@@ -7395,9 +7461,9 @@ function GlyphsChevronsBoldDownIcon(props) {
|
|
|
7395
7461
|
function AccordionItem({ _pseudo = 'none', children, className, id, initialIsOpen = false, isDisabled = false, size, title, }) {
|
|
7396
7462
|
const { isOpen, toggle } = useDisclosure(initialIsOpen);
|
|
7397
7463
|
const panelId = `panel-${id}`;
|
|
7398
|
-
return (jsxs("div", { className: clsx(className, styles$
|
|
7399
|
-
[styles$
|
|
7400
|
-
}), children: [jsx("h3", { children: jsxs("button", { "aria-controls": panelId, "aria-expanded": isOpen, className: clsx(styles$
|
|
7464
|
+
return (jsxs("div", { className: clsx(className, styles$E['accordion-item'], {
|
|
7465
|
+
[styles$E['is-open']]: isOpen,
|
|
7466
|
+
}), children: [jsx("h3", { children: jsxs("button", { "aria-controls": panelId, "aria-expanded": isOpen, className: clsx(styles$E.button, styles$E[_pseudo]), disabled: isDisabled, id: id, onClick: toggle, type: "button", children: [title, jsx("span", { className: styles$E.icon, children: size === 'lg' ? (jsx(GlyphsChevronsBoldDownIcon, {})) : (jsx(GlyphsChevronsSlimDownIcon, {})) })] }) }), jsx("div", { "aria-labelledby": id, className: styles$E.panel, id: panelId, role: "region", children: jsx("div", { className: styles$E.content, children: children }) })] }));
|
|
7401
7467
|
}
|
|
7402
7468
|
|
|
7403
7469
|
var styles$l = {"filter-section":"filter-section-module-q1Ob8","default":"filter-section-module-JkP09","title":"filter-section-module-hWVv-","with-action":"filter-section-module-9qc6L","header":"filter-section-module-zi2ZE","content":"filter-section-module-15-YW","sm":"filter-section-module-crU-3","md":"filter-section-module-vHRQu","border-top":"filter-section-module-dGcTY"};
|
|
@@ -7940,12 +8006,12 @@ function AlgoliaSortBy() {
|
|
|
7940
8006
|
return (jsx(Select, { label: t('Sort by'), onChange: value => refine(String(value)), options: options, selectedOption: currentRefinement, showLabel: false, size: "sm" }));
|
|
7941
8007
|
}
|
|
7942
8008
|
|
|
7943
|
-
var styles$h = {"category-card":"category-card-module-4NUjH","title":"category-card-module-LEhh3","arrow":"category-card-module-hL4-A","is-selected":"category-card-module-vJ7vB","image-container":"category-card-module-oNTrK"};
|
|
8009
|
+
var styles$h = {"category-card":"category-card-module-4NUjH","title":"category-card-module-LEhh3","arrow":"category-card-module-hL4-A","image":"category-card-module-RxWMW","is-selected":"category-card-module-vJ7vB","image-container":"category-card-module-oNTrK"};
|
|
7944
8010
|
|
|
7945
8011
|
function CategoryCard({ href, image, isSelected = false, onClick, title, withArrow = false, }) {
|
|
7946
8012
|
return (jsxs(RouteLink, { className: clsx({
|
|
7947
8013
|
[styles$h['is-selected']]: isSelected,
|
|
7948
|
-
}, styles$h['category-card']), href: href, onClick: onClick, children: [jsx("div", { className: styles$h['image-container'], children: jsx(Image, { ...image, fit: "contain" }) }), jsxs("p", { className: styles$h.title, children: [jsx("span", { children: title }), withArrow && jsx(GlyphsArrowBoldCapsRightIcon, { className: styles$h.arrow })] })] }));
|
|
8014
|
+
}, styles$h['category-card']), href: href, onClick: onClick, children: [jsx("div", { className: styles$h['image-container'], children: jsx(Image, { className: styles$h.image, ...image, fit: "contain" }) }), jsxs("p", { className: styles$h.title, children: [jsx("span", { children: title }), withArrow && jsx(GlyphsArrowBoldCapsRightIcon, { className: styles$h.arrow })] })] }));
|
|
7949
8015
|
}
|
|
7950
8016
|
|
|
7951
8017
|
const ProductListingPageContext = createContext({
|
|
@@ -8905,7 +8971,7 @@ function SearchList({ ariaLabelledby, children, className, id, }) {
|
|
|
8905
8971
|
return (jsx("ul", { "aria-labelledby": ariaLabelledby, className: clsx(styles$3['search-list'], className), id: id, children: children }));
|
|
8906
8972
|
}
|
|
8907
8973
|
|
|
8908
|
-
var styles$2 = {"search-list-item":"search-list-item-module-WXp77","content":"search-list-item-module-CPrhz","text":"search-list-item-module--5uqN"};
|
|
8974
|
+
var styles$2 = {"search-list-item":"search-list-item-module-WXp77","clear-filter-button":"search-list-item-module-YJvJm","content":"search-list-item-module-CPrhz","text":"search-list-item-module--5uqN"};
|
|
8909
8975
|
|
|
8910
8976
|
function SearchListItem({ icon, isRemovable = false, onClick, onRemove, text, }) {
|
|
8911
8977
|
return (jsxs("li", { className: styles$2['search-list-item'], onClick: onClick, role: "option", children: [jsxs("div", { className: styles$2.content, children: [icon && icon, text && jsx("span", { className: styles$2.text, children: text })] }), isRemovable && (jsx(IconButton, { color: "secondary", onPress: onRemove, children: jsx(StrokeCloseboxIcon, {}) }))] }));
|
|
@@ -9057,7 +9123,8 @@ function SearchRoot() {
|
|
|
9057
9123
|
*/
|
|
9058
9124
|
function GlobalSearch() {
|
|
9059
9125
|
const panelRef = useRef(null);
|
|
9060
|
-
const { isOpen } = useGlobalSearchDisclosure();
|
|
9126
|
+
const { close, isOpen } = useGlobalSearchDisclosure();
|
|
9127
|
+
useOnNavigate(close);
|
|
9061
9128
|
return (jsx(TransitionGroup, { children: jsx(Transition, { in: isOpen, nodeRef: panelRef, timeout: 300, children: state => (jsx("div", { ref: panelRef, className: state, children: jsx("div", { className: styles$8['search-wrapper'], children: jsx(SearchRoot, {}) }) })) }) }));
|
|
9062
9129
|
}
|
|
9063
9130
|
|
|
@@ -9075,4 +9142,4 @@ function ReactQueryContainer({ children }) {
|
|
|
9075
9142
|
return (jsx(QueryClientProvider, { client: queryClient, children: children }));
|
|
9076
9143
|
}
|
|
9077
9144
|
|
|
9078
|
-
export { Accordion, AddToCartButton, AlgoliaActiveCategories, AlgoliaCategoriesFilters, AlgoliaFilterPanel, AlgoliaInsightsProvider, AlgoliaInsightsProviderContext, AlgoliaMultiSelectFilterSection, AlgoliaPagination, AlgoliaProvider, AlgoliaResultsCount, AlgoliaSortBy, AvailabilityMessageType, BadRequestError, BadgeImagePlacementValues, BadgeStyleValues, BadgeTypeValues, Breadcrumb, Button, CartProvider, CategoryCarousel, Checkbox, ColorCheckbox, ConnectedAddToCartButton, CurrencyPositioningType, FavoriteButton, FavoriteProvider, FilterSection, ForbiddenRequestError, FormattedMessage, GlobalSearch, GlobalSearchDisclosureContext, GlobalSearchProvider, GlobalStateProvider, GlobalStateProviderContext, IconButton, Image, InternalServerErrorRequest, IntlProvider, Link, LoadingOverlay, MultiSelect, NotFoundRequestError, NumberField, Page, PageContainer, ProductCard, ProductDetailsPage, ProductListingPage, ProductOverviewGrid, ProductPrice, ProductSku, ProgressCircle, ReactQueryContainer, RequestError, RouteButton, RouteLink, RouteProvider, SearchResultsPage, SearchRoot, Select, ShowAll, Sidebar, SidebarDetectBreakpoint, SidebarProvider, TextField, TimeoutRequestError, UnauthorizedRequestError, UnprocessableContentRequestError, VariantDisplayTypeValues, WishListNameAlreadyExistsError, addProductToCurrentCart, addWishListItemToWishList, config, configPerEnvironment, createSession, createSonicSearchClient, createWishList, deleteCartLineById, deleteWishList, deleteWishListItemFromWishList, environment, environments, fetchCurrentCartLines, fetchTranslations, getSession, getWishList, getWishListItemsByWishListId, getWishLists, isRequestError, request, signIn, signOut, transformAlgoliaProductHitToProductHit, updateCartLineById, useAddProductToCurrentCart, useAddWishListItemToCurrentWishList, useAddWishListItemToWishList, useAlgolia, useAlgoliaInsights, useAlgoliaSearch, useBreakpoint, useCartEvents, useCreateWishList, useDebouncedCallback, useDeleteCartLineById, useDeleteWishListItemFromWishList, useDisclosure, useFavorite, useFavoriteProduct, useFeatureFlags, useFetchAllWishListsItems, useFetchCurrentCartLines, useFetchTranslations, useFetchWishLists, useFormattedMessage, useGlobalSearchDisclosure, useGlobalState, useIsAuthenticated, useIsBreakpoint, useNavigate, useScrollLock, useSession, useSignIn, useSignOut, useUpdateCartLineById, userToken };
|
|
9145
|
+
export { Accordion, AddToCartButton, AlgoliaActiveCategories, AlgoliaCategoriesFilters, AlgoliaFilterPanel, AlgoliaInsightsProvider, AlgoliaInsightsProviderContext, AlgoliaMultiSelectFilterSection, AlgoliaPagination, AlgoliaProvider, AlgoliaResultsCount, AlgoliaSortBy, AvailabilityMessageType, BadRequestError, BadgeImagePlacementValues, BadgeStyleValues, BadgeTypeValues, Breadcrumb, Button, CartProvider, CategoryCarousel, Checkbox, ColorCheckbox, ConnectedAddToCartButton, CurrencyPositioningType, FavoriteButton, FavoriteProvider, FilterSection, ForbiddenRequestError, FormattedMessage, GlobalSearch, GlobalSearchDisclosureContext, GlobalSearchProvider, GlobalStateProvider, GlobalStateProviderContext, IconButton, Image, InternalServerErrorRequest, IntlProvider, Link, LoadingOverlay, MultiSelect, NotFoundRequestError, NumberField, Page, PageContainer, ProductCard, ProductDetailsPage, ProductListingPage, ProductOverviewGrid, ProductPrice, ProductSku, ProgressCircle, ReactQueryContainer, RequestError, RouteButton, RouteLink, RouteProvider, SearchResultsPage, SearchRoot, Select, ShowAll, Sidebar, SidebarDetectBreakpoint, SidebarProvider, TextField, TimeoutRequestError, UnauthorizedRequestError, UnprocessableContentRequestError, VariantDisplayTypeValues, WishListNameAlreadyExistsError, addProductToCurrentCart, addWishListItemToWishList, config, configPerEnvironment, createSession, createSonicSearchClient, createWishList, deleteCartLineById, deleteWishList, deleteWishListItemFromWishList, environment, environments, fetchCurrentCartLines, fetchTranslations, getSession, getWishList, getWishListItemsByWishListId, getWishLists, isRequestError, request, signIn, signOut, transformAlgoliaProductHitToProductHit, updateCartLineById, useAddProductToCurrentCart, useAddWishListItemToCurrentWishList, useAddWishListItemToWishList, useAlgolia, useAlgoliaInsights, useAlgoliaSearch, useBreakpoint, useCartEvents, useCreateWishList, useDebouncedCallback, useDeleteCartLineById, useDeleteWishListItemFromWishList, useDisclosure, useFavorite, useFavoriteProduct, useFeatureFlags, useFetchAllWishListsItems, useFetchCurrentCartLines, useFetchTranslations, useFetchWishLists, useFormattedMessage, useGlobalSearchDisclosure, useGlobalState, useIsAuthenticated, useIsBreakpoint, useNavigate, useOnNavigate, useScrollLock, useSession, useSignIn, useSignOut, useUpdateCartLineById, userToken };
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { Image as ImageType } from 'shared/model/image';
|
|
2
|
+
interface ImagesGridProps {
|
|
3
|
+
images: ImageType[];
|
|
4
|
+
onSelectImage?: (image: ImageType, index: number) => void;
|
|
5
|
+
}
|
|
6
|
+
export declare function ImagesGrid({ images, onSelectImage }: ImagesGridProps): import("react/jsx-runtime").JSX.Element;
|
|
7
|
+
export {};
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import type { Meta, StoryObj } from '@storybook/react';
|
|
2
|
+
import { ImagesGrid } from './images-grid';
|
|
3
|
+
declare const meta: Meta<typeof ImagesGrid>;
|
|
4
|
+
export default meta;
|
|
5
|
+
type Story = StoryObj<typeof meta>;
|
|
6
|
+
export declare const Clickable: Story;
|
|
7
|
+
export declare const FiveImages: Story;
|
|
8
|
+
export declare const FourImages: Story;
|
|
9
|
+
export declare const ThreeImages: Story;
|
|
10
|
+
export declare const TwoImages: Story;
|
|
11
|
+
export declare const OneImage: Story;
|
|
@@ -9,4 +9,5 @@ export interface RouteProviderProps {
|
|
|
9
9
|
navigate: NavigateFn;
|
|
10
10
|
}
|
|
11
11
|
export declare function RouteProvider({ children, navigate }: RouteProviderProps): import("react/jsx-runtime").JSX.Element;
|
|
12
|
+
export declare function useOnNavigate(callback?: NavigateFn): NavigateFn;
|
|
12
13
|
export declare function useNavigate(): NavigateFn;
|
package/dist/styles.css
CHANGED
|
@@ -488,6 +488,8 @@
|
|
|
488
488
|
.icon-button-module-4PDK- {
|
|
489
489
|
all: unset;
|
|
490
490
|
display: flex;
|
|
491
|
+
min-width: 48px;
|
|
492
|
+
min-height: 48px;
|
|
491
493
|
align-items: center;
|
|
492
494
|
justify-content: center;
|
|
493
495
|
cursor: pointer;
|
|
@@ -921,16 +923,12 @@
|
|
|
921
923
|
|
|
922
924
|
.product-card-module-pLaiB .product-card-module-e0kMu {
|
|
923
925
|
display: grid;
|
|
924
|
-
flex: 1;
|
|
925
926
|
padding-bottom: var(--padding-bottom);
|
|
927
|
+
margin-top: auto;
|
|
926
928
|
gap: var(--space-16);
|
|
927
929
|
padding-inline: var(--padding-inline);
|
|
928
930
|
}
|
|
929
931
|
|
|
930
|
-
.product-card-module-pLaiB .product-card-module-Q0VvF {
|
|
931
|
-
height: 142px;
|
|
932
|
-
}
|
|
933
|
-
|
|
934
932
|
.product-card-module-pLaiB .product-card-module-Q0VvF .product-card-module-HkWBE {
|
|
935
933
|
display: flex;
|
|
936
934
|
min-height: var(--tag-height, var(--space-16));
|
|
@@ -960,6 +958,7 @@
|
|
|
960
958
|
|
|
961
959
|
.product-card-module-pLaiB .product-card-module-kD2tU {
|
|
962
960
|
display: flex;
|
|
961
|
+
height: 102px;
|
|
963
962
|
flex-wrap: wrap;
|
|
964
963
|
align-items: center;
|
|
965
964
|
justify-content: space-between;
|
|
@@ -987,7 +986,7 @@
|
|
|
987
986
|
display: flex;
|
|
988
987
|
width: 125px;
|
|
989
988
|
justify-content: flex-end;
|
|
990
|
-
margin-top:
|
|
989
|
+
margin-top: auto;
|
|
991
990
|
margin-left: auto;
|
|
992
991
|
}
|
|
993
992
|
|
|
@@ -1006,12 +1005,17 @@
|
|
|
1006
1005
|
--padding-bottom: var(--space-24);
|
|
1007
1006
|
}
|
|
1008
1007
|
|
|
1008
|
+
.product-card-module-pLaiB .product-card-module-Q0VvF {
|
|
1009
|
+
height: 142px;
|
|
1010
|
+
}
|
|
1011
|
+
|
|
1009
1012
|
.product-card-module-pLaiB .product-card-module-SnCvX {
|
|
1010
1013
|
margin-top: 0;
|
|
1011
1014
|
margin-left: auto;
|
|
1012
1015
|
}
|
|
1013
1016
|
|
|
1014
1017
|
.product-card-module-pLaiB .product-card-module-kD2tU {
|
|
1018
|
+
height: auto;
|
|
1015
1019
|
flex-wrap: nowrap;
|
|
1016
1020
|
}
|
|
1017
1021
|
|
|
@@ -2327,6 +2331,58 @@
|
|
|
2327
2331
|
}
|
|
2328
2332
|
}
|
|
2329
2333
|
|
|
2334
|
+
.images-grid-module-i5868 {
|
|
2335
|
+
display: grid;
|
|
2336
|
+
gap: var(--space-12);
|
|
2337
|
+
grid-template-columns: repeat(2, 1fr);
|
|
2338
|
+
grid-template-rows: repeat(4, 1fr);
|
|
2339
|
+
}
|
|
2340
|
+
|
|
2341
|
+
.images-grid-module-i5868 .images-grid-module-nY9-n {
|
|
2342
|
+
background-color: var(--color-gray-100);
|
|
2343
|
+
mix-blend-mode: multiply;
|
|
2344
|
+
outline: none;
|
|
2345
|
+
}
|
|
2346
|
+
|
|
2347
|
+
.images-grid-module-i5868 .images-grid-module-nY9-n.images-grid-module-Ruktz {
|
|
2348
|
+
cursor: pointer;
|
|
2349
|
+
}
|
|
2350
|
+
|
|
2351
|
+
.images-grid-module-i5868 .images-grid-module-nY9-n.images-grid-module-Ruktz:focus-visible {
|
|
2352
|
+
box-shadow: var(--shadow-focus-outline);
|
|
2353
|
+
}
|
|
2354
|
+
|
|
2355
|
+
.images-grid-module-i5868[data-count='5'] .images-grid-module-nY9-n:nth-child(3) {
|
|
2356
|
+
grid-column: span 2;
|
|
2357
|
+
grid-row: span 2;
|
|
2358
|
+
}
|
|
2359
|
+
|
|
2360
|
+
/* stylelint-disable-next-line no-descending-specificity */
|
|
2361
|
+
|
|
2362
|
+
.images-grid-module-i5868[data-count='3'] .images-grid-module-nY9-n:nth-child(1) {
|
|
2363
|
+
grid-column: span 2;
|
|
2364
|
+
grid-row: span 2;
|
|
2365
|
+
}
|
|
2366
|
+
|
|
2367
|
+
/* stylelint-disable-next-line no-descending-specificity */
|
|
2368
|
+
|
|
2369
|
+
.images-grid-module-i5868[data-count='2'] .images-grid-module-nY9-n {
|
|
2370
|
+
grid-column: span 2;
|
|
2371
|
+
grid-row: span 2;
|
|
2372
|
+
}
|
|
2373
|
+
|
|
2374
|
+
/* stylelint-disable-next-line no-descending-specificity */
|
|
2375
|
+
|
|
2376
|
+
.images-grid-module-i5868[data-count='1'] .images-grid-module-nY9-n {
|
|
2377
|
+
grid-column: span 2;
|
|
2378
|
+
grid-row: span 2;
|
|
2379
|
+
}
|
|
2380
|
+
|
|
2381
|
+
@media (width >= 1440px) {.images-grid-module-i5868 {
|
|
2382
|
+
gap: var(--space-16)
|
|
2383
|
+
}
|
|
2384
|
+
}
|
|
2385
|
+
|
|
2330
2386
|
.product-details-page-layout-module-IQFIn {
|
|
2331
2387
|
display: flex;
|
|
2332
2388
|
flex-direction: column;
|
|
@@ -2505,15 +2561,16 @@
|
|
|
2505
2561
|
|
|
2506
2562
|
.active-filters-module-Rrmhy {
|
|
2507
2563
|
display: flex;
|
|
2564
|
+
height: 32px;
|
|
2508
2565
|
align-items: center;
|
|
2509
2566
|
justify-content: space-between;
|
|
2567
|
+
line-height: 32px;
|
|
2510
2568
|
}
|
|
2511
2569
|
|
|
2512
2570
|
.active-filters-module-u9TTE {
|
|
2513
2571
|
--spacing: var(--space-16);
|
|
2514
2572
|
|
|
2515
2573
|
display: grid;
|
|
2516
|
-
gap: var(--spacing);
|
|
2517
2574
|
}
|
|
2518
2575
|
|
|
2519
2576
|
.active-filters-module-u9TTE .active-filters-module-CIuPU {
|
|
@@ -2562,6 +2619,7 @@
|
|
|
2562
2619
|
margin-top: var(--space-8);
|
|
2563
2620
|
margin-bottom: 0;
|
|
2564
2621
|
gap: 2px;
|
|
2622
|
+
transition: color 0.2s ease;
|
|
2565
2623
|
}
|
|
2566
2624
|
|
|
2567
2625
|
.category-card-module-4NUjH .category-card-module-LEhh3 span {
|
|
@@ -2581,6 +2639,10 @@
|
|
|
2581
2639
|
color: var(--color-brand-red);
|
|
2582
2640
|
}
|
|
2583
2641
|
|
|
2642
|
+
.category-card-module-4NUjH[data-pressed] .category-card-module-RxWMW, .category-card-module-4NUjH[data-hovered] .category-card-module-RxWMW, .category-card-module-4NUjH[data-focused] .category-card-module-RxWMW {
|
|
2643
|
+
scale: 1.15;
|
|
2644
|
+
}
|
|
2645
|
+
|
|
2584
2646
|
.category-card-module-4NUjH[data-pressed] .category-card-module-LEhh3, .category-card-module-4NUjH[data-hovered] .category-card-module-LEhh3, .category-card-module-4NUjH[data-focused] .category-card-module-LEhh3 {
|
|
2585
2647
|
color: var(--color-brand-red);
|
|
2586
2648
|
}
|
|
@@ -2596,12 +2658,13 @@
|
|
|
2596
2658
|
aspect-ratio: 1 / 1;
|
|
2597
2659
|
}
|
|
2598
2660
|
|
|
2599
|
-
.category-card-module-4NUjH .category-card-module-oNTrK
|
|
2661
|
+
.category-card-module-4NUjH .category-card-module-oNTrK .category-card-module-RxWMW {
|
|
2600
2662
|
position: relative;
|
|
2601
2663
|
z-index: 5;
|
|
2602
2664
|
margin: auto;
|
|
2603
2665
|
aspect-ratio: 1;
|
|
2604
2666
|
mix-blend-mode: multiply;
|
|
2667
|
+
transition: scale 0.2s ease;
|
|
2605
2668
|
}
|
|
2606
2669
|
|
|
2607
2670
|
.category-card-module-4NUjH .category-card-module-oNTrK::after {
|
|
@@ -3311,22 +3374,27 @@
|
|
|
3311
3374
|
.search-list-module-vRuMO {
|
|
3312
3375
|
all: unset;
|
|
3313
3376
|
display: grid;
|
|
3314
|
-
gap: var(--space-16);
|
|
3315
3377
|
}
|
|
3316
3378
|
|
|
3317
3379
|
.search-list-item-module-WXp77 {
|
|
3318
3380
|
display: flex;
|
|
3319
|
-
|
|
3381
|
+
height: 32px;
|
|
3320
3382
|
justify-content: space-between;
|
|
3321
3383
|
cursor: pointer;
|
|
3384
|
+
line-height: 32px;
|
|
3322
3385
|
}
|
|
3323
3386
|
|
|
3387
|
+
.search-list-item-module-WXp77 .search-list-item-module-YJvJm {
|
|
3388
|
+
min-height: 32px;
|
|
3389
|
+
}
|
|
3390
|
+
|
|
3324
3391
|
.search-list-item-module-WXp77:hover {
|
|
3325
3392
|
color: var(--color-brand-red);
|
|
3326
3393
|
}
|
|
3327
3394
|
|
|
3328
3395
|
.search-list-item-module-WXp77 .search-list-item-module-CPrhz {
|
|
3329
3396
|
display: flex;
|
|
3397
|
+
align-items: center;
|
|
3330
3398
|
gap: 5px;
|
|
3331
3399
|
}
|
|
3332
3400
|
|