@envive-ai/react-toolkit 0.1.11 → 0.1.13

package/dist/{index-Cl4d_pDw.d.ts → index-Br1B7Jta.d.cts}

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime25 from "react/jsx-runtime";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
 import { SearchFilterDatum, SelectFilterItem } from "@envive-ai/react-hooks/types";
 
 //#region src/components/SearchResultsFilterSidebar/types.d.ts
@@ -28,7 +28,6 @@ type SearchResultsFilterProps = {
   setIsOpen: (isOpen: boolean) => void;
   searchFilters: SearchFilterDatum[];
   searchFilterSidebarVariant: SearchFilterSidebarVariant;
-  searchText: string;
   onSelectFilterItem: SelectFilterItem;
   onClearAllFilters: () => void;
   filterButtonText: string;
@@ -42,6 +41,6 @@ declare const SearchResultsFilter: ({
   onSelectFilterItem,
   onClearAllFilters,
   filterButtonText
-}: SearchResultsFilterProps) => react_jsx_runtime25.JSX.Element;
+}: SearchResultsFilterProps) => react_jsx_runtime0.JSX.Element;
 //#endregion
 export { CloseIconVariant$1 as CloseIconVariant, SearchFilterSidebarVariant, SearchResultsFilter, SearchResultsFilterProps, searchFilterSidebarVariantClasses };

package/dist/{index-1x_hMlEf.d.cts → index-DADHwW6M.d.ts}

@@ -1,6 +1,6 @@
-import * as react_jsx_runtime5 from "react/jsx-runtime";
-import { TestProps } from "@envive-ai/react-hooks/types";
 import { FC } from "react";
+import * as react_jsx_runtime7 from "react/jsx-runtime";
+import { TestProps } from "@envive-ai/react-hooks/types";
 import { ResponseCategory, SearchResponseProduct } from "@spiffy-ai/commerce-api-client";
 
 //#region src/util/trim.d.ts
@@ -261,7 +261,7 @@ declare const RatingSummary: ({
   stars,
   reviewCount,
   className
-}: RatingSummaryProps) => react_jsx_runtime5.JSX.Element;
+}: RatingSummaryProps) => react_jsx_runtime7.JSX.Element;
 interface PriceSectionProps {
   originalPrice?: string;
   salePrice?: string;
@@ -271,15 +271,12 @@ declare const PriceSection: ({
   originalPrice,
   salePrice,
   pricePrefix
-}: PriceSectionProps) => react_jsx_runtime5.JSX.Element;
+}: PriceSectionProps) => react_jsx_runtime7.JSX.Element;
 interface ProductCardProps extends TestProps {
   productCardConfig?: ProductCardConfig;
   merchantShortName: string;
   title: string;
   url: string;
-  searchResponseId?: string;
-  productResponseId?: string;
-  cardDisplayLocation: string;
   imageUrl?: string;
   originalPrice?: number;
   averageRating?: number;
@@ -290,7 +287,6 @@ interface ProductCardProps extends TestProps {
   layoutVariant?: ProductCardLayoutVariant;
   zoomOnHover?: boolean;
   aspectRatio?: '3:4' | 'square' | 'none';
-  clickPosition?: number | null;
   growWithContainer?: boolean;
   handleClick?: (clickedUrl: string) => void;
 }
@@ -312,7 +308,7 @@ declare const ProductCard: ({
   aspectRatio,
   growWithContainer,
   handleClick
-}: ProductCardProps) => react_jsx_runtime5.JSX.Element;
+}: ProductCardProps) => react_jsx_runtime7.JSX.Element;
 //#endregion
 //#region src/components/ProductCard/ProductCardSkeleton.d.ts
 declare const ProductCardSkeleton: FC<ProductCardSkeletonProps>;

package/dist/{index-QMTPxKA9.d.ts → index-DDp-fLgm.d.cts}

@@ -1,6 +1,6 @@
-import { FC } from "react";
-import * as react_jsx_runtime14 from "react/jsx-runtime";
+import * as react_jsx_runtime13 from "react/jsx-runtime";
 import { TestProps } from "@envive-ai/react-hooks/types";
+import { FC } from "react";
 import { ResponseCategory, SearchResponseProduct } from "@spiffy-ai/commerce-api-client";
 
 //#region src/util/trim.d.ts
