PageSourceSearch

https://www.opi.com/_next/static/chunks/9445-8669b16d932b641e.js

js opi.com collected 2026-09-24 17:09:12 UTC 18,763 bytes, 188 lines download raw bytes

1(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[9445],{68909:function(e,n,t){"use strict";var a,r,i=t(2784);function l(){return(l=Object.assign?Object.assign.bind():function(e){for(var n=1;n<arguments.length;n++){var t=arguments[n];for(var a in t)({}).hasOwnProperty.call(t,a)&&(e[a]=t[a])}return e}).apply(null,arguments)}n.Z=e=>i.createElement("svg",l({className:"icon icon__arrow",viewBox:"0 0 45 45",fill:"none",xmlns:"http://www.w3.org/2000/svg"},e),a||(a=i.createElement("circle",{cx:22.5,cy:22.5,r:22.5,fill:"#fff"})),r||(r=i.createElement("path",{fillRule:"evenodd",clipRule:"evenodd",d:"m31.17 22.15-5.696-5.616 1.053-1.068 7.538 7.43-7.535 7.534-1.06-1.06 5.72-5.72H12v-1.5h19.17Z",fill:"#000"})))},29445:function(e,n,t){"use strict";t.r(n),t.d(n,{ProductRecommendations:function(){return T}});var a=t(52322),r=t(57815),i=t(5632),l=t(2784),o=t(52673),d=t(40549),c=t(3505),s=t(10718),m=t(21746),u=t(41929),p=t(3497),_=t(12971),g=t(68563),h=t(7040),S=t(1433),v=t(44354),x=t(50187),f=t(42819),b=t(17628),w=t(1293),y=t(50118),M=t(347),R=t(26540),j=t(6275),C=t(36598),N=t(29838),k=t(7764),P=t(33855),$=t(41524),B=t(4263);let W=`
2    query getCollectionProducts($handle: String!, $tagFilter: String!, $country: CountryCode!, $language: LanguageCode!, $includeReferenceMetafieldDetails: Boolean!, $numProductMedia: Int = 6, $numProductVariants: Int = 250, $numProductCollections: Int = 250, $numProductSellingPlanGroups: Int = 10, $numProductSellingPlans: Int = 10, $numProductVariantSellingPlanAllocations: Int = 10) @inContext(country: $country, language: $language) {
3  collection(handle: $handle) {
4    products(first: 12, filters: {tag: $tagFilter}) {
5      nodes {
6        seo {
7          title
8          description
9        }
10        ...ProductProviderFragment
11      }
12    }
13  }
14}
15    ${v.V}
16${x.Z}
17${f.r}
18${b.Q}
19${w.v}
20${y.w}
21${M.u}
22${R.O}
23${j.j}
24${C.n}
25${N.A}
26${k.I}
27${P.R}
28${$.Z}`,Z=(e,n,t)=>(0,h.a)(["getCollectionProducts",n],(0,B._)(e.endpoint,e.fetchParams||{},W,n,t),t);Z.getKey=e=>["getCollectionProducts",e],Z.fetcher=(e,n,t)=>(0,B._)(e.endpoint,e.fetchParams||{},W,n,t);var V=t(47771),I=t(99667);let F=(e,n,t)=>{let a=(0,S.T)(t),r={handle:e.handle,tagFilter:n?"pro":"consumer",includeReferenceMetafieldDetails:!0,...a},{data:i=[],isLoading:l}=(0,h.a)(Z.getKey(r),Z.fetcher((0,V.by)(t),r),{select:L});return{products:i?.filter(e=>e).map(e=>({product:e,isLoading:l})),isLoading:l}},L=e=>{let n=[],t=e.collection?.products.nodes;return t?.forEach(e=>{let t=I.p({product:e});n.push(t)}),n};var A=t(55825),O=t(41610),D=t(73614),E=t(18009);function T(e){let{filters:n,ruleContext:t}=e,{proCustomer:r}=(0,m.qp)(p.Am),l=(0,m.qp)(O.JN);if(void 0===l)throw Error("ProductRecommendations must be used within a FeatureFlagsContext");let s=(0,i.useRouter)(),g=(0,u.CS)(s.locale||s.defaultLocale),h={proCustomer:r,locale:g},{isProProductFilteringEnabled:S}=l.featureFlags[g];if(!n&&!t)return(0,a.jsx)(q,{...e,...h});let v=(0,E.e)(S,r,""),x=n?`${v} AND ${n}`:v,f=t?t.split(",").map(e=>e.trim()):[],b=(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(o.T,{filters:x,hitsPerPage:12,ruleContexts:["recommendations",...f],distinct:!0}),(0,a.jsx)(H,{...e,...h})]});return e?.asIndex?(0,a.jsx)(d.g,{indexName:(0,_.tH)(g),indexId:"recommendations",children:b}):(0,a.jsx)(c.p,{searchClient:A.J,indexName:(0,_.tH)(g),children:b})}let H=e=>{let{results:n,status:t,error:i}=(0,s.b)({catchError:!0}),{collection:o,locale:d,isLoading:c}=e,m=[];i||(m=n?.hits.length?n.hits.map(e=>({product:(0,g.k)({hit:e,collectionHandle:o.handle,locale:d}),isLoading:"idle"!==t})):[]);let u=(0,l.useMemo)(()=>({...e,products:m,isLoading:c}),[m,c,e]);return(0,a.jsx)(r.D,{...u,productCardComponent:D.C})},q=e=>{let{collection:n,proCustomer:t,locale:i}=e,{products:o,isLoading:d}=F(n,t||!1,i||"en-GB"),c=o.map(e=>{if(e&&e.product&&e.product.id){let n={...e};return e?.product?.id?.split("/").length>2&&n.product&&(n.product.id=e?.product?.id?.split("/").pop()||""),n}}).filter(e=>!!e&&!!e.product),s=(0,l.useMemo)(()=>(console.log("productsMapped: ",c),{...e,products:c,isLoading:d}),[c,d,e]);return(0,a.jsx)(r.D,{...s,productCardComponent:D.C})}},99667:function(e,n,t){"use strict";t.d(n,{p:function(){return c}});var a=t(83953),r=t(86914);let i=e=>{let n=(0,a.QN)(e.handle??""),t=n?`/products/${n}`:"";return{id:e.id??"",title:e.title??"",handle:n,price:{amount:Number(e.priceRange.minVariantPrice.amount),currencyCode:e.priceRange.minVariantPrice.currencyCode},comparePrice:{amount:Number(e.compareAtPriceRange.maxVariantPrice.amount),currencyCode:e.compareAtPriceRange.maxVariantPrice.currencyCode},availableForSale:!!e.availableForSale,systemName:e.productType||"",url:t,tags:e.tags,ultaProductUrl:e.meta_ulta_product_url?.value,customBuyNowLabel:e.meta_custom_buy_now_label?.value,customBuyNowUrl:e.meta_custom_buy_now_url?.value,asin:e.meta_asin?.value,barcode:e.variants?.edges[0]?.node.barcode||"",sku:e.variants?.edges[0]?.node.sku||"",secondaryImage:e.meta_hover_image?.value,hasAwards:!!e.meta_awards_icons?.value}},l=(e,n)=>{let t=function(e){if(!e?.media)return[];let n=[];
28return e.media.edges.forEach(e=>{let{node:t}=e;"MediaImage"===t.__typename&&n.push({type:r.r.Image,id:t.image?.id??"",image:{id:t.image?.id??"",url:t.image?.url??"",altText:t.image?.altText??"",width:t.image?.width??0,height:t.image?.height??0}})}),n}(n);t.length&&(e.image=t[0].image.url||"",e.images=t.map(e=>({src:e.image.url,alt:e.image.altText,height:e.image.height,width:e.image.width})))},o=e=>{let n="true"===(e.meta_pro_only?.value||"").toLowerCase();return e.variants&&e.variants.edges.every(e=>"true"===e.node.meta_pro_only?.value)||n},d=(e,n)=>{if(!n.variants)return;let t=n.variants.edges.find(e=>e.node.availableForSale);t&&(e.firstAvailableVariantId=t.node.id,t.node.sku&&(e.sku=t.node.sku))},c=e=>{if(!e.product)return;let n=e.product,t=i(n);return l(t,n),t.proOnly=o(n),d(t,n),t}},55825:function(e,n,t){"use strict";t.d(n,{J:function(){return r}});var a=t(61970);let r=t.n(a)()("0P2OOP9ZOZ","1986f53b4416185d50aee77c7f004dfe")},57815:function(e,n,t){"use strict";t.d(n,{D:function(){return m}});var a=t(52322),r=t(6277),i=t(39097),l=t.n(i),o=t(2784),d=t(16394),c=t(74826),s=t(93106);let m=({title:e,description:n,descriptionLink:t,cta:i,products:m,backgroundColor:u,viewModeOnlyMobile:p,placement:_,isLoading:g=!1,productCardComponent:h=d.I})=>{let S=(0,o.useMemo)(()=>p?{fontClasses:{title:"text-heading-h2-mobile"},styleClass:"productRecommendationManual__mobileViewOnly"}:"blog"===_?{fontClasses:{title:"text-heading-h2-desktop text-heading-h2-mobile"},styleClass:"productRecommendationManual__devirseViewModeBlog"}:{fontClasses:{title:"text-heading-h2-desktop text-heading-h2-mobile"},styleClass:"productRecommendationManual__devirseViewMode"},[p,_]);if(!m.length&&!g)return null;let v=`
29  .productRecommendationManual {
30    padding-block-start: var(--spacing-xl);
31    padding-block-end: var(--spacing-xl);
32
33    @media (max-width: 1023px) {
34      margin-inline-end: calc(var(--margin-mobile) * -1);
35      margin-inline-start: calc(var(--margin-mobile) * -1);
36    }
37  }
38  .productRecommendationManual__mobileViewOnly {
39    padding-block-start: 0;
40    padding-block-end: 0;
41
42    --recommendation-product-width: 158px;
43    --recommendation-product-height: 341px;
44    --recommendation-header-wrapper-margin-bottom: var(--spacing-m);
45    --recommendation-button-display: none;
46    --recommendation-width: 100%;
47    --recommendation-margin-block-start: var(--spacing-xl);
48    --recommendation-margin-block-end: var(--spacing-m);
49    --recommendation-view-transform: translate(var(--margin-mobile));
50    --recommendation-title-inline-spacing: 0;
51    --recommendation-marrgin-inline-start: var(--margin-mobile);
52  }
53
54  .productRecommendationManual__devirseViewMode,
55  .productRecommendationManual__devirseViewModeBlog {
56    --recommendation-product-width: 353px;
57    --recommendation-product-height: auto;
58    --recommendation-header-wrapper-margin-bottom: var(--spacing-l);
59    --recommendation-button-display: unset;
60    --recommendation-width: 100vw;
61    --recommendation-margin-block-start: var(--spacing-5xl);
62    --recommendation-margin-block-end: var(--spacing-l);
63    --recommendation-view-transform: 2.5px;
64    --recommendation-title-inline-spacing: var(--margin-desktop);
65    --recommendation-marrgin-inline-start: var(--margin-desktop);
66  }
67
68  .productRecommendationManual__carousel {
69    --arrow-top-spacing: 112px;
70  }
71
72  .productRecommendationManual__carousel.onlyMobile {
73    --arrow-top-spacing: 97px;
74  }
75
76  .productRecommendationManual__devirseViewModeBlog {
77    --recommendation-product-width: 282px;
78  }
79
80  .productRecommendationManual__carouselWrapper {
81    width: 100vw;
82    --itemview-transform: translate(var(--margin-mobile));
83    margin-inline-start: calc(var(--margin-mobile) * -1);
84  }
85
86  .productRecommendationManual__headerWrapper {
87    margin-bottom: var(--recommendation-header-wrapper-margin-bottom);
88  }
89
90  .productRecommendationManual__titleWrapper {
91    align-items: flex-start;
92    display: flex;
93    flex-direction: row;
94    gap: var(--spacing-m);
95    justify-content: space-between;
96  }
97
98  .productRecommendationManual__cta {
99    display: var(--recommendation-button-display);
100    flex-shrink: 0;
101    text-decoration: none;
102  }
103
104  @media (max-width: 1023.98px) {
105    .productRecommendationManual__mobileHidden {
106      display: none;
107    }
108
109    .productRecommendationManual__productWrapper {
110      width: 158px;
111      height: 341px;
112    }
113  }
114
115  @media (min-width: 1024px) {
116    padding-block-start: var(--spacing-5xl);
117    padding-block-end: var(--spacing-5xl);
118
119    .productRecommendationManual__carousel {
120      --arrow-top-spacing: 218px;
121    }
122
123    .productRecommendationManual__carousel.onlyMobile {
124      --arrow-top-spacing: 97px;
125    }
126
127    .productRecommendationManual__mobileViewOnly {
128      padding-block-start: 0;
129      padding-block-end: 0;
130    }
131
132    .productRecommendationManual__headerWrapper {
133      margin-bottom: var(--recommendation-header-wrapper-margin-bottom);
134    }
135
136    .productRecommendationManual__carouselWrapper {
137      --itemview-transform: var(--recommendation-view-transform);
138
139      margin-inline-start: calc(
140        var(--recommendation-marrgin-inline-start) * -1
141      );
142      width: calc(
143        100% + (var(--recommendation-marrgin-inline-start) * 2) - 13px
144      );
145    }
146
147    .productRecommendationManual__carouselWrapper.blog {
148      /*
149        Recommendations section in blog article pages flow out of parent container.
150        Parent container is taking 7 columns out of 9.
151        All parent container content is inside the 7 columns boundaries,
152        except for Recommendations section it fills the whole 9 columns.
153        So we add a negative margin of 100% / -9 which is one column width.
154      */
155      margin-inline-end: calc(100% / -9);
156      margin-inline-start: calc(100% / -9);
157      width: auto;
158    }
159
160    .productRecommendationManual__productWrapper {
161      width: var(--recommendation-product-width);
162    }
163
164    .productRecommendationManual__titleWrapper {
165      padding-inline-end: var(--recommendation-title-inline-spacing);
166      padding-inline-start: var(--recommendation-title-inline-spacing);
167    }
168
169    .productRecommendationManual__titleWrapper.blog {
170      /*
171        Recommendations section in blog article pages flow out of parent container.
172        Parent container is taking 7 columns out of 9.
173        All parent container content is inside the 7 columns boundaries,
174        except for Recommendations section it fills the whole 9 columns.
175        So we add a negative margin of 100% / -9 which is one column width.
176      */
177      margin-inline-end: calc(100% / -9);
178      margin-inline-start: calc(100% / -9);
179      padding-inline-end: 0;
180      padding-inline-start: 0;
181    }
182
183    .productRecommendationManual__description {
184      display: inline;
185    }
186  }
187  `;return(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)("style",{type:"text/css",children:v}),(0,a.jsxs)("section",{className:(0,r.Z)("productRecommendationManual",S.styleClass,u&&"productRecommendationManual--background","productRecommendationManual__carousel",p&&"onlyMobile"),children:[(0,a.jsx)("div",{className:"productRecommendationManual__headerWrapper",children:(0,a.jsxs)("div",{className:(0,r.Z)("productRecommendationManual__titleWrapper","blog"===_&&"blog"),children:[(0,a.jsxs)("div",{className:"productRecommendationManual__titleTextWrapper",children:[e&&(0,a.jsx)("h2",{className:(0,r.Z)("productRecommendationManual__title",S.fontClasses.title),children:e}),(0,a.jsxs)("div",{className:"productRecommendationManual__descriptionWrapper",children:[n&&(0,a.jsx)("p",{className:(0,r.Z)("productRecommendationManual__description","text-body-1-desktop","text-body-2-mobile"),children:n}),t?.title&&(0,a.jsxs)(a.Fragment,{children:[" ",(0,a.jsx)(l(),{href:t.url,className:(0,r.Z)("productRecommendationManual__descriptionLink","text-body-1-desktop","text-body-2-mobile"),target:t.newTab?"_blank":void 0,children:t.title})]})]})]}),i&&(0,a.jsx)(c.z,{type:"button",className:(0,r.Z)("productRecommendationManual__cta","productRecommendationManual__mobileHidden"),modifiers:["white","outlined"],href:i.url,target:i.newTab?"_blank":void 0,children:(0,a.jsx)("span",{children:i.title})})]})}),(0,a.jsx)("div",{className:(0,r.Z)("productRecommendationManual__carouselWrapper","blog"===_&&"blog"),children:(0,a.jsxs)(s.h,{id:"nailArtCollectionCarousel",height:null,spacing:"5px",children:[!g&&m.map((e,n)=>(0,a.jsx)("div",{className:"productRecommendationManual__productWrapper",children:(0,a.jsx)("article",{style:{height:"100%"},"data-test-id":"productCard",children:(0,a.jsx)(h,{...e,isLoading:g,viewModeOnlyMobile:p,location:"recommendations"})})},n)),g&&[...[,,,,].keys()].map(e=>(0,a.jsx)("div",{className:"productRecommendationManual__productWrapper",children:(0,a.jsx)("article",{style:{height:"100%"},"data-test-id":"productCard",children:(0,a.jsx)(h,{viewModeOnlyMobile:p,location:"recommendations",isLoading:!0})})},e))]})})]})]})}},93106:function(e,n,t){"use strict";t.d(n,{h:function(){return s}});var a=t(52322),r=t(6277),i=t(2784),l=t(50278),o=t(68909),d=t(54993),c=t.n(d);let s=({id:e="defaults",height:n="30rem",children:t,spacing:d="1rem",reverse:s=!1,dots:m=!1,itemviewTransform:u,className:p,hideDisabledNavButton:_=!1,clickToSwitch:g=!1})=>{let h=i.Children.toArray(t),S=(0,i.useRef)(null),v=(0,i.useRef)([]),[x,f]=(0,i.useState)(!1),[b,w]=(0,i.useState)(0),y=(0,l.N)(w),M=()=>Math.round(S.current?.scrollLeft??0),R=()=>S.current?.scrollWidth??0,j=()=>S.current?.clientWidth??0,C=()=>S.current?.offsetWidth??0,N=()=>
187R()-M(),[k,P]=(0,i.useState)(!0),$=(0,l.N)(P),B=e=>{e<=h.length-2&&j()>=N()?y(e+1):0===e&&M()>0?y(1):y(e)},W=e=>{let n=s?M()+j()-v.current[e].offsetLeft-v.current[e].clientWidth:M()-v.current[e].offsetLeft,t=s?M()-j()+R():M()+j()-R(),a=s?n>t:n<t;S.current&&S.current.scrollTo({left:M()-(a?t:n),top:0,behavior:"smooth"})};return((0,i.useEffect)(()=>{f(R()>C())}),h.length)?(0,a.jsxs)("div",{className:(0,r.Z)(c().scrollSnapSlider,p),dir:s?"rtl":"ltr",children:[(0,a.jsxs)("div",{className:c().scrollSnapSlider__crop,style:{"--slider-height":null!==n?n:void 0,"--slider-spacing":null!==d?d:void 0,"--itemview-transform":u,"--nav-arrows-display":x?"block":"none","--nav-arrows-disabled-opacity":_?0:.5},children:[(0,a.jsx)("div",{className:c().scrollSnapSlider__content,ref:S,onScroll:()=>{let e=s?M()+j()-5:M()+5;B(v.current.findIndex((n,t,a)=>{let r=t+1,i=r>=a.length,l=s?n?.offsetLeft:a[i?t:r]?.offsetLeft??0,o=i?5:0;return s?e>=l-o:e<=l+o})),$(s?j()+-1*M()+5<=R():N()-j()-5>=0)},children:(0,a.jsx)("div",{className:c().scrollSnapSlider__platter,children:h.map((n,t)=>(0,a.jsx)("div",{className:(0,r.Z)({[c().scrollSnapSlider__listitem]:!s},{[c()["scrollSnapSlider__listitem--reverse"]]:s}),ref:e=>e?v.current[t]=e:null,dir:"ltr","data-slider-slide":e,onClick:g?()=>W(t):void 0,onKeyDown:g?()=>W(t):void 0,role:g?"button":"",tabIndex:g?t:void 0,children:(0,a.jsx)("div",{className:c().scrollSnapSlider__itemview,"data-slider-itemview":e,children:n})},t))})}),(0,a.jsxs)("button",{className:(0,r.Z)(c().scrollSnapSlider__navButton,{[c()["scrollSnapSlider__navButton--prev"]]:!s},{[c()["scrollSnapSlider__navButton--prevReverse"]]:s}),disabled:0===b,onClick:()=>W(b-1),"data-nav-available":0!==b||void 0,"data-previous-button":e,type:"button",children:[(0,a.jsx)("span",{className:"visually-hidden",children:"Previous"}),(0,a.jsx)(o.Z,{})]}),(0,a.jsxs)("button",{className:(0,r.Z)(c().scrollSnapSlider__navButton,{[c()["scrollSnapSlider__navButton--next"]]:!s},{[c()["scrollSnapSlider__navButton--nextReverse"]]:s}),disabled:!k,onClick:()=>W(b+1),"data-nav-available":!!k||void 0,"data-next-button":e,type:"button",children:[(0,a.jsx)("span",{className:"visually-hidden",children:"Next"}),(0,a.jsx)(o.Z,{})]})]}),m&&(0,a.jsx)("ul",{className:c().scrollSnapSlider__slidePips,"data-slider-pips":e,children:Array.from({length:(()=>{let e=h.length,n=j(),t=R();return Math.ceil((t-n)/(t/e))+1})()}).map((e,n)=>(0,a.jsx)("li",{className:c().scrollSnapSlider__slidePip,children:(0,a.jsxs)("button",{className:c().scrollSnapSlider__slidePipButton,onClick:()=>W(n),type:"button",children:[(0,a.jsxs)("span",{className:"visually-hidden",children:["Skip to slide ",n+1]}),(0,a.jsx)("span",{className:c().scrollSnapSlider__dot,"data-current":b===n||void 0})]})},n))})]}):null}},54993:function(e){e.exports={scrollSnapSlider:"ScrollSnapSlider_scrollSnapSlider__iZ3Id",scrollSnapSlider__crop:"ScrollSnapSlider_scrollSnapSlider__crop___zVMy",scrollSnapSlider__content:"ScrollSnapSlider_scrollSnapSlider__content__DL4tq",scrollSnapSlider__platter:"ScrollSnapSlider_scrollSnapSlider__platter__DmM12",scrollSnapSlider__listitem:"ScrollSnapSlider_scrollSnapSlider__listitem__51QAf",scrollSnapSlider__itemview:"ScrollSnapSlider_scrollSnapSlider__itemview__am1iF","scrollSnapSlider__listitem--reverse":"ScrollSnapSlider_scrollSnapSlider__listitem--reverse__v7cNC",scrollSnapSlider__navButton:"ScrollSnapSlider_scrollSnapSlider__navButton__zSsNj","scrollSnapSlider__navButton--prev":"ScrollSnapSlider_scrollSnapSlider__navButton--prev__jp8_s","scrollSnapSlider__navButton--nextReverse":"ScrollSnapSlider_scrollSnapSlider__navButton--nextReverse__HGN5o","scrollSnapSlider__navButton--next":"ScrollSnapSlider_scrollSnapSlider__navButton--next__fMVYZ","scrollSnapSlider__navButton--prevReverse":"ScrollSnapSlider_scrollSnapSlider__navButton--prevReverse__k4_ev",scrollSnapSlider__slidePips:"ScrollSnapSlider_scrollSnapSlider__slidePips__JpZFC",scrollSnapSlider__slidePipButton:"ScrollSnapSlider_scrollSnapSlider__slidePipButton__CsWLD",scrollSnapSlider__dot:"ScrollSnapSlider_scrollSnapSlider__dot___F90Q",slideto:"ScrollSnapSlider_slideto___wxg_"}}}]);
188//# sourceMappingURL=9445-8669b16d932b641e.js.map

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.