@envive-ai/react-toolkit 0.2.13-arthur-1 → 0.2.14

package/dist/components/ModalSheet/mobile/index.js

@@ -0,0 +1,114 @@
+import { ModalSheetMobileHeader } from "./mobileHeader.js";
+import { useEffect, useState } from "react";
+import { motion } from "framer-motion";
+import classNames from "classnames";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/components/ModalSheet/mobile/index.tsx
+const ModalSheetMobile = ({ children, isOpen, closeModal, mobileFullHeight = 180, animationDuration, headerProps, footerProps }) => {
+	const [isHidden, setIsHidden] = useState(isOpen ? "block" : "none");
+	const [bottom, setBottom] = useState(isOpen ? 0 : 0 - mobileFullHeight);
+	const [overlayOpacity, setOverlayOpacity] = useState(isOpen ? 1 : 0);
+	useEffect(() => {
+		setIsHidden(isOpen ? "block" : "none");
+		setBottom(isOpen ? 0 : 0 - mobileFullHeight);
+		setOverlayOpacity(isOpen ? 1 : 0);
+	}, [mobileFullHeight, isOpen]);
+	const overlayClassNames = classNames({
+		"spiffy-modal-sheet-overlay": true,
+		"spiffy-tw-fixed": true,
+		"spiffy-tw-inset-0": true,
+		"spiffy-tw-top-[0]": true,
+		"spiffy-tw-bottom-[0]": true,
+		"spiffy-tw-left-[0]": true,
+		"spiffy-tw-right-[0]": true,
+		"spiffy-tw-bg-black/30": true,
+		"spiffy-tw-z-[100]": true
+	});
+	const modalClassNames = classNames({
+		"spiffy-modal-sheet": true,
+		"spiffy-modal-sheet-open": isOpen,
+		"spiffy-tw-w-full": true,
+		"spiffy-tw-overflow-y-auto": true,
+		"spiffy-tw-shadow-lg": true,
+		"spiffy-tw-fixed": true,
+		"spiffy-tw-bg-white": true,
+		"spiffy-tw-border-box": true,
+		"spiffy-tw-rounded-t-[16px]": true,
+		"spiffy-tw-h-[89%]": true,
+		"spiffy-tw-max-h-[89%]": true
+	});
+	const contentClassNames = classNames({
+		"spiffy-modal-sheet-content": true,
+		"spiffy-tw-flex": true,
+		"spiffy-tw-flex-col": true,
+		"spiffy-tw-w-full": true,
+		"spiffy-tw-h-full": true
+	});
+	const headerClassNames = classNames({
+		"spiffy-tw-sticky": true,
+		"spiffy-tw-top-[0px]": true,
+		"spiffy-tw-flex": true,
+		"spiffy-tw-flex-col": true
+	});
+	const { footerContent, footerClassName } = footerProps || {};
+	const footerClassNames = classNames({
+		"spiffy-tw-sticky": true,
+		"spiffy-tw-bottom-[0px]": true,
+		"spiffy-modal-sheet-footer": true,
+		"spiffy-tw-flex": true,
+		"spiffy-tw-flex-col": true
+	}, footerClassName);
+	return /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(motion.div, {
+		className: overlayClassNames,
+		animate: {
+			opacity: overlayOpacity,
+			display: isHidden
+		},
+		onClick: closeModal,
+		children: /* @__PURE__ */ jsx(motion.div, {
+			role: "dialog",
+			className: modalClassNames,
+			initial: {
+				bottom,
+				display: isHidden
+			},
+			animate: {
+				bottom,
+				display: isHidden
+			},
+			exit: {
+				bottom,
+				display: isHidden
+			},
+			transition: {
+				duration: animationDuration,
+				ease: "easeIn"
+			},
+			onClick: (e) => e.stopPropagation(),
+			children: /* @__PURE__ */ jsxs("div", {
+				className: contentClassNames,
+				children: [
+					/* @__PURE__ */ jsx("div", {
+						className: headerClassNames,
+						children: /* @__PURE__ */ jsx(ModalSheetMobileHeader, {
+							headerContent: headerProps.headerContent,
+							headerVariant: headerProps?.headerVariant,
+							handleHeaderClick: closeModal,
+							chevronColor: "#000"
+						})
+					}),
+					children,
+					/* @__PURE__ */ jsx("div", { className: "spiffy-tw-flex-grow" }),
+					footerContent && /* @__PURE__ */ jsx("div", {
+						className: footerClassNames,
+						children: footerContent
+					})
+				]
+			})
+		})
+	}) });
+};
+
+//#endregion
+export { ModalSheetMobile };

