@gfed-medusa/sf-lib-common 3.3.3 → 3.3.7

package/dist/components/breadcrumbs/index.d.ts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime9 from "react/jsx-runtime";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
 
 //#region src/components/breadcrumbs/index.d.ts
 declare const SEPARATOR_ICONS: Record<string, React.ComponentType<{
@@ -14,7 +14,7 @@ declare function Breadcrumbs({
   iconClassName,
   iconSize,
   separatorIcon
-}: BreadcrumbsProps): react_jsx_runtime9.JSX.Element;
+}: BreadcrumbsProps): react_jsx_runtime0.JSX.Element;
 //#endregion
 export { Breadcrumbs };
 //# sourceMappingURL=index.d.ts.map

package/dist/components/cart-mismatch-banner/index.d.ts

@@ -1,11 +1,11 @@
 import { Cart, Customer } from "../../types/graphql.js";
-import * as react_jsx_runtime4 from "react/jsx-runtime";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
 
 //#region src/components/cart-mismatch-banner/index.d.ts
 declare function CartMismatchBanner(props: {
   customer: Customer;
   cart: Cart;
-}): react_jsx_runtime4.JSX.Element | undefined;
+}): react_jsx_runtime0.JSX.Element | undefined;
 //#endregion
 export { CartMismatchBanner };
 //# sourceMappingURL=index.d.ts.map

package/dist/components/cart-mismatch-banner/index.js

