@evenicanpm/storefront-core 1.8.1 → 2.0.0

package/docs.tsconfig.json

@@ -26,10 +26,10 @@
 		}
 	},
 	"include": [
-		"src/components-v2/product-dimensions",
-		"src/components-v2/product-quantity-buttons",
-		"src/components-v2/products-view",
-		"src/components-v2/search-bar",
-		"src/components-v2/section"
+		"src/components/product-dimensions",
+		"src/components/product-quantity-buttons",
+		"src/components/products-view",
+		"src/components/search-bar",
+		"src/components/section"
 	]
 }

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@evenicanpm/storefront-core",
-	"version": "1.8.1",
+	"version": "2.0.0",
 	"description": "Core module for D365/e4 Headless Storefront",
 	"type": "module",
 	"scripts": {
@@ -16,7 +16,7 @@
 	"author": "Evenica",
 	"license": "ISC",
 	"dependencies": {
-		"@evenicanpm/ui": "^1.8.1"
+		"@evenicanpm/ui": "^2.0.0"
 	},
 	"devDependencies": {
 		"@storybook/addon-docs": "^9.1.6",
@@ -49,5 +49,5 @@
 			"esbuild": "0.19.11"
 		}
 	},
-	"gitHead": "07cfd4496c6a137e1420a6572298998b25b6369d"
+	"gitHead": "7552c1e700a0027b8a65506c77cb10dae092fdfb"
 }

package/src/api-manager/datasources/d365/d365-cart.datasource.ts

@@ -382,7 +382,7 @@ export class D365CartDatasource extends D365DatasourceBase implements CartApi {
 			}
 		});
 