package/dist/components/ModalSheet/mobile/mobileHeader.cjs

@@ -0,0 +1,38 @@
+const require_rolldown_runtime = require('../../../_virtual/rolldown_runtime.cjs');
+const require_AnimatedChevron = require('../../AnimatedChevron/AnimatedChevron.cjs');
+let framer_motion = require("framer-motion");
+let classnames = require("classnames");
+classnames = require_rolldown_runtime.__toESM(classnames);
+let react_jsx_runtime = require("react/jsx-runtime");
+
+//#region src/components/ModalSheet/mobile/mobileHeader.tsx
+const modalSheetVariants = { primary: {
+	"spiffy-tw-bg-[--spiffy-colors-background-primary]": true,
+	"spiffy-tw-text-[--spiffy-colors-text-light]": true
+} };
+const ModalSheetMobileHeader = ({ headerVariant = "primary", headerContent, handleHeaderClick, chevronColor }) => {
+	const animationKey = (0, framer_motion.useMotionValue)(-1);
+	const headerClassName = (0, classnames.default)({
+		"spiffy-modal-sheet-header": true,
+		"spiffy-tw-flex": true,
+		"spiffy-tw-items-center": true,
+		"spiffy-tw-justify-between": true,
+		"spiffy-tw-w-full": true,
+		"spiffy-tw-flex-col": true,
+		"spiffy-tw-pt-[16px]": true,
+		"spiffy-tw-shadow-[0px_-8px_16px_0px_#0000001A]": true,
+		...modalSheetVariants[headerVariant]
+	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(framer_motion.motion.div, {
+		className: headerClassName,
+		onTouchStart: handleHeaderClick,
+		onMouseDown: handleHeaderClick,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_AnimatedChevron.AnimatedChevron, {
+			animationKey,
+			chevronColor
+		}), headerContent]
+	});
+};
+
+//#endregion
+exports.ModalSheetMobileHeader = ModalSheetMobileHeader;

package/dist/components/ModalSheet/mobile/mobileHeader.js

@@ -0,0 +1,36 @@
+import { AnimatedChevron } from "../../AnimatedChevron/AnimatedChevron.js";
+import { motion, useMotionValue } from "framer-motion";
+import classNames from "classnames";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/components/ModalSheet/mobile/mobileHeader.tsx
+const modalSheetVariants = { primary: {
+	"spiffy-tw-bg-[--spiffy-colors-background-primary]": true,
+	"spiffy-tw-text-[--spiffy-colors-text-light]": true
+} };
+const ModalSheetMobileHeader = ({ headerVariant = "primary", headerContent, handleHeaderClick, chevronColor }) => {
+	const animationKey = useMotionValue(-1);
+	const headerClassName = classNames({
+		"spiffy-modal-sheet-header": true,
+		"spiffy-tw-flex": true,
+		"spiffy-tw-items-center": true,
+		"spiffy-tw-justify-between": true,
+		"spiffy-tw-w-full": true,
+		"spiffy-tw-flex-col": true,
+		"spiffy-tw-pt-[16px]": true,
+		"spiffy-tw-shadow-[0px_-8px_16px_0px_#0000001A]": true,
+		...modalSheetVariants[headerVariant]
+	});
+	return /* @__PURE__ */ jsxs(motion.div, {
+		className: headerClassName,
+		onTouchStart: handleHeaderClick,
+		onMouseDown: handleHeaderClick,
+		children: [/* @__PURE__ */ jsx(AnimatedChevron, {
+			animationKey,
+			chevronColor
+		}), headerContent]
+	});
+};
+
+//#endregion
+export { ModalSheetMobileHeader };

package/dist/components/ModalSheet/{index-B5q4MHdq.d.cts → types.d.cts}