@@ -261,7 +261,7 @@ declare const RatingSummary: ({
   stars,
   reviewCount,
   className
-}: RatingSummaryProps) => react_jsx_runtime14.JSX.Element;
+}: RatingSummaryProps) => react_jsx_runtime13.JSX.Element;
 interface PriceSectionProps {
   originalPrice?: string;
   salePrice?: string;
@@ -271,15 +271,12 @@ declare const PriceSection: ({
   originalPrice,
   salePrice,
   pricePrefix
-}: PriceSectionProps) => react_jsx_runtime14.JSX.Element;
+}: PriceSectionProps) => react_jsx_runtime13.JSX.Element;
 interface ProductCardProps extends TestProps {
   productCardConfig?: ProductCardConfig;
   merchantShortName: string;
   title: string;
   url: string;
-  searchResponseId?: string;
-  productResponseId?: string;
-  cardDisplayLocation: string;
   imageUrl?: string;
   originalPrice?: number;
   averageRating?: number;
@@ -290,7 +287,6 @@ interface ProductCardProps extends TestProps {
   layoutVariant?: ProductCardLayoutVariant;
   zoomOnHover?: boolean;
   aspectRatio?: '3:4' | 'square' | 'none';
-  clickPosition?: number | null;
   growWithContainer?: boolean;
   handleClick?: (clickedUrl: string) => void;
 }
@@ -312,7 +308,7 @@ declare const ProductCard: ({
   aspectRatio,
   growWithContainer,
   handleClick
-}: ProductCardProps) => react_jsx_runtime14.JSX.Element;
+}: ProductCardProps) => react_jsx_runtime13.JSX.Element;
 //#endregion
 //#region src/components/ProductCard/ProductCardSkeleton.d.ts
 declare const ProductCardSkeleton: FC<ProductCardSkeletonProps>;

package/dist/{index-CgjZdKpL.d.cts → index-Dh8rcWev.d.ts}

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime20 from "react/jsx-runtime";
+import * as react_jsx_runtime22 from "react/jsx-runtime";
 import { SearchFilterDatum, SelectFilterItem } from "@envive-ai/react-hooks/types";
 
 //#region src/components/SearchResultsFilterSidebar/types.d.ts
@@ -28,7 +28,6 @@ type SearchResultsFilterProps = {
   setIsOpen: (isOpen: boolean) => void;
   searchFilters: SearchFilterDatum[];
   searchFilterSidebarVariant: SearchFilterSidebarVariant;
-  searchText: string;
   onSelectFilterItem: SelectFilterItem;
   onClearAllFilters: () => void;
   filterButtonText: string;
@@ -42,6 +41,6 @@ declare const SearchResultsFilter: ({
   onSelectFilterItem,
   onClearAllFilters,
   filterButtonText
-}: SearchResultsFilterProps) => react_jsx_runtime20.JSX.Element;
+}: SearchResultsFilterProps) => react_jsx_runtime22.JSX.Element;
 //#endregion
 export { CloseIconVariant$1 as CloseIconVariant, SearchFilterSidebarVariant, SearchResultsFilter, SearchResultsFilterProps, searchFilterSidebarVariantClasses };

package/dist/index-W1wCDiw_.d.cts

@@ -0,0 +1,4 @@
+//#region src/components/SearchInputForm/types.d.ts
+type SearchInputVariant = 'standard';
+//#endregion
+export { SearchInputVariant };

package/dist/{searchFilterSidebarVariants-CDFCHVeZ.js → searchFilterSidebarVariants-J0FJ8pck.js}

