@dropins/storefront-wishlist 1.0.1 → 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/WishlistAlert.js +1 -1
- package/chunks/WishlistItem.js +1 -1
- package/chunks/mergeWishlists.js +5 -5
- package/chunks/removeProductsFromWishlist.js +2 -2
- 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/WishlistAlert/WishlistAlert.d.ts +2 -2
- package/containers/WishlistAlert.js +1 -1
- package/containers/WishlistItem/WishlistItem.d.ts +5 -0
- package/containers/WishlistToggle.js +1 -1
- package/i18n/en_US.json.d.ts +11 -1
- package/package.json +1 -1
- package/render.js +2 -2
package/chunks/WishlistAlert.js
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
/*! Copyright 2025 Adobe
|
|
2
2
|
All Rights Reserved. */
|
|
3
|
-
import{jsx as
|
|
3
|
+
import{jsx as a}from"@dropins/tools/preact-jsx-runtime.js";import{InLineAlert as m,Icon as g}from"@dropins/tools/components.js";import*as r from"@dropins/tools/preact-compat.js";import{S as h,a as v}from"./Trash.js";import{S as p}from"./HeartFilled.js";import{useText as E}from"@dropins/tools/i18n.js";const n=e=>r.createElement("svg",{id:"Icon_Warning_Base",width:24,height:24,viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",...e},r.createElement("g",{clipPath:"url(#clip0_841_1324)"},r.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M11.9949 2.30237L0.802734 21.6977H23.1977L11.9949 2.30237Z",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round"}),r.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M12.4336 10.5504L12.3373 14.4766H11.6632L11.5669 10.5504V9.51273H12.4336V10.5504ZM11.5883 18.2636V17.2687H12.4229V18.2636H11.5883Z",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round"})),r.createElement("defs",null,r.createElement("clipPath",{id:"clip0_841_1324"},r.createElement("rect",{width:24,height:21,fill:"white",transform:"translate(0 1.5)"})))),H=({action:e,item:i,routeToWishlist:t})=>{const s=E({addHeading:"Wishlist.Alert.addProduct.heading",addMessage:"Wishlist.Alert.addProduct.message",removeHeading:"Wishlist.Alert.removeProduct.heading",removeMessage:"Wishlist.Alert.removeProduct.message",moveHeading:"Wishlist.Alert.moveToCart.heading",moveMessage:"Wishlist.Alert.moveToCart.message",viewWishlist:"Wishlist.Alert.viewWishlist",addErrorHeading:"Wishlist.Alert.addError.heading",addErrorMessage:"Wishlist.Alert.addError.message",removeErrorHeading:"Wishlist.Alert.removeError.heading",removeErrorMessage:"Wishlist.Alert.removeError.message"});if(!e)return null;const l=s[`${e}Heading`],o=s[`${e}Message`],d={add:p,remove:v,move:h,addError:n,removeError:n},c=t?location.href.includes(t):!1;return a(m,{"data-testid":"wishlist-alert",heading:l,description:i?o.replace("{product}",i.product.name):o,type:e==="addError"||e==="removeError"?"warning":"success",icon:a(g,{source:d[e],size:"16"}),actionButtonPosition:"top",additionalActions:!c&&t?[{label:s.viewWishlist,onClick:()=>{location.href=t}}]:void 0})};export{H as W};
|
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};
|
package/chunks/mergeWishlists.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/*! Copyright 2025 Adobe
|
|
2
2
|
All Rights Reserved. */
|
|
3
|
-
import{Initializer as D}from"@dropins/tools/lib.js";import{events as c}from"@dropins/tools/event-bus.js";import{j as v,s as l,f as
|
|
3
|
+
import{Initializer as D}from"@dropins/tools/lib.js";import{events as c}from"@dropins/tools/event-bus.js";import{j as v,s as l,f as T,h as b,g as E,i as C,k as G}from"./removeProductsFromWishlist.js";const R=new D({init:async e=>{const t={isGuestWishlistEnabled:!1,...e};R.config.setConfig(t),S().catch(console.error)},listeners:()=>[c.on("wishlist/data",e=>{v(e)},{eager:!0}),c.on("authenticated",async e=>{if(l.authenticated&&!e&&c.emit("wishlist/reset",void 0),e&&!l.authenticated){l.authenticated=e;const t=await S().catch(console.error);t&&ce(t)}},{eager:!0}),c.on("wishlist/reset",()=>{ae().catch(console.error),c.emit("wishlist/data",null)})]}),pe=R.config;function O(e){if(!e)return null;const t=i=>{switch(i){case 1:return"INCLUDING_FPT_AND_DESCRIPTION";case 2:return"EXCLUDING_FPT_INCLUDING_DESCRIPTION_FINAL_PRICE";case 3:return"EXCLUDING_FPT";default:return"INCLUDING_FPT_ONLY"}};return{wishlistIsEnabled:e.storeConfig.magento_wishlist_general_is_enabled,wishlistMultipleListIsEnabled:e.storeConfig.enable_multiple_wishlists,wishlistMaxNumber:e.storeConfig.maximum_number_of_wishlists,fixedProductTaxesEnabled:e.storeConfig.fixed_product_taxes_enable,fixedProductTaxesApply:e.storeConfig.fixed_product_taxes_apply_tax_to_fpt,fixedProductTaxesEnabledDisplayInProductLists:t(e.storeConfig.fixed_product_taxes_display_prices_in_product_lists),fixedProductTaxesEnabledDisplayInSalesModules:t(e.storeConfig.fixed_product_taxes_display_prices_in_sales_modules),fixedProductTaxesEnabledDisplayInProductView:t(e.storeConfig.fixed_product_taxes_display_prices_on_product_view_page)}}function w(e,t=[]){var i;return e?{type:e.__typename,name:e.name,sku:e.sku,uid:e.uid,image:M(e,t),stockStatus:e.stock_status,canonicalUrl:e.canonical_url,urlKey:e.url_key,categories:(i=e.categories)==null?void 0:i.map(s=>s.name),prices:W(e),productAttributes:F(e),options:U(e)}:null}function U(e){var t,i;return e.__typename==="ConfigurableProduct"?e.configurable_options?(t=e.configurable_options)==null?void 0:t.map(s=>{var n;return{uid:s.uid,attributeUid:s.attribute_uid,attributeCode:s.attribute_code,values:(n=s.values)==null?void 0:n.map(r=>({uid:r.uid,label:r.label})),required:!0}}):[]:e.__typename==="GiftCardProduct"?e.gift_card_options?(i=e.gift_card_options)==null?void 0:i.map(s=>({uid:s.uid,required:s.required,title:s.title})):[]:[]}function M(e,t=[]){var s;let i=e.thumbnail;if(e.__typename==="ConfigurableProduct"&&e.variants&&(t==null?void 0:t.length)>0){const n=t.map(u=>u.uid);let r=e.variants.find(u=>{var o;const _=((o=u.attributes)==null?void 0:o.map(a=>a.uid))||[];return n.every(a=>_.includes(a))});r||(r=e.variants.find(u=>{var _;return(_=u.attributes)==null?void 0:_.some(o=>t.some(a=>a.uid===o.uid))})),(s=r==null?void 0:r.product)!=null&&s.image&&(i=r.product.image)}return{src:i==null?void 0:i.url,alt:i==null?void 0:i.label}}function W(e){var t,i,s,n,r,u,_,o,a,d,m,f,p,I,g,h,y,P;return{regularPrice:{currency:((s=(i=(t=e.price_range)==null?void 0:t.minimum_price)==null?void 0:i.regular_price)==null?void 0:s.currency)??"USD",value:((u=(r=(n=e.price_range)==null?void 0:n.minimum_price)==null?void 0:r.regular_price)==null?void 0:u.value)??0},finalPrice:{currency:((a=(o=(_=e.price_range)==null?void 0:_.minimum_price)==null?void 0:o.final_price)==null?void 0:a.currency)??"USD",value:((f=(m=(d=e.price_range)==null?void 0:d.minimum_price)==null?void 0:m.final_price)==null?void 0:f.value)??0},discount:{amountOff:((g=(I=(p=e.price_range)==null?void 0:p.minimum_price)==null?void 0:I.discount)==null?void 0:g.amount_off)??0,percentOff:((P=(y=(h=e.price_range)==null?void 0:h.minimum_price)==null?void 0:y.discount)==null?void 0:P.percent_off)??0},fixedProductTaxes:L(e)}}function F(e){var t,i;return(i=(t=e.custom_attributesV2)==null?void 0:t.items)==null?void 0:i.map(s=>{const n=s.code.split("_").map(r=>r.charAt(0).toUpperCase()+r.slice(1)).join(" ");return{...s,code:n}})}function L(e){var t,i,s,n,r;return(i=(t=e.price_range)==null?void 0:t.minimum_price)!=null&&i.fixed_product_taxes?(r=(n=(s=e.price_range)==null?void 0:s.minimum_price)==null?void 0:n.fixed_product_taxes)==null?void 0:r.map(u=>({money:{value:u.amount.value,currency:u.amount.currency},label:u.label})):[]}function N(e,t){return e?{id:e.id,updated_at:e.updated_at,sharing_code:e.sharing_code,items_count:e.items_count,items:k(e,t??[])}:null}function k(e,t){var i,s;return(s=(i=e==null?void 0:e.items_v2)==null?void 0:i.items)!=null&&s.length?e.items_v2.items.map(n=>{const r=$(n);return{id:n.id,quantity:n.quantity,description:n.description,added_at:n.added_at,enteredOptions:t,selectedOptions:r,product:w(n.product,r)}}):[]}function $(e){return e.product.__typename==="ConfigurableProduct"?e.configurable_options?e.configurable_options.map(t=>({value:t.value_label,label:t.option_label,uid:t.configurable_product_option_value_uid})):[]:[]}const q=`
|
|
4
4
|
query STORE_CONFIG_QUERY {
|
|
5
5
|
storeConfig {
|
|
6
6
|
magento_wishlist_general_is_enabled
|
|
@@ -13,7 +13,7 @@ query STORE_CONFIG_QUERY {
|
|
|
13
13
|
fixed_product_taxes_display_prices_on_product_view_page
|
|
14
14
|
}
|
|
15
15
|
}
|
|
16
|
-
`,H=async()=>
|
|
16
|
+
`,H=async()=>T(q,{method:"GET",cache:"force-cache"}).then(({errors:e,data:t})=>e?b(e):O(t)),B=`
|
|
17
17
|
fragment PRICE_RANGE_FRAGMENT on PriceRange {
|
|
18
18
|
minimum_price {
|
|
19
19
|
regular_price {
|
|
@@ -185,7 +185,7 @@ ${B}
|
|
|
185
185
|
}
|
|
186
186
|
|
|
187
187
|
${x}
|
|
188
|
-
`,Z=async(e,t)=>{if(!e)throw Error("Product SKU is not set");return
|
|
188
|
+
`,Z=async(e,t)=>{if(!e)throw Error("Product SKU is not set");return T(V,{variables:{sku:e}}).then(({errors:i,data:s})=>{var n;return i?b(i):(n=s==null?void 0:s.products)!=null&&n.items?w(s.products.items[0],t??[]):null})},X=`
|
|
189
189
|
fragment CUSTOMIZABLE_OPTIONS_FRAGMENT on SelectedCustomizableOption {
|
|
190
190
|
type
|
|
191
191
|
customizable_option_uid
|
|
@@ -303,7 +303,7 @@ ${se}
|
|
|
303
303
|
}
|
|
304
304
|
|
|
305
305
|
${A}
|
|
306
|
-
`,ne=async()=>l.authenticated?
|
|
306
|
+
`,ne=async()=>l.authenticated?T(re).then(({errors:e,data:t})=>{var i;return e?b(e):(i=t==null?void 0:t.customer)!=null&&i.wishlists?t.customer.wishlists.map(s=>N(s)):null}):E(),oe=`
|
|
307
307
|
mutation ADD_PRODUCTS_TO_WISHLIST_MUTATION(
|
|
308
308
|
$wishlistId: ID!,
|
|
309
309
|
$wishlistItems: [WishlistItemInput!]!,
|
|
@@ -322,4 +322,4 @@ ${se}
|
|
|
322
322
|
}
|
|
323
323
|
}
|
|
324
324
|
${A}
|
|
325
|
-
`,
|
|
325
|
+
`,ue=async e=>{var s,n,r,u,_;if(!e)return null;const t=E();let i={id:(t==null?void 0:t.id)??"",updated_at:"",sharing_code:"",items_count:0,items:(t==null?void 0:t.items)??[]};for(const o of e){if((s=i.items)==null?void 0:s.some(f=>C(f,{sku:o.sku,optionUIDs:o.optionsUIDs})))continue;const d=o.optionsUIDs?(n=o.optionsUIDs)==null?void 0:n.map(f=>({uid:f})):[],m=await Z(o.sku,d);if(!m)throw Error("Product not found");i.items=[...i.items,{quantity:o.quantity,selectedOptions:d,enteredOptions:[],product:m}]}if(i.items_count=(r=i.items)==null?void 0:r.length,c.emit("wishlist/data",i),l.authenticated){if(!l.wishlistId)throw c.emit("wishlist/data",t),Error("Wishlist ID is not set");const o={wishlistId:l.wishlistId,wishlistItems:e.map(({sku:p,quantity:I,optionsUIDs:g,enteredOptions:h})=>({sku:p,quantity:I,selected_options:g,entered_options:h}))},{errors:a,data:d}=await T(oe,{variables:o}),m=[...((u=d==null?void 0:d.addProductsToWishlist)==null?void 0:u.user_errors)??[],...a??[]];if(m.length>0)return c.emit("wishlist/data",t),b(m);const f=N(d.addProductsToWishlist.wishlist,((_=e[0])==null?void 0:_.enteredOptions)??[]);c.emit("wishlist/data",f)}return null},ae=()=>(l.wishlistId=null,l.authenticated=!1,Promise.resolve(null)),S=async()=>{if(l.initializing)return null;l.initializing=!0,l.config||(l.config=await H());const e=l.authenticated?await le():await _e();return c.emit("wishlist/initialized",e),c.emit("wishlist/data",e),l.initializing=!1,e};async function le(){const e=await ne(),t=e?e[0]:null;return t?(l.wishlistId=t.id,t):null}async function _e(){try{return await E()}catch(e){throw console.error(e),e}}const ce=async e=>{var n;if(!e)return null;const t=E(!0),i=[];if((n=t==null?void 0:t.items)==null||n.forEach(r=>{var o;const u=((o=r.selectedOptions)==null?void 0:o.map(a=>a.uid))||[];if(!e.items.some(a=>C(a,{sku:r.product.sku,optionUIDs:u}))){const a={sku:r.product.sku,quantity:1,optionsUIDs:u,enteredOptions:r.enteredOptions||void 0};i.push(a)}}),i.length===0)return null;const s=await ue(i);return G(),s};export{se as W,ue as a,A as b,pe as c,Z as d,ne as e,S as f,H as g,le as h,R as i,_e as j,ce as m,ae as r,N as t};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/*! Copyright 2025 Adobe
|
|
2
2
|
All Rights Reserved. */
|
|
3
|
-
import{events as
|
|
3
|
+
import{events as d}from"@dropins/tools/event-bus.js";import{FetchGraphQL as S}from"@dropins/tools/fetch-graphql.js";function g(s){const e=document.cookie.split(";");for(const t of e)if(t.trim().startsWith(`${s}=`))return t.trim().substring(s.length+1);return null}const f={wishlistId:null,authenticated:!1,isLoading:!0},n=new Proxy(f,{set(s,e,t){if(s[e]=t,e==="wishlistId"){if(t===n.wishlistId)return!0;if(t===null)return document.cookie="DROPIN__WISHLIST__WISHLIST-ID=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/",!0;const r=new Date;r.setDate(r.getDate()+30),document.cookie=`DROPIN__WISHLIST__WISHLIST-ID=${t}; expires=${r.toUTCString()}; path=/`}return Reflect.set(s,e,t)},get(s,e){return e==="wishlistId"?g("DROPIN__WISHLIST__WISHLIST-ID"):s[e]}});function u(s,e){var o;if(s.product.sku!==e.sku)return!1;const t=((o=s.selectedOptions)==null?void 0:o.map(i=>i.uid).filter(i=>!!i).sort())||[],r=(e.optionUIDs||[]).filter(i=>!!i).sort();return JSON.stringify(t)===JSON.stringify(r)}const c="DROPIN__WISHLIST__WISHLIST__DATA";function E(s){const e=n.authenticated?sessionStorage:localStorage;if(s)try{e.setItem(c,JSON.stringify(s))}catch(t){p(t)?console.error("Storage quota exceeded:",t):console.error("Error saving wishlist:",t)}else e.removeItem(c)}const p=s=>s instanceof DOMException&&s.name==="QuotaExceededError";function _(s=!1){const e=n.authenticated&&!s?sessionStorage:localStorage;try{const t=e.getItem(c);return t?JSON.parse(t):{id:"",items:[]}}catch(t){return console.error("Error retrieving wishlist:",t),{id:"",items:[]}}}function H(){localStorage.removeItem(c)}function L(s,e=[],t=[]){var i;const r=n.authenticated?sessionStorage:localStorage,o=r.getItem(c)?JSON.parse(r.getItem(c)):{items:[]};return(i=o==null?void 0:o.items)==null?void 0:i.find(l=>u(l,{sku:s,optionUIDs:e}))}const{setEndpoint:P,setFetchGraphQlHeader:F,removeFetchGraphQlHeader:R,setFetchGraphQlHeaders:M,fetchGraphQl:w,getConfig:N}=new S().getMethods(),O=s=>{const e=s.map(t=>t.message).join(" ");throw Error(e)},D=`
|
|
4
4
|
mutation REMOVE_PRODUCTS_FROM_WISHLIST_MUTATION(
|
|
5
5
|
$wishlistId: ID!,
|
|
6
6
|
$wishlistItemsIds: [ID!]!,
|
|
@@ -15,4 +15,4 @@ import{events as u}from"@dropins/tools/event-bus.js";import{FetchGraphQL as S}fr
|
|
|
15
15
|
}
|
|
16
16
|
}
|
|
17
17
|
}
|
|
18
|
-
`,$=async s=>{var r,o,i;const e=_(),t={...e,items:(r=e.items)==null?void 0:r.filter(l=>!s.some(I=>{var a;return
|
|
18
|
+
`,$=async s=>{var r,o,i;const e=_(),t={...e,items:(r=e.items)==null?void 0:r.filter(l=>!s.some(I=>{var a;return u(l,{sku:I.product.sku,optionUIDs:(a=I.selectedOptions)==null?void 0:a.map(h=>h.uid)})}))};if(n.authenticated){if(!n.wishlistId)throw Error("Wishlist ID is not set");const l=s.map(m=>m.id),{errors:I,data:a}=await w(D,{variables:{wishlistId:n.wishlistId,wishlistItemsIds:l}}),h=[...((o=a==null?void 0:a.removeProductsFromWishlist)==null?void 0:o.user_errors)??[],...I??[]];if(h.length>0)return d.emit("wishlist/data",e),O(h)}return t.items_count=(i=t.items)==null?void 0:i.length,d.emit("wishlist/data",t),null};export{P as a,F as b,R as c,M as d,N as e,w as f,_ as g,O as h,u as i,E as j,H as k,L as l,$ as r,n as s};
|
|
@@ -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};
|
|
@@ -2,8 +2,8 @@ import { FunctionComponent } from 'preact';
|
|
|
2
2
|
import { HTMLAttributes } from 'preact/compat';
|
|
3
3
|
|
|
4
4
|
export interface WishlistAlertProps extends HTMLAttributes<HTMLDivElement> {
|
|
5
|
-
action: 'add' | 'remove' | 'move';
|
|
6
|
-
item
|
|
5
|
+
action: 'add' | 'remove' | 'move' | 'addError' | 'removeError';
|
|
6
|
+
item?: {
|
|
7
7
|
product: {
|
|
8
8
|
name: string;
|
|
9
9
|
};
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
/*! Copyright 2025 Adobe
|
|
2
2
|
All Rights Reserved. */
|
|
3
|
-
import{W as e,W as l}from"../chunks/WishlistAlert.js";import"@dropins/tools/preact-jsx-runtime.js";import"@dropins/tools/components.js";import"
|
|
3
|
+
import{W as e,W as l}from"../chunks/WishlistAlert.js";import"@dropins/tools/preact-jsx-runtime.js";import"@dropins/tools/components.js";import"@dropins/tools/preact-compat.js";import"../chunks/Trash.js";import"../chunks/HeartFilled.js";import"@dropins/tools/i18n.js";export{e as WishlistAlert,l 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
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
/*! Copyright 2025 Adobe
|
|
2
2
|
All Rights Reserved. */
|
|
3
|
-
import{jsx as
|
|
3
|
+
import{jsx as h}from"@dropins/tools/preact-jsx-runtime.js";import{useState as c,useCallback as E,useEffect as I}from"@dropins/tools/preact-compat.js";import{Button as F,Icon as d}from"@dropins/tools/components.js";import{events as a}from"@dropins/tools/event-bus.js";import{s as P,g as j,i as x,r as A}from"../chunks/removeProductsFromWishlist.js";import{c as M,a as R}from"../chunks/mergeWishlists.js";import{S as p}from"../chunks/HeartFilled.js";import{S as q}from"../chunks/Heart.js";import{useText as H}from"@dropins/tools/i18n.js";import"@dropins/tools/fetch-graphql.js";import"@dropins/tools/lib.js";const Z=({product:s,iconWishlisted:W,iconToWishlist:g,size:u,variant:D,disabled:U,labelToWishlist:k,labelWishlisted:w,onClick:O,removeProdFromCart:f})=>{const[b,L]=c(P.authenticated),[o,n]=c(!1),[r,S]=c(null),{isGuestWishlistEnabled:T}=M.getConfig(),v=H({addToWishlist:"Wishlist.Wishlist.ariaLabelAddToWishlist",removeFromWishlist:"Wishlist.Wishlist.ariaLabelRemoveFromWishlist"}),l=E(()=>{var t;const e=j(),i=(t=e==null?void 0:e.items)==null?void 0:t.find(m=>x(m,{sku:s.topLevelSku??s.sku,optionUIDs:s.optionUIDs??(s.selectedOptionsUIDs?Object.values(s.selectedOptionsUIDs):void 0)}));S(i??null),n(!!i)},[s.topLevelSku,s.sku,s.optionUIDs,s.selectedOptionsUIDs]);I(()=>{l()},[l]),I(()=>{const e=m=>L(m),i=a.on("authenticated",e),t=a.on("wishlist/data",l);return()=>{i==null||i.off(),t==null||t.off()}},[l]);const y=async()=>{var e;if(o){try{await A([r])}catch{return a.emit("wishlist/alert",{action:"removeError",item:r}),null}n(!1),a.emit("wishlist/alert",{action:"remove",item:r})}else{try{await R([{sku:s.topLevelSku??s.sku,quantity:1,optionsUIDs:s.optionUIDs??(s.selectedOptionsUIDs?Object.values(s.selectedOptionsUIDs):void 0),enteredOptions:(e=s.options)!=null&&e.items?s.options.items.filter(i=>i.selected).map(i=>({uid:i.uid,value:i.value})):void 0}])}catch{return a.emit("wishlist/alert",{action:"addError"}),null}n(!0),a.emit("wishlist/alert",{action:"add",item:{product:s}}),f&&await f([{uid:s.uid,quantity:0}])}};if(!b&&!T)return null;const C=o?v.removeFromWishlist.replace("{PRODUCT_NAME}",s==null?void 0:s.name):v.addToWishlist.replace("{PRODUCT_NAME}",s==null?void 0:s.name);return h(F,{active:o,"aria-label":C,"data-testid":"wishlist-toggle",size:u??"medium",variant:D??"tertiary",disabled:U,icon:h(d,{source:g??q}),activeIcon:h(d,{source:W??p}),onClick:O??y,children:k,activeChildren:w})};export{Z as WishlistToggle,Z as default};
|
package/i18n/en_US.json.d.ts
CHANGED
|
@@ -7,7 +7,9 @@ declare const _default: {
|
|
|
7
7
|
},
|
|
8
8
|
"Wishlist": {
|
|
9
9
|
"heading": "Wishlist {count}",
|
|
10
|
-
"loading": "Loading..."
|
|
10
|
+
"loading": "Loading...",
|
|
11
|
+
"ariaLabelAddToWishlist": "add {PRODUCT_NAME} to wishlist",
|
|
12
|
+
"ariaLabelRemoveFromWishlist": "remove {PRODUCT_NAME} from wishlist"
|
|
11
13
|
},
|
|
12
14
|
"Alert": {
|
|
13
15
|
"addProduct": {
|
|
@@ -22,6 +24,14 @@ declare const _default: {
|
|
|
22
24
|
"heading": "Moved to cart",
|
|
23
25
|
"message": "{product} has been moved to your cart"
|
|
24
26
|
},
|
|
27
|
+
"addError": {
|
|
28
|
+
"heading": "Error",
|
|
29
|
+
"message": "Failed to add product to wishlist"
|
|
30
|
+
},
|
|
31
|
+
"removeError": {
|
|
32
|
+
"heading": "Error",
|
|
33
|
+
"message": "Failed to remove {product} from wishlist"
|
|
34
|
+
},
|
|
25
35
|
"viewWishlist": "View wishlist"
|
|
26
36
|
},
|
|
27
37
|
"Login": {
|
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"});
|
|
4
|
-
import{jsx as
|
|
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
|
+
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};
|