@@ -1,5 +1,3 @@
-import * as react_jsx_runtime1 from "react/jsx-runtime";
-
 //#region src/components/ModalSheet/types.d.ts
 type ModalSheetProps = {
   children: React.ReactNode;
@@ -24,15 +22,4 @@ type ModalSheetFooterProps = {
 };
 type ModalSheetHeaderVariant = 'primary';
 //#endregion
-//#region src/components/ModalSheet/ModalSheet.d.ts
-declare const ModalSheet: ({
-  children,
-  isOpen,
-  closeModal,
-  animationDuration,
-  desktopWidth,
-  headerProps,
-  footerProps
-}: ModalSheetProps) => react_jsx_runtime1.JSX.Element;
-//#endregion
-export { ModalSheet };
+export { ModalSheetProps };

package/dist/components/ModalSheet/{index-BN20-QS0.d.ts → types.d.ts}

@@ -1,5 +1,3 @@
-import * as react_jsx_runtime4 from "react/jsx-runtime";
-
 //#region src/components/ModalSheet/types.d.ts
 type ModalSheetProps = {
   children: React.ReactNode;
@@ -24,15 +22,4 @@ type ModalSheetFooterProps = {
 };
 type ModalSheetHeaderVariant = 'primary';
 //#endregion
-//#region src/components/ModalSheet/ModalSheet.d.ts
-declare const ModalSheet: ({
-  children,
-  isOpen,
-  closeModal,
-  animationDuration,
-  desktopWidth,
-  headerProps,
-  footerProps
-}: ModalSheetProps) => react_jsx_runtime4.JSX.Element;
-//#endregion
-export { ModalSheet };
+export { ModalSheetProps };

package/dist/{ProductCard-C7rZyWpj.cjs → components/ProductCard/ProductCard.cjs}

@@ -1,77 +1,20 @@
-const require_chunk = require('./chunk-CUT6urMc.cjs');
-const require_formatPrice = require('./formatPrice-CyfkjZ3R.cjs');
-const require_Typography = require('./Typography-Ds4gfOJz.cjs');
-const require_ImageWithFallback = require('./ImageWithFallback-C-ZQn7tR.cjs');
-const require_Spinner = require('./Spinner-7HblFCja.cjs');
+const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
+const require_formatPrice = require('../../util/formatPrice.cjs');
+const require_Typography = require('../Typography/Typography.cjs');
+require('../Typography/index.cjs');
+const require_ImageWithFallback = require('../ImageWithFallback/ImageWithFallback.cjs');
+require('../ImageWithFallback/index.cjs');
+const require_logger = require('../../logging/logger.cjs');
+const require_productCardVariants = require('./productCardVariants.cjs');
+const require_Spinner = require('../Spinner/Spinner.cjs');
+require('../Spinner/index.cjs');
 let classnames = require("classnames");
-classnames = require_chunk.__toESM(classnames);
+classnames = require_rolldown_runtime.__toESM(classnames);
 let react_jsx_runtime = require("react/jsx-runtime");
 let react_icons_md = require("react-icons/md");
 let __envive_ai_react_hooks_hooks_ImageResolver = require("@envive-ai/react-hooks/hooks/ImageResolver");
 let __envive_ai_react_hooks_config = require("@envive-ai/react-hooks/config");
 
-//#region src/logging/logger.ts
-var Logger = class {
-	static logInfo(message, ...args) {
-		console.info(`INFO: ${message}`, ...args);
-	}
-	static logDebug(message, ...args) {
-		console.debug(`DEBUG: ${message}`, ...args);
-	}
-	static logError(message, error, ...args) {
-		console.error(`ERROR: ${message} error=${error}`, args);
-	}
-	static logWarn(message, error, ...args) {
-		console.warn(`WARN: ${message} error=${error}`, args);
-	}
-};
-var logger_default = Logger;
-
-//#endregion
-//#region src/components/ProductCard/productCardVariants.ts
-/**
-* Shared variant mapping configurations for ProductCard components
-*/
-const variantClassMap = new Map([
-	["filled", ["spiffy-tw-bg-[--spiffy-colors-background-secondary]", "spiffy-tw-shadow-md"]],
-	["bordered", [
-		"spiffy-tw-bg-[--spiffy-colors-background-secondary]",
-		"spiffy-tw-border",
-		"spiffy-tw-border-[--spiffy-colors-border-light]"
-	]],
-	["minimal", ["spiffy-tw-bg-transparent"]],
-	["transparentBordered", [
-		"spiffy-tw-bg-transparent",
-		"spiffy-tw-border",
-		"spiffy-tw-border-[--spiffy-colors-border-light]"
-	]]
-]);
-const variantHoverClassMap = new Map([["backgroundDark", ["hover:spiffy-tw-bg-[--spiffy-colors-background-secondary-dark]"]], ["none", []]]);
-const variantTitleColorMap = new Map([
-	["filled", "spiffy-tw-text-[--spiffy-colors-text-link]"],
-	["bordered", "spiffy-tw-text-[--spiffy-colors-text-primary]"],
-	["minimal", "spiffy-tw-text-[--spiffy-colors-text-primary]"],
-	["transparentBordered", "spiffy-tw-text-[--spiffy-colors-text-primary]"]
-]);
-const productCardLayoutVariantClasses = {
-	normal: {
-		productTitle: ["spiffy-product-card-title"],
-		container: ["spiffy-tw-w-[208px]"],
-		verticalContainer: ["spiffy-tw-rounded-[8px]", "spiffy-tw-h-[268px]"]
-	},
-	tall: {
-		productTitle: ["spiffy-product-card-title-tall", "spiffy-tw-pt-[8px]"],
-		container: ["spiffy-tw-w-[160px] lg:spiffy-tw-w-[300px]"],
-		verticalContainer: ["lg:spiffy-tw-h-[496px]"]
-	},
-	square: {
-		productTitle: ["spiffy-product-card-title-tall", "spiffy-tw-pt-[8px]"],
-		container: ["spiffy-tw-w-[160px] lg:spiffy-tw-w-[280px]"],
-		verticalContainer: ["lg:spiffy-tw-h-[400px]"]
-	}
-};
-
-//#endregion
 //#region src/components/ProductCard/ProductCard.tsx
 const formatReviews = (stars) => String(Number(stars).toLocaleString("en-US", {
 	minimumFractionDigits: 1,
@@ -124,17 +67,17 @@ const ProductCard = ({ productCardConfig, merchantShortName, imageUrl, title, ur
 	const pricePrefix = productCardConfig?.pricePrefix;
 	const handleClick = () => onClick();
 	if (productCardConfig == null) {
-		logger_default.logError("[ProductCard] productCardConfig is null", void 0, { merchant: merchantShortName });
+		require_logger.default.logError("[ProductCard] productCardConfig is null", void 0, { merchant: merchantShortName });
 		return null;
 	}
-	const layoutClasses = productCardLayoutVariantClasses[finalLayoutVariant];
+	const layoutClasses = require_productCardVariants.productCardLayoutVariantClasses[finalLayoutVariant];
 	const containerClassnames = (0, classnames.default)("spiffy-tw-cursor-pointer", "spiffy-tw-flex", "spiffy-tw-flex-col", "spiffy-tw-gap-inherit", "spiffy-tw-overflow-hidden", {
 		"spiffy-tw-h-full": growWithContainer,
 		"spiffy-tw-w-full": growWithContainer,
 		"spiffy-tw-max-w-full": growWithContainer,
 		"spiffy-tw-rounded-[8px]": layoutVariant === "normal"
-	}, !growWithContainer && layoutClasses.container, variantClassMap.get(finalVariant) ?? [], variantHoverClassMap.get(finalHoverVariant) ?? []);
-	const verticalContainerVariantClasses = productCardLayoutVariantClasses[layoutVariant].verticalContainer;
+	}, !growWithContainer && layoutClasses.container, require_productCardVariants.variantClassMap.get(finalVariant) ?? [], require_productCardVariants.variantHoverClassMap.get(finalHoverVariant) ?? []);
+	const verticalContainerVariantClasses = require_productCardVariants.productCardLayoutVariantClasses[layoutVariant].verticalContainer;
 	const verticalContainerClassnames = (0, classnames.default)("spiffy-tw-flex", "spiffy-tw-flex-col", "spiffy-tw-overflow-hidden", "spiffy-tw-gap-inherit", {
 		"spiffy-tw-h-full": growWithContainer,
 		"spiffy-tw-w-full": growWithContainer,
@@ -157,7 +100,7 @@ const ProductCard = ({ productCardConfig, merchantShortName, imageUrl, title, ur
 		"hover:spiffy-tw-scale-105"
 	] : []);
 	const contentClassnames = (0, classnames.default)("spiffy-tw-flex", "spiffy-tw-flex-col", "spiffy-tw-p-2", "spiffy-tw-pr-2", "spiffy-tw-items-start", "spiffy-tw-justify-end", { "spiffy-tw-flex-grow-0": layoutVariant === "tall" || layoutVariant === "square" });
-	const productTitleClassnames = (0, classnames.default)("spiffy-tw-line-clamp-2", "spiffy-tw-overflow-clip", "spiffy-tw-tracking-[0.8px]", "spiffy-tw-whitespace-normal", "spiffy-tw-normal-case", variantTitleColorMap.get(finalVariant) ?? "spiffy-tw-text-[--spiffy-colors-text-primary]", ...layoutClasses.productTitle);
+	const productTitleClassnames = (0, classnames.default)("spiffy-tw-line-clamp-2", "spiffy-tw-overflow-clip", "spiffy-tw-tracking-[0.8px]", "spiffy-tw-whitespace-normal", "spiffy-tw-normal-case", require_productCardVariants.variantTitleColorMap.get(finalVariant) ?? "spiffy-tw-text-[--spiffy-colors-text-primary]", ...layoutClasses.productTitle);
 	const priceAndRatingContainerClassnames = (0, classnames.default)("spiffy-tw-flex", "spiffy-tw-flex-row", "spiffy-tw-justify-between", "spiffy-tw-items-center", "spiffy-tw-w-full", "spiffy-tw-pt-2", "spiffy-tw-gap-2");
 	const imageClassnames = (0, classnames.default)("spiffy-tw-bg-transparent", "spiffy-tw-w-full", "spiffy-tw-h-full", "spiffy-tw-object-cover", "spiffy-tw-object-top", "spiffy-tw-select-none", "spiffy-tw-pointer-events-none");
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
@@ -177,7 +120,7 @@ const ProductCard = ({ productCardConfig, merchantShortName, imageUrl, title, ur
 						children: imageUrl && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ImageWithFallback.ImageWithFallback, {
 							src: resolve(imageUrl, layoutVariant === "tall" ? 300 : 178),
 							alt: title,
-							fallback: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Spinner.Spinner, { className: "spiffy-tw-w-6 spiffy-tw-h-6" }),
+							fallback: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Spinner.Spinner, { className: "spiffy-tw-h-6 spiffy-tw-w-6" }),
 							imageClassnames
 						})
 					})
@@ -205,101 +148,6 @@ const ProductCard = ({ productCardConfig, merchantShortName, imageUrl, title, ur
 };
 
 //#endregion
-//#region src/components/ProductCard/types.ts
-let ProductCardSkeletonOverrides = /* @__PURE__ */ function(ProductCardSkeletonOverrides$1) {
-	ProductCardSkeletonOverrides$1["PRODUCT_CARD_SKELETON_CONTAINER"] = "spiffy-product-card-skeleton-container";
-	ProductCardSkeletonOverrides$1["PRODUCT_CARD_SKELETON"] = "spiffy-product-card-skeleton";
-	return ProductCardSkeletonOverrides$1;
-}({});
-let AnimatedProductCardOverrides = /* @__PURE__ */ function(AnimatedProductCardOverrides$1) {
-	AnimatedProductCardOverrides$1["PRODUCT_CARD_ANIMATED_CONTAINER"] = "spiffy-product-card-animated-container";
-	AnimatedProductCardOverrides$1["PRODUCT_CARD_ANIMATED_IMAGE_CONTAINER"] = "spiffy-product-card-animated";
-	return AnimatedProductCardOverrides$1;
-}({});
-
-//#endregion
-//#region src/components/ProductCard/ProductCardSkeleton.tsx
-const ProductCardSkeleton = ({ layoutVariant, aspectRatio, growWithContainer = false }) => {
-	const layoutClasses = productCardLayoutVariantClasses[layoutVariant || "normal"];
-	const containerClasses = (0, classnames.default)(ProductCardSkeletonOverrides.PRODUCT_CARD_SKELETON_CONTAINER, "spiffy-tw-flex", "spiffy-tw-flex-col", "spiffy-tw-gap-inherit", "spiffy-tw-bg-transparent", !growWithContainer ? layoutClasses.container : "");
-	const verticalContainerClasses = (0, classnames.default)("spiffy-tw-flex", "spiffy-tw-flex-col", "spiffy-tw-overflow-hidden", "spiffy-tw-gap-inherit", !growWithContainer ? layoutClasses.verticalContainer : "");
-	const imageClipContainerClasses = (0, classnames.default)("spiffy-tw-w-full", aspectRatio === "3:4" ? "spiffy-tw-aspect-[3/4]" : "", aspectRatio === "square" ? "spiffy-tw-aspect-square" : "", "spiffy-tw-overflow-hidden");
-	const imageSkeletonClasses = (0, classnames.default)("spiffy-tw-bg-[#F4F4F6]", "spiffy-tw-animate-pulse", "spiffy-tw-opacity-70", "spiffy-tw-w-full", "spiffy-tw-h-full");
-	const contentContainerClasses = (0, classnames.default)("spiffy-tw-flex", "spiffy-tw-flex-col", "spiffy-tw-gap-2", "spiffy-tw-w-full", "spiffy-tw-p-2");
-	const textSkeletonClasses = (0, classnames.default)(ProductCardSkeletonOverrides.PRODUCT_CARD_SKELETON, "spiffy-tw-h-[15px]", "spiffy-tw-block", "spiffy-tw-rounded-sm", "spiffy-tw-animate-pulse", "spiffy-tw-opacity-70", "spiffy-tw-bg-[#F4F4F6]");
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-		className: containerClasses,
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-			className: verticalContainerClasses,
-			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-				className: imageClipContainerClasses,
-				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: imageSkeletonClasses })
-			}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-				className: contentContainerClasses,
-				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: (0, classnames.default)(textSkeletonClasses, "spiffy-tw-w-full") }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: (0, classnames.default)(textSkeletonClasses, "spiffy-tw-w-[60%]") })]
-			})]
-		})
-	});
-};
-
-//#endregion
-Object.defineProperty(exports, 'AnimatedProductCardOverrides', {
-  enumerable: true,
-  get: function () {
-    return AnimatedProductCardOverrides;
-  }
-});
-Object.defineProperty(exports, 'PriceSection', {
-  enumerable: true,
-  get: function () {
-    return PriceSection;
-  }
-});
-Object.defineProperty(exports, 'ProductCard', {
-  enumerable: true,
-  get: function () {
-    return ProductCard;
-  }
-});
-Object.defineProperty(exports, 'ProductCardSkeleton', {
-  enumerable: true,
-  get: function () {
-    return ProductCardSkeleton;
-  }
-});
-Object.defineProperty(exports, 'ProductCardSkeletonOverrides', {
-  enumerable: true,
-  get: function () {
-    return ProductCardSkeletonOverrides;
-  }
-});
-Object.defineProperty(exports, 'RatingSummary', {
-  enumerable: true,
-  get: function () {
-    return RatingSummary;
-  }
-});
-Object.defineProperty(exports, 'productCardLayoutVariantClasses', {
-  enumerable: true,
-  get: function () {
-    return productCardLayoutVariantClasses;
-  }
-});
-Object.defineProperty(exports, 'variantClassMap', {
-  enumerable: true,
-  get: function () {
-    return variantClassMap;
-  }
-});
-Object.defineProperty(exports, 'variantHoverClassMap', {
-  enumerable: true,
-  get: function () {
-    return variantHoverClassMap;
-  }
-});
-Object.defineProperty(exports, 'variantTitleColorMap', {
-  enumerable: true,
-  get: function () {
-    return variantTitleColorMap;
-  }
-});
+exports.PriceSection = PriceSection;
+exports.ProductCard = ProductCard;
+exports.RatingSummary = RatingSummary;