@@ -12,13 +12,17 @@ function CartMismatchBanner(props) {
 	const { customer, cart } = props;
 	const [isPending, setIsPending] = useState(false);
 	const [actionText, setActionText] = useState("Run transfer again");
+	const [transferComplete, setTransferComplete] = useState(false);
 	const ctx = useStorefrontContext();
-	if (!customer || !!cart.customerId) return;
+	if (!customer || !!cart.customerId || transferComplete) return;
 	const handleSubmit = async () => {
 		try {
 			setIsPending(true);
 			setActionText("Transferring..");
-			await transferCart(ctx);
+			const result = await transferCart(ctx);
+			setIsPending(false);
+			if (result?.customerId) setTransferComplete(true);
+			else setActionText("Run transfer again");
 		} catch {
 			setActionText("Run transfer again");
 			setIsPending(false);

package/dist/components/cart-mismatch-banner/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/cart-mismatch-banner/index.tsx"],"sourcesContent":["'use client';\n\nimport { useState } from 'react';\n\nimport { ExclamationCircleSolid } from '@medusajs/icons';\nimport { Button } from '@medusajs/ui';\n\nimport { useStorefrontContext } from '@/lib/data/context';\nimport { transferCart } from '@/lib/data/customer';\nimport { Customer } from '@/types/graphql';\nimport { Cart } from '@/types/graphql';\n\nfunction CartMismatchBanner(props: { customer: Customer; cart: Cart }) {\n  const { customer, cart } = props;\n  const [isPending, setIsPending] = useState(false);\n  const [actionText, setActionText] = useState('Run transfer again');\n  const ctx = useStorefrontContext();\n\n  if (!customer || !!cart.customerId) {\n    return;\n  }\n\n  const handleSubmit = async () => {\n    try {\n      setIsPending(true);\n      setActionText('Transferring..');\n\n      await transferCart(ctx);\n    } catch {\n      setActionText('Run transfer again');\n      setIsPending(false);\n    }\n  };\n\n  return (\n    <div className=\"small:gap-2 small:p-4 mt-2 flex items-center justify-center gap-1 bg-orange-300 p-2 text-center text-sm text-orange-800\">\n      <div className=\"small:flex-row small:gap-2 flex flex-col items-center gap-1\">\n        <span className=\"flex items-center gap-1\">\n          <ExclamationCircleSolid className=\"inline\" />\n          Something went wrong when we tried to transfer your cart\n        </span>\n\n        <span>·</span>\n\n        <Button\n          variant=\"transparent\"\n          className=\"bg-transparent p-0 text-orange-950 hover:bg-transparent focus:bg-transparent active:bg-transparent disabled:text-orange-500\"\n          size=\"base\"\n          disabled={isPending}\n          onClick={handleSubmit}\n        >\n          {actionText}\n        </Button>\n      </div>\n    </div>\n  );\n}\n\nexport { CartMismatchBanner };\n"],"mappings":";;;;;;;;;;AAYA,SAAS,mBAAmB,OAA2C;CACrE,MAAM,EAAE,UAAU,SAAS;CAC3B,MAAM,CAAC,WAAW,gBAAgB,SAAS,MAAM;CACjD,MAAM,CAAC,YAAY,iBAAiB,SAAS,qBAAqB;CAClE,MAAM,MAAM,sBAAsB;AAElC,KAAI,CAAC,YAAY,CAAC,CAAC,KAAK,WACtB;CAGF,MAAM,eAAe,YAAY;AAC/B,MAAI;AACF,gBAAa,KAAK;AAClB,iBAAc,iBAAiB;AAE/B,SAAM,aAAa,IAAI;UACjB;AACN,iBAAc,qBAAqB;AACnC,gBAAa,MAAM;;;AAIvB,QACE,oBAAC;EAAI,WAAU;YACb,qBAAC;GAAI,WAAU;;IACb,qBAAC;KAAK,WAAU;gBACd,oBAAC,0BAAuB,WAAU,WAAW;MAExC;IAEP,oBAAC,oBAAK,MAAQ;IAEd,oBAAC;KACC,SAAQ;KACR,WAAU;KACV,MAAK;KACL,UAAU;KACV,SAAS;eAER;MACM;;IACL;GACF"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/cart-mismatch-banner/index.tsx"],"sourcesContent":["'use client';\n\nimport { useState } from 'react';\n\nimport { ExclamationCircleSolid } from '@medusajs/icons';\nimport { Button } from '@medusajs/ui';\n\nimport { useStorefrontContext } from '@/lib/data/context';\nimport { transferCart } from '@/lib/data/customer';\nimport { Customer } from '@/types/graphql';\nimport { Cart } from '@/types/graphql';\n\nfunction CartMismatchBanner(props: { customer: Customer; cart: Cart }) {\n  const { customer, cart } = props;\n  const [isPending, setIsPending] = useState(false);\n  const [actionText, setActionText] = useState('Run transfer again');\n  const [transferComplete, setTransferComplete] = useState(false);\n  const ctx = useStorefrontContext();\n\n  if (!customer || !!cart.customerId || transferComplete) {\n    return;\n  }\n\n  const handleSubmit = async () => {\n    try {\n      setIsPending(true);\n      setActionText('Transferring..');\n\n      const result = await transferCart(ctx);\n\n      setIsPending(false);\n      if (result?.customerId) {\n        setTransferComplete(true);\n      } else {\n        setActionText('Run transfer again');\n      }\n    } catch {\n      setActionText('Run transfer again');\n      setIsPending(false);\n    }\n  };\n\n  return (\n    <div className=\"small:gap-2 small:p-4 mt-2 flex items-center justify-center gap-1 bg-orange-300 p-2 text-center text-sm text-orange-800\">\n      <div className=\"small:flex-row small:gap-2 flex flex-col items-center gap-1\">\n        <span className=\"flex items-center gap-1\">\n          <ExclamationCircleSolid className=\"inline\" />\n          Something went wrong when we tried to transfer your cart\n        </span>\n\n        <span>·</span>\n\n        <Button\n          variant=\"transparent\"\n          className=\"bg-transparent p-0 text-orange-950 hover:bg-transparent focus:bg-transparent active:bg-transparent disabled:text-orange-500\"\n          size=\"base\"\n          disabled={isPending}\n          onClick={handleSubmit}\n        >\n          {actionText}\n        </Button>\n      </div>\n    </div>\n  );\n}\n\nexport { CartMismatchBanner };\n"],"mappings":";;;;;;;;;;AAYA,SAAS,mBAAmB,OAA2C;CACrE,MAAM,EAAE,UAAU,SAAS;CAC3B,MAAM,CAAC,WAAW,gBAAgB,SAAS,MAAM;CACjD,MAAM,CAAC,YAAY,iBAAiB,SAAS,qBAAqB;CAClE,MAAM,CAAC,kBAAkB,uBAAuB,SAAS,MAAM;CAC/D,MAAM,MAAM,sBAAsB;AAElC,KAAI,CAAC,YAAY,CAAC,CAAC,KAAK,cAAc,iBACpC;CAGF,MAAM,eAAe,YAAY;AAC/B,MAAI;AACF,gBAAa,KAAK;AAClB,iBAAc,iBAAiB;GAE/B,MAAM,SAAS,MAAM,aAAa,IAAI;AAEtC,gBAAa,MAAM;AACnB,OAAI,QAAQ,WACV,qBAAoB,KAAK;OAEzB,eAAc,qBAAqB;UAE/B;AACN,iBAAc,qBAAqB;AACnC,gBAAa,MAAM;;;AAIvB,QACE,oBAAC;EAAI,WAAU;YACb,qBAAC;GAAI,WAAU;;IACb,qBAAC;KAAK,WAAU;gBACd,oBAAC,0BAAuB,WAAU,WAAW;MAExC;IAEP,oBAAC,oBAAK,MAAQ;IAEd,oBAAC;KACC,SAAQ;KACR,WAAU;KACV,MAAK;KACL,UAAU;KACV,SAAS;eAER;MACM;;IACL;GACF"}

package/dist/components/delete-button/index.d.ts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime5 from "react/jsx-runtime";
+import * as react_jsx_runtime1 from "react/jsx-runtime";
 
 //#region src/components/delete-button/index.d.ts
 declare const DeleteButton: ({
@@ -9,7 +9,7 @@ declare const DeleteButton: ({
   id: string;
   children?: React.ReactNode;
   className?: string;
-}) => react_jsx_runtime5.JSX.Element;
+}) => react_jsx_runtime1.JSX.Element;
 //#endregion
 export { DeleteButton };
 //# sourceMappingURL=index.d.ts.map

package/dist/components/error-message/index.d.ts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime10 from "react/jsx-runtime";
+import * as react_jsx_runtime2 from "react/jsx-runtime";
 
 //#region src/components/error-message/index.d.ts
 declare const ErrorMessage: ({
@@ -7,7 +7,7 @@ declare const ErrorMessage: ({
 }: {
   error?: string | null;
   "data-testid"?: string;
-}) => react_jsx_runtime10.JSX.Element | null;
+}) => react_jsx_runtime2.JSX.Element | null;
 //#endregion
 export { ErrorMessage };
 //# sourceMappingURL=index.d.ts.map

package/dist/components/error-message/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","names":[],"sources":["../../../src/components/error-message/index.tsx"],"sourcesContent":[],"mappings":";;;cAAM;;iBAAgB;AAMrB;;;AAAA,CAAA,EAAA,GAAA,mBAAA,CAAA,GAAA,CAAA,OAAA,GAaA,IAAA"}
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../../src/components/error-message/index.tsx"],"sourcesContent":[],"mappings":";;;cAAM;;iBAAgB;AAMrB;;;AAAA,CAAA,EAAA,GAAA,kBAAA,CAAA,GAAA,CAAA,OAAA,GAaA,IAAA"}

package/dist/components/free-shipping-price-nudge/index.d.ts

@@ -1,5 +1,5 @@
 import { Cart, ShippingOption } from "../../types/graphql.js";
-import * as react_jsx_runtime7 from "react/jsx-runtime";
+import * as react_jsx_runtime3 from "react/jsx-runtime";
 
 //#region src/components/free-shipping-price-nudge/index.d.ts
 declare function ShippingPriceNudge({
@@ -10,7 +10,7 @@ declare function ShippingPriceNudge({
   variant?: 'popup' | 'inline';
   cart: Cart;
   shippingOptions: ShippingOption[];
-}): react_jsx_runtime7.JSX.Element | undefined;
+}): react_jsx_runtime3.JSX.Element | undefined;
 //#endregion
 export { ShippingPriceNudge };
 //# sourceMappingURL=index.d.ts.map

package/dist/components/interactive-link/index.d.ts

@@ -1,17 +1,20 @@
-import * as react_jsx_runtime0 from "react/jsx-runtime";
+import { LocalizedClientLink } from "../localized-client-link/index.js";
+import * as react_jsx_runtime5 from "react/jsx-runtime";
 
 //#region src/components/interactive-link/index.d.ts
-type InteractiveLinkProps = {
-  href: string;
-  children?: React.ReactNode;
-  onClick?: () => void;
+type InteractiveLinkProps = React.ComponentPropsWithoutRef<typeof LocalizedClientLink> & {
+  textClassName?: string;
+  iconClassName?: string;
 };
 declare const InteractiveLink: ({
   href,
   children,
   onClick,
+  className,
+  textClassName,
+  iconClassName,
   ...props
-}: InteractiveLinkProps) => react_jsx_runtime0.JSX.Element;
+}: InteractiveLinkProps) => react_jsx_runtime5.JSX.Element;
 //#endregion
 export { InteractiveLink };
 //# sourceMappingURL=index.d.ts.map

package/dist/components/interactive-link/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","names":[],"sources":["../../../src/components/interactive-link/index.tsx"],"sourcesContent":[],"mappings":";;;KAKK,oBAAA;;aAEQ,KAAA,CAAM;EAFd,OAAA,CAAA,EAAA,GAAA,GAAA,IAAA;AAEuB,CAAA;cAItB,eAAmB,EAAA,CAAA;EAAA,IAAA;EAAA,QAAA;EAAA,OAAA;EAAA,GAAA;AAAA,CAAA,EAKtB,oBALsB,EAAA,GAKF,kBAAA,CAAA,GAAA,CAAA,OALE"}
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../../src/components/interactive-link/index.tsx"],"sourcesContent":[],"mappings":";;;;KAKK,oBAAA,GAAuB,KAAA,CAAM,gCACzB;;;AAHsD,CAAA;AAEL,cAOpD,eA0BL,EAAA,CAAA;EAAA,IAAA;EAAA,QAAA;EAAA,OAAA;EAAA,SAAA;EAAA,aAAA;EAAA,aAAA;EAAA,GAAA;AAAA,CAAA,EAlBE,oBAkBF,EAAA,GAlBsB,kBAAA,CAAA,GAAA,CAAA,OAkBtB"}

package/dist/components/interactive-link/index.js

@@ -1,21 +1,21 @@
 import { LocalizedClientLink } from "../localized-client-link/index.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { ArrowUpRightMini } from "@medusajs/icons";
-import { Text } from "@medusajs/ui";
+import { Text, clx } from "@medusajs/ui";
 
 //#region src/components/interactive-link/index.tsx
-const InteractiveLink = ({ href, children, onClick, ...props }) => {
+const InteractiveLink = ({ href, children, onClick, className, textClassName, iconClassName, ...props }) => {
 	return /* @__PURE__ */ jsxs(LocalizedClientLink, {
-		className: "group flex items-center gap-x-1",
+		className: clx("text-ui-fg-interactive group flex items-center gap-x-1", className),
 		href,
 		onClick,
 		...props,
 		children: [/* @__PURE__ */ jsx(Text, {
-			className: "text-ui-fg-interactive",
+			className: clx("text-current", textClassName),
 			children
 		}), /* @__PURE__ */ jsx(ArrowUpRightMini, {
-			className: "duration-150 ease-in-out group-hover:rotate-45",
-			color: "var(--fg-interactive)"
+			className: clx("duration-150 ease-in-out group-hover:rotate-45", iconClassName),
+			color: "currentColor"
 		})]
 	});
 };

package/dist/components/interactive-link/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/interactive-link/index.tsx"],"sourcesContent":["import { ArrowUpRightMini } from '@medusajs/icons';\nimport { Text } from '@medusajs/ui';\n\nimport { LocalizedClientLink } from '../localized-client-link';\n\ntype InteractiveLinkProps = {\n  href: string;\n  children?: React.ReactNode;\n  onClick?: () => void;\n};\n\nconst InteractiveLink = ({\n  href,\n  children,\n  onClick,\n  ...props\n}: InteractiveLinkProps) => {\n  return (\n    <LocalizedClientLink\n      className=\"group flex items-center gap-x-1\"\n      href={href}\n      onClick={onClick}\n      {...props}\n    >\n      <Text className=\"text-ui-fg-interactive\">{children}</Text>\n      <ArrowUpRightMini\n        className=\"duration-150 ease-in-out group-hover:rotate-45\"\n        color=\"var(--fg-interactive)\"\n      />\n    </LocalizedClientLink>\n  );\n};\n\nexport { InteractiveLink };\n"],"mappings":";;;;;;AAWA,MAAM,mBAAmB,EACvB,MACA,UACA,SACA,GAAG,YACuB;AAC1B,QACE,qBAAC;EACC,WAAU;EACJ;EACG;EACT,GAAI;aAEJ,oBAAC;GAAK,WAAU;GAA0B;IAAgB,EAC1D,oBAAC;GACC,WAAU;GACV,OAAM;IACN;GACkB"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/interactive-link/index.tsx"],"sourcesContent":["import { ArrowUpRightMini } from '@medusajs/icons';\nimport { Text, clx } from '@medusajs/ui';\n\nimport { LocalizedClientLink } from '../localized-client-link';\n\ntype InteractiveLinkProps = React.ComponentPropsWithoutRef<\n  typeof LocalizedClientLink\n> & {\n  textClassName?: string;\n  iconClassName?: string;\n};\n\nconst InteractiveLink = ({\n  href,\n  children,\n  onClick,\n  className,\n  textClassName,\n  iconClassName,\n  ...props\n}: InteractiveLinkProps) => {\n  return (\n    <LocalizedClientLink\n      className={clx('text-ui-fg-interactive group flex items-center gap-x-1', className)}\n      href={href}\n      onClick={onClick}\n      {...props}\n    >\n      <Text className={clx('text-current', textClassName)}>{children}</Text>\n      <ArrowUpRightMini\n        className={clx(\n          'duration-150 ease-in-out group-hover:rotate-45',\n          iconClassName\n        )}\n        color=\"currentColor\"\n      />\n    </LocalizedClientLink>\n  );\n};\n\nexport { InteractiveLink };\n"],"mappings":";;;;;;AAYA,MAAM,mBAAmB,EACvB,MACA,UACA,SACA,WACA,eACA,eACA,GAAG,YACuB;AAC1B,QACE,qBAAC;EACC,WAAW,IAAI,0DAA0D,UAAU;EAC7E;EACG;EACT,GAAI;aAEJ,oBAAC;GAAK,WAAW,IAAI,gBAAgB,cAAc;GAAG;IAAgB,EACtE,oBAAC;GACC,WAAW,IACT,kDACA,cACD;GACD,OAAM;IACN;GACkB"}

package/dist/components/line-item-options/index.d.ts

@@ -1,5 +1,5 @@
 import { Maybe, ProductVariant } from "../../types/graphql.js";
-import * as react_jsx_runtime0 from "react/jsx-runtime";
+import * as react_jsx_runtime7 from "react/jsx-runtime";
 
 //#region src/components/line-item-options/index.d.ts
 type LineItemOptionsProps = {
@@ -11,7 +11,7 @@ declare const LineItemOptions: ({
   variant,
   "data-testid": dataTestid,
   "data-value": dataValue
-}: LineItemOptionsProps) => react_jsx_runtime0.JSX.Element;
+}: LineItemOptionsProps) => react_jsx_runtime7.JSX.Element;
 //#endregion
 export { LineItemOptions };
 //# sourceMappingURL=index.d.ts.map

package/dist/components/line-item-price/index.d.ts

@@ -1,5 +1,5 @@
 import { LineItem } from "../../types/graphql.js";
-import * as react_jsx_runtime11 from "react/jsx-runtime";
+import * as react_jsx_runtime8 from "react/jsx-runtime";
 
 //#region src/components/line-item-price/index.d.ts
 type LineItemPriceProps = {
@@ -11,7 +11,7 @@ declare const LineItemPrice: ({
   item,
   style,
   currencyCode
-}: LineItemPriceProps) => react_jsx_runtime11.JSX.Element;
+}: LineItemPriceProps) => react_jsx_runtime8.JSX.Element;
 //#endregion
 export { LineItemPrice };
 //# sourceMappingURL=index.d.ts.map

package/dist/components/line-item-price/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","names":[],"sources":["../../../src/components/line-item-price/index.tsx"],"sourcesContent":[],"mappings":";;;;KAMK,kBAAA;QACG;;EADH,YAAA,EAAA,MAAA;AACW,CAAA;cAKV,aAAiB,EAAA,CAAA;EAAA,IAAA;EAAA,KAAA;EAAA;AAAA,CAAA,EAIpB,kBAJoB,EAAA,GAIF,mBAAA,CAAA,GAAA,CAAA,OAJE"}
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../../src/components/line-item-price/index.tsx"],"sourcesContent":[],"mappings":";;;;KAMK,kBAAA;QACG;;EADH,YAAA,EAAA,MAAA;AACW,CAAA;cAKV,aAAiB,EAAA,CAAA;EAAA,IAAA;EAAA,KAAA;EAAA;AAAA,CAAA,EAIpB,kBAJoB,EAAA,GAIF,kBAAA,CAAA,GAAA,CAAA,OAJE"}

package/dist/components/localized-client-link/index.d.ts

@@ -1,5 +1,5 @@
 import { AnchorHTMLAttributes, DetailedHTMLProps } from "react";
-import * as react_jsx_runtime1 from "react/jsx-runtime";
+import * as react_jsx_runtime4 from "react/jsx-runtime";
 
 //#region src/components/localized-client-link/index.d.ts
 type LocalizedClientLinkProps = DetailedHTMLProps<AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement> & {
@@ -10,7 +10,7 @@ declare const LocalizedClientLink: ({
   href,
   locale,
   ...props
-}: LocalizedClientLinkProps) => react_jsx_runtime1.JSX.Element;
+}: LocalizedClientLinkProps) => react_jsx_runtime4.JSX.Element;
 //#endregion
 export { LocalizedClientLink };
 //# sourceMappingURL=index.d.ts.map

package/dist/components/modal/index.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import * as react_jsx_runtime3 from "react/jsx-runtime";
+import * as react_jsx_runtime6 from "react/jsx-runtime";
 
 //#region src/components/modal/index.d.ts
 type ModalProps = {
@@ -20,7 +20,7 @@ declare const Modal: {
     children,
     "data-testid": dataTestId,
     "aria-label": ariaLabel
-  }: ModalProps): react_jsx_runtime3.JSX.Element;
+  }: ModalProps): react_jsx_runtime6.JSX.Element;
   Title: React.FC<{
     children: React.ReactNode;
   }>;

