@dropins/storefront-wishlist 1.0.1-beta1 → 1.0.2-beta1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/chunks/WishlistItem.js +1 -1
- package/components/ImageCarousel/ImageCarousel.d.ts +7 -3
- package/components/ProductItem/ProductItem.d.ts +5 -1
- package/containers/Wishlist/Wishlist.d.ts +9 -2
- package/containers/Wishlist.js +2 -2
- package/containers/WishlistItem/WishlistItem.d.ts +5 -0
- package/package.json +1 -1
- package/render.js +1 -1
package/chunks/WishlistItem.js
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
/*! Copyright 2025 Adobe
|
|
2
2
|
All Rights Reserved. */
|
|
3
|
-
import{jsx as
|
|
3
|
+
import{jsx as e,Fragment as T,jsxs as f}from"@dropins/tools/preact-jsx-runtime.js";import{classes as w}from"@dropins/tools/lib.js";import{Price as _,Button as b,Icon as q,Image as J}from"@dropins/tools/components.js";import{useState as Q}from"@dropins/tools/preact-compat.js";import{s as y,r as Z}from"./removeProductsFromWishlist.js";import{events as W}from"@dropins/tools/event-bus.js";import{a as D,S as tt}from"./Trash.js";import{useText as et}from"@dropins/tools/i18n.js";const rt=({taxes:r,displayMode:t})=>e(T,{children:r.map((o,i)=>f("div",{"data-testid":`wishlist-product-item-tax-${i}`,className:"wishlist-product-item-tax",children:[e("span",{className:"wishlist-product-item-tax-label",children:o.label}),e(_,{className:"wishlist-product-item-tax-price",amount:o.money.value,currency:o.money.currency}),e("span",{className:"wishlist-product-item-tax-display-mode",children:t==="INCLUDING_FPT_AND_DESCRIPTION"?"incl.":"excl."})]},i))}),st=({className:r,item:t,onCartActionButtonClick:o,onTrashButtonClick:i,fixedProductTaxesEnabled:v,fixedProductTaxesEnabledDisplayInProductLists:m,routeProdDetailPage:l,imageNode:a,...u})=>{var C,g,A,O,B,S,E,z,F;const c=et({cartActionBtn:"ProductItem.CartActionButton",trashActionBtn:"ProductItem.TrashActionButton",customizeActionBtn:"ProductItem.CustomizeActionButton"}),I=((A=(g=(C=t.product)==null?void 0:C.prices)==null?void 0:g.discount)==null?void 0:A.amountOff)!==0||((S=(B=(O=t.product)==null?void 0:O.prices)==null?void 0:B.discount)==null?void 0:S.percentOff)!==0,P=()=>{var s;return e("a",{className:"wishlist-product-item-image","data-testid":"wishlist-product-item-image",href:l(t.product),children:e(ot,{images:(s=t.product)!=null&&s.image?[t.product.image]:[],imageNode:a})})},p=()=>{var s,d,n,h,G,R,k,L,M,U;return f(T,{children:[e(_,{className:w(["wishlist-product-item-price",I?"strikeout":""]),"data-testid":"wishlist-product-item-price",amount:(d=(s=t.product)==null?void 0:s.prices)==null?void 0:d.regularPrice.value,currency:(h=(n=t.product)==null?void 0:n.prices)==null?void 0:h.regularPrice.currency}),I&&e(_,{className:"wishlist-product-item-discounted-price","data-testid":"wishlist-product-item-discounted-price",amount:(R=(G=t.product)==null?void 0:G.prices)==null?void 0:R.finalPrice.value,currency:(L=(k=t.product)==null?void 0:k.prices)==null?void 0:L.finalPrice.currency}),v&&(m==="INCLUDING_FPT_AND_DESCRIPTION"||m==="EXCLUDING_FPT_INCLUDING_DESCRIPTION_FINAL_PRICE")&&((U=(M=t.product)==null?void 0:M.prices)==null?void 0:U.fixedProductTaxes)&&e(rt,{taxes:t.product.prices.fixedProductTaxes,displayMode:m})]})},$=()=>e(b,{"data-testid":"wishlist-product-item-remove-button",className:"wishlist-product-item-button__remove",variant:"tertiary",onClick:()=>i==null?void 0:i(),icon:e(q,{source:D,size:"24",stroke:"2",viewBox:"0 0 24 24","aria-label":c.trashActionBtn})}),V=()=>j()?Y():H(),j=()=>{var s,d,n,h;return((s=t.product)==null?void 0:s.type)==="ConfigurableProduct"?K():((d=t.product)==null?void 0:d.type)!=="GiftCardProduct"&&((n=t.product)==null?void 0:n.type)!=="BundleProduct"&&((h=t.product)==null?void 0:h.type)!=="GroupedProduct"},x=((E=t.selectedOptions)==null?void 0:E.map(s=>s.uid))||[],N=((z=t.product.options)==null?void 0:z.filter(s=>s.required))||[],K=()=>N.length===0?!0:N.every(s=>{var d;return(d=s.values)==null?void 0:d.some(n=>x.includes(n.uid))}),X=()=>x.length===0?null:e("div",{className:"wishlist-product-item-options",children:N.map(s=>{var n;const d=(n=s.values)==null?void 0:n.find(h=>x.includes(h.uid));return d?f("div",{className:"wishlist-product-item-option",children:[f("span",{className:"wishlist-product-item-option__attribute",children:[s.attributeCode,":"]})," ",e("span",{className:"wishlist-product-item-option__label",children:d.label})]},s.attributeCode):null})}),Y=()=>{var s;return e(b,{"data-testid":"wishlist-product-item-move-to-cart-button",size:"medium",type:"submit",icon:e(q,{source:tt}),disabled:((s=t.product)==null?void 0:s.stockStatus)!=="IN_STOCK","aria-label":c.cartActionBtn,onClick:()=>o==null?void 0:o(),children:c.cartActionBtn})},H=()=>e(b,{"data-testid":"wishlist-product-item-customize-button",size:"medium",type:"submit","aria-label":c.customizeActionBtn,href:l(t.product),children:c.customizeActionBtn});return e("div",{...u,className:w(["wishlist-product-item",r]),children:f("div",{className:"wishlist-product-item__content",children:[P(),f("div",{className:"wishlist-product-item__title","data-testid":"wishlist-product-item-header",children:[e("a",{className:"wishlist-product-item-name","data-testid":"wishlist-product-item-name",href:l(t.product),children:(F=t.product)==null?void 0:F.name}),$(),p()]}),X(),V()]})})},ot=({className:r,children:t,images:o,imageNode:i,...v})=>{const[m,l]=Q(0);return f(T,{children:[e("div",{...v,className:w(["image-carousel",r]),children:e("div",{className:w(["overflow-hidden relative max-w-[200px]",r]),children:o==null?void 0:o.map((a,u)=>{const c={className:w(["image-carousel-image",r]),src:a.src,alt:a.alt};return u!==m?null:typeof i=="function"?i({defaultImageProps:c}):i||e(J,{...c})})})}),(o==null?void 0:o.length)>1&&e("div",{className:w(["absolute","image-switcher-area"]),children:o==null?void 0:o.map((a,u)=>e("span",{className:w(["image-switcher",m===u?"image-switcher-active":"image-switcher-inactive"]),onClick:c=>{l(u),c.stopPropagation()}},u))})]})},mt=({initialData:r=null,moveProdToCart:t,routeProdDetailPage:o,imageNode:i})=>{var l,a,u,c,I;if(!(r!=null&&r.product))return null;const v=async(P=!0)=>{try{return await Z([r]),console.log(`Product ${r.product.sku} removed from wishlist!`),P&&W.emit("wishlist/alert",{action:"remove",item:r}),!0}catch(p){return console.error(`Product ${r.product.sku} could not be removed from wishlist`,p),!1}};return e(st,{item:r,onCartActionButtonClick:async()=>{var P;try{return await t([{sku:r.product.sku,quantity:1,optionsUIDs:(P=r.selectedOptions)==null?void 0:P.map(p=>p.uid),enteredOptions:r.enteredOptions}]),console.log(`Product ${r.product.sku} successfully moved to cart 🛒`),W.emit("wishlist/alert",{action:"move",item:r}),await v(!1)}catch(p){return console.error("Could not move product to cart: ",p),p.toString().includes("You need to choose options for your item.")&&window.location.replace(o(r.product)),!1}},onTrashButtonClick:v,fixedProductTaxesEnabled:((l=y.config)==null?void 0:l.fixedProductTaxesEnabled)??!1,fixedProductTaxesApply:((a=y.config)==null?void 0:a.fixedProductTaxesApply)??!1,fixedProductTaxesEnabledDisplayInProductLists:(u=y.config)==null?void 0:u.fixedProductTaxesEnabledDisplayInProductLists,fixedProductTaxesEnabledDisplayInProductView:(c=y.config)==null?void 0:c.fixedProductTaxesEnabledDisplayInProductView,fixedProductTaxesEnabledDisplayInSalesModules:(I=y.config)==null?void 0:I.fixedProductTaxesEnabledDisplayInSalesModules,routeProdDetailPage:o,imageNode:i})};export{mt as W};
|
|
@@ -1,13 +1,17 @@
|
|
|
1
|
-
import { FunctionComponent } from 'preact';
|
|
1
|
+
import { FunctionComponent, JSX } from 'preact';
|
|
2
2
|
import { HTMLAttributes } from 'preact/compat';
|
|
3
|
+
import { ImageNodeRenderProps } from '../../../@adobe-commerce/elsie/src/components';
|
|
3
4
|
|
|
4
5
|
export interface ImageCarouselProps extends HTMLAttributes<HTMLDivElement> {
|
|
5
|
-
className
|
|
6
|
-
children
|
|
6
|
+
className?: string;
|
|
7
|
+
children?: any;
|
|
7
8
|
images: {
|
|
8
9
|
src: string;
|
|
9
10
|
alt: string | undefined;
|
|
10
11
|
}[];
|
|
12
|
+
imageNode?: (props: {
|
|
13
|
+
defaultImageProps: ImageNodeRenderProps;
|
|
14
|
+
}) => JSX.Element;
|
|
11
15
|
}
|
|
12
16
|
export declare const ImageCarousel: FunctionComponent<ImageCarouselProps>;
|
|
13
17
|
//# sourceMappingURL=ImageCarousel.d.ts.map
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
import { FunctionComponent } from 'preact';
|
|
1
|
+
import { FunctionComponent, JSX } from 'preact';
|
|
2
2
|
import { HTMLAttributes } from 'preact/compat';
|
|
3
|
+
import { ImageNodeRenderProps } from '../../../@adobe-commerce/elsie/src/components';
|
|
3
4
|
import { Item, Product } from '../../data/models';
|
|
4
5
|
|
|
5
6
|
export interface ProductItemProps extends HTMLAttributes<HTMLDivElement> {
|
|
@@ -13,6 +14,9 @@ export interface ProductItemProps extends HTMLAttributes<HTMLDivElement> {
|
|
|
13
14
|
fixedProductTaxesEnabledDisplayInSalesModules?: string;
|
|
14
15
|
fixedProductTaxesEnabledDisplayInProductView?: string;
|
|
15
16
|
routeProdDetailPage: (product: Product) => string;
|
|
17
|
+
imageNode?: (props: {
|
|
18
|
+
defaultImageProps: ImageNodeRenderProps;
|
|
19
|
+
}) => JSX.Element;
|
|
16
20
|
}
|
|
17
21
|
export declare const ProductItem: FunctionComponent<ProductItemProps>;
|
|
18
22
|
//# sourceMappingURL=ProductItem.d.ts.map
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { HTMLAttributes } from 'preact/compat';
|
|
2
|
-
import { Container } from '../../../@adobe-commerce/elsie/src/lib';
|
|
3
|
-
import { Product } from '../../data/models';
|
|
2
|
+
import { Container, SlotProps } from '../../../@adobe-commerce/elsie/src/lib';
|
|
3
|
+
import { Item, Product } from '../../data/models';
|
|
4
|
+
import { ImageProps } from '../../../@adobe-commerce/elsie/src/components';
|
|
4
5
|
|
|
5
6
|
export interface WishlistProps extends HTMLAttributes<HTMLDivElement> {
|
|
6
7
|
routeEmptyWishlistCTA?: () => string;
|
|
@@ -10,6 +11,12 @@ export interface WishlistProps extends HTMLAttributes<HTMLDivElement> {
|
|
|
10
11
|
quantity: number;
|
|
11
12
|
}[]) => Promise<any>;
|
|
12
13
|
routeProdDetailPage: (product: Product) => string;
|
|
14
|
+
slots?: {
|
|
15
|
+
image?: SlotProps<{
|
|
16
|
+
defaultImageProps: ImageProps;
|
|
17
|
+
item: Item;
|
|
18
|
+
}>;
|
|
19
|
+
};
|
|
13
20
|
}
|
|
14
21
|
export declare const Wishlist: Container<WishlistProps>;
|
|
15
22
|
//# sourceMappingURL=Wishlist.d.ts.map
|
package/containers/Wishlist.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/*! Copyright 2025 Adobe
|
|
2
2
|
All Rights Reserved. */
|
|
3
|
-
import{jsx as i,jsxs as
|
|
3
|
+
import{jsx as i,jsxs as a,Fragment as b}from"@dropins/tools/preact-jsx-runtime.js";import{useState as _,useCallback as B,useEffect as $,useMemo as S,Fragment as R}from"@dropins/tools/preact-compat.js";import{classes as L,Slot as z,VComponent as A}from"@dropins/tools/lib.js";import{IllustratedMessage as V,Button as Y,Icon as q,SkeletonRow as G,Skeleton as J}from"@dropins/tools/components.js";import{W as K}from"../chunks/WishlistItem.js";import{events as E}from"@dropins/tools/event-bus.js";import{s as M}from"../chunks/removeProductsFromWishlist.js";import{useText as j,Text as F}from"@dropins/tools/i18n.js";import{W as O}from"../chunks/WishlistAlert.js";import{S as Q}from"../chunks/Heart.js";import"../chunks/Trash.js";import"@dropins/tools/fetch-graphql.js";import"../chunks/HeartFilled.js";const U=({className:l,children:t,ctaLinkURL:e,...m})=>{const r=j({emptyWishlist:"Wishlist.EmptyWishlist.heading",message:"Wishlist.EmptyWishlist.message",cta:"Wishlist.EmptyWishlist.cta"});return i("div",{...m,className:L(["wishlist-empty-wishlist",l]),children:i(V,{className:L(["wishlist-empty-wishlist__wrapper",l]),"data-testid":"wishlist-empty-wishlist",heading:r.emptyWishlist,icon:i(q,{className:"wishlist-empty-wishlist__icon",source:Q}),message:i("p",{children:r.message}),action:e?i(Y,{"data-testid":"wishlist-empty-wishlist-button",size:"medium",variant:"primary",type:"submit",href:e,children:r.cta},"routeHome"):void 0})})},H=()=>i(G,{children:`
|
|
4
4
|
<svg
|
|
5
5
|
width="100%"
|
|
6
6
|
height="100%"
|
|
@@ -14,4 +14,4 @@ import{jsx as i,jsxs as d,Fragment as H}from"@dropins/tools/preact-jsx-runtime.j
|
|
|
14
14
|
<rect x="6" y="556" width="132" height="22" rx="4" fill="#E8E8E8" />
|
|
15
15
|
<rect x="6" y="592" width="280" height="48" rx="24" fill="#D9D9D9" />
|
|
16
16
|
</svg>
|
|
17
|
-
`}),
|
|
17
|
+
`}),X=()=>a(J,{"data-testid":"wishlist-loader",children:[i(H,{}),i(H,{}),i(H,{})]}),di=({routeEmptyWishlistCTA:l,routeToWishlist:t,moveProdToCart:e,routeProdDetailPage:m,slots:r,...W})=>{const[g,k]=_(null),[x,d]=_(M.authenticated),[I,p]=_(M.isLoading),y=n=>d(n),[w,c]=_(null),v=B(n=>{const{action:h,item:o}=n;c(i(O,{action:h,item:o,routeToWishlist:t}))},[t]);return $(()=>{const n=E.on("authenticated",y),h=E.on("wishlist/alert",s=>v(s)),o=E.on("wishlist/data",s=>{k(s),p(!1)},{eager:!0});return()=>{n==null||n.off(),o==null||o.off(),h==null||h.off()}},[v]),i(Z,{...W,wishlistData:g,wishlistAlert:w,routeEmptyWishlistCTA:l,moveProdToCart:e,isLoggedIn:x,isLoading:I,routeProdDetailPage:m,slots:r})},Z=({className:l,wishlistData:t,wishlistAlert:e,isLoggedIn:m,isLoading:r,moveProdToCart:W,routeEmptyWishlistCTA:g,onLoginClick:k,routeProdDetailPage:x,slots:d,...I})=>{const[p,y]=_(e),w=j({wishlistHeading:"Wishlist.Wishlist.heading",wishlistLoadingHeading:"Wishlist.Wishlist.loading"}),c=S(()=>{var s;return((s=t==null?void 0:t.items)==null?void 0:s.length)>0?t.items.map(u=>{var f;return i(K,{initialData:u,moveProdToCart:W,routeProdDetailPage:x,imageNode:d!=null&&d.image?({defaultImageProps:N})=>i(z,{name:"image",slot:d.image,context:{defaultImageProps:N,item:u}}):void 0},(f=u.product)==null?void 0:f.sku)}):null},[t,W,x]);$(()=>{if(e){y(e);const s=setTimeout(()=>{y(null)},5e3);return()=>clearTimeout(s)}},[e]);const v=S(()=>p?i(A,{node:p,className:"wishlist-wishlist__alert"}):null,[p]),n=()=>a(b,{children:[i("div",{className:"wishlist-wishlist__heading","data-testid":"wishlist-heading-wrapper",children:i("h1",{className:"wishlist-wishlist__heading-text","data-testid":"loader-wishlist-heading",children:w.wishlistLoadingHeading})}),i(X,{})]}),h=()=>c?a(b,{children:[o,i("div",{className:"wishlist-wishlist__content",children:c})]}):i("div",{className:L(["wishlist-wishlist__content","wishlist-wishlist__content--empty"]),children:a("div",{children:[i(U,{"data-testid":"empty-wishlist",ctaLinkURL:g==null?void 0:g()}),!m&&i(C,{onLoginClick:k})]})}),o=S(()=>{var s;return c?i("div",{className:"wishlist-wishlist__heading","data-testid":"wishlist-heading-wrapper",children:i("h1",{className:"wishlist-wishlist__heading-text","data-testid":"default-wishlist-heading",children:(s=w.wishlistHeading)==null?void 0:s.split(" {count}").map((u,f)=>{var N;return a(R,{children:[u,f===0&&i("span",{className:"wishlist-wishlist__heading-count","data-testid":"wishlist-heading-count",children:`${t==null?void 0:t.items_count} products`})]},((N=t==null?void 0:t.id)==null?void 0:N.toString())+f)})})}):null},[w,c,t]);return a("div",{...I,className:L(["wishlist-wishlist",l]),children:[v,r?n():h()]})},C=({onLoginClick:l})=>a("div",{className:"wishlist-login__sign-in",children:[i("a",{"data-testid":"log-in-link",className:"wishlist-login__link",href:"",rel:"noreferrer",onClick:l,role:"button",children:i(F,{id:"Wishlist.Login.logIn"})}),i(F,{id:"Wishlist.Login.sync"})]});export{di as Wishlist,di as default};
|
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
import { HTMLAttributes } from 'preact/compat';
|
|
2
2
|
import { Container } from '../../../@adobe-commerce/elsie/src/lib';
|
|
3
3
|
import { Item, Product } from '../../data/models';
|
|
4
|
+
import { ImageNodeRenderProps } from '../../../@adobe-commerce/elsie/src/components';
|
|
5
|
+
import { JSX } from 'preact';
|
|
4
6
|
|
|
5
7
|
export interface WishlistItemProps extends HTMLAttributes<HTMLDivElement> {
|
|
6
8
|
initialData: Item | null;
|
|
@@ -11,6 +13,9 @@ export interface WishlistItemProps extends HTMLAttributes<HTMLDivElement> {
|
|
|
11
13
|
enteredOptions?: [];
|
|
12
14
|
}[]) => Promise<any>;
|
|
13
15
|
routeProdDetailPage: (product: Product) => string;
|
|
16
|
+
imageNode?: (props: {
|
|
17
|
+
defaultImageProps: ImageNodeRenderProps;
|
|
18
|
+
}) => JSX.Element;
|
|
14
19
|
}
|
|
15
20
|
export declare const WishlistItem: Container<WishlistItemProps>;
|
|
16
21
|
//# sourceMappingURL=WishlistItem.d.ts.map
|
package/package.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"name": "@dropins/storefront-wishlist", "version": "1.0.
|
|
1
|
+
{"name": "@dropins/storefront-wishlist", "version": "1.0.2-beta1", "@dropins/tools": "~1.0.0", "license": "SEE LICENSE IN LICENSE.md"}
|
package/render.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*! Copyright 2025 Adobe
|
|
2
2
|
All Rights Reserved. */
|
|
3
|
-
(function(r,e){try{if(typeof document<"u"){const t=document.createElement("style"),n=e.styleId;for(const i in e.attributes)t.setAttribute(i,e.attributes[i]);t.setAttribute("data-dropin",n),t.appendChild(document.createTextNode(r));const a=document.querySelector('style[data-dropin="sdk"]');if(a)a.after(t);else{const i=document.querySelector('link[rel="stylesheet"], style');i?i.before(t):document.head.append(t)}}}catch(t){console.error("dropin-styles (injectCodeFunction)",t)}})(".wishlist-empty-wishlist{container-type:inline-size;container-name:wishlist}.wishlist-empty-wishlist__wrapper .dropin-card--secondary{display:grid;grid-auto-rows:min-content;justify-content:center;text-align:center;border:unset}.wishlist-empty-wishlist .dropin-illustrated-message__heading{font:var(--type-headline-1-font)}.wishlist-empty-wishlist .dropin-illustrated-message__message{font:var(--type-body-1-default-font)}@container wishlist (width < 737px){.wishlist-empty-wishlist__wrapper .dropin-card{border:unset;border-style:hidden}}.wishlist-wishlist{container-type:inline-size;container-name:wishlist-grid;max-width:inherit}.wishlist-wishlist__content{display:grid;gap:var(--spacing-medium);margin:auto;padding:var(--spacing-medium) 0}.wishlist-wishlist__heading{color:var(--color-neutral-800);display:grid;font:var(--type-headline-1-font);letter-spacing:var(--type-headline-1-letter-spacing);padding:var(--spacing-small) 0;row-gap:var(--spacing-xsmall)}.wishlist-wishlist__heading-count{color:#6d6d6d;margin-left:var(--spacing-xxsmall);letter-spacing:normal;font:var(--type-details-caption-2-font)}.wishlist-wishlist__content.wishlist-wishlist__content--empty{border:var(--shape-border-width-2) solid var(--color-neutral-400);border-radius:var(--shape-border-radius-2);grid-template-columns:repeat(1,1fr);padding:var(--spacing-xxbig);margin:var(--spacing-xxbig) auto}@media only screen and (max-width: 480px){.wishlist-wishlist__content,.dropin-skeleton{grid-template-columns:repeat(1,1fr)}.dropin-skeleton-row:nth-child(n+2){display:none}}@media only screen and (min-width: 480px) and (max-width: 600px){.wishlist-wishlist__content,.dropin-skeleton{grid-template-columns:repeat(2,1fr)}.dropin-skeleton-row:nth-child(n+3){display:none}}@media only screen and (min-width: 600px){.wishlist-wishlist__content,.dropin-skeleton{grid-template-columns:repeat(2,1fr)}.dropin-skeleton-row:nth-child(n+3){display:none}}@media only screen and (min-width: 768px){.wishlist-wishlist__content,.dropin-skeleton{grid-template-columns:repeat(3,1fr)}.dropin-skeleton-row:nth-child(n){display:block}}.wishlist-product-item{background-color:var(--color-neutral-50);margin-bottom:var(--spacing-small)}.wishlist-product-item__content{display:flex;flex-direction:column;gap:var(--spacing-small)}.wishlist-product-item__content .wishlist-product-item-image{background:var(--color-neutral-200);height:100%;padding:0;width:100%}.wishlist-product-item__content .wishlist-product-item__title{color:var(--color-neutral-800);font:var(--type-body-2-strong-font);letter-spacing:var(--type-body-2-strong-letter-spacing);margin:0;position:relative}.wishlist-product-item-name{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:85%}a.wishlist-product-item-name:active,a.wishlist-product-item-name:hover,a.wishlist-product-item-name{color:var(--color-neutral-800);cursor:pointer;font:var(--type-body-2-strong-font);letter-spacing:var(--type-body-2-strong-letter-spacing)}.wishlist-product-item__content .wishlist-product-item-button__remove{position:absolute;right:0;top:-10px}.wishlist-product-item__content .wishlist-product-item-options{font:var(--type-body-2-default-font)}.wishlist-product-item__content .wishlist-product-item-option__attribute{text-transform:capitalize}.wishlist-product-item__content .wishlist-product-item-option__label{font:var(--type-body-2-strong-font)}.wishlist-product-item__content .wishlist-product-item-price{display:inline;font:var(--type-body-2-default-font)}.strikeout{text-decoration:line-through}.wishlist-product-item__content .wishlist-product-item-discounted-price{display:inline;margin-left:var(--spacing-xsmall);color:var(--color-alert-800)}.wishlist-product-item-move-to-cart{display:grid;grid-area:product-add-to-cart;justify-content:end}.wishlist-product-item-tax{color:var(--color-neutral-500)}.wishlist-product-item-tax span{margin-right:var(--spacing-xsmall)}.image-carousel{display:flex;flex-direction:column;gap:var(--spacing-medium);padding:var(--spacing-medium)}.image-carousel .image-carousel-image{object-fit:contain;padding:var(--spacing-xxsmall) 0;width:100%}.image-switcher-area{margin-top:var(--spacing-small);text-align:center;width:100%}.image-switcher-area .image-switcher{cursor:pointer;border-radius:50%;display:inline-flex;height:var(--spacing-xsmall);margin:0 var(--spacing-xxsmall);width:var(--spacing-xsmall)}.image-switcher-area .image-switcher-active{background-color:var(--color-neutral-900);border:var(--shape-border-width-1) solid var(--color-brand-700)}.image-switcher-area .image-switcher-inactive{background-color:var(--color-neutral-600);border:var(--shape-border-width-1) solid var(--color-neutral-600)}@media only screen and (max-width: 480px){.image-carousel{gap:var(--spacing-xxsmall)}.image-carousel .image-carousel-image{height:250px}}@media only screen and (min-width: 480px) and (max-width: 600px){.image-carousel{gap:var(--spacing-xsmall)}.image-carousel .image-carousel-image{height:300px}}@media only screen and (min-width: 600px){.image-carousel{gap:var(--spacing-xsmall)}.image-carousel .image-carousel-image{height:300px}}@media only screen and (min-width: 768px){.image-carousel{gap:var(--spacing-small)}.image-carousel .image-carousel-image{height:350px}}@media only screen and (min-width: 1024px){.image-carousel{gap:var(--spacing-medium)}.image-carousel .image-carousel-image{height:400px}}.wishlist-login__sign-in{grid-column-start:2;color:var(--color-neutral-800);font:var(--type-body-1-default-font);letter-spacing:var(--type-body-2-default-letter-spacing);margin-top:var(--spacing-xxsmall);text-align:center}a.wishlist-login__link{font:var(--type-body-1-strong-font);letter-spacing:var(--type-body-2-strong-letter-spacing);margin-left:var(--spacing-xxsmall);text-decoration:underline;text-decoration-thickness:auto;text-underline-offset:auto;color:var(--color-neutral-800)}a.wishlist-login__link:hover{color:var(--color-neutral-800);text-decoration:underline;text-decoration-thickness:auto;text-underline-offset:auto}",{styleId:"Wishlist"});
|
|
3
|
+
(function(r,e){try{if(typeof document<"u"){const t=document.createElement("style"),n=e.styleId;for(const i in e.attributes)t.setAttribute(i,e.attributes[i]);t.setAttribute("data-dropin",n),t.appendChild(document.createTextNode(r));const a=document.querySelector('style[data-dropin="sdk"]');if(a)a.after(t);else{const i=document.querySelector('link[rel="stylesheet"], style');i?i.before(t):document.head.append(t)}}}catch(t){console.error("dropin-styles (injectCodeFunction)",t)}})(".wishlist-empty-wishlist{container-type:inline-size;container-name:wishlist}.wishlist-empty-wishlist__wrapper .dropin-card--secondary{display:grid;grid-auto-rows:min-content;justify-content:center;text-align:center;border:unset}.wishlist-empty-wishlist .dropin-illustrated-message__heading{font:var(--type-headline-1-font)}.wishlist-empty-wishlist .dropin-illustrated-message__message{font:var(--type-body-1-default-font)}@container wishlist (width < 737px){.wishlist-empty-wishlist__wrapper .dropin-card{border:unset;border-style:hidden}}.wishlist-wishlist{container-type:inline-size;container-name:wishlist-grid;max-width:inherit}.wishlist-wishlist__content{display:grid;gap:var(--spacing-medium);margin:auto;padding:var(--spacing-medium) 0}.wishlist-wishlist__heading{color:var(--color-neutral-800);display:grid;font:var(--type-headline-1-font);letter-spacing:var(--type-headline-1-letter-spacing);padding:var(--spacing-small) 0;row-gap:var(--spacing-xsmall)}.wishlist-wishlist__heading-text{font-size:inherit;font-weight:inherit;margin:0;line-height:inherit}.wishlist-wishlist__heading-count{color:#6d6d6d;margin-left:var(--spacing-xxsmall);letter-spacing:normal;font:var(--type-details-caption-2-font)}.wishlist-wishlist__content.wishlist-wishlist__content--empty{border:var(--shape-border-width-2) solid var(--color-neutral-400);border-radius:var(--shape-border-radius-2);grid-template-columns:repeat(1,1fr);padding:var(--spacing-xxbig);margin:var(--spacing-xxbig) auto}@media only screen and (max-width: 480px){.wishlist-wishlist__content,.dropin-skeleton{grid-template-columns:repeat(1,1fr)}.dropin-skeleton-row:nth-child(n+2){display:none}}@media only screen and (min-width: 480px) and (max-width: 600px){.wishlist-wishlist__content,.dropin-skeleton{grid-template-columns:repeat(2,1fr)}.dropin-skeleton-row:nth-child(n+3){display:none}}@media only screen and (min-width: 600px){.wishlist-wishlist__content,.dropin-skeleton{grid-template-columns:repeat(2,1fr)}.dropin-skeleton-row:nth-child(n+3){display:none}}@media only screen and (min-width: 768px){.wishlist-wishlist__content,.dropin-skeleton{grid-template-columns:repeat(3,1fr)}.dropin-skeleton-row:nth-child(n){display:block}}.wishlist-product-item{background-color:var(--color-neutral-50);margin-bottom:var(--spacing-small)}.wishlist-product-item__content{display:flex;flex-direction:column;gap:var(--spacing-small)}.wishlist-product-item__content .wishlist-product-item-image{background:var(--color-neutral-200);height:100%;padding:0;width:100%}.wishlist-product-item__content .wishlist-product-item__title{color:var(--color-neutral-800);font:var(--type-body-2-strong-font);letter-spacing:var(--type-body-2-strong-letter-spacing);margin:0;position:relative}.wishlist-product-item-name{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:85%}a.wishlist-product-item-name:active,a.wishlist-product-item-name:hover,a.wishlist-product-item-name{color:var(--color-neutral-800);cursor:pointer;font:var(--type-body-2-strong-font);letter-spacing:var(--type-body-2-strong-letter-spacing)}.wishlist-product-item__content .wishlist-product-item-button__remove{position:absolute;right:0;top:-10px}.wishlist-product-item__content .wishlist-product-item-options{font:var(--type-body-2-default-font)}.wishlist-product-item__content .wishlist-product-item-option__attribute{text-transform:capitalize}.wishlist-product-item__content .wishlist-product-item-option__label{font:var(--type-body-2-strong-font)}.wishlist-product-item__content .wishlist-product-item-price{display:inline;font:var(--type-body-2-default-font)}.strikeout{text-decoration:line-through}.wishlist-product-item__content .wishlist-product-item-discounted-price{display:inline;margin-left:var(--spacing-xsmall);color:var(--color-alert-800)}.wishlist-product-item-move-to-cart{display:grid;grid-area:product-add-to-cart;justify-content:end}.wishlist-product-item-tax{color:var(--color-neutral-500)}.wishlist-product-item-tax span{margin-right:var(--spacing-xsmall)}.image-carousel{display:flex;flex-direction:column;gap:var(--spacing-medium);padding:var(--spacing-medium)}.image-carousel .image-carousel-image{object-fit:contain;padding:var(--spacing-xxsmall) 0;width:100%}.image-switcher-area{margin-top:var(--spacing-small);text-align:center;width:100%}.image-switcher-area .image-switcher{cursor:pointer;border-radius:50%;display:inline-flex;height:var(--spacing-xsmall);margin:0 var(--spacing-xxsmall);width:var(--spacing-xsmall)}.image-switcher-area .image-switcher-active{background-color:var(--color-neutral-900);border:var(--shape-border-width-1) solid var(--color-brand-700)}.image-switcher-area .image-switcher-inactive{background-color:var(--color-neutral-600);border:var(--shape-border-width-1) solid var(--color-neutral-600)}@media only screen and (max-width: 480px){.image-carousel{gap:var(--spacing-xxsmall)}.image-carousel .image-carousel-image{height:250px}}@media only screen and (min-width: 480px) and (max-width: 600px){.image-carousel{gap:var(--spacing-xsmall)}.image-carousel .image-carousel-image{height:300px}}@media only screen and (min-width: 600px){.image-carousel{gap:var(--spacing-xsmall)}.image-carousel .image-carousel-image{height:300px}}@media only screen and (min-width: 768px){.image-carousel{gap:var(--spacing-small)}.image-carousel .image-carousel-image{height:350px}}@media only screen and (min-width: 1024px){.image-carousel{gap:var(--spacing-medium)}.image-carousel .image-carousel-image{height:400px}}.wishlist-login__sign-in{grid-column-start:2;color:var(--color-neutral-800);font:var(--type-body-1-default-font);letter-spacing:var(--type-body-2-default-letter-spacing);margin-top:var(--spacing-xxsmall);text-align:center}a.wishlist-login__link{font:var(--type-body-1-strong-font);letter-spacing:var(--type-body-2-strong-letter-spacing);margin-left:var(--spacing-xxsmall);text-decoration:underline;text-decoration-thickness:auto;text-underline-offset:auto;color:var(--color-neutral-800)}a.wishlist-login__link:hover{color:var(--color-neutral-800);text-decoration:underline;text-decoration-thickness:auto;text-underline-offset:auto}",{styleId:"Wishlist"});
|
|
4
4
|
import{jsx as t}from"@dropins/tools/preact-jsx-runtime.js";import{Render as d}from"@dropins/tools/lib.js";import{useState as a,useEffect as n}from"@dropins/tools/preact-hooks.js";import{UIProvider as m}from"@dropins/tools/components.js";import{events as h}from"@dropins/tools/event-bus.js";const c={EmptyWishlist:{heading:"Your wishlist is empty",message:"Add items by clicking on the heart icon.",cta:"Start shopping"},Wishlist:{heading:"Wishlist {count}",loading:"Loading...",ariaLabelAddToWishlist:"add {PRODUCT_NAME} to wishlist",ariaLabelRemoveFromWishlist:"remove {PRODUCT_NAME} from wishlist"},Alert:{addProduct:{heading:"Added to wishlist",message:"{product} has been added to your wishlist"},removeProduct:{heading:"Removed from wishlist",message:"{product} has been removed from your wishlist"},moveToCart:{heading:"Moved to cart",message:"{product} has been moved to your cart"},addError:{heading:"Error",message:"Failed to add product to wishlist"},removeError:{heading:"Error",message:"Failed to remove {product} from wishlist"},viewWishlist:"View wishlist"},Login:{sync:" to sync your saved items across all your devices.",logIn:"Log in"}},l={CartActionButton:"Move To Cart",TrashActionButton:"Remove this product from wishlist",CustomizeActionButton:"Customize"},u={Wishlist:c,ProductItem:l},g={default:u},v=({children:e})=>{const[s,i]=a("en_US");return n(()=>{const o=h.on("locale",r=>{i(r)},{eager:!0});return()=>{o==null||o.off()}},[]),t(m,{lang:s,langDefinitions:g,children:e})},P=new d(t(v,{}));export{P as render};
|