package/dist/components/ProductCard/ProductCard.d.cts

@@ -0,0 +1,64 @@
+import { ProductCardConfig, ProductCardHoverVariant, ProductCardLayoutVariant, ProductCardVariant } from "./types.cjs";
+import * as react_jsx_runtime20 from "react/jsx-runtime";
+
+//#region src/components/ProductCard/ProductCard.d.ts
+interface RatingSummaryProps {
+  stars: number;
+  reviewCount: number;
+  className?: string;
+}
+declare const RatingSummary: ({
+  stars,
+  reviewCount,
+  className
+}: RatingSummaryProps) => react_jsx_runtime20.JSX.Element;
+interface PriceSectionProps {
+  originalPrice?: string;
+  salePrice?: string;
+  pricePrefix?: string;
+}
+declare const PriceSection: ({
+  originalPrice,
+  salePrice,
+  pricePrefix
+}: PriceSectionProps) => react_jsx_runtime20.JSX.Element;
+interface ProductCardProps {
+  productCardConfig?: ProductCardConfig;
+  merchantShortName: string;
+  title: string;
+  url: string;
+  imageUrl?: string;
+  originalPrice?: number;
+  averageRating?: number;
+  numberReviews?: number;
+  salePrice?: number;
+  variant?: ProductCardVariant;
+  hoverVariant?: ProductCardHoverVariant;
+  layoutVariant?: ProductCardLayoutVariant;
+  zoomOnHover?: boolean;
+  aspectRatio?: '3:4' | 'square' | 'none';
+  growWithContainer?: boolean;
+  onClick?: () => void;
+  dataTestId?: string;
+}
+declare const ProductCard: ({
+  productCardConfig,
+  merchantShortName,
+  imageUrl,
+  title,
+  url,
+  originalPrice,
+  averageRating,
+  numberReviews,
+  salePrice,
+  variant,
+  hoverVariant,
+  dataTestId,
+  layoutVariant,
+  zoomOnHover,
+  aspectRatio,
+  growWithContainer,
+  onClick
+}: ProductCardProps) => react_jsx_runtime20.JSX.Element;
+//#endregion
+export { PriceSection, ProductCard, RatingSummary, RatingSummaryProps };