@@ -1,4 +1,4 @@
-import { ColorNames, colorVar } from "./colorsConfig-5Yf4nrEe.js";
+import { ColorNames, colorVar } from "./colorsConfig-DZ-GSPWy.js";
 
 //#region src/components/SearchResultsFilterSidebar/searchFilterSidebarVariants.ts
 const searchFilterSidebarVariantClasses = {

package/dist/{searchFilterSidebarVariants-CtmuwSBQ.cjs → searchFilterSidebarVariants-kkTjYEIF.cjs}

@@ -1,4 +1,4 @@
-const require_colorsConfig = require('./colorsConfig-DFL3mBwB.cjs');
+const require_colorsConfig = require('./colorsConfig-B3-SMUSx.cjs');
 
 //#region src/components/SearchResultsFilterSidebar/searchFilterSidebarVariants.ts
 const searchFilterSidebarVariantClasses = {

package/dist/{textVariantClasses-Dgz7Zaql.cjs → textVariantClasses-CBre7vXv.cjs}

@@ -90,13 +90,11 @@ const TextStyleVariantMap = {
 	...TextVariantMap,
 	...HeadlineVariantMap
 };
-const getVariantPlaceholderClassNames = (classes) => {
-	return Object.keys(classes).reduce((acc, key) => {
-		if (key.includes("spiffy-tw")) acc[`placeholder:${key}`] = classes[key];
-		else acc[`${key}-placeholder`] = classes[key];
-		return acc;
-	}, {});
-};
+const getVariantPlaceholderClassNames = (classes) => Object.keys(classes).reduce((acc, key) => {
+	if (key.includes("spiffy-tw")) acc[`placeholder:${key}`] = classes[key];
+	else acc[`${key}-placeholder`] = classes[key];
+	return acc;
+}, {});
 
 //#endregion
 Object.defineProperty(exports, 'HeadlineVariantMap', {

package/dist/{textVariantClasses-D77TGEy1.js → textVariantClasses-CRrTb43V.js}

@@ -89,13 +89,11 @@ const TextStyleVariantMap = {
 	...TextVariantMap,
 	...HeadlineVariantMap
 };
-const getVariantPlaceholderClassNames = (classes) => {
-	return Object.keys(classes).reduce((acc, key) => {
-		if (key.includes("spiffy-tw")) acc[`placeholder:${key}`] = classes[key];
-		else acc[`${key}-placeholder`] = classes[key];
-		return acc;
-	}, {});
-};
+const getVariantPlaceholderClassNames = (classes) => Object.keys(classes).reduce((acc, key) => {
+	if (key.includes("spiffy-tw")) acc[`placeholder:${key}`] = classes[key];
+	else acc[`${key}-placeholder`] = classes[key];
+	return acc;
+}, {});
 
 //#endregion
 export { HeadlineVariantMap, TextStyleVariantMap, TextVariantMap, getVariantPlaceholderClassNames };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@envive-ai/react-toolkit",
-  "version": "0.1.11",
+  "version": "0.1.13",
   "description": "React component library for Envive services.",
   "keywords": [
     "react",
@@ -28,7 +28,7 @@
   },
   "dependencies": {
     "@envive-ai/react-icons": "0.1.1",
-    "@envive-ai/react-hooks": "^0.1.6",
+    "@envive-ai/react-hooks": "^0.1.8",
     "@tailwindcss/typography": "^0.5.15",
     "classnames": "^2.5.1",
     "framer-motion": "^12.23.12",
@@ -45,7 +45,7 @@
     "postcss": "^8.5.6",
     "tailwindcss": "^3.4.17",
     "tsdown": "^0.14.2",
-    "typescript": "~5.8.3"
+    "typescript": "^5.4.3"
   },
   "exports": {
     "./Accordion": {
@@ -132,10 +132,6 @@
       "import": "./dist/Spinner/index.js",
       "require": "./dist/Spinner/index.cjs"
     },
-    "./Styles": {
-      "import": "./dist/Styles/index.js",
-      "require": "./dist/Styles/index.cjs"
-    },
     "./SuggestionButton": {
       "import": "./dist/SuggestionButton/index.js",
       "require": "./dist/SuggestionButton/index.cjs"

package/src/components/AppliedFiltersScrollbar/AppliedFiltersScrollbar.tsx

@@ -38,33 +38,31 @@ export const AppliedFiltersScrollbar = ({
 
   return (
     <ScrollContainer className={filterBarClassNames} hideScrollbars>
-      {selectedFilterOptions.map((filter) => {
-        return (
-          <button
-            key={filter.id}
-            className={buttonClasses}
-            type="button"
-            onClick={() => onRemoveFilter(filter)}
-            aria-label={`Remove filter: ${filter.displayName}`}
-          >
-            <div className="spiffy-tw-flex spiffy-tw-items-center spiffy-tw-gap-[8px]">
-              <Text variant="body3">{filter.displayName}</Text>
-              <svg
-                xmlns="http://www.w3.org/2000/svg"
-                width="10"
-                height="10"
-                viewBox="0 0 10 10"
-                fill="none"
-              >
-                <path
-                  d="M4.59766 4.29297L8.48535 0.405273L9.19238 1.1123L5.30469 5L9.19238 8.8877L8.48535 9.59473L4.59766 5.70703L0.707031 9.59766L0 8.89062L3.89062 5L0 1.10938L0.707031 0.402344L4.59766 4.29297Z"
-                  fill={iconColor}
-                />
-              </svg>
-            </div>
-          </button>
-        );
-      })}
+      {selectedFilterOptions.map((filter) => (
+        <button
+          key={filter.id}
+          className={buttonClasses}
+          type="button"
+          onClick={() => onRemoveFilter(filter)}
+          aria-label={`Remove filter: ${filter.displayName}`}
+        >
+          <div className="spiffy-tw-flex spiffy-tw-items-center spiffy-tw-gap-[8px]">
+            <Text variant="body3">{filter.displayName}</Text>
+            <svg
+              xmlns="http://www.w3.org/2000/svg"
+              width="10"
+              height="10"
+              viewBox="0 0 10 10"
+              fill="none"
+            >
+              <path
+                d="M4.59766 4.29297L8.48535 0.405273L9.19238 1.1123L5.30469 5L9.19238 8.8877L8.48535 9.59473L4.59766 5.70703L0.707031 9.59766L0 8.89062L3.89062 5L0 1.10938L0.707031 0.402344L4.59766 4.29297Z"
+                fill={iconColor}
+              />
+            </svg>
+          </div>
+        </button>
+      ))}
     </ScrollContainer>
   );
 };

package/src/components/ButtonBase/ButtonBase.tsx

@@ -4,7 +4,6 @@ import { ButtonBaseOverrides, ButtonBaseProps } from './types';
 import { Text } from '../Text/Text';
 
 export const ButtonBase = ({
-  type = 'button',
   isDisabled = false,
   dataAttributes,
   buttonClass,
@@ -53,7 +52,7 @@ export const ButtonBase = ({
 
   return (
     <button
-      type={type}
+      type="button"
       ref={buttonRef}
       className={buttonClassName}
       disabled={isDisabled}

package/src/components/DynamicFiltersScrollbar/DynamicFiltersScrollbar.tsx

@@ -22,31 +22,29 @@ export const DynamicFiltersScrollbar = ({
   filterDefaultClasses,
   filterHoverClasses,
   onToggleDynamicFilter,
-}: DynamicFiltersScrollbarProps) => {
-  return (
-    <ScrollContainer className={filterBarClassNames} hideScrollbars>
-      {availableDynamicFilters.map(({ name, displayName }) => {
-        const buttonClasses = classNames(
-          'spiffy-tw-px-[12px] spiffy-tw-py-2 spiffy-tw-rounded-full spiffy-tw-border spiffy-tw-whitespace-nowrap ',
-          filterHoverClasses,
-          filterDefaultClasses,
-        );
-        return (
-          <button
-            key={name}
-            type="button"
-            className={buttonClasses}
-            onClick={() => {
-              onToggleDynamicFilter({
-                filter: name,
-                dynamicFilterDisplayName: displayName,
-              });
-            }}
-          >
-            <Text variant="body3">{displayName}</Text>
-          </button>
-        );
-      })}
-    </ScrollContainer>
-  );
-};
+}: DynamicFiltersScrollbarProps) => (
+  <ScrollContainer className={filterBarClassNames} hideScrollbars>
+    {availableDynamicFilters.map(({ name, displayName }) => {
+      const buttonClasses = classNames(
+        'spiffy-tw-px-[12px] spiffy-tw-py-2 spiffy-tw-rounded-full spiffy-tw-border spiffy-tw-whitespace-nowrap ',
+        filterHoverClasses,
+        filterDefaultClasses,
+      );
+      return (
+        <button
+          key={name}
+          type="button"
+          className={buttonClasses}
+          onClick={() => {
+            onToggleDynamicFilter({
+              filter: name,
+              dynamicFilterDisplayName: displayName,
+            });
+          }}
+        >
+          <Text variant="body3">{displayName}</Text>
+        </button>
+      );
+    })}
+  </ScrollContainer>
+);

package/src/components/FilterScrollbar/AppliedFiltersScrollbar.tsx

@@ -38,33 +38,31 @@ export const AppliedFiltersScrollbar = ({
 
   return (
     <ScrollContainer className={filterBarClassNames} hideScrollbars>
-      {selectedFilterOptions.map((filter) => {
-        return (
-          <button
-            key={filter.id}
-            className={buttonClasses}
-            type="button"
-            onClick={() => onRemoveFilter(filter)}
-            aria-label={`Remove filter: ${filter.displayName}`}
-          >
-            <div className="spiffy-tw-flex spiffy-tw-items-center spiffy-tw-gap-[8px]">
-              <Text variant="body3">{filter.displayName}</Text>
-              <svg
-                xmlns="http://www.w3.org/2000/svg"
-                width="10"
-                height="10"
-                viewBox="0 0 10 10"
-                fill="none"
-              >
-                <path
-                  d="M4.59766 4.29297L8.48535 0.405273L9.19238 1.1123L5.30469 5L9.19238 8.8877L8.48535 9.59473L4.59766 5.70703L0.707031 9.59766L0 8.89062L3.89062 5L0 1.10938L0.707031 0.402344L4.59766 4.29297Z"
-                  fill={iconColor}
-                />
-              </svg>
-            </div>
-          </button>
-        );
-      })}
+      {selectedFilterOptions.map((filter) => (
+        <button
+          key={filter.id}
+          className={buttonClasses}
+          type="button"
+          onClick={() => onRemoveFilter(filter)}
+          aria-label={`Remove filter: ${filter.displayName}`}
+        >
+          <div className="spiffy-tw-flex spiffy-tw-items-center spiffy-tw-gap-[8px]">
+            <Text variant="body3">{filter.displayName}</Text>
+            <svg
+              xmlns="http://www.w3.org/2000/svg"
+              width="10"
+              height="10"
+              viewBox="0 0 10 10"
+              fill="none"
+            >
+              <path
+                d="M4.59766 4.29297L8.48535 0.405273L9.19238 1.1123L5.30469 5L9.19238 8.8877L8.48535 9.59473L4.59766 5.70703L0.707031 9.59766L0 8.89062L3.89062 5L0 1.10938L0.707031 0.402344L4.59766 4.29297Z"
+                fill={iconColor}
+              />
+            </svg>
+          </div>
+        </button>
+      ))}
     </ScrollContainer>
   );
 };

package/src/components/FilterScrollbar/DynamicFiltersScrollbar.tsx

@@ -22,31 +22,29 @@ export const DynamicFiltersScrollbar = ({
   filterDefaultClasses,
   filterHoverClasses,
   onToggleDynamicFilter,
-}: DynamicFiltersScrollbarProps) => {
-  return (
-    <ScrollContainer className={filterBarClassNames} hideScrollbars>
-      {availableDynamicFilters.map(({ name, displayName }) => {
-        const buttonClasses = classNames(
-          'spiffy-tw-px-[12px] spiffy-tw-py-2 spiffy-tw-rounded-full spiffy-tw-border spiffy-tw-whitespace-nowrap ',
-          filterHoverClasses,
-          filterDefaultClasses,
-        );
-        return (
-          <button
-            key={name}
-            type="button"
-            className={buttonClasses}
-            onClick={() => {
-              onToggleDynamicFilter({
-                filter: name,
-                dynamicFilterDisplayName: displayName,
-              });
-            }}
-          >
-            <Text variant="body3">{displayName}</Text>
-          </button>
-        );
-      })}
-    </ScrollContainer>
-  );
-};
+}: DynamicFiltersScrollbarProps) => (
+  <ScrollContainer className={filterBarClassNames} hideScrollbars>
+    {availableDynamicFilters.map(({ name, displayName }) => {
+      const buttonClasses = classNames(
+        'spiffy-tw-px-[12px] spiffy-tw-py-2 spiffy-tw-rounded-full spiffy-tw-border spiffy-tw-whitespace-nowrap ',
+        filterHoverClasses,
+        filterDefaultClasses,
+      );
+      return (
+        <button
+          key={name}
+          type="button"
+          className={buttonClasses}
+          onClick={() => {
+            onToggleDynamicFilter({
+              filter: name,
+              dynamicFilterDisplayName: displayName,
+            });
+          }}
+        >
+          <Text variant="body3">{displayName}</Text>
+        </button>
+      );
+    })}
+  </ScrollContainer>
+);

package/src/components/ModalSheet/ModalSheet.tsx

@@ -1,7 +1,7 @@
+import { useIsSmallScreen } from '@envive-ai/react-hooks/hooks/IsSmallScreen';
 import { ModalSheetMobile } from './mobile';
 import { ModalSheetDesktop } from './desktop';
 import { ModalSheetProps } from './types';
-import { useIsSmallScreen } from '@envive-ai/react-hooks/hooks';
 
 const ANIMATION_DURATION = 0.3;
 

package/src/components/ModalSheet/common/closeIcon.tsx

@@ -33,8 +33,8 @@ export const ModalSheetCloseIcon = ({
 
   const closeIconContextValue = useMemo(() => ({ size: iconSize }), [iconSize]);
   return (
-    <div className={closeIconClassNames} onClick={closeModal}>
+    <button type="button" className={closeIconClassNames} onClick={closeModal}>
       <IconContext.Provider value={closeIconContextValue}>{closeIcon}</IconContext.Provider>
-    </div>
+    </button>
   );
 };

package/src/components/ModalSheet/desktop/index.tsx

@@ -104,6 +104,7 @@ export const ModalSheetDesktop = ({
               <ModalSheetDesktopHeader
                 headerContent={headerProps.headerContent}
                 headerVariant={headerProps?.headerVariant}
+                chevronColor="#000"
               />
             </div>
             {children}

package/src/components/ModalSheet/mobile/index.tsx

@@ -102,6 +102,7 @@ export const ModalSheetMobile = ({
                 headerContent={headerProps.headerContent}
                 headerVariant={headerProps?.headerVariant}
                 handleHeaderClick={closeModal}
+                chevronColor="#000"
               />
             </div>
             {children}

package/src/components/ModalSheet/mobile/mobileHeader.tsx

@@ -1,7 +1,7 @@
 import classNames from 'classnames';
 import { motion, useMotionValue } from 'framer-motion';
-import { ModalSheetHeaderProps } from '../types';
 import { AnimatedChevron } from 'src/components/AnimatedChevron/AnimatedChevron';
+import { ModalSheetHeaderProps } from '../types';
 
 const modalSheetVariants = {
   primary: {

package/src/components/ProductCard/ProductCard.tsx

@@ -1,12 +1,16 @@
 import classNames from 'classnames';
 import { MdStar } from 'react-icons/md';
+import Logger from 'src/logging/logger';
+import { Text } from 'src/components/Text/Text';
+import { formatPrice } from 'src/util/formatPrice';
+import { TestProps } from '@envive-ai/react-hooks/types';
+import { useImageResolver } from '@envive-ai/react-hooks/hooks/ImageResolver';
 import {
   variantClassMap,
   variantHoverClassMap,
   productCardLayoutVariantClasses,
   variantTitleColorMap,
 } from './productCardVariants';
-import Logger from 'src/logging/logger';
 import { Headline } from '../Headline';
 import { ImageWithFallback } from '../ImageWithFallback';
 import { Spinner } from '../Spinner';
@@ -16,10 +20,6 @@ import {
   ProductCardHoverVariant,
   ProductCardLayoutVariant,
 } from './types';
-import { Text } from 'src/components/Text/Text';
-import { formatPrice } from 'src/util/formatPrice';
-import { useImageResolver } from '@envive-ai/react-hooks/hooks';
-import { TestProps } from '@envive-ai/react-hooks/types';
 
 const formatReviews = (stars: number) =>
   String(
@@ -95,29 +95,11 @@ export const PriceSection = ({ originalPrice, salePrice, pricePrefix }: PriceSec
   );
 };
 
-// export const formatPrice = (price?: number, currency: string = '$'): string => {
-//   if (price == null) {
-//     return '';
-//   }
-
-//   const options: Intl.NumberFormatOptions = {};
-
-//   if (!Number.isInteger(price)) {
-//     options.minimumFractionDigits = 2;
-//     options.maximumFractionDigits = 2;
-//   }
-
-//   return `${currency}${price.toLocaleString('en-US', options)}`;
-// };
-
 interface ProductCardProps extends TestProps {
   productCardConfig?: ProductCardConfig;
   merchantShortName: string;
   title: string;
   url: string;
-  searchResponseId?: string;
-  productResponseId?: string;
-  cardDisplayLocation: string;
   imageUrl?: string;
   originalPrice?: number;
   averageRating?: number;
@@ -128,7 +110,6 @@ interface ProductCardProps extends TestProps {
   layoutVariant?: ProductCardLayoutVariant;
   zoomOnHover?: boolean;
   aspectRatio?: '3:4' | 'square' | 'none';
-  clickPosition?: number | null;
   growWithContainer?: boolean;
   handleClick?: (clickedUrl: string) => void;
 }
@@ -139,8 +120,6 @@ export const ProductCard = ({
   imageUrl,
   title,
   url,
-  // searchResponseId,
-  // productResponseId,
   originalPrice,
   averageRating,
   numberReviews,
@@ -149,10 +128,8 @@ export const ProductCard = ({
   hoverVariant,
   dataTestId,
   layoutVariant = 'normal',
-  // cardDisplayLocation,
   zoomOnHover = false,
   aspectRatio = 'none',
-  // clickPosition = null,
   growWithContainer = false,
   handleClick,
 }: ProductCardProps) => {