package/dist/components/modal/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","names":[],"sources":["../../../src/components/modal/index.tsx"],"sourcesContent":[],"mappings":";;;;KAQK,UAAA;;;EAAA,IAAA,CAAA,EAAA,OAAU,GAAA,QAAA,GAKH,OAAM;EAKZ,MAAA,CAAA,EAqEL,OAAA;YA1EW,KAAA,CAAM;;;;cAKZ;;;;;;;;;KAQH,aAAU,kBAAA,CAAA,GAAA,CAAA;;IAAV,QAAA,EA+D+B,KAAA,CAAM,SA/DrC;EAAU,CAAA,CAAA;EA+DqB,WAAM,UAAA,CAAA;cAeA,KAAA,CAAM;EAAN,CAAA,CAAA;;IAQD,QAAA,EAAN,KAAA,CAAM,SAAA;;EAIJ,MAAM,UAAA,CAAA;cAAN,KAAA,CAAM"}
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../../src/components/modal/index.tsx"],"sourcesContent":[],"mappings":";;;;KAQK,UAAA;;;EAAA,IAAA,CAAA,EAAA,OAAU,GAAA,QAAA,GAKH,OAAM;EAKZ,MAAA,CAAA,EAmEL,OAAA;YAxEW,KAAA,CAAM;;;;cAKZ;;;;;;;;;KAQH,aAAU,kBAAA,CAAA,GAAA,CAAA;;IAAV,QAAA,EA6D+B,KAAA,CAAM,SA7DrC;EAAU,CAAA,CAAA;EA6DqB,WAAM,UAAA,CAAA;cAeA,KAAA,CAAM;EAAN,CAAA,CAAA;;IAQD,QAAA,EAAN,KAAA,CAAM,SAAA;;EAIJ,MAAM,UAAA,CAAA;cAAN,KAAA,CAAM"}

package/dist/components/modal/index.js