-		let shippingData;
+		let shippingData: ProductWarehouseInventoryInformation | undefined;
 		if (shippingItems.length) {
 			try {
 				const searchCriteria: InventoryAvailabilitySearchCriteria = {
@@ -392,24 +392,29 @@ export class D365CartDatasource extends D365DatasourceBase implements CartApi {
 					SearchArea: input.searchCriteria.searchArea,
 					FilterByChannelFulfillmentGroup: true,
 				};
-				shippingData = await getEstimatedAvailabilityAsync(
+				const shippingAsyncResult = await getEstimatedAvailabilityAsync(
 					context as any,
 					searchCriteria,
 				);
+				shippingData =
+					shippingAsyncResult as ProductWarehouseInventoryInformation;
 			} catch (error) {
 				console.error("Error getting shipping inventory:", error);
 				throw error;
 			}
 		}
 
-		let warehouseData;
+		let warehouseData: ProductWarehouseInventoryInformation | undefined;
 		if (bopisItems.length) {
 			try {
-				warehouseData = await getEstimatedProductWarehouseAvailabilityAsync(
-					context as any,
-					bopisItems,
-					2,
-				);
+				const warehouseAsyncResult =
+					await getEstimatedProductWarehouseAvailabilityAsync(
+						context as any,
+						bopisItems,
+						2,
+					);
+				warehouseData =
+					warehouseAsyncResult as ProductWarehouseInventoryInformation;
 			} catch (error) {
 				console.error("Error getting pick up inventory:", error);
 				throw error;

package/src/api-manager/datasources/d365/d365-product.datasource.ts

@@ -19,6 +19,7 @@ import type {
 } from "@evenicanpm/storefront-core/src/api-manager/schemas/product.schema";
 import type { ProductApi } from "@evenicanpm/storefront-core/src/api-manager/types/Datasource";
 import {
+	executeAction,
 	type InventoryAvailabilitySearchCriteria,
 	type IQueryResultSettings,
 	type ProductPrice,
@@ -26,7 +27,6 @@ import {
 	type ProductSearchCriteria,
 	type ProductSearchResult,
 	type SimpleProduct,
-	executeAction,
 } from "@msdyn365-commerce/retail-proxy";
 import {
 	createSearchByCriteriaInput,
@@ -222,7 +222,11 @@ class D365ProductDatasource extends D365DatasourceBase implements ProductApi {
 				ItemId: id,
 			}));
 		}
-		const results = await searchByCriteriaAsync(ctx as any, searchCriteria);
+		const observableResults = await searchByCriteriaAsync(
+			ctx as any,
+			searchCriteria,
+		);
+		const results: ProductSearchResult[] = Array.from(observableResults as any);
 		const promises = [];
 		for (const product of results) {
 			promises.push(
@@ -233,8 +237,7 @@ class D365ProductDatasource extends D365DatasourceBase implements ProductApi {
 			);
 		}
 		await Promise.all(promises);
-		const parsed = globalThis.structuredClone(results);
-		return parsed;
+		return results;
 	}
 
 	async getCategoryList(): Promise<any> {

package/src/api-manager/datasources/e4/cart/e4-cart.datasource.ts

@@ -102,7 +102,7 @@ const cart: CartApi = {
 		const e4Api = await getGraphqlClient();
 
 		const { cartLine } = input;
-		let cart;
+		let cart: E4Cart | undefined;
 
 		for (const cl of cartLine) {
 			const { data, errors } = await e4Api.e4UpdateCartLineMD({
@@ -118,12 +118,14 @@ const cart: CartApi = {
 				throw new Error("Error updating cart lines");
 			}
 
-			cart = data.updateCartLine;
+			cart = data?.updateCartLine?.cart as E4Cart | undefined;
 		}
 
-		const transformedData = cartTranslator.cartTransformValidate(
-			cart?.cart as E4Cart,
-		);
+		if (!cart) {
+			throw new Error("Failed to update cart lines - no cart returned");
+		}
+
+		const transformedData = cartTranslator.cartTransformValidate(cart);
 		return transformedData;
 	},
 

package/src/api-manager/datasources/e4/categories/e4-categories.translator.ts

@@ -146,9 +146,9 @@ export const categoryTransformValidate = (
 		}
 	});
 
-	rootNodes.forEach((rootNode: TransformedCategoryNode) =>
-		calculateUrls(rootNode, "", urlPrefix),
-	);
+	for (const rootNode of rootNodes as TransformedCategoryNode[]) {
+		calculateUrls(rootNode, "", urlPrefix);
+	}
 	rootNodes.sort(
 		(a, b) =>
 			(a.DisplayOrder ?? 0) - (b.DisplayOrder ?? 0) ||

package/src/api-manager/datasources/e4/product/e4-product.translator.ts

@@ -305,7 +305,9 @@ export const productPricesTransformValidate = (
 		(p) => merge(p, productPricesMap) as ProductPrice,
 	);
 	try {
-		translatedData.forEach((pp: ProductPrice) => productPriceSchema.parse(pp));
+		for (const pp of translatedData) {
+			productPriceSchema.parse(pp);
+		}
 	} catch (e) {
 		console.warn("ProductPrice data does not match retail-proxy schema", e);
 	}

package/src/api-manager/index.ts

@@ -61,10 +61,9 @@ async function createApiManager() {
 
 	// @ts-expect-error
 	function importAll(r) {
-		r.keys().forEach(
-			(key: keyof typeof storefrontOverrides) =>
-				(storefrontOverrides[key] = r(key)),
-		);
+		r.keys().forEach((key: keyof typeof storefrontOverrides) => {
+			storefrontOverrides[key] = r(key);
+		});
 	}
 
 	// Arguments must be literals not variables.

package/src/api-manager/lib/category-helpers.ts

@@ -107,8 +107,8 @@ const normalizeCategoryName = (string_: string) =>
 	string_.toLowerCase().replaceAll(" ", "-");
 
 export {
-	mapCategoryToHierarchy,
 	generateUrl,
 	getFriendlyName,
+	mapCategoryToHierarchy,
 	normalizeCategoryName,
 };

package/src/auth/auth-options.test.ts

@@ -23,7 +23,7 @@ describe("next-auth option callbacks", () => {
 				type: "oauth",
 			};
 
-			let newToken;
+			let newToken: ExtendedJwtToken | undefined;
 			if (authOptions()?.callbacks?.jwt) {
 				newToken = await authOptions().callbacks.jwt({
 					token,

package/src/auth/msal.ts

@@ -65,4 +65,4 @@ const getRequestConfig = (requestType?: string) => {
 	}
 };
 
-export { getMsalInstance, initializeMsal, getRequestConfig };
+export { getMsalInstance, getRequestConfig, initializeMsal };

package/src/auth/providers/entra-external-id-provider.ts

@@ -1,4 +1,4 @@
-import { Provider } from "next-auth/providers";
+import type { Provider } from "next-auth/providers";
 
 const createEntraExternalIdProvider = (): Provider => {
 	const clientId = process.env.NEXT_PUBLIC_ENTRA_EXTERNAL_ID_CLIENT_ID || "";

package/src/auth/providers/index.ts

@@ -1,7 +1,7 @@
 import azureADB2CProvider from "@/auth/providers/aadb2c-provider";
 import authentikProvider from "@/auth/providers/authentik-provider";
-import keycloakProvider from "@/auth/providers/keycloak-provider";
 import createEntraExternalIdProvider from "@/auth/providers/entra-external-id-provider";
+import keycloakProvider from "@/auth/providers/keycloak-provider";
 
 export const getProviders = () => {
 	const azureProvider = azureADB2CProvider();

package/src/cms/blocks/components/category-carousel/index.tsx

@@ -1,9 +1,9 @@
 "use client";
 
 // GLOBAL CUSTOM COMPONENT
-import BazaarCard from "@evenicanpm/storefront-core/src/components-v2/BazaarCard";
-import { Carousel } from "@evenicanpm/storefront-core/src/components-v2/carousel/index";
-import { Section } from "@evenicanpm/storefront-core/src/components-v2/section";
+import BazaarCard from "@evenicanpm/storefront-core/src/components/BazaarCard";
+import { Carousel } from "@evenicanpm/storefront-core/src/components/carousel/index";
+import { Section } from "@evenicanpm/storefront-core/src/components/section";
 import NextLink from "next/link";
 import React from "react";
 // LOCAL CUSTOM COMPONENT

package/src/cms/blocks/components/footer/index.tsx

@@ -13,7 +13,7 @@ import Logo from "@/cms/blocks/components/footer/sections/footer-logo";
 import cms from "@/cms/endpoints";
 
 const getBlockComponent = (block: FooterBlock, index: number) => {
-	let Block;
+	let Block: typeof Links | typeof Logo | typeof Contact;
 
 	switch (block.__component) {
 		case "footer.links":

package/src/cms/blocks/components/footer/sections/footer-app-store.tsx

@@ -1,4 +1,4 @@
-import FlexBox from "@evenicanpm/storefront-core/src/components-v2/flex-box/flex-box";
+import FlexBox from "@evenicanpm/storefront-core/src/components/flex-box/flex-box";
 import { Box } from "@mui/material";
 import React, { Fragment } from "react";
 import { MdFacebook as Facebook } from "react-icons/md";

package/src/cms/blocks/components/footer/sections/footer-contact.tsx

@@ -1,4 +1,4 @@
-import { Paragraph } from "@evenicanpm/storefront-core/src/components-v2/Typography";
+import { Paragraph } from "@evenicanpm/storefront-core/src/components/Typography";
 import Grid from "@mui/material/Grid2";
 import React from "react";
 import type { SocialLink } from "@/cms/blocks/components/footer/interfaces";

package/src/cms/blocks/components/footer/sections/footer-logo.tsx

@@ -1,7 +1,7 @@
 "use client";
 
-import SiteLogo from "@evenicanpm/storefront-core/src/components-v2/site-logo";
-import { Paragraph } from "@evenicanpm/storefront-core/src/components-v2/Typography";
+import SiteLogo from "@evenicanpm/storefront-core/src/components/site-logo";
+import { Paragraph } from "@evenicanpm/storefront-core/src/components/Typography";
 import Grid from "@mui/material/Grid2";
 import useTheme from "@mui/material/styles/useTheme";
 import useMediaQuery from "@mui/material/useMediaQuery";

package/src/cms/blocks/components/footer/sections/footer-social-links.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 // Custom Components
-import FlexBox from "@evenicanpm/storefront-core/src/components-v2/flex-box/flex-box";
+import FlexBox from "@evenicanpm/storefront-core/src/components/flex-box/flex-box";
 import IconButton from "@mui/material/IconButton";
 import styled from "@mui/material/styles/styled";
 import React from "react";
@@ -43,7 +43,12 @@ export default function SocialLinks({
 	return (
 		<FlexBox className="flex" mx={-0.625}>
 			{socials?.map(({ name, link }, i) => {
-				let Icon;
+				let Icon:
+					| typeof Facebook
+					| typeof Instagram
+					| typeof Google
+					| typeof Twitter
+					| undefined;
 
 				switch (name) {
 					case "Facebook":

package/src/cms/blocks/components/hero-carousel/index.tsx

@@ -2,8 +2,8 @@
 // This component works best with cutout product images
 
 // GLOBAL CUSTOM COMPONENTS
-import { Carousel } from "@evenicanpm/storefront-core/src/components-v2/carousel/index";
-import CarouselCard1 from "@evenicanpm/storefront-core/src/components-v2/carousel-cards/carousel-card-1/index";
+import { Carousel } from "@evenicanpm/storefront-core/src/components/carousel/index";
+import CarouselCard1 from "@evenicanpm/storefront-core/src/components/carousel-cards/carousel-card-1/index";
 import { Box, Container } from "@mui/material";
 import React from "react";
 import type { HeroCarouselBlock, Slide } from "@/cms/blocks/interfaces";

package/src/cms/blocks/components/product-carousel/index.tsx

@@ -1,9 +1,9 @@
 "use client";
 import getProductByIds from "@evenicanpm/storefront-core/src/api-manager/services/product/queries/get-product-by-ids";
-import { Carousel } from "@evenicanpm/storefront-core/src/components-v2/carousel/index";
+import { Carousel } from "@evenicanpm/storefront-core/src/components/carousel/index";
 // CMS
-import ProductCard from "@evenicanpm/storefront-core/src/components-v2/product-cards/product-card/product-card";
-import { Section } from "@evenicanpm/storefront-core/src/components-v2/section";
+import ProductCard from "@evenicanpm/storefront-core/src/components/product-cards/product-card/product-card";
+import { Section } from "@evenicanpm/storefront-core/src/components/section";
 import type { SimpleProduct } from "@msdyn365-commerce/retail-proxy";
 import { Box } from "@mui/system";
 import React from "react";

package/src/cms/blocks/components/product-section-fullwidth/index.tsx

@@ -1,10 +1,10 @@
 import { getQueryClient } from "@evenicanpm/storefront-core/src/api-manager/services/get-query-client";
 // API
 import getProductByIds from "@evenicanpm/storefront-core/src/api-manager/services/product/queries/get-product-by-ids";
-import BazaarCard from "@evenicanpm/storefront-core/src/components-v2/BazaarCard";
-import HoverBox from "@evenicanpm/storefront-core/src/components-v2/HoverBox";
-import { Section } from "@evenicanpm/storefront-core/src/components-v2/section";
-import { H4 } from "@evenicanpm/storefront-core/src/components-v2/Typography";
+import BazaarCard from "@evenicanpm/storefront-core/src/components/BazaarCard";
+import HoverBox from "@evenicanpm/storefront-core/src/components/HoverBox";
+import { Section } from "@evenicanpm/storefront-core/src/components/section";
+import { H4 } from "@evenicanpm/storefront-core/src/components/Typography";
 import buildDetailUrl from "@evenicanpm/storefront-core/src/lib/build-detail-url";
 // Utils
 import { currency } from "@evenicanpm/storefront-core/src/lib/lib";

package/src/cms/blocks/components/services/service-card.tsx

@@ -4,7 +4,7 @@
 import {
 	H4,
 	Span,
-} from "@evenicanpm/storefront-core/src/components-v2/Typography";
+} from "@evenicanpm/storefront-core/src/components/Typography";
 import Card from "@mui/material/Card";
 import Fab from "@mui/material/Fab";
 import Grid from "@mui/material/Grid2";

package/src/cms/blocks/components/shared/featured-product-card.tsx

@@ -1,7 +1,7 @@
 // GLOBAL CUSTOM COMPONENTS
-import HoverBox from "@evenicanpm/storefront-core/src/components-v2/HoverBox";
-import Image from "@evenicanpm/storefront-core/src/components-v2/Image";
-import { H4 } from "@evenicanpm/storefront-core/src/components-v2/Typography";
+import HoverBox from "@evenicanpm/storefront-core/src/components/HoverBox";
+import Image from "@evenicanpm/storefront-core/src/components/Image";
+import { H4 } from "@evenicanpm/storefront-core/src/components/Typography";
 import React from "react";
 
 // ==========================================================

package/src/cms/blocks/components/shared/product-category-item.tsx

@@ -1,7 +1,7 @@
-import BazaarCard from "@evenicanpm/storefront-core/src/components-v2/BazaarCard";
-import BazaarImage from "@evenicanpm/storefront-core/src/components-v2/BazaarImage";
+import BazaarCard from "@evenicanpm/storefront-core/src/components/BazaarCard";
+import BazaarImage from "@evenicanpm/storefront-core/src/components/BazaarImage";
 // GLOBAL CUSTOM COMPONENTS
-import { H4 } from "@evenicanpm/storefront-core/src/components-v2/Typography";
+import { H4 } from "@evenicanpm/storefront-core/src/components/Typography";
 import { type SxProps, styled, type Theme } from "@mui/material/styles";
 import React, { type HtmlHTMLAttributes } from "react";
 

package/src/cms/blocks/components/shared/product-grid.tsx

@@ -1,6 +1,6 @@
-import ProductCard from "@evenicanpm/storefront-core/src/components-v2/product-cards/product-card/index";
+import ProductCard from "@evenicanpm/storefront-core/src/components/product-cards/product-card/index";
 // GLOBAL CUSTOM COMPONENTS
-import { Section } from "@evenicanpm/storefront-core/src/components-v2/section";
+import { Section } from "@evenicanpm/storefront-core/src/components/section";
 import Box from "@mui/material/Box";
 import Grid from "@mui/material/Grid2";
 import React from "react";

package/src/cms/blocks/components/shared/top-categories-card.tsx

@@ -1,6 +1,6 @@
 // GLOBAL CUSTOM COMPONENTS
-import HoverBox from "@evenicanpm/storefront-core/src/components-v2/HoverBox";
-import Image from "@evenicanpm/storefront-core/src/components-v2/Image";
+import HoverBox from "@evenicanpm/storefront-core/src/components/HoverBox";
+import Image from "@evenicanpm/storefront-core/src/components/Image";
 import { lightOrDarkText } from "@evenicanpm/storefront-core/src/lib/hexToLuma";
 import Card from "@mui/material/Card";
 import Chip from "@mui/material/Chip";

package/src/cms/blocks/components/shared/top-rating-product-card.tsx

@@ -1,11 +1,11 @@
-import { FlexRowCenter } from "@evenicanpm/storefront-core/src/components-v2/flex-box/index";
+import { FlexRowCenter } from "@evenicanpm/storefront-core/src/components/flex-box/index";
 // GLOBAL CUSTOM COMPONENTS
-import HoverBox from "@evenicanpm/storefront-core/src/components-v2/HoverBox";
-import Image from "@evenicanpm/storefront-core/src/components-v2/Image";
+import HoverBox from "@evenicanpm/storefront-core/src/components/HoverBox";
+import Image from "@evenicanpm/storefront-core/src/components/Image";
 import {
 	H4,
 	Small,
-} from "@evenicanpm/storefront-core/src/components-v2/Typography";
+} from "@evenicanpm/storefront-core/src/components/Typography";
 // CUSTOM UTILS LIBRARY FUNCTION
 import { currency } from "@evenicanpm/storefront-core/src/lib/lib";
 import Rating from "@mui/material/Rating";

package/src/cms/blocks/icons/components/category.tsx

@@ -6,6 +6,7 @@ import React from "react";
 
 const Category: OverridableComponent<SvgIconTypeMap> = createSvgIcon(
 	<svg fill="currentColor" viewBox="0 0 64 64">
+		<title>Category</title>
 		<path d="m29 11v14a4 4 0 0 1 -4 4h-14a4 4 0 0 1 -4-4v-14a4 4 0 0 1 4-4h14a4 4 0 0 1 4 4zm24-4h-14a4 4 0 0 0 -4 4v14a4 4 0 0 0 4 4h14a4 4 0 0 0 4-4v-14a4 4 0 0 0 -4-4zm-28 28h-14a4 4 0 0 0 -4 4v14a4 4 0 0 0 4 4h14a4 4 0 0 0 4-4v-14a4 4 0 0 0 -4-4zm21 0a11 11 0 1 0 11 11 11 11 0 0 0 -11-11z" />
 	</svg>,
 	"Category",

package/src/cms/blocks/icons/components/dotted-star.tsx

@@ -5,6 +5,7 @@ import React from "react";
 
 const DottedStar = createSvgIcon(
 	<svg fill="currentColor" viewBox="0 0 24 24">
+		<title>Dotted Star</title>
 		<path
 			d="M12.431 11.7264L11.9772 10.5867L11.5233 11.7264C11.4231 11.9784 11.1869 12.15 10.9157 12.1679L9.69147 12.2469L10.6349 13.031C10.8436 13.2047 10.9342 13.4828 10.8669 13.7457L10.5641 14.9342L11.6016 14.2785C11.8309 14.1344 12.1234 14.1344 12.3527 14.2785L13.3895 14.9336L13.0867 13.7457C13.0194 13.4828 13.11 13.2047 13.3188 13.031L14.2621 12.2469L13.0386 12.1679C12.7675 12.15 12.5313 11.9784 12.431 11.7264Z"
 			fill="#FF9101"

package/src/cms/blocks/icons/components/gift-box.tsx

@@ -5,6 +5,7 @@ import React from "react";
 
 const GiftBox = createSvgIcon(
 	<svg fill="currentColor" viewBox="0 0 22 20">
+		<title>Gift Box</title>
 		<path
 			fillRule="evenodd"
 			clipRule="evenodd"

package/src/cms/blocks/icons/components/light.tsx

@@ -5,6 +5,7 @@ import React from "react";
 
 const Light = createSvgIcon(
 	<svg fill="currentColor" viewBox="0 0 24 24">
+		<title>Light</title>
 		<path d="M19.0765 9.48063H12.1242L15.5905 0L5 14.5194H11.9522L8.48592 24L19.0765 9.48063Z" />
 	</svg>,
 	"Light",

package/src/cms/blocks/icons/components/new-arrival.tsx

@@ -5,6 +5,7 @@ import React from "react";
 
 const NewArrival = createSvgIcon(
 	<svg fill="currentColor" viewBox="0 0 24 24">
+		<title>New Arrival</title>
 		<g>
 			<path
 				d="M22.9347 12.001L24 10.1003L22.3995 8.62199L22.8254 6.48519L20.8463 5.57376L20.5911 3.40991L18.4273 3.15468L17.5158 1.17562L15.379 1.60157L13.9006 0.000976562L12 1.0663L10.0994 0.000976562L8.62106 1.60152L6.48427 1.17557L5.57283 3.15463L3.40898 3.40987L3.15375 5.57371L1.17469 6.48515L1.60064 8.62194L0 10.1003L1.06533 12.0009L0 13.9016L1.60055 15.3799L1.17459 17.5167L3.15366 18.4281L3.40889 20.592L5.57273 20.8472L6.48417 22.8263L8.62097 22.4003L10.0993 24.0009L11.9999 22.9356L13.9005 24.0009L15.3788 22.4003L17.5156 22.8263L18.4271 20.8472L20.5909 20.592L20.8462 18.4281L22.8252 17.5167L22.3993 15.3799L23.9998 13.9016L22.9347 12.001ZM8.62936 14.0641H7.61878L5.78016 11.7887V14.0641H4.50881V9.43504H5.49984L7.35802 11.7887V9.43504H8.62936V14.0641ZM12.7238 14.0641H9.42483V9.43504H12.6652V10.5434H10.6962V11.1954H12.3783V12.2255H10.6962V12.9557H12.7239V14.0641H12.7238ZM18.0765 14.0641H17.0203L16.3618 12.408L15.7098 14.0641H14.6536L12.8411 9.43504H14.2168L15.2209 12.6102L15.5403 11.6453L14.7905 9.43504H15.9576L16.3618 10.8629L16.7726 9.43504H17.9397L17.1768 11.6453L17.5094 12.6102L18.507 9.43504H19.8891L18.0765 14.0641Z"

package/src/cms/blocks/icons/components/rank-badge.tsx

@@ -4,6 +4,7 @@ import React from "react";
 
 const RankBadge = createSvgIcon(
 	<svg fill="currentColor" viewBox="0 0 24 24">
+		<title>Rank Badge</title>
 		<path
 			d="M1.99309 16.5377L1.49359 17.0365L5.70897 18.0092C5.77746 18.025 5.84014 18.0597 5.88987 18.1093C5.93959 18.159 5.97437 18.2216 5.99022 18.2901L6.96297 22.5062L7.46247 22.0063L6.43722 17.5622L1.99309 16.5377Z"
 			fill="#FAB400"

package/src/cms/blocks/icons/index.ts

@@ -11,12 +11,7 @@ import Light from "@/cms/blocks/icons/components/light";
 import NewArrival from "@/cms/blocks/icons/components/new-arrival";
 import RankBadge from "@/cms/blocks/icons/components/rank-badge";
 
-export { Category };
-export { DottedStar };
-export { GiftBox };
-export { Light };
-export { NewArrival };
-export { RankBadge };
+export { Category, DottedStar, GiftBox, Light, NewArrival, RankBadge };
 
 const iconMapping: Record<string, IconComponent> = {
 	DottedStar, // Add more icons here as needed

package/src/{components-v2 → components}/BazaarTextField.tsx

@@ -1,5 +1,5 @@
 // CUSTOM COMPONENT
-import { H6 } from "@evenicanpm/storefront-core/src/components-v2/Typography";
+import { H6 } from "@evenicanpm/storefront-core/src/components/Typography";
 import Box, { type BoxProps } from "@mui/material/Box";
 import TextField, { type TextFieldProps } from "@mui/material/TextField";
 

package/src/{components-v2 → components}/DropZone.tsx

@@ -2,7 +2,7 @@
 import {
 	H5,
 	Small,
-} from "@evenicanpm/storefront-core/src/components-v2/Typography";
+} from "@evenicanpm/storefront-core/src/components/Typography";
 // MUI
 import Box from "@mui/material/Box";
 import Button from "@mui/material/Button";
@@ -26,6 +26,7 @@ export default function DropZone({
 	onChange,
 	title = "Drag & drop files here",
 	handleReject,
+	accept,
 }: Readonly<Props>) {
 	const onDrop = useCallback(
 		(acceptedFiles: File[]) => onChange(acceptedFiles),

package/src/{components-v2 → components}/ImageWithFallback.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import LazyImage from "@evenicanpm/storefront-core/src/components-v2/LazyImage";
+import LazyImage from "@evenicanpm/storefront-core/src/components/LazyImage";
 import type { ImageProps } from "next/image";
 import type React from "react";
 import { useEffect, useState } from "react";

package/src/components/_tests_/BazaarCard.test.tsx

@@ -0,0 +1,16 @@
+import { render, screen } from "@testing-library/react";
+import BazaarCard from "../BazaarCard";
+
+describe("BazaarCard", () => {
+	it("renders children", () => {
+		render(<BazaarCard>Card Content</BazaarCard>);
+		expect(screen.getByText("Card Content")).toBeInTheDocument();
+	});
+
+	it("accepts hoverEffect prop", () => {
+		const { container } = render(
+			<BazaarCard hoverEffect>Hover Card</BazaarCard>,
+		);
+		expect(container.firstChild).toBeTruthy();
+	});
+});

package/src/components/_tests_/BazaarImage.test.tsx

@@ -0,0 +1,18 @@
+import { render, screen } from "@testing-library/react";
+import BazaarImage from "../BazaarImage";
+
+describe("BazaarImage", () => {
+	it("renders image with src and alt", () => {
+		render(
+			<BazaarImage
+				src="/test.png"
+				alt="Test Image"
+				data-testid="bazaar-image"
+			/>,
+		);
+		const image = screen.getByTestId("bazaar-image");
+		expect(image).toBeInTheDocument();
+		expect(image).toHaveAttribute("src", "/test.png");
+		expect(image).toHaveAttribute("alt", "Test Image");
+	});
+});

package/src/components/_tests_/BazaarMenu.test.tsx

@@ -0,0 +1,46 @@
+import { fireEvent, render, screen } from "@testing-library/react";
+import { vi } from "vitest";
+import BazaarMenu from "../BazaarMenu";
+
+vi.mock("@mui/material/Menu", () => ({
+	default: ({
+		children,
+		open,
+	}: {
+		children: React.ReactNode;
+		open: boolean;
+	}) => (open ? <div data-testid="bazaar-menu">{children}</div> : null),
+}));
+
+describe("BazaarMenu", () => {
+	it("renders menu options when open is true", () => {
+		render(
+			<BazaarMenu
+				open
+				direction="right"
+				handler={() => <button type="button">Trigger</button>}
+				options={() => <div>Menu Option</div>}
+			/>,
+		);
+
+		expect(screen.getByTestId("bazaar-menu")).toBeInTheDocument();
+		expect(screen.getByText("Menu Option")).toBeInTheDocument();
+	});
+
+	it("opens menu using handler click", () => {
+		render(
+			<BazaarMenu
+				handler={(onClick) => (
+					<button type="button" onClick={onClick}>
+						Open
+					</button>
+				)}
+				options={() => <div>Dynamic Option</div>}
+			/>,
+		);
+
+		fireEvent.click(screen.getByRole("button", { name: "Open" }));
+		expect(screen.getByTestId("bazaar-menu")).toBeInTheDocument();
+		expect(screen.getByText("Dynamic Option")).toBeInTheDocument();
+	});
+});