package/dist/components/ProductCard/ProductCard.d.ts

@@ -0,0 +1,64 @@
+import { ProductCardConfig, ProductCardHoverVariant, ProductCardLayoutVariant, ProductCardVariant } from "./types.js";
+import * as react_jsx_runtime23 from "react/jsx-runtime";
+
+//#region src/components/ProductCard/ProductCard.d.ts
+interface RatingSummaryProps {
+  stars: number;
+  reviewCount: number;
+  className?: string;
+}
+declare const RatingSummary: ({
+  stars,
+  reviewCount,
+  className
+}: RatingSummaryProps) => react_jsx_runtime23.JSX.Element;
+interface PriceSectionProps {
+  originalPrice?: string;
+  salePrice?: string;
+  pricePrefix?: string;
+}
+declare const PriceSection: ({
+  originalPrice,
+  salePrice,
+  pricePrefix
+}: PriceSectionProps) => react_jsx_runtime23.JSX.Element;
+interface ProductCardProps {
+  productCardConfig?: ProductCardConfig;
+  merchantShortName: string;
+  title: string;
+  url: string;
+  imageUrl?: string;
+  originalPrice?: number;
+  averageRating?: number;
+  numberReviews?: number;
+  salePrice?: number;
+  variant?: ProductCardVariant;
+  hoverVariant?: ProductCardHoverVariant;
+  layoutVariant?: ProductCardLayoutVariant;
+  zoomOnHover?: boolean;
+  aspectRatio?: '3:4' | 'square' | 'none';
+  growWithContainer?: boolean;
+  onClick?: () => void;
+  dataTestId?: string;
+}
+declare const ProductCard: ({
+  productCardConfig,
+  merchantShortName,
+  imageUrl,
+  title,
+  url,
+  originalPrice,
+  averageRating,
+  numberReviews,
+  salePrice,
+  variant,
+  hoverVariant,
+  dataTestId,
+  layoutVariant,
+  zoomOnHover,
+  aspectRatio,
+  growWithContainer,
+  onClick
+}: ProductCardProps) => react_jsx_runtime23.JSX.Element;
+//#endregion
+export { PriceSection, ProductCard, RatingSummary, RatingSummaryProps };