@@ -24,13 +24,13 @@ const Modal = ({ isOpen, close, size = "medium", search = false, children, "data
 				leave: "ease-in duration-200",
 				leaveFrom: "opacity-100",
 				leaveTo: "opacity-0",
-				children: /* @__PURE__ */ jsx("div", { className: "fixed inset-0 h-screen bg-opacity-75 backdrop-blur-md" })
+				children: /* @__PURE__ */ jsx("div", { className: "fixed inset-0 h-screen bg-black/20 backdrop-blur-sm" })
 			}), /* @__PURE__ */ jsx("div", {
 				className: "fixed inset-0 overflow-y-hidden",
 				children: /* @__PURE__ */ jsx("div", {
-					className: clx("flex h-full min-h-full justify-center p-4 text-center", {
-						"items-center": !search,
-						"items-start": search
+					className: clx("flex h-full min-h-full justify-center text-center", {
+						"items-center p-4": !search,
+						"items-start small:pt-[68px] small:px-4 small:pb-4": search
 					}),
 					children: /* @__PURE__ */ jsx(Transition.Child, {
 						as: Fragment,
@@ -42,12 +42,10 @@ const Modal = ({ isOpen, close, size = "medium", search = false, children, "data
 						leaveTo: "opacity-0 scale-95",
 						children: /* @__PURE__ */ jsx(Dialog.Panel, {
 							"data-testid": dataTestId,
-							className: clx("flex h-fit max-h-[75vh] w-full transform flex-col justify-start p-5 text-left align-middle transition-all", {
+							className: clx("flex h-dvh small:h-fit small:max-h-[75vh] w-full transform flex-col justify-start rounded-none small:rounded-rounded border bg-white p-4 small:p-5 shadow-xl text-left align-middle transition-all", {
 								"max-w-md": size === "small",
 								"max-w-xl": size === "medium",
-								"max-w-3xl": size === "large",
-								"bg-transparent shadow-none": search,
-								"rounded-rounded border bg-white shadow-xl": !search
+								"max-w-3xl": size === "large"
 							}),
 							children: /* @__PURE__ */ jsx(ModalProvider, {
 								close,

package/dist/components/modal/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["Title: React.FC<{ children: React.ReactNode }>","Description: React.FC<{ children: React.ReactNode }>","Body: React.FC<{ children: React.ReactNode }>","Footer: React.FC<{ children: React.ReactNode }>"],"sources":["../../../src/components/modal/index.tsx"],"sourcesContent":["import React, { Fragment } from 'react';\n\nimport { X } from '@gfed-medusa/sf-lib-ui/icons/x';\nimport { Dialog, Transition } from '@headlessui/react';\nimport { clx } from '@medusajs/ui';\n\nimport { ModalProvider, useModal } from '@/lib/context/modal-context';\n\ntype ModalProps = {\n  isOpen: boolean;\n  close: () => void;\n  size?: 'small' | 'medium' | 'large';\n  search?: boolean;\n  children: React.ReactNode;\n  'data-testid'?: string;\n  'aria-label'?: string;\n};\n\nconst Modal = ({\n  isOpen,\n  close,\n  size = 'medium',\n  search = false,\n  children,\n  'data-testid': dataTestId,\n  'aria-label': ariaLabel,\n}: ModalProps) => {\n  return (\n    <Transition appear show={isOpen} as={Fragment}>\n      <Dialog\n        as=\"div\"\n        className=\"relative z-[75]\"\n        onClose={close}\n        aria-label={ariaLabel}\n      >\n        <Transition.Child\n          as={Fragment}\n          enter=\"ease-out duration-300\"\n          enterFrom=\"opacity-0\"\n          enterTo=\"opacity-100\"\n          leave=\"ease-in duration-200\"\n          leaveFrom=\"opacity-100\"\n          leaveTo=\"opacity-0\"\n        >\n          <div className=\"fixed inset-0 h-screen bg-opacity-75 backdrop-blur-md\" />\n        </Transition.Child>\n\n        <div className=\"fixed inset-0 overflow-y-hidden\">\n          <div\n            className={clx(\n              'flex h-full min-h-full justify-center p-4 text-center',\n              {\n                'items-center': !search,\n                'items-start': search,\n              }\n            )}\n          >\n            <Transition.Child\n              as={Fragment}\n              enter=\"ease-out duration-300\"\n              enterFrom=\"opacity-0 scale-95\"\n              enterTo=\"opacity-100 scale-100\"\n              leave=\"ease-in duration-200\"\n              leaveFrom=\"opacity-100 scale-100\"\n              leaveTo=\"opacity-0 scale-95\"\n            >\n              <Dialog.Panel\n                data-testid={dataTestId}\n                className={clx(\n                  'flex h-fit max-h-[75vh] w-full transform flex-col justify-start p-5 text-left align-middle transition-all',\n                  {\n                    'max-w-md': size === 'small',\n                    'max-w-xl': size === 'medium',\n                    'max-w-3xl': size === 'large',\n                    'bg-transparent shadow-none': search,\n                    'rounded-rounded border bg-white shadow-xl': !search,\n                  }\n                )}\n              >\n                <ModalProvider close={close}>{children}</ModalProvider>\n              </Dialog.Panel>\n            </Transition.Child>\n          </div>\n        </div>\n      </Dialog>\n    </Transition>\n  );\n};\n\nconst Title: React.FC<{ children: React.ReactNode }> = ({ children }) => {\n  const { close } = useModal();\n\n  return (\n    <Dialog.Title className=\"flex items-center justify-between\">\n      <div className=\"text-large-semi\">{children}</div>\n      <div>\n        <button onClick={close} data-testid=\"close-modal-button\">\n          <X size={20} />\n        </button>\n      </div>\n    </Dialog.Title>\n  );\n};\n\nconst Description: React.FC<{ children: React.ReactNode }> = ({ children }) => {\n  return (\n    <Dialog.Description className=\"text-small-regular text-ui-fg-base flex h-full items-center justify-center pb-4 pt-2\">\n      {children}\n    </Dialog.Description>\n  );\n};\n\nconst Body: React.FC<{ children: React.ReactNode }> = ({ children }) => {\n  return <div className=\"flex justify-center\">{children}</div>;\n};\n\nconst Footer: React.FC<{ children: React.ReactNode }> = ({ children }) => {\n  return (\n    <div className=\"flex items-center justify-end gap-x-4\">{children}</div>\n  );\n};\n\nModal.Title = Title;\nModal.Description = Description;\nModal.Body = Body;\nModal.Footer = Footer;\n\nexport { Modal };\n"],"mappings":";;;;;;;;AAkBA,MAAM,SAAS,EACb,QACA,OACA,OAAO,UACP,SAAS,OACT,UACA,eAAe,YACf,cAAc,gBACE;AAChB,QACE,oBAAC;EAAW;EAAO,MAAM;EAAQ,IAAI;YACnC,qBAAC;GACC,IAAG;GACH,WAAU;GACV,SAAS;GACT,cAAY;cAEZ,oBAAC,WAAW;IACV,IAAI;IACJ,OAAM;IACN,WAAU;IACV,SAAQ;IACR,OAAM;IACN,WAAU;IACV,SAAQ;cAER,oBAAC,SAAI,WAAU,0DAA0D;KACxD,EAEnB,oBAAC;IAAI,WAAU;cACb,oBAAC;KACC,WAAW,IACT,yDACA;MACE,gBAAgB,CAAC;MACjB,eAAe;MAChB,CACF;eAED,oBAAC,WAAW;MACV,IAAI;MACJ,OAAM;MACN,WAAU;MACV,SAAQ;MACR,OAAM;MACN,WAAU;MACV,SAAQ;gBAER,oBAAC,OAAO;OACN,eAAa;OACb,WAAW,IACT,6GACA;QACE,YAAY,SAAS;QACrB,YAAY,SAAS;QACrB,aAAa,SAAS;QACtB,8BAA8B;QAC9B,6CAA6C,CAAC;QAC/C,CACF;iBAED,oBAAC;QAAqB;QAAQ;SAAyB;QAC1C;OACE;MACf;KACF;IACC;GACE;;AAIjB,MAAMA,SAAkD,EAAE,eAAe;CACvE,MAAM,EAAE,UAAU,UAAU;AAE5B,QACE,qBAAC,OAAO;EAAM,WAAU;aACtB,oBAAC;GAAI,WAAU;GAAmB;IAAe,EACjD,oBAAC,mBACC,oBAAC;GAAO,SAAS;GAAO,eAAY;aAClC,oBAAC,KAAE,MAAM,KAAM;IACR,GACL;GACO;;AAInB,MAAMC,eAAwD,EAAE,eAAe;AAC7E,QACE,oBAAC,OAAO;EAAY,WAAU;EAC3B;GACkB;;AAIzB,MAAMC,QAAiD,EAAE,eAAe;AACtE,QAAO,oBAAC;EAAI,WAAU;EAAuB;GAAe;;AAG9D,MAAMC,UAAmD,EAAE,eAAe;AACxE,QACE,oBAAC;EAAI,WAAU;EAAyC;GAAe;;AAI3E,MAAM,QAAQ;AACd,MAAM,cAAc;AACpB,MAAM,OAAO;AACb,MAAM,SAAS"}
+{"version":3,"file":"index.js","names":["Title: React.FC<{ children: React.ReactNode }>","Description: React.FC<{ children: React.ReactNode }>","Body: React.FC<{ children: React.ReactNode }>","Footer: React.FC<{ children: React.ReactNode }>"],"sources":["../../../src/components/modal/index.tsx"],"sourcesContent":["import React, { Fragment } from 'react';\n\nimport { X } from '@gfed-medusa/sf-lib-ui/icons/x';\nimport { Dialog, Transition } from '@headlessui/react';\nimport { clx } from '@medusajs/ui';\n\nimport { ModalProvider, useModal } from '@/lib/context/modal-context';\n\ntype ModalProps = {\n  isOpen: boolean;\n  close: () => void;\n  size?: 'small' | 'medium' | 'large';\n  search?: boolean;\n  children: React.ReactNode;\n  'data-testid'?: string;\n  'aria-label'?: string;\n};\n\nconst Modal = ({\n  isOpen,\n  close,\n  size = 'medium',\n  search = false,\n  children,\n  'data-testid': dataTestId,\n  'aria-label': ariaLabel,\n}: ModalProps) => {\n  return (\n    <Transition appear show={isOpen} as={Fragment}>\n      <Dialog\n        as=\"div\"\n        className=\"relative z-[75]\"\n        onClose={close}\n        aria-label={ariaLabel}\n      >\n        <Transition.Child\n          as={Fragment}\n          enter=\"ease-out duration-300\"\n          enterFrom=\"opacity-0\"\n          enterTo=\"opacity-100\"\n          leave=\"ease-in duration-200\"\n          leaveFrom=\"opacity-100\"\n          leaveTo=\"opacity-0\"\n        >\n          <div className=\"fixed inset-0 h-screen bg-black/20 backdrop-blur-sm\" />\n        </Transition.Child>\n\n        <div className=\"fixed inset-0 overflow-y-hidden\">\n          <div\n            className={clx(\n              'flex h-full min-h-full justify-center text-center',\n              {\n                'items-center p-4': !search,\n                'items-start small:pt-[68px] small:px-4 small:pb-4': search,\n              }\n            )}\n          >\n            <Transition.Child\n              as={Fragment}\n              enter=\"ease-out duration-300\"\n              enterFrom=\"opacity-0 scale-95\"\n              enterTo=\"opacity-100 scale-100\"\n              leave=\"ease-in duration-200\"\n              leaveFrom=\"opacity-100 scale-100\"\n              leaveTo=\"opacity-0 scale-95\"\n            >\n              <Dialog.Panel\n                data-testid={dataTestId}\n                className={clx(\n                  'flex h-dvh small:h-fit small:max-h-[75vh] w-full transform flex-col justify-start rounded-none small:rounded-rounded border bg-white p-4 small:p-5 shadow-xl text-left align-middle transition-all',\n                  {\n                    'max-w-md': size === 'small',\n                    'max-w-xl': size === 'medium',\n                    'max-w-3xl': size === 'large',\n                  }\n                )}\n              >\n                <ModalProvider close={close}>{children}</ModalProvider>\n              </Dialog.Panel>\n            </Transition.Child>\n          </div>\n        </div>\n      </Dialog>\n    </Transition>\n  );\n};\n\nconst Title: React.FC<{ children: React.ReactNode }> = ({ children }) => {\n  const { close } = useModal();\n\n  return (\n    <Dialog.Title className=\"flex items-center justify-between\">\n      <div className=\"text-large-semi\">{children}</div>\n      <div>\n        <button onClick={close} data-testid=\"close-modal-button\">\n          <X size={20} />\n        </button>\n      </div>\n    </Dialog.Title>\n  );\n};\n\nconst Description: React.FC<{ children: React.ReactNode }> = ({ children }) => {\n  return (\n    <Dialog.Description className=\"text-small-regular text-ui-fg-base flex h-full items-center justify-center pb-4 pt-2\">\n      {children}\n    </Dialog.Description>\n  );\n};\n\nconst Body: React.FC<{ children: React.ReactNode }> = ({ children }) => {\n  return <div className=\"flex justify-center\">{children}</div>;\n};\n\nconst Footer: React.FC<{ children: React.ReactNode }> = ({ children }) => {\n  return (\n    <div className=\"flex items-center justify-end gap-x-4\">{children}</div>\n  );\n};\n\nModal.Title = Title;\nModal.Description = Description;\nModal.Body = Body;\nModal.Footer = Footer;\n\nexport { Modal };\n"],"mappings":";;;;;;;;AAkBA,MAAM,SAAS,EACb,QACA,OACA,OAAO,UACP,SAAS,OACT,UACA,eAAe,YACf,cAAc,gBACE;AAChB,QACE,oBAAC;EAAW;EAAO,MAAM;EAAQ,IAAI;YACnC,qBAAC;GACC,IAAG;GACH,WAAU;GACV,SAAS;GACT,cAAY;cAEZ,oBAAC,WAAW;IACV,IAAI;IACJ,OAAM;IACN,WAAU;IACV,SAAQ;IACR,OAAM;IACN,WAAU;IACV,SAAQ;cAER,oBAAC,SAAI,WAAU,wDAAwD;KACtD,EAEnB,oBAAC;IAAI,WAAU;cACb,oBAAC;KACC,WAAW,IACT,qDACA;MACE,oBAAoB,CAAC;MACrB,qDAAqD;MACtD,CACF;eAED,oBAAC,WAAW;MACV,IAAI;MACJ,OAAM;MACN,WAAU;MACV,SAAQ;MACR,OAAM;MACN,WAAU;MACV,SAAQ;gBAER,oBAAC,OAAO;OACN,eAAa;OACb,WAAW,IACT,sMACA;QACE,YAAY,SAAS;QACrB,YAAY,SAAS;QACrB,aAAa,SAAS;QACvB,CACF;iBAED,oBAAC;QAAqB;QAAQ;SAAyB;QAC1C;OACE;MACf;KACF;IACC;GACE;;AAIjB,MAAMA,SAAkD,EAAE,eAAe;CACvE,MAAM,EAAE,UAAU,UAAU;AAE5B,QACE,qBAAC,OAAO;EAAM,WAAU;aACtB,oBAAC;GAAI,WAAU;GAAmB;IAAe,EACjD,oBAAC,mBACC,oBAAC;GAAO,SAAS;GAAO,eAAY;aAClC,oBAAC,KAAE,MAAM,KAAM;IACR,GACL;GACO;;AAInB,MAAMC,eAAwD,EAAE,eAAe;AAC7E,QACE,oBAAC,OAAO;EAAY,WAAU;EAC3B;GACkB;;AAIzB,MAAMC,QAAiD,EAAE,eAAe;AACtE,QAAO,oBAAC;EAAI,WAAU;EAAuB;GAAe;;AAG9D,MAAMC,UAAmD,EAAE,eAAe;AACxE,QACE,oBAAC;EAAI,WAAU;EAAyC;GAAe;;AAI3E,MAAM,QAAQ;AACd,MAAM,cAAc;AACpB,MAAM,OAAO;AACb,MAAM,SAAS"}

package/dist/components/preview-price/index.d.ts

@@ -1,12 +1,12 @@
 import { VariantPrice } from "../../types/prices.js";
-import * as react_jsx_runtime6 from "react/jsx-runtime";
+import * as react_jsx_runtime15 from "react/jsx-runtime";
 
 //#region src/components/preview-price/index.d.ts
 declare function PreviewPrice({
   price
 }: {
   price: VariantPrice;
-}): react_jsx_runtime6.JSX.Element | null;
+}): react_jsx_runtime15.JSX.Element | null;
 //#endregion
 export { PreviewPrice };
 //# sourceMappingURL=index.d.ts.map

package/dist/components/preview-price/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","names":[],"sources":["../../../src/components/preview-price/index.tsx"],"sourcesContent":[],"mappings":";;;;iBAIS,YAAA;;;SAAiC;IAAc,kBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../../src/components/preview-price/index.tsx"],"sourcesContent":[],"mappings":";;;;iBAIS,YAAA;;;SAAiC;IAAc,mBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/product-card/index.d.ts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime12 from "react/jsx-runtime";
+import * as react_jsx_runtime11 from "react/jsx-runtime";
 import { VariantProps } from "class-variance-authority";
 import * as class_variance_authority_types0 from "class-variance-authority/types";
 
@@ -59,7 +59,7 @@ declare function ProductCard({
   variant,
   size,
   className
-}: ProductCardProps): react_jsx_runtime12.JSX.Element;
+}: ProductCardProps): react_jsx_runtime11.JSX.Element;
 //#endregion
 export { ProductCard };
 //# sourceMappingURL=index.d.ts.map

package/dist/components/product-card/index.js

@@ -93,7 +93,7 @@ function ProductCard({ product, rating, badge, variants, variant, size, classNam
 					quality: 60,
 					sizes: "(max-width: 576px) 280px, (max-width: 768px) 360px, (max-width: 992px) 240px, 200px"
 				}), badge && /* @__PURE__ */ jsx("div", {
-					className: "absolute top-2 left-2",
+					className: "absolute left-2 top-2",
 					children: /* @__PURE__ */ jsx(Badge, {
 						variant: "default",
 						children: badge.label

package/dist/components/product-card/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/product-card/index.tsx"],"sourcesContent":["'use client';\n\nimport Image from 'next/image';\n\nimport { type VariantProps, cva } from 'class-variance-authority';\n\nimport { Badge } from '@gfed-medusa/sf-lib-ui/components/badge';\nimport { Button } from '@gfed-medusa/sf-lib-ui/components/button';\nimport { RatingCount } from '@gfed-medusa/sf-lib-ui/components/rating-count';\nimport { VariantSelector } from '@gfed-medusa/sf-lib-ui/components/variant-selector';\nimport { cn } from '@gfed-medusa/sf-lib-ui/lib/utils';\n\nconst productCardVariants = cva(\n  'rounded-2xl border overflow-hidden transition',\n  {\n    variants: {\n      variant: {\n        default: 'flex flex-col shadow-sm hover:shadow-md',\n        withAddToCart: 'flex flex-col shadow-sm hover:shadow-md',\n        minimal: 'flex flex-col hover:shadow hover:border-muted-foreground/30',\n      },\n      size: {\n        sm: 'w-48',\n        md: 'w-64',\n        lg: 'w-80',\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n      size: 'md',\n    },\n  }\n);\n\ninterface Price {\n  current: string;\n  old?: string;\n}\n\ninterface Product {\n  id: string;\n  image: {\n    src: string;\n    alt?: string;\n  };\n  localize?: {\n    currency: string;\n    locale: string;\n  };\n  title: string;\n  href?: string;\n  price: Price;\n}\n\ninterface ProductCardProps extends VariantProps<typeof productCardVariants> {\n  product: Product;\n  rating?: {\n    average: number;\n    count?: number;\n  };\n  badge?: {\n    label: string;\n    variant?: 'default' | 'sale' | 'new' | 'limited';\n  };\n  variants?: {\n    options: {\n      value: string;\n      label?: string;\n      imageSrc?: string;\n      color?: string;\n    }[];\n    value: string;\n    onChange: (value: string) => void;\n  };\n  quantity?: {\n    value: number;\n    onChange: (value: number) => void;\n  };\n  className?: string;\n}\n\nconst formatPrice = (price: Price, locale = 'en-GB', currency = 'GBP') => {\n  const formatter = new Intl.NumberFormat(locale, {\n    style: 'currency',\n    currency,\n  });\n\n  return {\n    currentPrice: formatter.format(Number(price.current)),\n    oldPrice: price.old ? formatter.format(Number(price.old)) : undefined,\n  };\n};\n\nexport function ProductCard({\n  product,\n  rating,\n  badge,\n  variants,\n  variant,\n  size,\n  className,\n}: ProductCardProps) {\n  const { currentPrice, oldPrice } = formatPrice(\n    product.price,\n    product.localize?.locale,\n    product.localize?.currency\n  );\n\n  switch (variant) {\n    case 'minimal':\n      return (\n        <div\n          className={cn(\n            productCardVariants({ variant, size }),\n            'w-60 overflow-hidden rounded-2xl border p-0 shadow-sm'\n          )}\n        >\n          <div className=\"relative h-72 w-full overflow-hidden\">\n            <Image\n              src={product.image.src}\n              alt={product.image.alt ?? product.title}\n              fill\n              className=\"object-cover\"\n              sizes=\"240px\"\n              quality={60}\n            />\n          </div>\n\n          <div className=\"flex flex-col gap-1 p-3\">\n            <div className=\"flex items-center justify-between\">\n              <h3 className=\"truncate text-base font-medium\">\n                {product.href ? (\n                  <a href={product.href} className=\"hover:underline\">\n                    {product.title}\n                  </a>\n                ) : (\n                  product.title\n                )}\n              </h3>\n              <p className=\"mt-0 text-lg font-semibold text-gray-900\">\n                {currentPrice}\n              </p>\n            </div>\n            <p className=\"text-xs text-gray-500\">7 colors</p>\n          </div>\n        </div>\n      );\n    default:\n      return (\n        <div className={cn(productCardVariants({ variant, size }), className)}>\n          {/* Image */}\n          <div className=\"relative aspect-[1/1]\">\n            <Image\n              src={product.image.src}\n              alt={product.image.alt ?? product.title}\n              fill\n              className={cn('object-cover')}\n              priority\n              quality={60}\n              sizes=\"(max-width: 576px) 280px, (max-width: 768px) 360px, (max-width: 992px) 240px, 200px\"\n            />\n            {badge && (\n              <div className=\"absolute top-2 left-2\">\n                <Badge variant=\"default\">{badge.label}</Badge>\n              </div>\n            )}\n          </div>\n\n          {/* Content */}\n          <div className=\"flex flex-col gap-2 p-3\">\n            <h3 className=\"truncate text-base font-medium\">\n              {product.href ? (\n                <a href={product.href} className=\"hover:underline\">\n                  {product.title}\n                </a>\n              ) : (\n                product.title\n              )}\n            </h3>\n\n            {/* Price */}\n            <div className=\"flex items-center gap-2\">\n              <p className=\"text-lg font-semibold\">{currentPrice}</p>\n              {oldPrice && (\n                <p className=\"text-muted-foreground text-sm line-through\">\n                  {oldPrice}\n                </p>\n              )}\n            </div>\n\n            {/* Rating */}\n            {rating !== undefined && (\n              <div\n                data-testid=\"product-card-rating\"\n                className=\"flex items-center gap-2\"\n              >\n                <RatingCount\n                  average={rating.average}\n                  ratingCount={rating.count}\n                />\n              </div>\n            )}\n\n            {/* Variant Selector */}\n            {variants && (\n              <VariantSelector\n                options={variants.options}\n                value={variants.value ?? ''}\n                onChange={variants.onChange}\n                type=\"color\"\n              />\n            )}\n\n            {/* Add to Cart button */}\n            {variant === 'withAddToCart' && (\n              <Button variant=\"default\" className=\"w-full cursor-pointer\">\n                Add to Cart\n              </Button>\n            )}\n          </div>\n        </div>\n      );\n  }\n}\n"],"mappings":";;;;;;;;;;;;AAYA,MAAM,sBAAsB,IAC1B,iDACA;CACE,UAAU;EACR,SAAS;GACP,SAAS;GACT,eAAe;GACf,SAAS;GACV;EACD,MAAM;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACL;EACF;CACD,iBAAiB;EACf,SAAS;EACT,MAAM;EACP;CACF,CACF;AAiDD,MAAM,eAAe,OAAc,SAAS,SAAS,WAAW,UAAU;CACxE,MAAM,YAAY,IAAI,KAAK,aAAa,QAAQ;EAC9C,OAAO;EACP;EACD,CAAC;AAEF,QAAO;EACL,cAAc,UAAU,OAAO,OAAO,MAAM,QAAQ,CAAC;EACrD,UAAU,MAAM,MAAM,UAAU,OAAO,OAAO,MAAM,IAAI,CAAC,GAAG;EAC7D;;AAGH,SAAgB,YAAY,EAC1B,SACA,QACA,OACA,UACA,SACA,MACA,aACmB;CACnB,MAAM,EAAE,cAAc,aAAa,YACjC,QAAQ,OACR,QAAQ,UAAU,QAClB,QAAQ,UAAU,SACnB;AAED,SAAQ,SAAR;EACE,KAAK,UACH,QACE,qBAAC;GACC,WAAW,GACT,oBAAoB;IAAE;IAAS;IAAM,CAAC,EACtC,wDACD;cAED,oBAAC;IAAI,WAAU;cACb,oBAAC;KACC,KAAK,QAAQ,MAAM;KACnB,KAAK,QAAQ,MAAM,OAAO,QAAQ;KAClC;KACA,WAAU;KACV,OAAM;KACN,SAAS;MACT;KACE,EAEN,qBAAC;IAAI,WAAU;eACb,qBAAC;KAAI,WAAU;gBACb,oBAAC;MAAG,WAAU;gBACX,QAAQ,OACP,oBAAC;OAAE,MAAM,QAAQ;OAAM,WAAU;iBAC9B,QAAQ;QACP,GAEJ,QAAQ;OAEP,EACL,oBAAC;MAAE,WAAU;gBACV;OACC;MACA,EACN,oBAAC;KAAE,WAAU;eAAwB;MAAY;KAC7C;IACF;EAEV,QACE,QACE,qBAAC;GAAI,WAAW,GAAG,oBAAoB;IAAE;IAAS;IAAM,CAAC,EAAE,UAAU;cAEnE,qBAAC;IAAI,WAAU;eACb,oBAAC;KACC,KAAK,QAAQ,MAAM;KACnB,KAAK,QAAQ,MAAM,OAAO,QAAQ;KAClC;KACA,WAAW,GAAG,eAAe;KAC7B;KACA,SAAS;KACT,OAAM;MACN,EACD,SACC,oBAAC;KAAI,WAAU;eACb,oBAAC;MAAM,SAAQ;gBAAW,MAAM;OAAc;MAC1C;KAEJ,EAGN,qBAAC;IAAI,WAAU;;KACb,oBAAC;MAAG,WAAU;gBACX,QAAQ,OACP,oBAAC;OAAE,MAAM,QAAQ;OAAM,WAAU;iBAC9B,QAAQ;QACP,GAEJ,QAAQ;OAEP;KAGL,qBAAC;MAAI,WAAU;iBACb,oBAAC;OAAE,WAAU;iBAAyB;QAAiB,EACtD,YACC,oBAAC;OAAE,WAAU;iBACV;QACC;OAEF;KAGL,WAAW,UACV,oBAAC;MACC,eAAY;MACZ,WAAU;gBAEV,oBAAC;OACC,SAAS,OAAO;OAChB,aAAa,OAAO;QACpB;OACE;KAIP,YACC,oBAAC;MACC,SAAS,SAAS;MAClB,OAAO,SAAS,SAAS;MACzB,UAAU,SAAS;MACnB,MAAK;OACL;KAIH,YAAY,mBACX,oBAAC;MAAO,SAAQ;MAAU,WAAU;gBAAwB;OAEnD;;KAEP;IACF"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/product-card/index.tsx"],"sourcesContent":["'use client';\n\nimport Image from 'next/image';\n\nimport { type VariantProps, cva } from 'class-variance-authority';\n\nimport { Badge } from '@gfed-medusa/sf-lib-ui/components/badge';\nimport { Button } from '@gfed-medusa/sf-lib-ui/components/button';\nimport { RatingCount } from '@gfed-medusa/sf-lib-ui/components/rating-count';\nimport { VariantSelector } from '@gfed-medusa/sf-lib-ui/components/variant-selector';\nimport { cn } from '@gfed-medusa/sf-lib-ui/lib/utils';\n\nconst productCardVariants = cva(\n  'rounded-2xl border overflow-hidden transition',\n  {\n    variants: {\n      variant: {\n        default: 'flex flex-col shadow-sm hover:shadow-md',\n        withAddToCart: 'flex flex-col shadow-sm hover:shadow-md',\n        minimal: 'flex flex-col hover:shadow hover:border-muted-foreground/30',\n      },\n      size: {\n        sm: 'w-48',\n        md: 'w-64',\n        lg: 'w-80',\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n      size: 'md',\n    },\n  }\n);\n\ninterface Price {\n  current: string;\n  old?: string;\n}\n\ninterface Product {\n  id: string;\n  image: {\n    src: string;\n    alt?: string;\n  };\n  localize?: {\n    currency: string;\n    locale: string;\n  };\n  title: string;\n  href?: string;\n  price: Price;\n}\n\ninterface ProductCardProps extends VariantProps<typeof productCardVariants> {\n  product: Product;\n  rating?: {\n    average: number;\n    count?: number;\n  };\n  badge?: {\n    label: string;\n    variant?: 'default' | 'sale' | 'new' | 'limited';\n  };\n  variants?: {\n    options: {\n      value: string;\n      label?: string;\n      imageSrc?: string;\n      color?: string;\n    }[];\n    value: string;\n    onChange: (value: string) => void;\n  };\n  quantity?: {\n    value: number;\n    onChange: (value: number) => void;\n  };\n  className?: string;\n}\n\nconst formatPrice = (price: Price, locale = 'en-GB', currency = 'GBP') => {\n  const formatter = new Intl.NumberFormat(locale, {\n    style: 'currency',\n    currency,\n  });\n\n  return {\n    currentPrice: formatter.format(Number(price.current)),\n    oldPrice: price.old ? formatter.format(Number(price.old)) : undefined,\n  };\n};\n\nexport function ProductCard({\n  product,\n  rating,\n  badge,\n  variants,\n  variant,\n  size,\n  className,\n}: ProductCardProps) {\n  const { currentPrice, oldPrice } = formatPrice(\n    product.price,\n    product.localize?.locale,\n    product.localize?.currency\n  );\n\n  switch (variant) {\n    case 'minimal':\n      return (\n        <div\n          className={cn(\n            productCardVariants({ variant, size }),\n            'w-60 overflow-hidden rounded-2xl border p-0 shadow-sm'\n          )}\n        >\n          <div className=\"relative h-72 w-full overflow-hidden\">\n            <Image\n              src={product.image.src}\n              alt={product.image.alt ?? product.title}\n              fill\n              className=\"object-cover\"\n              sizes=\"240px\"\n              quality={60}\n            />\n          </div>\n\n          <div className=\"flex flex-col gap-1 p-3\">\n            <div className=\"flex items-center justify-between\">\n              <h3 className=\"truncate text-base font-medium\">\n                {product.href ? (\n                  <a href={product.href} className=\"hover:underline\">\n                    {product.title}\n                  </a>\n                ) : (\n                  product.title\n                )}\n              </h3>\n              <p className=\"mt-0 text-lg font-semibold text-gray-900\">\n                {currentPrice}\n              </p>\n            </div>\n            <p className=\"text-xs text-gray-500\">7 colors</p>\n          </div>\n        </div>\n      );\n    default:\n      return (\n        <div className={cn(productCardVariants({ variant, size }), className)}>\n          {/* Image */}\n          <div className=\"relative aspect-[1/1]\">\n            <Image\n              src={product.image.src}\n              alt={product.image.alt ?? product.title}\n              fill\n              className={cn('object-cover')}\n              priority\n              quality={60}\n              sizes=\"(max-width: 576px) 280px, (max-width: 768px) 360px, (max-width: 992px) 240px, 200px\"\n            />\n            {badge && (\n              <div className=\"absolute left-2 top-2\">\n                <Badge variant=\"default\">{badge.label}</Badge>\n              </div>\n            )}\n          </div>\n\n          {/* Content */}\n          <div className=\"flex flex-col gap-2 p-3\">\n            <h3 className=\"truncate text-base font-medium\">\n              {product.href ? (\n                <a href={product.href} className=\"hover:underline\">\n                  {product.title}\n                </a>\n              ) : (\n                product.title\n              )}\n            </h3>\n\n            {/* Price */}\n            <div className=\"flex items-center gap-2\">\n              <p className=\"text-lg font-semibold\">{currentPrice}</p>\n              {oldPrice && (\n                <p className=\"text-muted-foreground text-sm line-through\">\n                  {oldPrice}\n                </p>\n              )}\n            </div>\n\n            {/* Rating */}\n            {rating !== undefined && (\n              <div\n                data-testid=\"product-card-rating\"\n                className=\"flex items-center gap-2\"\n              >\n                <RatingCount\n                  average={rating.average}\n                  ratingCount={rating.count}\n                />\n              </div>\n            )}\n\n            {/* Variant Selector */}\n            {variants && (\n              <VariantSelector\n                options={variants.options}\n                value={variants.value ?? ''}\n                onChange={variants.onChange}\n                type=\"color\"\n              />\n            )}\n\n            {/* Add to Cart button */}\n            {variant === 'withAddToCart' && (\n              <Button variant=\"default\" className=\"w-full cursor-pointer\">\n                Add to Cart\n              </Button>\n            )}\n          </div>\n        </div>\n      );\n  }\n}\n"],"mappings":";;;;;;;;;;;;AAYA,MAAM,sBAAsB,IAC1B,iDACA;CACE,UAAU;EACR,SAAS;GACP,SAAS;GACT,eAAe;GACf,SAAS;GACV;EACD,MAAM;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACL;EACF;CACD,iBAAiB;EACf,SAAS;EACT,MAAM;EACP;CACF,CACF;AAiDD,MAAM,eAAe,OAAc,SAAS,SAAS,WAAW,UAAU;CACxE,MAAM,YAAY,IAAI,KAAK,aAAa,QAAQ;EAC9C,OAAO;EACP;EACD,CAAC;AAEF,QAAO;EACL,cAAc,UAAU,OAAO,OAAO,MAAM,QAAQ,CAAC;EACrD,UAAU,MAAM,MAAM,UAAU,OAAO,OAAO,MAAM,IAAI,CAAC,GAAG;EAC7D;;AAGH,SAAgB,YAAY,EAC1B,SACA,QACA,OACA,UACA,SACA,MACA,aACmB;CACnB,MAAM,EAAE,cAAc,aAAa,YACjC,QAAQ,OACR,QAAQ,UAAU,QAClB,QAAQ,UAAU,SACnB;AAED,SAAQ,SAAR;EACE,KAAK,UACH,QACE,qBAAC;GACC,WAAW,GACT,oBAAoB;IAAE;IAAS;IAAM,CAAC,EACtC,wDACD;cAED,oBAAC;IAAI,WAAU;cACb,oBAAC;KACC,KAAK,QAAQ,MAAM;KACnB,KAAK,QAAQ,MAAM,OAAO,QAAQ;KAClC;KACA,WAAU;KACV,OAAM;KACN,SAAS;MACT;KACE,EAEN,qBAAC;IAAI,WAAU;eACb,qBAAC;KAAI,WAAU;gBACb,oBAAC;MAAG,WAAU;gBACX,QAAQ,OACP,oBAAC;OAAE,MAAM,QAAQ;OAAM,WAAU;iBAC9B,QAAQ;QACP,GAEJ,QAAQ;OAEP,EACL,oBAAC;MAAE,WAAU;gBACV;OACC;MACA,EACN,oBAAC;KAAE,WAAU;eAAwB;MAAY;KAC7C;IACF;EAEV,QACE,QACE,qBAAC;GAAI,WAAW,GAAG,oBAAoB;IAAE;IAAS;IAAM,CAAC,EAAE,UAAU;cAEnE,qBAAC;IAAI,WAAU;eACb,oBAAC;KACC,KAAK,QAAQ,MAAM;KACnB,KAAK,QAAQ,MAAM,OAAO,QAAQ;KAClC;KACA,WAAW,GAAG,eAAe;KAC7B;KACA,SAAS;KACT,OAAM;MACN,EACD,SACC,oBAAC;KAAI,WAAU;eACb,oBAAC;MAAM,SAAQ;gBAAW,MAAM;OAAc;MAC1C;KAEJ,EAGN,qBAAC;IAAI,WAAU;;KACb,oBAAC;MAAG,WAAU;gBACX,QAAQ,OACP,oBAAC;OAAE,MAAM,QAAQ;OAAM,WAAU;iBAC9B,QAAQ;QACP,GAEJ,QAAQ;OAEP;KAGL,qBAAC;MAAI,WAAU;iBACb,oBAAC;OAAE,WAAU;iBAAyB;QAAiB,EACtD,YACC,oBAAC;OAAE,WAAU;iBACV;QACC;OAEF;KAGL,WAAW,UACV,oBAAC;MACC,eAAY;MACZ,WAAU;gBAEV,oBAAC;OACC,SAAS,OAAO;OAChB,aAAa,OAAO;QACpB;OACE;KAIP,YACC,oBAAC;MACC,SAAS,SAAS;MAClB,OAAO,SAAS,SAAS;MACzB,UAAU,SAAS;MACnB,MAAK;OACL;KAIH,YAAY,mBACX,oBAAC;MAAO,SAAQ;MAAU,WAAU;gBAAwB;OAEnD;;KAEP;IACF"}

package/dist/components/product-preview/index.d.ts

@@ -1,15 +1,20 @@
 import { Product } from "../../types/graphql.js";
-import * as react_jsx_runtime13 from "react/jsx-runtime";
+import * as react_jsx_runtime9 from "react/jsx-runtime";
 
 //#region src/components/product-preview/index.d.ts
+type ProductPreviewProduct = Pick<Product, 'id' | 'title' | 'handle' | 'thumbnail' | 'images' | 'variants'>;
 type ProductPreviewProps = {
-  product: Product;
+  product: ProductPreviewProduct;
   isFeatured?: boolean;
+  imagePriority?: boolean;
+  imageFetchPriority?: 'auto' | 'high' | 'low';
 };
 declare function ProductPreview({
   product,
-  isFeatured
-}: ProductPreviewProps): react_jsx_runtime13.JSX.Element;
+  isFeatured,
+  imagePriority,
+  imageFetchPriority
+}: ProductPreviewProps): react_jsx_runtime9.JSX.Element;
 //#endregion
-export { ProductPreview, ProductPreviewProps };
+export { ProductPreview, ProductPreviewProduct, ProductPreviewProps };
 //# sourceMappingURL=index.d.ts.map

package/dist/components/product-preview/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","names":[],"sources":["../../../src/components/product-preview/index.tsx"],"sourcesContent":[],"mappings":";;;;KASY,mBAAA;WACD;;AADX,CAAA;AAGE,iBAEO,cAAA,CAAc;EAAA,OAAA;EAAA;AAAA,CAAA,EAA0B,mBAA1B,CAAA,EAA6C,mBAAA,CAAA,GAAA,CAAA,OAA7C"}
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../../src/components/product-preview/index.tsx"],"sourcesContent":[],"mappings":";;;;KASY,qBAAA,GAAwB,KAClC;KAIU,mBAAA;WACD;EANC,UAAA,CAAA,EAAA,OAAA;EAKA,aAAA,CAAA,EAAA,OAAmB;EAOtB,kBAAc,CAAA,EAAA,MAAA,GAAA,MAAA,GAAA,KAAA;CACrB;iBADO,cAAA,CAEP;EAAA,OAAA;EAAA,UAAA;EAAA,aAAA;EAAA;AAAA,CAAA,EAGC,mBAHD,CAAA,EAGoB,kBAAA,CAAA,GAAA,CAAA,OAHpB"}

package/dist/components/product-preview/index.js

@@ -6,7 +6,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { Text } from "@medusajs/ui";
 
 //#region src/components/product-preview/index.tsx
-function ProductPreview({ product, isFeatured }) {
+function ProductPreview({ product, isFeatured, imagePriority = false, imageFetchPriority }) {
 	const { cheapestPrice } = getProductPrice({ product });
 	return /* @__PURE__ */ jsx(LocalizedClientLink, {
 		href: `/products/${product.handle}`,
@@ -17,7 +17,9 @@ function ProductPreview({ product, isFeatured }) {
 				thumbnail: product.thumbnail,
 				images: product.images,
 				size: "full",
-				isFeatured
+				isFeatured,
+				imagePriority,
+				imageFetchPriority
 			}), /* @__PURE__ */ jsxs("div", {
 				className: "txt-compact-medium mt-4 flex justify-between",
 				children: [/* @__PURE__ */ jsx(Text, {

package/dist/components/product-preview/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/product-preview/index.tsx"],"sourcesContent":["import { Text } from '@medusajs/ui';\n\nimport { getProductPrice } from '@/lib/utils/get-product-price';\nimport { Product } from '@/types/graphql';\n\nimport { LocalizedClientLink } from '../localized-client-link';\nimport { PreviewPrice } from '../preview-price';\nimport { Thumbnail } from '../thumbnail';\n\nexport type ProductPreviewProps = {\n  product: Product;\n  isFeatured?: boolean;\n};\n\nfunction ProductPreview({ product, isFeatured }: ProductPreviewProps) {\n  const { cheapestPrice } = getProductPrice({\n    product,\n  });\n\n  return (\n    <LocalizedClientLink href={`/products/${product.handle}`} className=\"group\">\n      <div data-testid=\"product-wrapper\">\n        <Thumbnail\n          thumbnail={product.thumbnail}\n          images={product.images}\n          size=\"full\"\n          isFeatured={isFeatured}\n        />\n        <div className=\"txt-compact-medium mt-4 flex justify-between\">\n          <Text className=\"text-ui-fg-subtle\" data-testid=\"product-title\">\n            {product.title}\n          </Text>\n          <div className=\"flex items-center gap-x-2\">\n            {cheapestPrice && <PreviewPrice price={cheapestPrice} />}\n          </div>\n        </div>\n      </div>\n    </LocalizedClientLink>\n  );\n}\n\nexport { ProductPreview };\n"],"mappings":";;;;;;;;AAcA,SAAS,eAAe,EAAE,SAAS,cAAmC;CACpE,MAAM,EAAE,kBAAkB,gBAAgB,EACxC,SACD,CAAC;AAEF,QACE,oBAAC;EAAoB,MAAM,aAAa,QAAQ;EAAU,WAAU;YAClE,qBAAC;GAAI,eAAY;cACf,oBAAC;IACC,WAAW,QAAQ;IACnB,QAAQ,QAAQ;IAChB,MAAK;IACO;KACZ,EACF,qBAAC;IAAI,WAAU;eACb,oBAAC;KAAK,WAAU;KAAoB,eAAY;eAC7C,QAAQ;MACJ,EACP,oBAAC;KAAI,WAAU;eACZ,iBAAiB,oBAAC,gBAAa,OAAO,gBAAiB;MACpD;KACF;IACF;GACc"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/product-preview/index.tsx"],"sourcesContent":["import { Text } from '@medusajs/ui';\n\nimport { getProductPrice } from '@/lib/utils/get-product-price';\nimport { Product } from '@/types/graphql';\n\nimport { LocalizedClientLink } from '../localized-client-link';\nimport { PreviewPrice } from '../preview-price';\nimport { Thumbnail } from '../thumbnail';\n\nexport type ProductPreviewProduct = Pick<\n  Product,\n  'id' | 'title' | 'handle' | 'thumbnail' | 'images' | 'variants'\n>;\n\nexport type ProductPreviewProps = {\n  product: ProductPreviewProduct;\n  isFeatured?: boolean;\n  imagePriority?: boolean;\n  imageFetchPriority?: 'auto' | 'high' | 'low';\n};\n\nfunction ProductPreview({\n  product,\n  isFeatured,\n  imagePriority = false,\n  imageFetchPriority,\n}: ProductPreviewProps) {\n  const { cheapestPrice } = getProductPrice({\n    product,\n  });\n\n  return (\n    <LocalizedClientLink href={`/products/${product.handle}`} className=\"group\">\n      <div data-testid=\"product-wrapper\">\n        <Thumbnail\n          thumbnail={product.thumbnail}\n          images={product.images}\n          size=\"full\"\n          isFeatured={isFeatured}\n          imagePriority={imagePriority}\n          imageFetchPriority={imageFetchPriority}\n        />\n        <div className=\"txt-compact-medium mt-4 flex justify-between\">\n          <Text className=\"text-ui-fg-subtle\" data-testid=\"product-title\">\n            {product.title}\n          </Text>\n          <div className=\"flex items-center gap-x-2\">\n            {cheapestPrice && <PreviewPrice price={cheapestPrice} />}\n          </div>\n        </div>\n      </div>\n    </LocalizedClientLink>\n  );\n}\n\nexport { ProductPreview };\n"],"mappings":";;;;;;;;AAqBA,SAAS,eAAe,EACtB,SACA,YACA,gBAAgB,OAChB,sBACsB;CACtB,MAAM,EAAE,kBAAkB,gBAAgB,EACxC,SACD,CAAC;AAEF,QACE,oBAAC;EAAoB,MAAM,aAAa,QAAQ;EAAU,WAAU;YAClE,qBAAC;GAAI,eAAY;cACf,oBAAC;IACC,WAAW,QAAQ;IACnB,QAAQ,QAAQ;IAChB,MAAK;IACO;IACG;IACK;KACpB,EACF,qBAAC;IAAI,WAAU;eACb,oBAAC;KAAK,WAAU;KAAoB,eAAY;eAC7C,QAAQ;MACJ,EACP,oBAAC;KAAI,WAAU;eACZ,iBAAiB,oBAAC,gBAAa,OAAO,gBAAiB;MACpD;KACF;IACF;GACc"}

package/dist/components/submit-button/index.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import * as react_jsx_runtime14 from "react/jsx-runtime";
+import * as react_jsx_runtime10 from "react/jsx-runtime";
 
 //#region src/components/submit-button/index.d.ts
 declare function SubmitButton({
@@ -14,7 +14,7 @@ declare function SubmitButton({
   className?: string;
   'data-testid'?: string;
   isLoading?: boolean;
-}): react_jsx_runtime14.JSX.Element;
+}): react_jsx_runtime10.JSX.Element;
 //#endregion
 export { SubmitButton };
 //# sourceMappingURL=index.d.ts.map

package/dist/components/thumbnail/index.d.ts

@@ -6,6 +6,8 @@ type ThumbnailProps = {
   images?: any[] | null;
   size?: 'small' | 'medium' | 'large' | 'full' | 'square';
   isFeatured?: boolean;
+  imagePriority?: boolean;
+  imageFetchPriority?: 'auto' | 'high' | 'low';
   className?: string;
   'data-testid'?: string;
 };

package/dist/components/thumbnail/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","names":[],"sources":["../../../src/components/thumbnail/index.tsx"],"sourcesContent":[],"mappings":";;;KAOK,cAAA;;EAAA,MAAA,CAAA,EAAA,GAAA,EAAA,GAAc,IAAA;EAUb,IAAA,CAAA,EAAA,OA8BL,GAAA,QA9ByB,GAAA,OAAA,GAAA,MAAT,GAAM,QAAE;;;;;cAAnB,WAAW,KAAA,CAAM,GAAG"}
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../../src/components/thumbnail/index.tsx"],"sourcesContent":[],"mappings":";;;KAOK,cAAA;;EAAA,MAAA,CAAA,EAAA,GAAA,EAAA,GAAc,IAAA;EAYb,IAAA,CAAA,EAAA,OAqCL,GAAA,QArCyB,GAAA,OAAA,GAAA,MAAT,GAAM,QAAE;;;;;;;cAAnB,WAAW,KAAA,CAAM,GAAG"}

package/dist/components/thumbnail/index.js

@@ -5,7 +5,7 @@ import Image from "next/image";
 import { PlaceholderImage } from "@gfed-medusa/sf-lib-ui/icons/placeholder-image";
 
 //#region src/components/thumbnail/index.tsx
-const Thumbnail = ({ thumbnail, images, size = "small", isFeatured, className, "data-testid": dataTestid }) => {
+const Thumbnail = ({ thumbnail, images, size = "small", isFeatured, imagePriority = false, imageFetchPriority, className, "data-testid": dataTestid }) => {
 	const initialImage = thumbnail || images?.[0]?.url;
 	return /* @__PURE__ */ jsx(Container, {
 		className: clx("rounded-large bg-ui-bg-subtle shadow-elevation-card-rest group-hover:shadow-elevation-card-hover relative w-full overflow-hidden p-4 transition-shadow duration-150 ease-in-out", className, {
@@ -20,16 +20,20 @@ const Thumbnail = ({ thumbnail, images, size = "small", isFeatured, className, "
 		"data-testid": dataTestid,
 		children: /* @__PURE__ */ jsx(ImageOrPlaceholder, {
 			image: initialImage,
-			size
+			size,
+			imagePriority,
+			imageFetchPriority
 		})
 	});
 };
-const ImageOrPlaceholder = ({ image, size }) => {
+const ImageOrPlaceholder = ({ image, size, imagePriority, imageFetchPriority }) => {
 	return image ? /* @__PURE__ */ jsx(Image, {
 		src: image,
 		alt: "Thumbnail",
 		className: "absolute inset-0 object-cover object-center",
 		draggable: false,
+		priority: imagePriority,
+		...imageFetchPriority ? { fetchPriority: imageFetchPriority } : {},
 		quality: 40,
 		sizes: "(max-width: 576px) 280px, (max-width: 768px) 360px, (max-width: 992px) 480px, 800px",
 		fill: true

package/dist/components/thumbnail/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["Thumbnail: React.FC<ThumbnailProps>"],"sources":["../../../src/components/thumbnail/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport Image from 'next/image';\n\nimport { PlaceholderImage } from '@gfed-medusa/sf-lib-ui/icons/placeholder-image';\nimport { Container, clx } from '@medusajs/ui';\n\ntype ThumbnailProps = {\n  thumbnail?: string | null;\n  // TODO: Fix image typings\n  images?: any[] | null;\n  size?: 'small' | 'medium' | 'large' | 'full' | 'square';\n  isFeatured?: boolean;\n  className?: string;\n  'data-testid'?: string;\n};\n\nconst Thumbnail: React.FC<ThumbnailProps> = ({\n  thumbnail,\n  images,\n  size = 'small',\n  isFeatured,\n  className,\n  'data-testid': dataTestid,\n}) => {\n  const initialImage = thumbnail || images?.[0]?.url;\n\n  return (\n    <Container\n      className={clx(\n        'rounded-large bg-ui-bg-subtle shadow-elevation-card-rest group-hover:shadow-elevation-card-hover relative w-full overflow-hidden p-4 transition-shadow duration-150 ease-in-out',\n        className,\n        {\n          'aspect-[11/14]': isFeatured,\n          'aspect-[9/16]': !isFeatured && size !== 'square',\n          'aspect-[1/1]': size === 'square',\n          'w-[180px]': size === 'small',\n          'w-[290px]': size === 'medium',\n          'w-[440px]': size === 'large',\n          'w-full': size === 'full',\n        }\n      )}\n      data-testid={dataTestid}\n    >\n      <ImageOrPlaceholder image={initialImage} size={size} />\n    </Container>\n  );\n};\n\nconst ImageOrPlaceholder = ({\n  image,\n  size,\n}: Pick<ThumbnailProps, 'size'> & { image?: string }) => {\n  return image ? (\n    <Image\n      src={image}\n      alt=\"Thumbnail\"\n      className=\"absolute inset-0 object-cover object-center\"\n      draggable={false}\n      quality={40}\n      sizes=\"(max-width: 576px) 280px, (max-width: 768px) 360px, (max-width: 992px) 480px, 800px\"\n      fill\n    />\n  ) : (\n    <div className=\"absolute inset-0 flex h-full w-full items-center justify-center\">\n      <PlaceholderImage size={size === 'small' ? 16 : 24} />\n    </div>\n  );\n};\n\nexport { Thumbnail };\n"],"mappings":";;;;;;;AAiBA,MAAMA,aAAuC,EAC3C,WACA,QACA,OAAO,SACP,YACA,WACA,eAAe,iBACX;CACJ,MAAM,eAAe,aAAa,SAAS,IAAI;AAE/C,QACE,oBAAC;EACC,WAAW,IACT,mLACA,WACA;GACE,kBAAkB;GAClB,iBAAiB,CAAC,cAAc,SAAS;GACzC,gBAAgB,SAAS;GACzB,aAAa,SAAS;GACtB,aAAa,SAAS;GACtB,aAAa,SAAS;GACtB,UAAU,SAAS;GACpB,CACF;EACD,eAAa;YAEb,oBAAC;GAAmB,OAAO;GAAoB;IAAQ;GAC7C;;AAIhB,MAAM,sBAAsB,EAC1B,OACA,WACuD;AACvD,QAAO,QACL,oBAAC;EACC,KAAK;EACL,KAAI;EACJ,WAAU;EACV,WAAW;EACX,SAAS;EACT,OAAM;EACN;GACA,GAEF,oBAAC;EAAI,WAAU;YACb,oBAAC,oBAAiB,MAAM,SAAS,UAAU,KAAK,KAAM;GAClD"}
+{"version":3,"file":"index.js","names":["Thumbnail: React.FC<ThumbnailProps>"],"sources":["../../../src/components/thumbnail/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport Image from 'next/image';\n\nimport { PlaceholderImage } from '@gfed-medusa/sf-lib-ui/icons/placeholder-image';\nimport { Container, clx } from '@medusajs/ui';\n\ntype ThumbnailProps = {\n  thumbnail?: string | null;\n  // TODO: Fix image typings\n  images?: any[] | null;\n  size?: 'small' | 'medium' | 'large' | 'full' | 'square';\n  isFeatured?: boolean;\n  imagePriority?: boolean;\n  imageFetchPriority?: 'auto' | 'high' | 'low';\n  className?: string;\n  'data-testid'?: string;\n};\n\nconst Thumbnail: React.FC<ThumbnailProps> = ({\n  thumbnail,\n  images,\n  size = 'small',\n  isFeatured,\n  imagePriority = false,\n  imageFetchPriority,\n  className,\n  'data-testid': dataTestid,\n}) => {\n  const initialImage = thumbnail || images?.[0]?.url;\n\n  return (\n    <Container\n      className={clx(\n        'rounded-large bg-ui-bg-subtle shadow-elevation-card-rest group-hover:shadow-elevation-card-hover relative w-full overflow-hidden p-4 transition-shadow duration-150 ease-in-out',\n        className,\n        {\n          'aspect-[11/14]': isFeatured,\n          'aspect-[9/16]': !isFeatured && size !== 'square',\n          'aspect-[1/1]': size === 'square',\n          'w-[180px]': size === 'small',\n          'w-[290px]': size === 'medium',\n          'w-[440px]': size === 'large',\n          'w-full': size === 'full',\n        }\n      )}\n      data-testid={dataTestid}\n    >\n      <ImageOrPlaceholder\n        image={initialImage}\n        size={size}\n        imagePriority={imagePriority}\n        imageFetchPriority={imageFetchPriority}\n      />\n    </Container>\n  );\n};\n\nconst ImageOrPlaceholder = ({\n  image,\n  size,\n  imagePriority,\n  imageFetchPriority,\n}: Pick<\n  ThumbnailProps,\n  'size' | 'imagePriority' | 'imageFetchPriority'\n> & { image?: string }) => {\n  return image ? (\n    <Image\n      src={image}\n      alt=\"Thumbnail\"\n      className=\"absolute inset-0 object-cover object-center\"\n      draggable={false}\n      priority={imagePriority}\n      {...(imageFetchPriority ? { fetchPriority: imageFetchPriority } : {})}\n      quality={40}\n      sizes=\"(max-width: 576px) 280px, (max-width: 768px) 360px, (max-width: 992px) 480px, 800px\"\n      fill\n    />\n  ) : (\n    <div className=\"absolute inset-0 flex h-full w-full items-center justify-center\">\n      <PlaceholderImage size={size === 'small' ? 16 : 24} />\n    </div>\n  );\n};\n\nexport { Thumbnail };\n"],"mappings":";;;;;;;AAmBA,MAAMA,aAAuC,EAC3C,WACA,QACA,OAAO,SACP,YACA,gBAAgB,OAChB,oBACA,WACA,eAAe,iBACX;CACJ,MAAM,eAAe,aAAa,SAAS,IAAI;AAE/C,QACE,oBAAC;EACC,WAAW,IACT,mLACA,WACA;GACE,kBAAkB;GAClB,iBAAiB,CAAC,cAAc,SAAS;GACzC,gBAAgB,SAAS;GACzB,aAAa,SAAS;GACtB,aAAa,SAAS;GACtB,aAAa,SAAS;GACtB,UAAU,SAAS;GACpB,CACF;EACD,eAAa;YAEb,oBAAC;GACC,OAAO;GACD;GACS;GACK;IACpB;GACQ;;AAIhB,MAAM,sBAAsB,EAC1B,OACA,MACA,eACA,yBAIyB;AACzB,QAAO,QACL,oBAAC;EACC,KAAK;EACL,KAAI;EACJ,WAAU;EACV,WAAW;EACX,UAAU;EACV,GAAK,qBAAqB,EAAE,eAAe,oBAAoB,GAAG,EAAE;EACpE,SAAS;EACT,OAAM;EACN;GACA,GAEF,oBAAC;EAAI,WAAU;YACb,oBAAC,oBAAiB,MAAM,SAAS,UAAU,KAAK,KAAM;GAClD"}

package/dist/lib/config/medusa.js

@@ -3,7 +3,7 @@ import Medusa from "@medusajs/js-sdk";
 //#region src/lib/config/medusa.ts
 const sdk = new Medusa({
 	baseUrl: process.env.NEXT_PUBLIC_MEDUSA_BACKEND_URL || "http://localhost:9000",
-	debug: true,
+	debug: false,
 	publishableKey: process.env.NEXT_PUBLIC_MEDUSA_PUBLISHABLE_KEY
 });
 

package/dist/lib/context/apollo-context.d.ts

@@ -1,10 +1,10 @@
 import { PropsWithChildren } from "react";
-import * as react_jsx_runtime15 from "react/jsx-runtime";
+import * as react_jsx_runtime13 from "react/jsx-runtime";
 
 //#region src/lib/context/apollo-context.d.ts
 declare function ApolloClientProvider({
   children
-}: PropsWithChildren): react_jsx_runtime15.JSX.Element;
+}: PropsWithChildren): react_jsx_runtime13.JSX.Element;
 //#endregion
 export { ApolloClientProvider };
 //# sourceMappingURL=apollo-context.d.ts.map