@anker-in/headless-ui 1.3.68 → 1.3.69

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.
Files changed (8) hide show
  1. package/dist/cjs/biz-components/HeroBanner/HeroBanner.js +1 -1
  2. package/dist/cjs/biz-components/ShelfDisplay/shelfDisplayItem.js +1 -1
  3. package/dist/cjs/components/dialog.js +1 -1
  4. package/dist/esm/biz-components/HeroBanner/HeroBanner.js +1 -1
  5. package/dist/esm/biz-components/ShelfDisplay/shelfDisplayItem.js +1 -1
  6. package/dist/esm/components/dialog.js +1 -1
  7. package/package.json +1 -1
  8. package/style.css +9 -0
package/dist/cjs/biz-components/HeroBanner/HeroBanner.js CHANGED
@@ -1 +1 @@
1
- "use strict";"use client";var ze=Object.create;var L=Object.defineProperty;var Ce=Object.getOwnPropertyDescriptor;var Le=Object.getOwnPropertyNames;var Ie=Object.getPrototypeOf,Pe=Object.prototype.hasOwnProperty;var Se=(t,s)=>{for(var o in s)L(t,o,{get:s[o],enumerable:!0})},re=(t,s,o,h)=>{if(s&&typeof s=="object"||typeof s=="function")for(let b of Le(s))!Pe.call(t,b)&&b!==o&&L(t,b,{get:()=>s[b],enumerable:!(h=Ce(s,b))||h.enumerable});return t};var B=(t,s,o)=>(o=t!=null?ze(Ie(t)):{},re(s||!t||!t.__esModule?L(o,"default",{value:t,enumerable:!0}):o,t)),Ee=t=>re(L({},"__esModule",{value:!0}),t);var Oe={};Se(Oe,{default:()=>Ae});module.exports=Ee(Oe);var e=require("react/jsx-runtime"),p=B(require("react")),N=B(require("gsap")),T=require("gsap/dist/ScrollTrigger"),I=B(require("jump.js")),_=require("react-responsive"),ne=require("react-intersection-observer"),le=B(require("../../helpers/ScrollLoadVideo.js")),l=require("../../components/index.js"),d=require("../../helpers/index.js"),V=require("class-variance-authority"),se=require("../../shared/Styles.js"),ie=require("../../hooks/useExposure.js"),H=require("../../shared/trackUrlRef.js"),pe=require("../../helpers/utils.js"),ue=require("../AiuiProvider/index.js"),ce=require("../../components/button.js"),me=require("../VideoModal/index.js"),de=B(require("./HeroBannerCarousel.js"));const f="image",g="hero_banner",Me=(0,V.cva)("hero-banner-content lg-desktop:gap-[32px] absolute top-24 z-10 flex w-full flex-col gap-[24px]",{variants:{align:{left:"tablet:px-[32px] laptop:top-1/2 laptop:px-[64px] lg-desktop:px-[calc(50%-832px)] laptop:-translate-y-1/2 left-0 px-[16px]",center:"tablet:top-[84px] laptop:top-[76px] desktop:top-[176px] lg-desktop:top-[192px] left-1/2 top-[84px] -translate-x-1/2 translate-y-0 items-center text-center"}},defaultVariants:{align:"left"}}),Re=(0,V.cva)("hero-banner-wrap-text lg-desktop:max-w-[824px] desktop:max-w-[648px] laptop:max-w-[440px] tablet:max-w-[704px] max-w-[358px]",{variants:{align:{left:"laptop:text-left",center:"text-center"}},defaultVariants:{align:"left"}}),De=(0,V.cva)("hero-banner-button-group lg-desktop:gap-x-3 flex flex-wrap items-center gap-x-2 gap-y-3",{variants:{align:{left:"laptop:justify-start",center:"justify-center"}},defaultVariants:{align:"left"}}),je=(0,V.cva)("hero-banner-icon-group flex items-center gap-2",{variants:{align:{left:"justify-start",center:"justify-center"}},defaultVariants:{align:"left"}}),_e=({size:t="base"})=>{const{width:s,height:o}=ce.sizeMap[t];return(0,e.jsx)("svg",{width:s,height:o,viewBox:"0 0 20 20",fill:"currentcolor",xmlns:"http://www.w3.org/2000/svg",children:(0,e.jsx)("path",{d:"M13.9599 9.30662C14.4547 9.63647 14.4547 10.3635 13.9599 10.6934L6.29558 15.8029C5.74179 16.1721 5 15.7751 5 15.1096V4.89042C5 4.22484 5.74179 3.82785 6.29558 4.19705L13.9599 9.30662Z",fill:"currentcolor"})})},oe=p.default.forwardRef(({data:t,className:s,classNames:o={},onSecondaryClick:h,onPrimaryClick:b,onTertiaryClick:A,jumpOptions:fe={},...O},U)=>{const{locale:q}=(0,ue.useAiuiContext)(),P={...{duration:500,offset:0},...fe},z=a=>!a||!q?a:(0,pe.getLocalizedPath)(a,q),{label:G,title:i,subtitle:n,endDate:J,endDate_tz:ge,dateFormat:be,pcImage:y,padImage:F,mobileImage:C,pcVideo:xe,padVideo:ye,mobileVideo:W,isShowVideo:he,isVideoLoop:ve=!0,primaryButton:u,secondaryButton:r,tertiaryButton:c,theme:ke="light",size:S="default",titleSize:E,caption:Y=[],blockLink:Q,iconArray:Z,align:v="left",enableParallax:K=!0}=t,M=Array.isArray(Y)?Y:[],we=Array.isArray(Z)?Z:void 0,$e=(0,_.useMediaQuery)({query:"(max-width: 768px)"}),Be=(0,_.useMediaQuery)({query:"(max-width: 1024px)"}),[X,ee]=(0,p.useState)(!1),{ref:Ne,inView:te}=(0,ne.useInView)(),R=(0,p.useRef)(null),D=(0,p.useRef)(null),j=(0,p.useRef)(null),k=(0,p.useRef)(null),x=(0,p.useRef)(null),Te=i?.trim()||n?.trim()||y?.alt?.trim()||void 0,Ve=i!==void 0?i?.trim()||n?.trim()||y?.alt?.trim()||void 0:n&&n.trim()||"",He=n&&n.trim()||"";return(0,ie.useExposure)(x,{componentType:f,componentName:g,componentTitle:Ve,componentDescription:He}),(0,p.useImperativeHandle)(U,()=>x.current),(0,p.useEffect)(()=>{if(t.items&&t.items.length>0||!K)return;N.default.registerPlugin(T.ScrollTrigger);function a(){if(!k.current)return;const m=x.current?.clientHeight||100;window.innerHeight<=m?R.current=T.ScrollTrigger.create({trigger:x.current,start:"top bottom",end:"bottom top",scrub:!0,onUpdate:w=>{const $=w.progress*40-20;N.default.set(k.current,{yPercent:$})}}):(j.current=T.ScrollTrigger.create({trigger:x.current,start:"top bottom",end:"bottom bottom",scrub:!0,onUpdate:w=>{const $=w.progress*20-20;N.default.set(k.current,{yPercent:$})}}),D.current=T.ScrollTrigger.create({trigger:x.current,start:"top top",end:"bottom top",scrub:!0,onUpdate:w=>{const $=w.progress*20;N.default.set(k.current,{yPercent:$})}}))}return te&&a(),()=>{R.current&&R.current.kill(),j.current&&j.current.kill(),D.current&&D.current.kill()}},[te,t.items,K]),t.items&&t.items.length>0?(0,e.jsx)(de.default,{data:t,className:s,classNames:o,onPrimaryClick:b,onSecondaryClick:h,onTertiaryClick:A,ref:U,...O}):(0,e.jsx)("div",{...O,ref:Ne,"data-ui-component-id":"HeroBanner",children:(0,e.jsxs)("div",{ref:x,className:(0,d.cn)(ke==="dark"?"aiui-dark":"","text-info-primary relative w-full overflow-hidden",{"lg-desktop:aspect-[1920/930] desktop:aspect-[1440/700] laptop:aspect-[1024/520] tablet:aspect-[768/660] aspect-[390/660]":S==="default","lg-desktop:aspect-[1920/800] desktop:aspect-[1440/640] laptop:aspect-[1024/480] tablet:aspect-[768/560] aspect-[390/560]":S==="sm"},s),children:[Q&&(0,e.jsx)("a",{className:"absolute inset-0 z-10",href:(0,H.trackUrlRef)(z(Q),`${f}_${g}`),"data-headless-type-name":`${f}#${g}`,"data-headless-title-desc-button":`${i}#${n}`,tabIndex:-1,"aria-hidden":"true","aria-label":Te}),(0,e.jsx)("div",{ref:k,className:(0,d.cn)("absolute left-0 top-0 size-full"),children:he?(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)("div",{"data-video-poster":"true",className:"laptop:w-full absolute inset-0 h-full transition-opacity duration-500",children:(0,e.jsx)(l.Picture,{className:"absolute inset-0 size-full",imgClassName:"size-full object-cover",loading:"eager",fetchPriority:"high",alt:y?.alt||"",source:`${y?.url||""} , ${F?.url??(C?.url||"")} 1024, ${C?.url||""} 767`})}),(0,e.jsx)(le.default,{poster:void 0,src:$e?W?.url:Be?ye?.url||W?.url:xe?.url,className:"laptop:w-full absolute inset-0 h-full",videoClassName:"h-full object-cover",muted:!0,loop:ve,playsInline:!0,onPlaying:a=>{a.currentTarget.closest('[data-ui-component-id="HeroBanner"]')?.querySelector('[data-video-poster="true"]')?.classList.add("opacity-0")}})]}):(0,e.jsx)(l.Picture,{className:"laptop:w-full h-full",imgClassName:"h-full object-cover",loading:"eager",fetchPriority:"high",alt:y?.alt||"",source:`${y?.url||""} , ${F?.url??(C?.url||"")} 1024, ${C?.url||""} 767`})}),(0,e.jsxs)("div",{className:Me({align:v}),children:[(0,e.jsxs)("div",{className:Re({align:v}),children:[G&&(0,e.jsx)(l.Text,{size:2,as:"p",className:(0,d.cn)("hero-banner-label font-heading lg-desktop:text-[18px] desktop:text-base text-sm"),html:G}),i&&(0,e.jsx)(l.Heading,{as:E==="4"?"h1":"h2",html:i,className:(0,d.cn)("hero-banner-title",o.title),size:E?Number(E||"5"):S==="sm"?4:5}),n&&(0,e.jsx)(l.Text,{as:"p",size:2,className:(0,d.cn)("hero-banner-subtitle font-heading lg-desktop:text-[18px] desktop:text-base laptop:mt-2 lg-desktop:mt-4 mt-1 text-sm",o.subtitle),html:n}),J&&(0,e.jsx)("div",{className:"mt-3",children:(0,e.jsx)(l.Countdown,{endDate:J,endDate_tz:ge,dateFormat:be,variant:"spacious",align:v})})]}),(0,e.jsxs)("div",{className:(0,d.cn)(De({align:v}),o.buttonGroup),children:[(0,e.jsxs)("div",{className:"lg-desktop:gap-3 flex items-center gap-2",children:[r?.isShowPlayVideoButton&&r?.playVideoButtonText?(0,e.jsxs)(l.Button,{onClick:()=>ee(!0),size:"lg",variant:"secondary",className:"hero-banner-play-video-button","data-headless-type-name":`${f}#${g}`,"data-headless-title-desc-button":`${i}#${n}#${r?.playVideoButtonText}`,children:[r?.playVideoButtonText," ",(0,e.jsx)(_e,{size:"lg"})]}):r?.text?(0,e.jsxs)(l.Button,{"aria-label":i??n,size:"lg",variant:"secondary",className:(0,d.cn)("hero-banner-secondary-button",o.secondaryButton),as:r?.isCustomSecondaryButton?"button":"a",href:(0,H.trackUrlRef)(z(r?.link),`${f}_${g}`),target:r?.target,rel:r?.target==="_blank"?r?.rel??"noopener noreferrer":r?.rel,onClick:a=>{if(r.link?.startsWith("#")){a.preventDefault();const m=document.querySelector(r.link);m&&(0,I.default)(m,P)}r?.isCustomSecondaryButton&&h?.(t,a,r?.customSecondaryEventId)},"data-headless-type-name":`${f}#${g}`,"data-headless-title-desc-button":`${i}#${n}#${r?.text}`,children:[r?.text,(0,e.jsx)("span",{className:"sr-only",children:i??n})]}):null,u&&u.text&&(0,e.jsx)(l.Button,{"aria-label":i??n,size:"lg",variant:"primary",className:(0,d.cn)("hero-banner-primary-button",o.primaryButton),as:u?.isCustomPrimaryButton?"button":"a",href:(0,H.trackUrlRef)(z(u.link),`${f}_${g}`),target:u?.target,rel:u?.target==="_blank"?u?.rel??"noopener noreferrer":u?.rel,onClick:a=>{if(u.link?.startsWith("#")){a.preventDefault();const m=document.querySelector(u.link);m&&(0,I.default)(m,P)}u?.isCustomPrimaryButton&&b?.(t,a,u?.customPrimaryEventId)},"data-headless-type-name":`${f}#${g}`,"data-headless-title-desc-button":`${i}#${n}#${u?.text}`,children:u.text})]}),c&&c.text&&(0,e.jsxs)(l.Button,{"aria-label":i??n,size:"lg",variant:"link",className:(0,d.cn)("hero-banner-tertiary-button w-auto p-0",o.tertiaryButton),as:c?.isCustomTertiaryButton?"button":"a",href:(0,H.trackUrlRef)(z(c.link),`${f}_${g}`),target:c?.target,rel:c?.target==="_blank"?c?.rel??"noopener noreferrer":c?.rel,onClick:a=>{if(c.link?.startsWith("#")){a.preventDefault();const m=document.querySelector(c.link);m&&(0,I.default)(m,P)}c?.isCustomTertiaryButton&&A?.(t,a,c?.customTertiaryEventId)},"data-headless-type-name":`${f}#${g}`,"data-headless-title-desc-button":`${i}#${n}#${c?.text}`,children:[c.text,(0,e.jsx)("span",{className:"sr-only",children:i??n})]})]}),(0,e.jsx)("div",{className:je({align:v}),children:we?.map(a=>(0,e.jsx)("div",{className:"h-12",children:(0,e.jsx)(l.Picture,{className:"laptop:w-full h-full",imgClassName:"h-full object-cover",loading:"eager",alt:a?.pcImage?.alt||"",source:a?.pcImage?.url})},a?.pcImage?.url||a?.pcImage?.alt))})]}),M.length>0&&(0,e.jsx)("div",{className:(0,d.cn)("hero-banner-caption-group laptop:gap-3 tablet:px-[32px] laptop:px-[64px] lg-desktop:px-[calc(50%-832px)] desktop:pb-[24px] absolute bottom-0 z-10 flex items-stretch gap-2 px-[16px] pb-[16px]",o.captionGroup),children:M.map((a,m)=>(0,e.jsxs)(p.default.Fragment,{children:[(0,e.jsx)(l.Text,{size:2,className:(0,d.cn)("hero-banner-product-text tablet:w-[108px] loptop:w-[150px] desktop:w-[156px] lg-desktop:w-[180px] laptop:text-[14px] flex-1 text-[12px]"),html:a.title}),m<M.length-1&&(0,e.jsx)("div",{className:(0,d.cn)("bg-info-primary w-px")})]},a.title))}),X&&(0,e.jsx)(me.VideoModal,{visible:X,videoUrl:r?.isYoutubeVideo?void 0:r?.videoUrl?.url,youTubeId:r?.isYoutubeVideo?r?.youtubeId:void 0,onCloseModal:()=>ee(!1)})]})})});oe.displayName="HeroBanner";var Ae=(0,se.withLayout)(oe);
1
+ "use strict";"use client";var ze=Object.create;var L=Object.defineProperty;var Ce=Object.getOwnPropertyDescriptor;var Le=Object.getOwnPropertyNames;var Ie=Object.getPrototypeOf,Pe=Object.prototype.hasOwnProperty;var Se=(t,s)=>{for(var o in s)L(t,o,{get:s[o],enumerable:!0})},re=(t,s,o,h)=>{if(s&&typeof s=="object"||typeof s=="function")for(let b of Le(s))!Pe.call(t,b)&&b!==o&&L(t,b,{get:()=>s[b],enumerable:!(h=Ce(s,b))||h.enumerable});return t};var B=(t,s,o)=>(o=t!=null?ze(Ie(t)):{},re(s||!t||!t.__esModule?L(o,"default",{value:t,enumerable:!0}):o,t)),Ee=t=>re(L({},"__esModule",{value:!0}),t);var Oe={};Se(Oe,{default:()=>Ae});module.exports=Ee(Oe);var e=require("react/jsx-runtime"),p=B(require("react")),N=B(require("gsap")),T=require("gsap/dist/ScrollTrigger"),I=B(require("jump.js")),_=require("react-responsive"),ne=require("react-intersection-observer"),le=B(require("../../helpers/ScrollLoadVideo.js")),l=require("../../components/index.js"),d=require("../../helpers/index.js"),V=require("class-variance-authority"),se=require("../../shared/Styles.js"),ie=require("../../hooks/useExposure.js"),H=require("../../shared/trackUrlRef.js"),pe=require("../../helpers/utils.js"),ue=require("../AiuiProvider/index.js"),ce=require("../../components/button.js"),me=require("../VideoModal/index.js"),de=B(require("./HeroBannerCarousel.js"));const f="image",g="hero_banner",Me=(0,V.cva)("hero-banner-content lg-desktop:gap-[32px] absolute top-24 z-10 flex w-full flex-col gap-[24px]",{variants:{align:{left:"tablet:px-[32px] laptop:top-1/2 laptop:px-[64px] lg-desktop:px-[calc(50%-832px)] laptop:-translate-y-1/2 left-0 px-[16px]",center:"tablet:top-[84px] laptop:top-[76px] desktop:top-[176px] lg-desktop:top-[192px] left-1/2 top-[84px] -translate-x-1/2 translate-y-0 items-center text-center"}},defaultVariants:{align:"left"}}),Re=(0,V.cva)("hero-banner-wrap-text lg-desktop:max-w-[824px] desktop:max-w-[648px] laptop:max-w-[440px] tablet:max-w-[704px] max-w-[358px]",{variants:{align:{left:"laptop:text-left",center:"text-center"}},defaultVariants:{align:"left"}}),De=(0,V.cva)("hero-banner-button-group lg-desktop:gap-x-3 flex flex-wrap items-center gap-x-2 gap-y-3",{variants:{align:{left:"laptop:justify-start",center:"justify-center"}},defaultVariants:{align:"left"}}),je=(0,V.cva)("hero-banner-icon-group flex items-center gap-2",{variants:{align:{left:"justify-start",center:"justify-center"}},defaultVariants:{align:"left"}}),_e=({size:t="base"})=>{const{width:s,height:o}=ce.sizeMap[t];return(0,e.jsx)("svg",{width:s,height:o,viewBox:"0 0 20 20",fill:"currentcolor",xmlns:"http://www.w3.org/2000/svg",children:(0,e.jsx)("path",{d:"M13.9599 9.30662C14.4547 9.63647 14.4547 10.3635 13.9599 10.6934L6.29558 15.8029C5.74179 16.1721 5 15.7751 5 15.1096V4.89042C5 4.22484 5.74179 3.82785 6.29558 4.19705L13.9599 9.30662Z",fill:"currentcolor"})})},oe=p.default.forwardRef(({data:t,className:s,classNames:o={},onSecondaryClick:h,onPrimaryClick:b,onTertiaryClick:A,jumpOptions:fe={},...O},U)=>{const{locale:q}=(0,ue.useAiuiContext)(),P={...{duration:500,offset:0},...fe},z=a=>!a||!q?a:(0,pe.getLocalizedPath)(a,q),{label:G,title:i,subtitle:n,endDate:J,endDate_tz:ge,dateFormat:be,pcImage:y,padImage:F,mobileImage:C,pcVideo:xe,padVideo:ye,mobileVideo:W,isShowVideo:he,isVideoLoop:ve=!0,primaryButton:u,secondaryButton:r,tertiaryButton:c,theme:ke="light",size:S="default",titleSize:E,caption:Y=[],blockLink:Q,iconArray:Z,align:v="left",enableParallax:K=!0}=t,M=Array.isArray(Y)?Y:[],we=Array.isArray(Z)?Z:void 0,$e=(0,_.useMediaQuery)({query:"(max-width: 768px)"}),Be=(0,_.useMediaQuery)({query:"(max-width: 1024px)"}),[X,ee]=(0,p.useState)(!1),{ref:Ne,inView:te}=(0,ne.useInView)(),R=(0,p.useRef)(null),D=(0,p.useRef)(null),j=(0,p.useRef)(null),k=(0,p.useRef)(null),x=(0,p.useRef)(null),Te=i?.trim()||n?.trim()||y?.alt?.trim()||void 0,Ve=i!==void 0?i?.trim()||n?.trim()||y?.alt?.trim()||void 0:n&&n.trim()||"",He=n&&n.trim()||"";return(0,ie.useExposure)(x,{componentType:f,componentName:g,componentTitle:Ve,componentDescription:He}),(0,p.useImperativeHandle)(U,()=>x.current),(0,p.useEffect)(()=>{if(t.items&&t.items.length>0||!K)return;N.default.registerPlugin(T.ScrollTrigger);function a(){if(!k.current)return;const m=x.current?.clientHeight||100;window.innerHeight<=m?R.current=T.ScrollTrigger.create({trigger:x.current,start:"top bottom",end:"bottom top",scrub:!0,onUpdate:w=>{const $=w.progress*40-20;N.default.set(k.current,{yPercent:$})}}):(j.current=T.ScrollTrigger.create({trigger:x.current,start:"top bottom",end:"bottom bottom",scrub:!0,onUpdate:w=>{const $=w.progress*20-20;N.default.set(k.current,{yPercent:$})}}),D.current=T.ScrollTrigger.create({trigger:x.current,start:"top top",end:"bottom top",scrub:!0,onUpdate:w=>{const $=w.progress*20;N.default.set(k.current,{yPercent:$})}}))}return te&&a(),()=>{R.current&&R.current.kill(),j.current&&j.current.kill(),D.current&&D.current.kill()}},[te,t.items,K]),t.items&&t.items.length>0?(0,e.jsx)(de.default,{data:t,className:s,classNames:o,onPrimaryClick:b,onSecondaryClick:h,onTertiaryClick:A,ref:U,...O}):(0,e.jsx)("div",{...O,ref:Ne,"data-ui-component-id":"HeroBanner",children:(0,e.jsxs)("div",{ref:x,className:(0,d.cn)(ke==="dark"?"aiui-dark":"","text-info-primary relative w-full overflow-hidden",{"lg-desktop:aspect-[1920/930] desktop:aspect-[1440/700] laptop:aspect-[1024/520] tablet:aspect-[768/660] aspect-[390/660]":S==="default","lg-desktop:aspect-[1920/800] desktop:aspect-[1440/640] laptop:aspect-[1024/480] tablet:aspect-[768/560] aspect-[390/560]":S==="sm"},s),children:[Q&&(0,e.jsx)("a",{className:"absolute inset-0 z-10",href:(0,H.trackUrlRef)(z(Q),`${f}_${g}`),"data-headless-type-name":`${f}#${g}`,"data-headless-title-desc-button":`${i}#${n}`,tabIndex:-1,"aria-hidden":"true","aria-label":Te}),(0,e.jsx)("div",{ref:k,className:(0,d.cn)("absolute left-0 top-0 size-full"),children:he?(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)("div",{"data-video-poster":"true",className:"laptop:w-full absolute inset-0 h-full transition-opacity duration-500",children:(0,e.jsx)(l.Picture,{className:"absolute inset-0 size-full",imgClassName:"size-full object-cover",loading:"eager",fetchPriority:"high",alt:y?.alt||"",source:`${y?.url||""} , ${F?.url??(C?.url||"")} 1024, ${C?.url||""} 767`})}),(0,e.jsx)(le.default,{poster:void 0,src:$e?W?.url:Be?ye?.url||W?.url:xe?.url,className:"laptop:w-full absolute inset-0 h-full",videoClassName:"h-full object-cover",muted:!0,loop:ve,playsInline:!0,onPlaying:a=>{a.currentTarget.closest('[data-ui-component-id="HeroBanner"]')?.querySelector('[data-video-poster="true"]')?.classList.add("opacity-0")}})]}):(0,e.jsx)(l.Picture,{className:"laptop:w-full h-full",imgClassName:"h-full object-cover",loading:"eager",fetchPriority:"high",alt:y?.alt||"",source:`${y?.url||""} , ${F?.url??(C?.url||"")} 1024, ${C?.url||""} 767`})}),(0,e.jsxs)("div",{className:Me({align:v}),children:[(0,e.jsxs)("div",{className:Re({align:v}),children:[G&&(0,e.jsx)(l.Text,{size:2,as:"p",className:(0,d.cn)("hero-banner-label font-heading lg-desktop:text-[18px] desktop:text-base text-sm"),html:G}),i&&(0,e.jsx)(l.Heading,{as:E==="4"?"h1":"h2",html:i,className:(0,d.cn)("hero-banner-title",o.title),size:E?Number(E||"5"):S==="sm"?4:5}),n&&(0,e.jsx)(l.Text,{as:"p",size:2,className:(0,d.cn)("hero-banner-subtitle font-heading lg-desktop:text-[18px] desktop:text-base laptop:mt-2 lg-desktop:mt-4 mt-1 text-sm",o.subtitle),html:n}),J&&(0,e.jsx)("div",{className:"mt-3",children:(0,e.jsx)(l.Countdown,{endDate:J,endDate_tz:ge,dateFormat:be,variant:"spacious",align:v})})]}),(0,e.jsxs)("div",{className:(0,d.cn)(De({align:v}),o.buttonGroup),children:[(0,e.jsxs)("div",{className:"lg-desktop:gap-3 flex items-center gap-2",children:[r?.isShowPlayVideoButton&&r?.playVideoButtonText?(0,e.jsxs)(l.Button,{onClick:()=>ee(!0),size:"lg",variant:"secondary",className:"hero-banner-play-video-button","data-headless-type-name":`${f}#${g}`,"data-headless-title-desc-button":`${i}#${n}#${r?.playVideoButtonText}`,children:[r?.playVideoButtonText," ",(0,e.jsx)(_e,{size:"lg"})]}):r?.text?(0,e.jsxs)(l.Button,{"aria-label":i??n,size:"lg",variant:"secondary",className:(0,d.cn)("hero-banner-secondary-button",o.secondaryButton),as:r?.isCustomSecondaryButton?"button":"a",href:(0,H.trackUrlRef)(z(r?.link),`${f}_${g}`),target:r?.target,rel:r?.target==="_blank"?r?.rel??"noopener noreferrer":r?.rel,onClick:a=>{if(r.link?.startsWith("#")){a.preventDefault();const m=document.querySelector(r.link);m&&(0,I.default)(m,P)}r?.isCustomSecondaryButton&&h?.(t,a,r?.customSecondaryEventId)},"data-headless-type-name":`${f}#${g}`,"data-headless-title-desc-button":`${i}#${n}#${r?.text}`,children:[r?.text,(0,e.jsx)("span",{className:"sr-only",children:i??n})]}):null,u&&u.text&&(0,e.jsx)(l.Button,{"aria-label":i??n,size:"lg",variant:"primary",className:(0,d.cn)("hero-banner-primary-button",o.primaryButton),as:u?.isCustomPrimaryButton?"button":"a",href:(0,H.trackUrlRef)(z(u.link),`${f}_${g}`),target:u?.target,rel:u?.target==="_blank"?u?.rel??"noopener noreferrer":u?.rel,onClick:a=>{if(u.link?.startsWith("#")){a.preventDefault();const m=document.querySelector(u.link);m&&(0,I.default)(m,P)}u?.isCustomPrimaryButton&&b?.(t,a,u?.customPrimaryEventId)},"data-headless-type-name":`${f}#${g}`,"data-headless-title-desc-button":`${i}#${n}#${u?.text}`,children:u.text})]}),c&&c.text&&(0,e.jsxs)(l.Button,{"aria-label":i??n,size:"lg",variant:"link",className:(0,d.cn)("hero-banner-tertiary-button w-auto p-0",o.tertiaryButton),as:c?.isCustomTertiaryButton?"button":"a",href:(0,H.trackUrlRef)(z(c.link),`${f}_${g}`),target:c?.target,rel:c?.target==="_blank"?c?.rel??"noopener noreferrer":c?.rel,onClick:a=>{if(c.link?.startsWith("#")){a.preventDefault();const m=document.querySelector(c.link);m&&(0,I.default)(m,P)}c?.isCustomTertiaryButton&&A?.(t,a,c?.customTertiaryEventId)},"data-headless-type-name":`${f}#${g}`,"data-headless-title-desc-button":`${i}#${n}#${c?.text}`,children:[c.text,(0,e.jsx)("span",{className:"sr-only",children:i??n})]})]}),(0,e.jsx)("div",{className:je({align:v}),children:we?.map(a=>(0,e.jsx)("div",{className:"h-12",children:(0,e.jsx)(l.Picture,{className:"!inline-block h-full !w-auto",imgClassName:"!w-auto h-full object-contain",loading:"eager",alt:a?.pcImage?.alt||"",source:a?.pcImage?.url})},a?.pcImage?.url||a?.pcImage?.alt))})]}),M.length>0&&(0,e.jsx)("div",{className:(0,d.cn)("hero-banner-caption-group laptop:gap-3 tablet:px-[32px] laptop:px-[64px] lg-desktop:px-[calc(50%-832px)] desktop:pb-[24px] absolute bottom-0 z-10 flex items-stretch gap-2 px-[16px] pb-[16px]",o.captionGroup),children:M.map((a,m)=>(0,e.jsxs)(p.default.Fragment,{children:[(0,e.jsx)(l.Text,{size:2,className:(0,d.cn)("hero-banner-product-text tablet:w-[108px] loptop:w-[150px] desktop:w-[156px] lg-desktop:w-[180px] laptop:text-[14px] flex-1 text-[12px]"),html:a.title}),m<M.length-1&&(0,e.jsx)("div",{className:(0,d.cn)("bg-info-primary w-px")})]},a.title))}),X&&(0,e.jsx)(me.VideoModal,{visible:X,videoUrl:r?.isYoutubeVideo?void 0:r?.videoUrl?.url,youTubeId:r?.isYoutubeVideo?r?.youtubeId:void 0,onCloseModal:()=>ee(!1)})]})})});oe.displayName="HeroBanner";var Ae=(0,se.withLayout)(oe);
package/dist/cjs/biz-components/ShelfDisplay/shelfDisplayItem.js CHANGED
@@ -1 +1 @@
1
- "use strict";var ze=Object.create;var fe=Object.defineProperty;var Ae=Object.getOwnPropertyDescriptor;var Fe=Object.getOwnPropertyNames;var Me=Object.getPrototypeOf,je=Object.prototype.hasOwnProperty;var Ee=(e,t)=>{for(var p in t)fe(e,p,{get:t[p],enumerable:!0})},Ie=(e,t,p,T)=>{if(t&&typeof t=="object"||typeof t=="function")for(let g of Fe(t))!je.call(e,g)&&g!==p&&fe(e,g,{get:()=>t[g],enumerable:!(T=Ae(t,g))||T.enumerable});return e};var Te=(e,t,p)=>(p=e!=null?ze(Me(e)):{},Ie(t||!e||!e.__esModule?fe(p,"default",{value:e,enumerable:!0}):p,e)),Oe=e=>Ie(fe({},"__esModule",{value:!0}),e);var Re={};Ee(Re,{ShelfDisplayHorizontalItem:()=>Ue,ShelfDisplayWrapItem:()=>He,getProductImage:()=>De});module.exports=Oe(Re);var s=require("react/jsx-runtime"),Ne=require("../AiuiProvider/index.js"),Ce=require("./shelfDisplay.js"),xe=Te(require("../../components/picture.js")),ve=Te(require("../../components/badge.js")),k=require("../../helpers/utils.js"),be=require("../../components/text.js"),se=Te(require("../../components/button.js")),Be=require("../../shared/track.js"),Pe=require("../../shared/trackUrlRef.js"),Le=require("../../components/heading.js"),$e=require("../../hooks/useExposure.js"),c=require("react");const ye="image",ge="product_shelf",he=999999999e-2,De=e=>{const t=e?.sku,p=e?.variants,T=p?.find(O=>O?.sku===t),g=T?.image?.url||p?.[0]?.image?.url||"",re=T?.image?.altText||p?.[0]?.image?.altText||e?.custom_name||e?.title||"";return{imageUrl:g,altText:re}},We=({items:e})=>e?.length?(0,s.jsx)("div",{className:"shelf-display-social-endorsements desktop:gap-2 absolute right-0 top-0 z-10 flex flex-col items-center gap-1",children:e.map((t,p)=>typeof t.icon=="string"?(0,s.jsx)("img",{src:t.icon,alt:t.label||"",loading:"lazy",className:"desktop:size-10 lg-desktop:size-12 size-8 object-contain"},p):(0,s.jsx)(be.Text,{"aria-label":t.label,className:"desktop:size-10 lg-desktop:size-12 size-8 [&_img]:size-full [&_svg]:size-full",children:t.icon},p))}):null,He=({data:e,configuration:t})=>{const{isDisplayBackImage:p=!1,itemShape:T,metafields:g,isTopTag:re=!1,isShowTag:O,isShowOriginalPrice:I,isShowShortTitle:ke=!1,isShowPricesTag:z=!1,pricesTagTextColor:W,pricesTagBgColor:H,itemsTagTextColor:w,itemsTagBgColor:K,formatPrice:ie,renderOriginalPrice:Q,renderPriceLabel:we,renderPrice:U}=t||{},{locale:C="es",copyWriting:oe,currencyDisplay:X}=(0,Ne.useAiuiContext)(),{discounts:Y,discountsCopy:le}=g||{},ne=(0,c.useRef)(null),[n,ae]=(0,c.useState)([]),[ce,A]=(0,c.useState)(""),[pe,F]=(0,c.useState)(!1),[_,R]=(0,c.useState)(!1),me=(i,d,u,f)=>{const{primaryFun:b,onAddCart:N,onBuyNow:ee,onLearnMore:te,event:Se}=t||{};if(b){if(b==="AddCart"&&N)return N(i,d+1,u,f);if(b==="BuyNow"&&ee)return ee(i,d+1,u,f);if(b==="LearnMore"&&te)return te(i,d+1,u,f)}Se?.primaryButton?.(i,d+1,u,f)},_e=(i,d,u,f)=>{const{secondaryFun:b,onAddCart:N,onBuyNow:ee,onLearnMore:te,event:Se}=t||{};if(b){if(b==="AddCart"&&N)return N(i,d+1,u,f);if(b==="BuyNow"&&ee)return ee(i,d+1,u,f);if(b==="LearnMore"&&te)return te(i,d+1,u,f)}Se?.secondaryButton?.(i,d+1,u,f)},o=(0,c.useMemo)(()=>{const i=e?.variants||[];if(i.length)return e?.sku?i?.find?.(d=>d?.sku===e?.sku)||i[0]:i?.[0]},[e?.sku,e?.variants]),M=o?.id?.split?.("/")||[],B=M?.[M?.length-1],h=!o?.availableForSale||o?.price?.amount===he||o?.price===he,S=o?.coupons?.[0],de=e?.price?.currencyCode||"USD",q=(0,c.useMemo)(()=>(0,Ce.formatVariantPrice)({locale:C,amount:S?S?.variant_price4wscode:o?.price,baseAmount:S?o?.price:0,currencyCode:de,currencyDisplay:X,customFormatPrice:ie}),[de,C,S,X,o,ie]),{price:j,basePrice:P,discount:L,discountAmount:E}=q,{imageUrl:V,altText:ue}=De(e),G=e?.custom_name||e?.title,$=ke&&o?.metafields?.infos?.page_short_title||G,Z=e?.custom_description||e?.description,r=()=>{if(S?.value_type==="fixed_amount"){const i=E||"",d=i.match(/^(.*?)(\d[\d.,]*)(.*)$/);if(d){const[,u,f,b]=d;let N=f;return f.endsWith(".00")?N=f.replace(/\.00$/,""):f.endsWith(",00")&&(N=f.replace(/,00$/,"")),`${u}${N}${b}`}return i}return L||""};(0,c.useEffect)(()=>{let i=[];if(L||E){const u=`${r()} ${Y?.off||le?.off||""}`;A(u)}const d=e?.tags?.filter?.(u=>u?.startsWith?.("CLtag"))?.map?.(u=>u?.replace?.("CLtag:",""))?.slice?.(0,L&&z?1:2)||[];ae(i.concat(d))},[e?.tags,L,E,z,Y?.off,le?.off]),(0,$e.useExposure)(ne,{componentType:ye,componentName:ge,componentTitle:G,componentDescription:Z,position:t?.index+1});const l=async()=>{if(!pe&&!e?.custom_primary_link){F(!0);try{await me(e,t?.index,t,S)}finally{F(!1)}}},a=async()=>{if(!_&&!e?.custom_secondary_link){R(!0);try{await _e(e,t?.index,t,S)}finally{R(!1)}}},m=()=>(0,s.jsxs)("div",{className:"shelf-display-product-content desktop:gap-6 lg-desktop:flex-[221] desktop:flex-[190] flex flex-[178] flex-col justify-between gap-4",children:[(0,s.jsxs)("div",{className:"shelf-display-product-content-title-desc",children:[$?(0,s.jsx)(Le.Heading,{as:"h3",title:$||"",size:2,className:"shelf-display-product-title text-info-primary mb-1 line-clamp-2",html:$||""}):null,(0,s.jsx)(be.Text,{size:2,className:(0,k.cn)("lg-desktop:text-lg desktop:text-base shelf-display-product-description text-info-primary line-clamp-2 text-sm !leading-[1.4]"),html:Z||""})]}),(0,s.jsxs)("div",{className:"shelf-display-product-content-price-button",children:[(0,s.jsx)("div",{className:"mb-2 flex items-center",children:U?U(e,{price:j,basePrice:P,discount:L,discountAmount:E,variant:o,coupon:S,isSoldOut:h,isShowOriginalPrice:I}):h?(0,s.jsx)("div",{className:"lg-desktop:text-2xl text-info-primary text-xl font-bold",children:oe?.soldOutText}):(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)("div",{className:"final-price lg-desktop:text-2xl text-info-primary text-xl font-bold !leading-[1.2]",children:o?.availableForSale&&j||""}),Q?Q(e,{price:j,basePrice:P,discount:L,discountAmount:E,isShowOriginalPrice:I}):P&&I&&(0,s.jsx)("div",{className:"origin-price lg-desktop:text-2xl text-info-quaternary ml-1 text-xl font-bold !leading-[1.2] line-through",children:o?.availableForSale&&P||""})]})}),!U&&we?.(e,o,{isShowOriginalPrice:I}),(0,s.jsxs)("div",{className:(0,k.cn)("shelf-flex-button-group","lg-desktop:gap-3 flex items-center gap-2",t.direction==="vertical"?"flex-col":""),children:[t?.secondaryButton&&!h?(0,s.jsx)(se.default,{disabled:h&&t?.secondaryFun!=="LearnMore",variant:"secondary",href:e?.custom_secondary_link,as:e?.custom_secondary_link?"a":"button",onClick:a,loading:_,className:t.direction==="vertical"?"w-full":"",children:t?.secondaryButton||""}):null,t?.primaryButton?(0,s.jsx)(se.default,{disabled:h&&t?.primaryFun!=="LearnMore",variant:"primary",href:e?.custom_primary_link,as:e?.custom_primary_link?"a":"button",onClick:l,loading:pe,className:t.direction==="vertical"?"w-full":"",children:t?.primaryButton||""}):null]})]})]}),y={...W?{color:W}:{},...H?{backgroundColor:H,backgroundImage:"none"}:{},...W||H?{outline:"none"}:{}},x={...w?{color:w}:{},...K?{backgroundColor:K,backgroundImage:"none"}:{},...w||K?{outlineColor:w}:{}},D=()=>(0,s.jsxs)("div",{className:"lg-desktop:flex-[28] box-border flex flex-[24] flex-wrap gap-1 overflow-hidden",children:[z&&ce&&(0,s.jsx)(ve.default,{className:"shelf-prices-tag",variant:"fill",style:y,children:ce||""}),O&&n?.length>0&&n?.map?.((i,d)=>(0,s.jsx)(ve.default,{className:"shelf-items-tag",variant:"outline",style:x,children:i},d))]}),v=e?.custom_bg_image,J=e?.custom_theme;return(0,s.jsx)("div",{ref:ne,className:(0,k.cn)("box-border w-full cursor-pointer overflow-hidden duration-300","rounded-box","lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[545] desktop:aspect-w-[316] desktop:aspect-h-[450]","laptop:aspect-w-[288] laptop:aspect-h-[422] aspect-w-[296] aspect-h-[422] relative","md-tablet:h-[422px] shelf-display-item",v?"bg-cover bg-center bg-no-repeat":"bg-background tablet:hover:bg-info-white",{"aiui-dark":J==="dark","aiui-light":J==="light"}),style:v?{backgroundImage:`url(${v})`}:void 0,children:p?(0,s.jsx)("div",{className:"absolute inset-0 box-border overflow-hidden",children:(0,s.jsxs)("div",{className:"relative inset-0 size-full",children:[(0,s.jsx)(D,{}),(0,s.jsx)(xe.default,{source:V,alt:ue,className:(0,k.cn)("flex h-full justify-center object-cover [&_img]:w-auto",{"opacity-0":v})}),(0,s.jsx)("div",{className:"desktop:p-6 absolute inset-x-0 bottom-0 box-border overflow-hidden p-4",children:m()})]})}):(0,s.jsxs)("div",{className:"desktop:p-6 desktop:pt-4 desktop:gap-2 absolute inset-0 box-border flex flex-col justify-between gap-1 overflow-hidden p-4",children:[(0,s.jsx)(D,{}),(0,s.jsxs)("div",{className:(0,k.cn)("shelf-display-item-image lg-desktop:flex-[240] relative inline-block w-full flex-[180] overflow-hidden",{"opacity-0":v}),children:[(0,s.jsx)("a",{"aria-label":G,target:t?.target,href:(0,Pe.trackUrlRef)(`${C==="us"||!C?"":`/${C}`}/products/${e?.handle}?variant=${B}`,`${ye}_${ge}`),onClick:()=>{(0,Be.gaTrack)({event:"ga4Event",event_name:"select_item",event_parameters:{page_group:"Home Page",item_list_name:"Home_Page_Bundle",items:[{item_id:e?.sku||o?.sku,item_name:e?.name,item_variant:o?.name,price:o?.price,index:t?.index+1}]}})},children:(0,s.jsx)(xe.default,{source:V,alt:ue,className:"flex h-full justify-center object-cover [&_img]:w-auto"})}),(0,s.jsx)(We,{items:e?.socialEndorsements})]}),m()]})},e?.id||e?.handle)},Ue=({data:e,configuration:t})=>{const{itemShape:p,itemLength:T,metafields:g,isShowShortTitle:re,formatPrice:O,renderOriginalPrice:I,renderPriceLabel:ke,renderPrice:z}=t||{},{discounts:W,discountsCopy:H}=g||{},{locale:w="us",copyWriting:K,currencyDisplay:ie}=(0,Ne.useAiuiContext)(),[Q,we]=(0,c.useState)([]),U=(0,c.useRef)(null),[C,oe]=(0,c.useState)(!1),[X,Y]=(0,c.useState)(!1),le=(r,l,a,m)=>{const{primaryFun:y,onAddCart:x,onBuyNow:D,onLearnMore:v,event:J}=t||{};if(y){if(y==="AddCart"&&x)return x(r,l+1,a,m);if(y==="BuyNow"&&D)return D(r,l+1,a,m);if(y==="LearnMore"&&v)return v(r,l+1,a,m)}J?.primaryButton?.(r,l+1,a,m)},ne=(r,l,a,m)=>{const{secondaryFun:y,onAddCart:x,onBuyNow:D,onLearnMore:v,event:J}=t||{};if(y){if(y==="AddCart"&&x)return x(r,l+1,a,m);if(y==="BuyNow"&&D)return D(r,l+1,a,m);if(y==="LearnMore"&&v)return v(r,l+1,a,m)}J?.secondaryButton?.(r,l+1,a,m)},n=(0,c.useMemo)(()=>{const r=e?.variants||[];if(r.length)return e?.sku&&r.find(l=>l?.sku===e?.sku)||r[0]},[e?.sku,e?.variants]),ae=n?.id?.split?.("/")||[],ce=ae?.[ae?.length-1],A=!n?.availableForSale||n?.price?.amount===he||n?.price===he,pe=t?.isShowTag,F=t?.isShowOriginalPrice,_=n?.coupons?.[0],R=!!(F&&_),me=e?.price?.currencyCode||"USD",_e=(0,c.useMemo)(()=>(0,Ce.formatVariantPrice)({locale:w,amount:R?_?.variant_price4wscode:n?.price,baseAmount:R?n?.price:0,currencyCode:me,currencyDisplay:ie,customFormatPrice:O}),[me,w,R,_?.variant_price4wscode,n,O]),{price:o,basePrice:M,discount:B,discountAmount:h}=_e,{imageUrl:S,altText:de}=De(e),q=e?.custom_name||e?.title,j=re&&n?.metafields?.infos?.page_short_title||q,P=e?.custom_description||e?.description;(0,$e.useExposure)(U,{componentType:ye,componentName:ge,componentTitle:q,componentDescription:P,position:t?.index+1});const L=async()=>{if(!C&&!e?.custom_primary_link){oe(!0);try{await le(e,t?.index,t,_)}finally{oe(!1)}}},E=async()=>{if(!X&&!e?.custom_secondary_link){Y(!0);try{await ne(e,t?.index,t,_)}finally{Y(!1)}}},V=()=>T>=2?{boxItem:"lg-desktop:max-w-[401px] desktop:max-w-[292px] max-w-full",imgItem:"m-tablet:m-auto lg-desktop:max-w-[330px] lg-desktop:max-h-[330px] desktop:max-w-[260px] desktop:max-h-[260px] max-w-[138px] max-h-[138px]",wrap:"lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[480] desktop:aspect-w-[648] desktop:aspect-h-[380] laptop:aspect-w-[440] laptop:aspect-h-[356] tablet:aspect-w-[346] tablet:aspect-h-[360] md-tablet:w-full"}:{boxItem:"lg-desktop:max-w-[401px] desktop:max-w-[292px] laptop:max-w-[289px] max-w-[262px]",imgItem:"md-tablet:m-auto lg-desktop:max-w-[450px] lg-desktop:max-h-[450px] desktop:max-w-[332px] desktop:max-h-[332px] max-w-[312px] max-h-[312px]",wrap:"lg-desktop:aspect-w-[1664] lg-desktop:aspect-h-[480] desktop:aspect-w-[1312] desktop:aspect-h-[380] laptop:aspect-w-[896] laptop:aspect-h-[356] tablet:aspect-w-[704] tablet:aspect-h-[360] md-tablet:w-full"},ue=()=>T>=2?"flex flex-col justify-between desktop:gap-12 desktop:flex-row desktop:justify-center desktop:items-center":"flex justify-center items-center gap-6 md-tablet:flex-col",G=()=>{if(_?.value_type==="fixed_amount"){const r=h||"",l=r.match(/^(.*?)(\d[\d.,]*)(.*)$/);if(l){const[,a,m,y]=l;let x=m;return m.endsWith(".00")?x=m.replace(/\.00$/,""):m.endsWith(",00")&&(x=m.replace(/,00$/,"")),`${a}${x}${y}`}return r}return B||""};(0,c.useEffect)(()=>{let r=[];if(B||h){const a=`${G()} ${W?.off||H?.off||""}`;r.push(a)}const l=e?.tags?.filter?.(a=>a?.startsWith?.("CLtag"))?.map?.(a=>a?.replace?.("CLtag:",""))?.slice?.(0,B?1:2)||[];we(r.concat(l))},[e?.tags,B,h,W?.off,H?.off]);const $=e?.custom_bg_image,Z=e?.custom_theme;return(0,s.jsx)("div",{ref:U,className:(0,k.cn)(V().wrap,"rounded-box","shelf-display-item","duration-300","md-tablet:h-[360px] relative box-border w-full cursor-pointer overflow-hidden",$?"bg-cover bg-center bg-no-repeat":"bg-container-secondary-1 tablet:hover:bg-info-white",{"aiui-dark":Z==="dark","aiui-light":Z==="light"}),style:$?{backgroundImage:`url(${$})`}:void 0,children:(0,s.jsxs)("div",{className:(0,k.cn)(ue(),"desktop:p-6 absolute inset-0 box-border overflow-hidden p-4"),children:[(0,s.jsx)("div",{className:(0,k.cn)(V().imgItem,"desktop:mb-0 relative mb-1 overflow-hidden",{"opacity-0":$}),children:(0,s.jsx)("a",{"aria-label":q,target:t?.target,href:(0,Pe.trackUrlRef)(`${w==="us"||!w?"":`/${w}`}/products/${e?.handle}?variant=${ce}`,`${ye}_${ge}`),onClick:()=>{(0,Be.gaTrack)({event:"ga4Event",event_name:"select_item",event_parameters:{page_group:"Home Page",item_list_name:"Home_Page_Bundle",items:[{item_id:e?.sku||n?.sku,item_name:e?.name,item_variant:n?.name,price:n?.price,index:t?.index+1}]}})},children:(0,s.jsx)(xe.default,{source:S,alt:de,className:"flex h-full justify-center object-cover [&_img]:w-auto"})})}),(0,s.jsxs)("div",{className:(0,k.cn)("flex flex-col items-start justify-center",V().boxItem),children:[pe&&(0,s.jsx)("div",{className:"mb-1 box-border flex h-8 flex-wrap gap-1 overflow-hidden",children:Q?.length>0&&Q?.map?.((r,l)=>(0,s.jsx)(ve.default,{className:"shelf-items-tag",variant:"fill",children:r},l))}),j?(0,s.jsx)(Le.Heading,{as:"h3",title:j||"",size:2,className:"shelf-display-product-title lg-desktop:h-[58px] text-info-primary mb-1 line-clamp-2 h-[48px]",html:j||""}):null,P?(0,s.jsx)(be.Text,{size:2,className:"lg-desktop:text-lg lg-desktop:h-[26px] desktop:text-base desktop:h-6 shelf-display-product-description text-info-primary line-clamp-1 h-5 text-sm",html:P||""}):null,(0,s.jsx)("div",{className:"mb-2 mt-5 flex items-center",children:z?z(e,{price:o,basePrice:M,discount:B,discountAmount:h,variant:n,coupon:_,isSoldOut:A,isShowOriginalPrice:F}):A?(0,s.jsx)("div",{className:"lg-desktop:text-2xl text-info-primary text-xl font-bold",children:K?.soldOutText}):(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)("div",{className:"final-price tablet:text-xl text-info-primary text-xl font-bold",children:n?.availableForSale&&o||""}),I?I(e,{price:o,basePrice:M,discount:B,discountAmount:h,isShowOriginalPrice:F}):M&&(0,s.jsx)("div",{className:"origin-price tablet:text-xl text-info-quaternary ml-1 text-lg font-bold line-through",children:n?.availableForSale&&M||""})]})}),!z&&ke?.(e,n,{isShowOriginalPrice:F}),(0,s.jsxs)("div",{className:(0,k.cn)("shelf-flex-button-group","lg-desktop:gap-3 flex items-center gap-2",t.direction==="vertical"?"flex-col":""),children:[t?.secondaryButton&&!A?(0,s.jsx)(se.default,{disabled:A&&t?.secondaryFun!=="LearnMore",variant:"secondary",href:e?.custom_secondary_link,as:e?.custom_secondary_link?"a":"button",onClick:E,loading:X,className:t.direction==="vertical"?"w-full":"",children:t?.secondaryButton||""}):null,t?.primaryButton?(0,s.jsx)(se.default,{disabled:A&&t?.primaryFun!=="LearnMore",variant:"primary",href:e?.custom_primary_link,as:e?.custom_primary_link?"a":"button",onClick:L,loading:C,className:t.direction==="vertical"?"w-full":"",children:t?.primaryButton||""}):null]})]})]})},e?.id||e?.handle)};
1
+ "use strict";var ze=Object.create;var fe=Object.defineProperty;var Ae=Object.getOwnPropertyDescriptor;var Fe=Object.getOwnPropertyNames;var Me=Object.getPrototypeOf,je=Object.prototype.hasOwnProperty;var Ee=(e,t)=>{for(var p in t)fe(e,p,{get:t[p],enumerable:!0})},Ie=(e,t,p,T)=>{if(t&&typeof t=="object"||typeof t=="function")for(let g of Fe(t))!je.call(e,g)&&g!==p&&fe(e,g,{get:()=>t[g],enumerable:!(T=Ae(t,g))||T.enumerable});return e};var Te=(e,t,p)=>(p=e!=null?ze(Me(e)):{},Ie(t||!e||!e.__esModule?fe(p,"default",{value:e,enumerable:!0}):p,e)),Oe=e=>Ie(fe({},"__esModule",{value:!0}),e);var Re={};Ee(Re,{ShelfDisplayHorizontalItem:()=>Ue,ShelfDisplayWrapItem:()=>He,getProductImage:()=>De});module.exports=Oe(Re);var s=require("react/jsx-runtime"),Ne=require("../AiuiProvider/index.js"),Ce=require("./shelfDisplay.js"),xe=Te(require("../../components/picture.js")),ve=Te(require("../../components/badge.js")),k=require("../../helpers/utils.js"),be=require("../../components/text.js"),se=Te(require("../../components/button.js")),Be=require("../../shared/track.js"),Pe=require("../../shared/trackUrlRef.js"),Le=require("../../components/heading.js"),$e=require("../../hooks/useExposure.js"),c=require("react");const ye="image",ge="product_shelf",he=999999999e-2,De=e=>{const t=e?.sku,p=e?.variants,T=p?.find(O=>O?.sku===t),g=T?.image?.url||p?.[0]?.image?.url||"",re=T?.image?.altText||p?.[0]?.image?.altText||e?.custom_name||e?.title||"";return{imageUrl:g,altText:re}},We=({items:e})=>e?.length?(0,s.jsx)("div",{className:"shelf-display-social-endorsements desktop:gap-2 absolute right-0 top-0 z-10 flex flex-col items-center gap-1",children:e.map((t,p)=>typeof t.icon=="string"?(0,s.jsx)("img",{src:t.icon,alt:t.label||"",loading:"lazy",className:"desktop:size-10 lg-desktop:size-12 size-8 object-contain"},p):(0,s.jsx)(be.Text,{"aria-label":t.label,className:"desktop:size-10 lg-desktop:size-12 size-8 [&_img]:size-full [&_svg]:size-full",children:t.icon},p))}):null,He=({data:e,configuration:t})=>{const{isDisplayBackImage:p=!1,itemShape:T,metafields:g,isTopTag:re=!1,isShowTag:O,isShowOriginalPrice:I,isShowShortTitle:ke=!1,isShowPricesTag:z=!1,pricesTagTextColor:W,pricesTagBgColor:H,itemsTagTextColor:w,itemsTagBgColor:K,formatPrice:ie,renderOriginalPrice:Q,renderPriceLabel:we,renderPrice:U}=t||{},{locale:C="es",copyWriting:oe,currencyDisplay:X}=(0,Ne.useAiuiContext)(),{discounts:Y,discountsCopy:le}=g||{},ne=(0,c.useRef)(null),[n,ae]=(0,c.useState)([]),[ce,A]=(0,c.useState)(""),[pe,F]=(0,c.useState)(!1),[_,R]=(0,c.useState)(!1),me=(i,d,u,f)=>{const{primaryFun:b,onAddCart:N,onBuyNow:ee,onLearnMore:te,event:Se}=t||{};if(b){if(b==="AddCart"&&N)return N(i,d+1,u,f);if(b==="BuyNow"&&ee)return ee(i,d+1,u,f);if(b==="LearnMore"&&te)return te(i,d+1,u,f)}Se?.primaryButton?.(i,d+1,u,f)},_e=(i,d,u,f)=>{const{secondaryFun:b,onAddCart:N,onBuyNow:ee,onLearnMore:te,event:Se}=t||{};if(b){if(b==="AddCart"&&N)return N(i,d+1,u,f);if(b==="BuyNow"&&ee)return ee(i,d+1,u,f);if(b==="LearnMore"&&te)return te(i,d+1,u,f)}Se?.secondaryButton?.(i,d+1,u,f)},o=(0,c.useMemo)(()=>{const i=e?.variants||[];if(i.length)return e?.sku?i?.find?.(d=>d?.sku===e?.sku)||i[0]:i?.[0]},[e?.sku,e?.variants]),M=o?.id?.split?.("/")||[],B=M?.[M?.length-1],h=!o?.availableForSale||o?.price?.amount===he||o?.price===he,S=o?.coupons?.[0],de=e?.price?.currencyCode||"USD",q=(0,c.useMemo)(()=>(0,Ce.formatVariantPrice)({locale:C,amount:S?S?.variant_price4wscode:o?.price,baseAmount:S?o?.price:0,currencyCode:de,currencyDisplay:X,customFormatPrice:ie}),[de,C,S,X,o,ie]),{price:j,basePrice:P,discount:L,discountAmount:E}=q,{imageUrl:V,altText:ue}=De(e),G=e?.custom_name||e?.title,$=ke&&o?.metafields?.infos?.page_short_title||G,Z=e?.custom_description||e?.description,r=()=>{if(S?.value_type==="fixed_amount"){const i=E||"",d=i.match(/^(.*?)(\d[\d.,]*)(.*)$/);if(d){const[,u,f,b]=d;let N=f;return f.endsWith(".00")?N=f.replace(/\.00$/,""):f.endsWith(",00")&&(N=f.replace(/,00$/,"")),`${u}${N}${b}`}return i}return L||""};(0,c.useEffect)(()=>{let i=[];if(L||E){const u=`${r()} ${Y?.off||le?.off||""}`;A(u)}const d=e?.tags?.filter?.(u=>u?.startsWith?.("CLtag"))?.map?.(u=>u?.replace?.("CLtag:",""))?.slice?.(0,L&&z?1:2)||[];ae(i.concat(d))},[e?.tags,L,E,z,Y?.off,le?.off]),(0,$e.useExposure)(ne,{componentType:ye,componentName:ge,componentTitle:G,componentDescription:Z,position:t?.index+1});const l=async()=>{if(!pe&&!e?.custom_primary_link){F(!0);try{await me(e,t?.index,t,S)}finally{F(!1)}}},a=async()=>{if(!_&&!e?.custom_secondary_link){R(!0);try{await _e(e,t?.index,t,S)}finally{R(!1)}}},m=()=>(0,s.jsxs)("div",{className:"shelf-display-product-content desktop:gap-6 lg-desktop:flex-[221] desktop:flex-[190] flex flex-[178] flex-col justify-between gap-4",children:[(0,s.jsxs)("div",{className:"shelf-display-product-content-title-desc",children:[$?(0,s.jsx)(Le.Heading,{as:"h3",title:$||"",size:2,className:"shelf-display-product-title text-info-primary mb-1 line-clamp-2",html:$||""}):null,(0,s.jsx)(be.Text,{size:2,className:(0,k.cn)("lg-desktop:text-lg desktop:text-base shelf-display-product-description text-info-primary line-clamp-2 text-sm !leading-[1.4]"),html:Z||""})]}),(0,s.jsxs)("div",{className:"shelf-display-product-content-price-button",children:[(0,s.jsx)("div",{className:"mb-2 flex items-center",children:U?U(e,{price:j,basePrice:P,discount:L,discountAmount:E,variant:o,coupon:S,isSoldOut:h,isShowOriginalPrice:I}):h?(0,s.jsx)("div",{className:"lg-desktop:text-2xl text-info-primary text-xl font-bold",children:oe?.soldOutText}):(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)("div",{className:"final-price lg-desktop:text-2xl text-info-primary text-xl font-bold !leading-[1.2]",children:o?.availableForSale&&j||""}),Q?Q(e,{price:j,basePrice:P,discount:L,discountAmount:E,isShowOriginalPrice:I}):P&&I&&(0,s.jsx)("div",{className:"origin-price lg-desktop:text-2xl text-info-quaternary ml-1 text-xl font-bold !leading-[1.2] line-through",children:o?.availableForSale&&P||""})]})}),!U&&we?.(e,o,{isShowOriginalPrice:I}),(0,s.jsxs)("div",{className:(0,k.cn)("shelf-flex-button-group","lg-desktop:gap-3 flex items-center gap-2",t.direction==="vertical"?"flex-col":""),children:[t?.secondaryButton&&!h?(0,s.jsx)(se.default,{disabled:h&&t?.secondaryFun!=="LearnMore",variant:"secondary",href:e?.custom_secondary_link,as:e?.custom_secondary_link?"a":"button",onClick:a,loading:_,className:t.direction==="vertical"?"w-full":"",children:t?.secondaryButton||""}):null,t?.primaryButton?(0,s.jsx)(se.default,{disabled:h&&t?.primaryFun!=="LearnMore",variant:"primary",href:e?.custom_primary_link,as:e?.custom_primary_link?"a":"button",onClick:l,loading:pe,className:t.direction==="vertical"?"w-full":"",children:t?.primaryButton||""}):null]})]})]}),y={...W?{color:W}:{},...H?{backgroundColor:H,backgroundImage:"none"}:{},...W||H?{outline:"none"}:{}},x={...w?{color:w}:{},...K?{backgroundColor:K,backgroundImage:"none"}:{},...w||K?{outlineColor:w}:{}},D=()=>(0,s.jsxs)("div",{className:"lg-desktop:min-h-[28px] lg-desktop:flex-[28] box-border flex min-h-6 flex-[24] flex-wrap gap-1 overflow-hidden",children:[z&&ce&&(0,s.jsx)(ve.default,{className:"shelf-prices-tag",variant:"fill",style:y,children:ce||""}),O&&n?.length>0&&n?.map?.((i,d)=>(0,s.jsx)(ve.default,{className:"shelf-items-tag",variant:"outline",style:x,children:i},d))]}),v=e?.custom_bg_image,J=e?.custom_theme;return(0,s.jsx)("div",{ref:ne,className:(0,k.cn)("box-border w-full cursor-pointer overflow-hidden duration-300","rounded-box","lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[545] desktop:aspect-w-[316] desktop:aspect-h-[450]","laptop:aspect-w-[288] laptop:aspect-h-[422] aspect-w-[296] aspect-h-[422] relative","md-tablet:h-[422px] shelf-display-item",v?"bg-cover bg-center bg-no-repeat":"bg-background tablet:hover:bg-info-white",{"aiui-dark":J==="dark","aiui-light":J==="light"}),style:v?{backgroundImage:`url(${v})`}:void 0,children:p?(0,s.jsx)("div",{className:"absolute inset-0 box-border overflow-hidden",children:(0,s.jsxs)("div",{className:"relative inset-0 size-full",children:[(0,s.jsx)(D,{}),(0,s.jsx)(xe.default,{source:V,alt:ue,className:(0,k.cn)("flex h-full justify-center object-cover [&_img]:w-auto",{"opacity-0":v})}),(0,s.jsx)("div",{className:"desktop:p-6 absolute inset-x-0 bottom-0 box-border overflow-hidden p-4",children:m()})]})}):(0,s.jsxs)("div",{className:"desktop:p-6 desktop:pt-4 desktop:gap-2 absolute inset-0 box-border flex flex-col justify-between gap-1 overflow-hidden p-4",children:[(0,s.jsx)(D,{}),(0,s.jsxs)("div",{className:(0,k.cn)("shelf-display-item-image lg-desktop:flex-[240] relative inline-block w-full flex-[180] overflow-hidden",{"opacity-0":v}),children:[(0,s.jsx)("a",{"aria-label":G,target:t?.target,href:(0,Pe.trackUrlRef)(`${C==="us"||!C?"":`/${C}`}/products/${e?.handle}?variant=${B}`,`${ye}_${ge}`),onClick:()=>{(0,Be.gaTrack)({event:"ga4Event",event_name:"select_item",event_parameters:{page_group:"Home Page",item_list_name:"Home_Page_Bundle",items:[{item_id:e?.sku||o?.sku,item_name:e?.name,item_variant:o?.name,price:o?.price,index:t?.index+1}]}})},children:(0,s.jsx)(xe.default,{source:V,alt:ue,className:"flex h-full justify-center object-cover [&_img]:w-auto"})}),(0,s.jsx)(We,{items:e?.socialEndorsements})]}),m()]})},e?.id||e?.handle)},Ue=({data:e,configuration:t})=>{const{itemShape:p,itemLength:T,metafields:g,isShowShortTitle:re,formatPrice:O,renderOriginalPrice:I,renderPriceLabel:ke,renderPrice:z}=t||{},{discounts:W,discountsCopy:H}=g||{},{locale:w="us",copyWriting:K,currencyDisplay:ie}=(0,Ne.useAiuiContext)(),[Q,we]=(0,c.useState)([]),U=(0,c.useRef)(null),[C,oe]=(0,c.useState)(!1),[X,Y]=(0,c.useState)(!1),le=(r,l,a,m)=>{const{primaryFun:y,onAddCart:x,onBuyNow:D,onLearnMore:v,event:J}=t||{};if(y){if(y==="AddCart"&&x)return x(r,l+1,a,m);if(y==="BuyNow"&&D)return D(r,l+1,a,m);if(y==="LearnMore"&&v)return v(r,l+1,a,m)}J?.primaryButton?.(r,l+1,a,m)},ne=(r,l,a,m)=>{const{secondaryFun:y,onAddCart:x,onBuyNow:D,onLearnMore:v,event:J}=t||{};if(y){if(y==="AddCart"&&x)return x(r,l+1,a,m);if(y==="BuyNow"&&D)return D(r,l+1,a,m);if(y==="LearnMore"&&v)return v(r,l+1,a,m)}J?.secondaryButton?.(r,l+1,a,m)},n=(0,c.useMemo)(()=>{const r=e?.variants||[];if(r.length)return e?.sku&&r.find(l=>l?.sku===e?.sku)||r[0]},[e?.sku,e?.variants]),ae=n?.id?.split?.("/")||[],ce=ae?.[ae?.length-1],A=!n?.availableForSale||n?.price?.amount===he||n?.price===he,pe=t?.isShowTag,F=t?.isShowOriginalPrice,_=n?.coupons?.[0],R=!!(F&&_),me=e?.price?.currencyCode||"USD",_e=(0,c.useMemo)(()=>(0,Ce.formatVariantPrice)({locale:w,amount:R?_?.variant_price4wscode:n?.price,baseAmount:R?n?.price:0,currencyCode:me,currencyDisplay:ie,customFormatPrice:O}),[me,w,R,_?.variant_price4wscode,n,O]),{price:o,basePrice:M,discount:B,discountAmount:h}=_e,{imageUrl:S,altText:de}=De(e),q=e?.custom_name||e?.title,j=re&&n?.metafields?.infos?.page_short_title||q,P=e?.custom_description||e?.description;(0,$e.useExposure)(U,{componentType:ye,componentName:ge,componentTitle:q,componentDescription:P,position:t?.index+1});const L=async()=>{if(!C&&!e?.custom_primary_link){oe(!0);try{await le(e,t?.index,t,_)}finally{oe(!1)}}},E=async()=>{if(!X&&!e?.custom_secondary_link){Y(!0);try{await ne(e,t?.index,t,_)}finally{Y(!1)}}},V=()=>T>=2?{boxItem:"lg-desktop:max-w-[401px] desktop:max-w-[292px] max-w-full",imgItem:"m-tablet:m-auto lg-desktop:max-w-[330px] lg-desktop:max-h-[330px] desktop:max-w-[260px] desktop:max-h-[260px] max-w-[138px] max-h-[138px]",wrap:"lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[480] desktop:aspect-w-[648] desktop:aspect-h-[380] laptop:aspect-w-[440] laptop:aspect-h-[356] tablet:aspect-w-[346] tablet:aspect-h-[360] md-tablet:w-full"}:{boxItem:"lg-desktop:max-w-[401px] desktop:max-w-[292px] laptop:max-w-[289px] max-w-[262px]",imgItem:"md-tablet:m-auto lg-desktop:max-w-[450px] lg-desktop:max-h-[450px] desktop:max-w-[332px] desktop:max-h-[332px] max-w-[312px] max-h-[312px]",wrap:"lg-desktop:aspect-w-[1664] lg-desktop:aspect-h-[480] desktop:aspect-w-[1312] desktop:aspect-h-[380] laptop:aspect-w-[896] laptop:aspect-h-[356] tablet:aspect-w-[704] tablet:aspect-h-[360] md-tablet:w-full"},ue=()=>T>=2?"flex flex-col justify-between desktop:gap-12 desktop:flex-row desktop:justify-center desktop:items-center":"flex justify-center items-center gap-6 md-tablet:flex-col",G=()=>{if(_?.value_type==="fixed_amount"){const r=h||"",l=r.match(/^(.*?)(\d[\d.,]*)(.*)$/);if(l){const[,a,m,y]=l;let x=m;return m.endsWith(".00")?x=m.replace(/\.00$/,""):m.endsWith(",00")&&(x=m.replace(/,00$/,"")),`${a}${x}${y}`}return r}return B||""};(0,c.useEffect)(()=>{let r=[];if(B||h){const a=`${G()} ${W?.off||H?.off||""}`;r.push(a)}const l=e?.tags?.filter?.(a=>a?.startsWith?.("CLtag"))?.map?.(a=>a?.replace?.("CLtag:",""))?.slice?.(0,B?1:2)||[];we(r.concat(l))},[e?.tags,B,h,W?.off,H?.off]);const $=e?.custom_bg_image,Z=e?.custom_theme;return(0,s.jsx)("div",{ref:U,className:(0,k.cn)(V().wrap,"rounded-box","shelf-display-item","duration-300","md-tablet:h-[360px] relative box-border w-full cursor-pointer overflow-hidden",$?"bg-cover bg-center bg-no-repeat":"bg-container-secondary-1 tablet:hover:bg-info-white",{"aiui-dark":Z==="dark","aiui-light":Z==="light"}),style:$?{backgroundImage:`url(${$})`}:void 0,children:(0,s.jsxs)("div",{className:(0,k.cn)(ue(),"desktop:p-6 absolute inset-0 box-border overflow-hidden p-4"),children:[(0,s.jsx)("div",{className:(0,k.cn)(V().imgItem,"desktop:mb-0 relative mb-1 overflow-hidden",{"opacity-0":$}),children:(0,s.jsx)("a",{"aria-label":q,target:t?.target,href:(0,Pe.trackUrlRef)(`${w==="us"||!w?"":`/${w}`}/products/${e?.handle}?variant=${ce}`,`${ye}_${ge}`),onClick:()=>{(0,Be.gaTrack)({event:"ga4Event",event_name:"select_item",event_parameters:{page_group:"Home Page",item_list_name:"Home_Page_Bundle",items:[{item_id:e?.sku||n?.sku,item_name:e?.name,item_variant:n?.name,price:n?.price,index:t?.index+1}]}})},children:(0,s.jsx)(xe.default,{source:S,alt:de,className:"flex h-full justify-center object-cover [&_img]:w-auto"})})}),(0,s.jsxs)("div",{className:(0,k.cn)("flex flex-col items-start justify-center",V().boxItem),children:[pe&&(0,s.jsx)("div",{className:"mb-1 box-border flex h-8 flex-wrap gap-1 overflow-hidden",children:Q?.length>0&&Q?.map?.((r,l)=>(0,s.jsx)(ve.default,{className:"shelf-items-tag",variant:"fill",children:r},l))}),j?(0,s.jsx)(Le.Heading,{as:"h3",title:j||"",size:2,className:"shelf-display-product-title lg-desktop:h-[58px] text-info-primary mb-1 line-clamp-2 h-[48px]",html:j||""}):null,P?(0,s.jsx)(be.Text,{size:2,className:"lg-desktop:text-lg lg-desktop:h-[26px] desktop:text-base desktop:h-6 shelf-display-product-description text-info-primary line-clamp-1 h-5 text-sm",html:P||""}):null,(0,s.jsx)("div",{className:"mb-2 mt-5 flex items-center",children:z?z(e,{price:o,basePrice:M,discount:B,discountAmount:h,variant:n,coupon:_,isSoldOut:A,isShowOriginalPrice:F}):A?(0,s.jsx)("div",{className:"lg-desktop:text-2xl text-info-primary text-xl font-bold",children:K?.soldOutText}):(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)("div",{className:"final-price tablet:text-xl text-info-primary text-xl font-bold",children:n?.availableForSale&&o||""}),I?I(e,{price:o,basePrice:M,discount:B,discountAmount:h,isShowOriginalPrice:F}):M&&(0,s.jsx)("div",{className:"origin-price tablet:text-xl text-info-quaternary ml-1 text-lg font-bold line-through",children:n?.availableForSale&&M||""})]})}),!z&&ke?.(e,n,{isShowOriginalPrice:F}),(0,s.jsxs)("div",{className:(0,k.cn)("shelf-flex-button-group","lg-desktop:gap-3 flex items-center gap-2",t.direction==="vertical"?"flex-col":""),children:[t?.secondaryButton&&!A?(0,s.jsx)(se.default,{disabled:A&&t?.secondaryFun!=="LearnMore",variant:"secondary",href:e?.custom_secondary_link,as:e?.custom_secondary_link?"a":"button",onClick:E,loading:X,className:t.direction==="vertical"?"w-full":"",children:t?.secondaryButton||""}):null,t?.primaryButton?(0,s.jsx)(se.default,{disabled:A&&t?.primaryFun!=="LearnMore",variant:"primary",href:e?.custom_primary_link,as:e?.custom_primary_link?"a":"button",onClick:L,loading:C,className:t.direction==="vertical"?"w-full":"",children:t?.primaryButton||""}):null]})]})]})},e?.id||e?.handle)};
package/dist/cjs/components/dialog.js CHANGED
@@ -1 +1 @@
1
- "use strict";"use client";var b=Object.create;var r=Object.defineProperty;var P=Object.getOwnPropertyDescriptor;var x=Object.getOwnPropertyNames;var L=Object.getPrototypeOf,w=Object.prototype.hasOwnProperty;var T=(e,t)=>{for(var a in t)r(e,a,{get:t[a],enumerable:!0})},u=(e,t,a,n)=>{if(t&&typeof t=="object"||typeof t=="function")for(let l of x(t))!w.call(e,l)&&l!==a&&r(e,l,{get:()=>t[l],enumerable:!(n=P(t,l))||n.enumerable});return e};var C=(e,t,a)=>(a=e!=null?b(L(e)):{},u(t||!e||!e.__esModule?r(a,"default",{value:e,enumerable:!0}):a,e)),h=e=>u(r({},"__esModule",{value:!0}),e);var M={};T(M,{Dialog:()=>m,DialogClose:()=>N,DialogContent:()=>g,DialogDescription:()=>v,DialogFooter:()=>D,DialogHeader:()=>f,DialogOverlay:()=>c,DialogPortal:()=>p,DialogTitle:()=>y,DialogTrigger:()=>R});module.exports=h(M);var o=require("react/jsx-runtime"),d=C(require("react")),i=C(require("@radix-ui/react-dialog")),s=require("../helpers/index.js");const H=e=>(0,o.jsx)("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",...e,children:(0,o.jsx)("path",{d:"M5.63657 5.63618C6.02704 5.2456 6.66026 5.24565 7.05079 5.63618L12.0005 10.5859L16.9503 5.63618C17.3408 5.24565 17.974 5.2456 18.3645 5.63618C18.7549 6.02672 18.7549 6.65986 18.3645 7.05039L13.4147 12.0001L18.3645 16.9499C18.7549 17.3404 18.7549 17.9736 18.3645 18.3641C17.974 18.7547 17.3408 18.7546 16.9503 18.3641L12.0005 13.4144L7.05079 18.3641C6.66026 18.7546 6.02704 18.7547 5.63657 18.3641C5.24614 17.9736 5.24615 17.3404 5.63657 16.9499L10.5863 12.0001L5.63657 7.05039C5.24615 6.65986 5.24614 6.02672 5.63657 5.63618Z",fill:"#4A4C56"})}),m=i.Root;m.displayName="Dialog";const R=i.Trigger,p=i.Portal,N=i.Close,c=d.forwardRef(({className:e,...t},a)=>(0,o.jsx)(i.Overlay,{ref:a,className:(0,s.cn)("data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-[1000] bg-black/80",e),...t}));c.displayName=i.Overlay.displayName;const g=d.forwardRef(({className:e,children:t,overlayClassName:a,...n},l)=>(0,o.jsxs)(p,{children:[(0,o.jsx)(c,{className:a}),(0,o.jsxs)(i.Content,{ref:l,className:(0,s.cn)("bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] tablet:rounded-lg fixed left-1/2 top-1/2 z-[1001] grid w-full max-w-lg -translate-x-1/2 -translate-y-1/2 gap-4 border p-6 shadow-lg duration-200",e),...n,children:[t,(0,o.jsxs)(i.Close,{className:"dialog-close-button ring-offset-background focus:ring-ring data-[state=open]:bg-accent data-[state=open]:text-muted-foreground absolute right-4 top-4 rounded-sm opacity-70 transition-opacity hover:opacity-100 disabled:pointer-events-none",children:[(0,o.jsx)(H,{className:"dialog-close-icon tablet:size-6 size-4"}),(0,o.jsx)("span",{className:"sr-only",children:"Close"})]})]})]}));g.displayName=i.Content.displayName;const f=({className:e,...t})=>(0,o.jsx)("div",{className:(0,s.cn)("tablet:text-left flex flex-col space-y-1.5 text-center",e),...t});f.displayName="DialogHeader";const D=({className:e,...t})=>(0,o.jsx)("div",{className:(0,s.cn)("tablet:flex-row tablet:justify-end tablet:space-x-2 flex flex-col-reverse",e),...t});D.displayName="DialogFooter";const y=d.forwardRef(({className:e,...t},a)=>(0,o.jsx)(i.Title,{ref:a,className:(0,s.cn)("text-lg font-semibold leading-none tracking-tight",e),...t}));y.displayName=i.Title.displayName;const v=d.forwardRef(({className:e,...t},a)=>(0,o.jsx)(i.Description,{ref:a,className:(0,s.cn)("text-muted-foreground text-sm",e),...t}));v.displayName=i.Description.displayName;
1
+ "use strict";"use client";var b=Object.create;var r=Object.defineProperty;var P=Object.getOwnPropertyDescriptor;var x=Object.getOwnPropertyNames;var L=Object.getPrototypeOf,w=Object.prototype.hasOwnProperty;var T=(e,t)=>{for(var a in t)r(e,a,{get:t[a],enumerable:!0})},u=(e,t,a,n)=>{if(t&&typeof t=="object"||typeof t=="function")for(let l of x(t))!w.call(e,l)&&l!==a&&r(e,l,{get:()=>t[l],enumerable:!(n=P(t,l))||n.enumerable});return e};var C=(e,t,a)=>(a=e!=null?b(L(e)):{},u(t||!e||!e.__esModule?r(a,"default",{value:e,enumerable:!0}):a,e)),h=e=>u(r({},"__esModule",{value:!0}),e);var M={};T(M,{Dialog:()=>m,DialogClose:()=>N,DialogContent:()=>g,DialogDescription:()=>v,DialogFooter:()=>D,DialogHeader:()=>f,DialogOverlay:()=>c,DialogPortal:()=>p,DialogTitle:()=>y,DialogTrigger:()=>R});module.exports=h(M);var o=require("react/jsx-runtime"),d=C(require("react")),i=C(require("@radix-ui/react-dialog")),s=require("../helpers/index.js");const H=e=>(0,o.jsx)("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",...e,children:(0,o.jsx)("path",{d:"M5.63657 5.63618C6.02704 5.2456 6.66026 5.24565 7.05079 5.63618L12.0005 10.5859L16.9503 5.63618C17.3408 5.24565 17.974 5.2456 18.3645 5.63618C18.7549 6.02672 18.7549 6.65986 18.3645 7.05039L13.4147 12.0001L18.3645 16.9499C18.7549 17.3404 18.7549 17.9736 18.3645 18.3641C17.974 18.7547 17.3408 18.7546 16.9503 18.3641L12.0005 13.4144L7.05079 18.3641C6.66026 18.7546 6.02704 18.7547 5.63657 18.3641C5.24614 17.9736 5.24615 17.3404 5.63657 16.9499L10.5863 12.0001L5.63657 7.05039C5.24615 6.65986 5.24614 6.02672 5.63657 5.63618Z",fill:"#4A4C56"})}),m=i.Root;m.displayName="Dialog";const R=i.Trigger,p=i.Portal,N=i.Close,c=d.forwardRef(({className:e,...t},a)=>(0,o.jsx)(i.Overlay,{ref:a,className:(0,s.cn)("data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-[1000] bg-black/80",e),...t}));c.displayName=i.Overlay.displayName;const g=d.forwardRef(({className:e,children:t,overlayClassName:a,...n},l)=>(0,o.jsxs)(p,{children:[(0,o.jsx)(c,{className:a}),(0,o.jsxs)(i.Content,{ref:l,className:(0,s.cn)("bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] tablet:rounded-lg fixed left-1/2 top-1/2 z-[1001] grid w-full max-w-lg -translate-x-1/2 -translate-y-1/2 gap-4 border p-6 shadow-lg duration-200",e),...n,children:[t,(0,o.jsxs)(i.Close,{className:"dialog-close-button ring-offset-background focus:ring-ring data-[state=open]:bg-accent data-[state=open]:text-muted-foreground absolute right-4 top-4 rounded-sm opacity-70 transition-opacity hover:opacity-100 disabled:pointer-events-none",children:[(0,o.jsx)(H,{className:"dialog-close-icon tablet:size-6 size-5"}),(0,o.jsx)("span",{className:"sr-only",children:"Close"})]})]})]}));g.displayName=i.Content.displayName;const f=({className:e,...t})=>(0,o.jsx)("div",{className:(0,s.cn)("tablet:text-left flex flex-col space-y-1.5 text-center",e),...t});f.displayName="DialogHeader";const D=({className:e,...t})=>(0,o.jsx)("div",{className:(0,s.cn)("tablet:flex-row tablet:justify-end tablet:space-x-2 flex flex-col-reverse",e),...t});D.displayName="DialogFooter";const y=d.forwardRef(({className:e,...t},a)=>(0,o.jsx)(i.Title,{ref:a,className:(0,s.cn)("text-lg font-semibold leading-none tracking-tight",e),...t}));y.displayName=i.Title.displayName;const v=d.forwardRef(({className:e,...t},a)=>(0,o.jsx)(i.Description,{ref:a,className:(0,s.cn)("text-muted-foreground text-sm",e),...t}));v.displayName=i.Description.displayName;
package/dist/esm/biz-components/HeroBanner/HeroBanner.js CHANGED
@@ -1 +1 @@
1
- "use client";import{Fragment as _e,jsx as e,jsxs as d}from"react/jsx-runtime";import re,{useImperativeHandle as ke,useRef as v,useState as we,useEffect as $e}from"react";import B from"gsap";import{ScrollTrigger as N}from"gsap/dist/ScrollTrigger";import M from"jump.js";import{useMediaQuery as oe}from"react-responsive";import{useInView as Be}from"react-intersection-observer";import Ne from"../../helpers/ScrollLoadVideo.js";import{Button as T,Heading as Te,Picture as R,Text as D,Countdown as Ve}from"../../components/index.js";import{cn as p}from"../../helpers/index.js";import{cva as V}from"class-variance-authority";import{withLayout as He}from"../../shared/Styles.js";import{useExposure as ze}from"../../hooks/useExposure.js";import{trackUrlRef as H}from"../../shared/trackUrlRef.js";import{getLocalizedPath as Ce}from"../../helpers/utils.js";import{useAiuiContext as Le}from"../AiuiProvider/index.js";import{sizeMap as Ie}from"../../components/button.js";import{VideoModal as Pe}from"../VideoModal/index.js";import Se from"./HeroBannerCarousel.js";const c="image",m="hero_banner",Ee=V("hero-banner-content lg-desktop:gap-[32px] absolute top-24 z-10 flex w-full flex-col gap-[24px]",{variants:{align:{left:"tablet:px-[32px] laptop:top-1/2 laptop:px-[64px] lg-desktop:px-[calc(50%-832px)] laptop:-translate-y-1/2 left-0 px-[16px]",center:"tablet:top-[84px] laptop:top-[76px] desktop:top-[176px] lg-desktop:top-[192px] left-1/2 top-[84px] -translate-x-1/2 translate-y-0 items-center text-center"}},defaultVariants:{align:"left"}}),Me=V("hero-banner-wrap-text lg-desktop:max-w-[824px] desktop:max-w-[648px] laptop:max-w-[440px] tablet:max-w-[704px] max-w-[358px]",{variants:{align:{left:"laptop:text-left",center:"text-center"}},defaultVariants:{align:"left"}}),Re=V("hero-banner-button-group lg-desktop:gap-x-3 flex flex-wrap items-center gap-x-2 gap-y-3",{variants:{align:{left:"laptop:justify-start",center:"justify-center"}},defaultVariants:{align:"left"}}),De=V("hero-banner-icon-group flex items-center gap-2",{variants:{align:{left:"justify-start",center:"justify-center"}},defaultVariants:{align:"left"}}),je=({size:i="base"})=>{const{width:k,height:u}=Ie[i];return e("svg",{width:k,height:u,viewBox:"0 0 20 20",fill:"currentcolor",xmlns:"http://www.w3.org/2000/svg",children:e("path",{d:"M13.9599 9.30662C14.4547 9.63647 14.4547 10.3635 13.9599 10.6934L6.29558 15.8029C5.74179 16.1721 5 15.7751 5 15.1096V4.89042C5 4.22484 5.74179 3.82785 6.29558 4.19705L13.9599 9.30662Z",fill:"currentcolor"})})},ne=re.forwardRef(({data:i,className:k,classNames:u={},onSecondaryClick:j,onPrimaryClick:_,onTertiaryClick:A,jumpOptions:le={},...O},U)=>{const{locale:q}=Le(),z={...{duration:500,offset:0},...le},w=t=>!t||!q?t:Ce(t,q),{label:G,title:o,subtitle:r,endDate:J,endDate_tz:se,dateFormat:ie,pcImage:g,padImage:F,mobileImage:$,pcVideo:pe,padVideo:ue,mobileVideo:W,isShowVideo:ce,isVideoLoop:me=!0,primaryButton:n,secondaryButton:a,tertiaryButton:l,theme:de="light",size:C="default",titleSize:L,caption:Y=[],blockLink:Q,iconArray:Z,align:b="left",enableParallax:K=!0}=i,I=Array.isArray(Y)?Y:[],fe=Array.isArray(Z)?Z:void 0,ge=oe({query:"(max-width: 768px)"}),be=oe({query:"(max-width: 1024px)"}),[X,ee]=we(!1),{ref:xe,inView:te}=Be(),P=v(null),S=v(null),E=v(null),x=v(null),f=v(null),ye=o?.trim()||r?.trim()||g?.alt?.trim()||void 0,he=o!==void 0?o?.trim()||r?.trim()||g?.alt?.trim()||void 0:r&&r.trim()||"",ve=r&&r.trim()||"";return ze(f,{componentType:c,componentName:m,componentTitle:he,componentDescription:ve}),ke(U,()=>f.current),$e(()=>{if(i.items&&i.items.length>0||!K)return;B.registerPlugin(N);function t(){if(!x.current)return;const s=f.current?.clientHeight||100;window.innerHeight<=s?P.current=N.create({trigger:f.current,start:"top bottom",end:"bottom top",scrub:!0,onUpdate:y=>{const h=y.progress*40-20;B.set(x.current,{yPercent:h})}}):(E.current=N.create({trigger:f.current,start:"top bottom",end:"bottom bottom",scrub:!0,onUpdate:y=>{const h=y.progress*20-20;B.set(x.current,{yPercent:h})}}),S.current=N.create({trigger:f.current,start:"top top",end:"bottom top",scrub:!0,onUpdate:y=>{const h=y.progress*20;B.set(x.current,{yPercent:h})}}))}return te&&t(),()=>{P.current&&P.current.kill(),E.current&&E.current.kill(),S.current&&S.current.kill()}},[te,i.items,K]),i.items&&i.items.length>0?e(Se,{data:i,className:k,classNames:u,onPrimaryClick:_,onSecondaryClick:j,onTertiaryClick:A,ref:U,...O}):e("div",{...O,ref:xe,"data-ui-component-id":"HeroBanner",children:d("div",{ref:f,className:p(de==="dark"?"aiui-dark":"","text-info-primary relative w-full overflow-hidden",{"lg-desktop:aspect-[1920/930] desktop:aspect-[1440/700] laptop:aspect-[1024/520] tablet:aspect-[768/660] aspect-[390/660]":C==="default","lg-desktop:aspect-[1920/800] desktop:aspect-[1440/640] laptop:aspect-[1024/480] tablet:aspect-[768/560] aspect-[390/560]":C==="sm"},k),children:[Q&&e("a",{className:"absolute inset-0 z-10",href:H(w(Q),`${c}_${m}`),"data-headless-type-name":`${c}#${m}`,"data-headless-title-desc-button":`${o}#${r}`,tabIndex:-1,"aria-hidden":"true","aria-label":ye}),e("div",{ref:x,className:p("absolute left-0 top-0 size-full"),children:ce?d(_e,{children:[e("div",{"data-video-poster":"true",className:"laptop:w-full absolute inset-0 h-full transition-opacity duration-500",children:e(R,{className:"absolute inset-0 size-full",imgClassName:"size-full object-cover",loading:"eager",fetchPriority:"high",alt:g?.alt||"",source:`${g?.url||""} , ${F?.url??($?.url||"")} 1024, ${$?.url||""} 767`})}),e(Ne,{poster:void 0,src:ge?W?.url:be?ue?.url||W?.url:pe?.url,className:"laptop:w-full absolute inset-0 h-full",videoClassName:"h-full object-cover",muted:!0,loop:me,playsInline:!0,onPlaying:t=>{t.currentTarget.closest('[data-ui-component-id="HeroBanner"]')?.querySelector('[data-video-poster="true"]')?.classList.add("opacity-0")}})]}):e(R,{className:"laptop:w-full h-full",imgClassName:"h-full object-cover",loading:"eager",fetchPriority:"high",alt:g?.alt||"",source:`${g?.url||""} , ${F?.url??($?.url||"")} 1024, ${$?.url||""} 767`})}),d("div",{className:Ee({align:b}),children:[d("div",{className:Me({align:b}),children:[G&&e(D,{size:2,as:"p",className:p("hero-banner-label font-heading lg-desktop:text-[18px] desktop:text-base text-sm"),html:G}),o&&e(Te,{as:L==="4"?"h1":"h2",html:o,className:p("hero-banner-title",u.title),size:L?Number(L||"5"):C==="sm"?4:5}),r&&e(D,{as:"p",size:2,className:p("hero-banner-subtitle font-heading lg-desktop:text-[18px] desktop:text-base laptop:mt-2 lg-desktop:mt-4 mt-1 text-sm",u.subtitle),html:r}),J&&e("div",{className:"mt-3",children:e(Ve,{endDate:J,endDate_tz:se,dateFormat:ie,variant:"spacious",align:b})})]}),d("div",{className:p(Re({align:b}),u.buttonGroup),children:[d("div",{className:"lg-desktop:gap-3 flex items-center gap-2",children:[a?.isShowPlayVideoButton&&a?.playVideoButtonText?d(T,{onClick:()=>ee(!0),size:"lg",variant:"secondary",className:"hero-banner-play-video-button","data-headless-type-name":`${c}#${m}`,"data-headless-title-desc-button":`${o}#${r}#${a?.playVideoButtonText}`,children:[a?.playVideoButtonText," ",e(je,{size:"lg"})]}):a?.text?d(T,{"aria-label":o??r,size:"lg",variant:"secondary",className:p("hero-banner-secondary-button",u.secondaryButton),as:a?.isCustomSecondaryButton?"button":"a",href:H(w(a?.link),`${c}_${m}`),target:a?.target,rel:a?.target==="_blank"?a?.rel??"noopener noreferrer":a?.rel,onClick:t=>{if(a.link?.startsWith("#")){t.preventDefault();const s=document.querySelector(a.link);s&&M(s,z)}a?.isCustomSecondaryButton&&j?.(i,t,a?.customSecondaryEventId)},"data-headless-type-name":`${c}#${m}`,"data-headless-title-desc-button":`${o}#${r}#${a?.text}`,children:[a?.text,e("span",{className:"sr-only",children:o??r})]}):null,n&&n.text&&e(T,{"aria-label":o??r,size:"lg",variant:"primary",className:p("hero-banner-primary-button",u.primaryButton),as:n?.isCustomPrimaryButton?"button":"a",href:H(w(n.link),`${c}_${m}`),target:n?.target,rel:n?.target==="_blank"?n?.rel??"noopener noreferrer":n?.rel,onClick:t=>{if(n.link?.startsWith("#")){t.preventDefault();const s=document.querySelector(n.link);s&&M(s,z)}n?.isCustomPrimaryButton&&_?.(i,t,n?.customPrimaryEventId)},"data-headless-type-name":`${c}#${m}`,"data-headless-title-desc-button":`${o}#${r}#${n?.text}`,children:n.text})]}),l&&l.text&&d(T,{"aria-label":o??r,size:"lg",variant:"link",className:p("hero-banner-tertiary-button w-auto p-0",u.tertiaryButton),as:l?.isCustomTertiaryButton?"button":"a",href:H(w(l.link),`${c}_${m}`),target:l?.target,rel:l?.target==="_blank"?l?.rel??"noopener noreferrer":l?.rel,onClick:t=>{if(l.link?.startsWith("#")){t.preventDefault();const s=document.querySelector(l.link);s&&M(s,z)}l?.isCustomTertiaryButton&&A?.(i,t,l?.customTertiaryEventId)},"data-headless-type-name":`${c}#${m}`,"data-headless-title-desc-button":`${o}#${r}#${l?.text}`,children:[l.text,e("span",{className:"sr-only",children:o??r})]})]}),e("div",{className:De({align:b}),children:fe?.map(t=>e("div",{className:"h-12",children:e(R,{className:"laptop:w-full h-full",imgClassName:"h-full object-cover",loading:"eager",alt:t?.pcImage?.alt||"",source:t?.pcImage?.url})},t?.pcImage?.url||t?.pcImage?.alt))})]}),I.length>0&&e("div",{className:p("hero-banner-caption-group laptop:gap-3 tablet:px-[32px] laptop:px-[64px] lg-desktop:px-[calc(50%-832px)] desktop:pb-[24px] absolute bottom-0 z-10 flex items-stretch gap-2 px-[16px] pb-[16px]",u.captionGroup),children:I.map((t,s)=>d(re.Fragment,{children:[e(D,{size:2,className:p("hero-banner-product-text tablet:w-[108px] loptop:w-[150px] desktop:w-[156px] lg-desktop:w-[180px] laptop:text-[14px] flex-1 text-[12px]"),html:t.title}),s<I.length-1&&e("div",{className:p("bg-info-primary w-px")})]},t.title))}),X&&e(Pe,{visible:X,videoUrl:a?.isYoutubeVideo?void 0:a?.videoUrl?.url,youTubeId:a?.isYoutubeVideo?a?.youtubeId:void 0,onCloseModal:()=>ee(!1)})]})})});ne.displayName="HeroBanner";var st=He(ne);export{st as default};
1
+ "use client";import{Fragment as _e,jsx as e,jsxs as d}from"react/jsx-runtime";import re,{useImperativeHandle as ke,useRef as v,useState as we,useEffect as $e}from"react";import B from"gsap";import{ScrollTrigger as N}from"gsap/dist/ScrollTrigger";import M from"jump.js";import{useMediaQuery as oe}from"react-responsive";import{useInView as Be}from"react-intersection-observer";import Ne from"../../helpers/ScrollLoadVideo.js";import{Button as T,Heading as Te,Picture as R,Text as D,Countdown as Ve}from"../../components/index.js";import{cn as p}from"../../helpers/index.js";import{cva as V}from"class-variance-authority";import{withLayout as He}from"../../shared/Styles.js";import{useExposure as ze}from"../../hooks/useExposure.js";import{trackUrlRef as H}from"../../shared/trackUrlRef.js";import{getLocalizedPath as Ce}from"../../helpers/utils.js";import{useAiuiContext as Le}from"../AiuiProvider/index.js";import{sizeMap as Ie}from"../../components/button.js";import{VideoModal as Pe}from"../VideoModal/index.js";import Se from"./HeroBannerCarousel.js";const c="image",m="hero_banner",Ee=V("hero-banner-content lg-desktop:gap-[32px] absolute top-24 z-10 flex w-full flex-col gap-[24px]",{variants:{align:{left:"tablet:px-[32px] laptop:top-1/2 laptop:px-[64px] lg-desktop:px-[calc(50%-832px)] laptop:-translate-y-1/2 left-0 px-[16px]",center:"tablet:top-[84px] laptop:top-[76px] desktop:top-[176px] lg-desktop:top-[192px] left-1/2 top-[84px] -translate-x-1/2 translate-y-0 items-center text-center"}},defaultVariants:{align:"left"}}),Me=V("hero-banner-wrap-text lg-desktop:max-w-[824px] desktop:max-w-[648px] laptop:max-w-[440px] tablet:max-w-[704px] max-w-[358px]",{variants:{align:{left:"laptop:text-left",center:"text-center"}},defaultVariants:{align:"left"}}),Re=V("hero-banner-button-group lg-desktop:gap-x-3 flex flex-wrap items-center gap-x-2 gap-y-3",{variants:{align:{left:"laptop:justify-start",center:"justify-center"}},defaultVariants:{align:"left"}}),De=V("hero-banner-icon-group flex items-center gap-2",{variants:{align:{left:"justify-start",center:"justify-center"}},defaultVariants:{align:"left"}}),je=({size:i="base"})=>{const{width:k,height:u}=Ie[i];return e("svg",{width:k,height:u,viewBox:"0 0 20 20",fill:"currentcolor",xmlns:"http://www.w3.org/2000/svg",children:e("path",{d:"M13.9599 9.30662C14.4547 9.63647 14.4547 10.3635 13.9599 10.6934L6.29558 15.8029C5.74179 16.1721 5 15.7751 5 15.1096V4.89042C5 4.22484 5.74179 3.82785 6.29558 4.19705L13.9599 9.30662Z",fill:"currentcolor"})})},ne=re.forwardRef(({data:i,className:k,classNames:u={},onSecondaryClick:j,onPrimaryClick:_,onTertiaryClick:A,jumpOptions:le={},...O},U)=>{const{locale:q}=Le(),z={...{duration:500,offset:0},...le},w=t=>!t||!q?t:Ce(t,q),{label:G,title:o,subtitle:r,endDate:J,endDate_tz:se,dateFormat:ie,pcImage:g,padImage:F,mobileImage:$,pcVideo:pe,padVideo:ue,mobileVideo:W,isShowVideo:ce,isVideoLoop:me=!0,primaryButton:n,secondaryButton:a,tertiaryButton:l,theme:de="light",size:C="default",titleSize:L,caption:Y=[],blockLink:Q,iconArray:Z,align:b="left",enableParallax:K=!0}=i,I=Array.isArray(Y)?Y:[],fe=Array.isArray(Z)?Z:void 0,ge=oe({query:"(max-width: 768px)"}),be=oe({query:"(max-width: 1024px)"}),[X,ee]=we(!1),{ref:xe,inView:te}=Be(),P=v(null),S=v(null),E=v(null),x=v(null),f=v(null),ye=o?.trim()||r?.trim()||g?.alt?.trim()||void 0,he=o!==void 0?o?.trim()||r?.trim()||g?.alt?.trim()||void 0:r&&r.trim()||"",ve=r&&r.trim()||"";return ze(f,{componentType:c,componentName:m,componentTitle:he,componentDescription:ve}),ke(U,()=>f.current),$e(()=>{if(i.items&&i.items.length>0||!K)return;B.registerPlugin(N);function t(){if(!x.current)return;const s=f.current?.clientHeight||100;window.innerHeight<=s?P.current=N.create({trigger:f.current,start:"top bottom",end:"bottom top",scrub:!0,onUpdate:y=>{const h=y.progress*40-20;B.set(x.current,{yPercent:h})}}):(E.current=N.create({trigger:f.current,start:"top bottom",end:"bottom bottom",scrub:!0,onUpdate:y=>{const h=y.progress*20-20;B.set(x.current,{yPercent:h})}}),S.current=N.create({trigger:f.current,start:"top top",end:"bottom top",scrub:!0,onUpdate:y=>{const h=y.progress*20;B.set(x.current,{yPercent:h})}}))}return te&&t(),()=>{P.current&&P.current.kill(),E.current&&E.current.kill(),S.current&&S.current.kill()}},[te,i.items,K]),i.items&&i.items.length>0?e(Se,{data:i,className:k,classNames:u,onPrimaryClick:_,onSecondaryClick:j,onTertiaryClick:A,ref:U,...O}):e("div",{...O,ref:xe,"data-ui-component-id":"HeroBanner",children:d("div",{ref:f,className:p(de==="dark"?"aiui-dark":"","text-info-primary relative w-full overflow-hidden",{"lg-desktop:aspect-[1920/930] desktop:aspect-[1440/700] laptop:aspect-[1024/520] tablet:aspect-[768/660] aspect-[390/660]":C==="default","lg-desktop:aspect-[1920/800] desktop:aspect-[1440/640] laptop:aspect-[1024/480] tablet:aspect-[768/560] aspect-[390/560]":C==="sm"},k),children:[Q&&e("a",{className:"absolute inset-0 z-10",href:H(w(Q),`${c}_${m}`),"data-headless-type-name":`${c}#${m}`,"data-headless-title-desc-button":`${o}#${r}`,tabIndex:-1,"aria-hidden":"true","aria-label":ye}),e("div",{ref:x,className:p("absolute left-0 top-0 size-full"),children:ce?d(_e,{children:[e("div",{"data-video-poster":"true",className:"laptop:w-full absolute inset-0 h-full transition-opacity duration-500",children:e(R,{className:"absolute inset-0 size-full",imgClassName:"size-full object-cover",loading:"eager",fetchPriority:"high",alt:g?.alt||"",source:`${g?.url||""} , ${F?.url??($?.url||"")} 1024, ${$?.url||""} 767`})}),e(Ne,{poster:void 0,src:ge?W?.url:be?ue?.url||W?.url:pe?.url,className:"laptop:w-full absolute inset-0 h-full",videoClassName:"h-full object-cover",muted:!0,loop:me,playsInline:!0,onPlaying:t=>{t.currentTarget.closest('[data-ui-component-id="HeroBanner"]')?.querySelector('[data-video-poster="true"]')?.classList.add("opacity-0")}})]}):e(R,{className:"laptop:w-full h-full",imgClassName:"h-full object-cover",loading:"eager",fetchPriority:"high",alt:g?.alt||"",source:`${g?.url||""} , ${F?.url??($?.url||"")} 1024, ${$?.url||""} 767`})}),d("div",{className:Ee({align:b}),children:[d("div",{className:Me({align:b}),children:[G&&e(D,{size:2,as:"p",className:p("hero-banner-label font-heading lg-desktop:text-[18px] desktop:text-base text-sm"),html:G}),o&&e(Te,{as:L==="4"?"h1":"h2",html:o,className:p("hero-banner-title",u.title),size:L?Number(L||"5"):C==="sm"?4:5}),r&&e(D,{as:"p",size:2,className:p("hero-banner-subtitle font-heading lg-desktop:text-[18px] desktop:text-base laptop:mt-2 lg-desktop:mt-4 mt-1 text-sm",u.subtitle),html:r}),J&&e("div",{className:"mt-3",children:e(Ve,{endDate:J,endDate_tz:se,dateFormat:ie,variant:"spacious",align:b})})]}),d("div",{className:p(Re({align:b}),u.buttonGroup),children:[d("div",{className:"lg-desktop:gap-3 flex items-center gap-2",children:[a?.isShowPlayVideoButton&&a?.playVideoButtonText?d(T,{onClick:()=>ee(!0),size:"lg",variant:"secondary",className:"hero-banner-play-video-button","data-headless-type-name":`${c}#${m}`,"data-headless-title-desc-button":`${o}#${r}#${a?.playVideoButtonText}`,children:[a?.playVideoButtonText," ",e(je,{size:"lg"})]}):a?.text?d(T,{"aria-label":o??r,size:"lg",variant:"secondary",className:p("hero-banner-secondary-button",u.secondaryButton),as:a?.isCustomSecondaryButton?"button":"a",href:H(w(a?.link),`${c}_${m}`),target:a?.target,rel:a?.target==="_blank"?a?.rel??"noopener noreferrer":a?.rel,onClick:t=>{if(a.link?.startsWith("#")){t.preventDefault();const s=document.querySelector(a.link);s&&M(s,z)}a?.isCustomSecondaryButton&&j?.(i,t,a?.customSecondaryEventId)},"data-headless-type-name":`${c}#${m}`,"data-headless-title-desc-button":`${o}#${r}#${a?.text}`,children:[a?.text,e("span",{className:"sr-only",children:o??r})]}):null,n&&n.text&&e(T,{"aria-label":o??r,size:"lg",variant:"primary",className:p("hero-banner-primary-button",u.primaryButton),as:n?.isCustomPrimaryButton?"button":"a",href:H(w(n.link),`${c}_${m}`),target:n?.target,rel:n?.target==="_blank"?n?.rel??"noopener noreferrer":n?.rel,onClick:t=>{if(n.link?.startsWith("#")){t.preventDefault();const s=document.querySelector(n.link);s&&M(s,z)}n?.isCustomPrimaryButton&&_?.(i,t,n?.customPrimaryEventId)},"data-headless-type-name":`${c}#${m}`,"data-headless-title-desc-button":`${o}#${r}#${n?.text}`,children:n.text})]}),l&&l.text&&d(T,{"aria-label":o??r,size:"lg",variant:"link",className:p("hero-banner-tertiary-button w-auto p-0",u.tertiaryButton),as:l?.isCustomTertiaryButton?"button":"a",href:H(w(l.link),`${c}_${m}`),target:l?.target,rel:l?.target==="_blank"?l?.rel??"noopener noreferrer":l?.rel,onClick:t=>{if(l.link?.startsWith("#")){t.preventDefault();const s=document.querySelector(l.link);s&&M(s,z)}l?.isCustomTertiaryButton&&A?.(i,t,l?.customTertiaryEventId)},"data-headless-type-name":`${c}#${m}`,"data-headless-title-desc-button":`${o}#${r}#${l?.text}`,children:[l.text,e("span",{className:"sr-only",children:o??r})]})]}),e("div",{className:De({align:b}),children:fe?.map(t=>e("div",{className:"h-12",children:e(R,{className:"!inline-block h-full !w-auto",imgClassName:"!w-auto h-full object-contain",loading:"eager",alt:t?.pcImage?.alt||"",source:t?.pcImage?.url})},t?.pcImage?.url||t?.pcImage?.alt))})]}),I.length>0&&e("div",{className:p("hero-banner-caption-group laptop:gap-3 tablet:px-[32px] laptop:px-[64px] lg-desktop:px-[calc(50%-832px)] desktop:pb-[24px] absolute bottom-0 z-10 flex items-stretch gap-2 px-[16px] pb-[16px]",u.captionGroup),children:I.map((t,s)=>d(re.Fragment,{children:[e(D,{size:2,className:p("hero-banner-product-text tablet:w-[108px] loptop:w-[150px] desktop:w-[156px] lg-desktop:w-[180px] laptop:text-[14px] flex-1 text-[12px]"),html:t.title}),s<I.length-1&&e("div",{className:p("bg-info-primary w-px")})]},t.title))}),X&&e(Pe,{visible:X,videoUrl:a?.isYoutubeVideo?void 0:a?.videoUrl?.url,youTubeId:a?.isYoutubeVideo?a?.youtubeId:void 0,onCloseModal:()=>ee(!1)})]})})});ne.displayName="HeroBanner";var st=He(ne);export{st as default};
package/dist/esm/biz-components/ShelfDisplay/shelfDisplayItem.js CHANGED
@@ -1 +1 @@
1
- import{Fragment as Ae,jsx as s,jsxs as f}from"react/jsx-runtime";import{useAiuiContext as Ne}from"../AiuiProvider/index.js";import{formatVariantPrice as Ce}from"./shelfDisplay.js";import _e from"../../components/picture.js";import Se from"../../components/badge.js";import{cn as w}from"../../helpers/utils.js";import{Text as Te}from"../../components/text.js";import fe from"../../components/button.js";import{gaTrack as Be}from"../../shared/track.js";import{trackUrlRef as Pe}from"../../shared/trackUrlRef.js";import{Heading as Le}from"../../components/heading.js";import{useExposure as $e}from"../../hooks/useExposure.js";import{useRef as De,useEffect as Ie,useMemo as ye,useState as j}from"react";const ge="image",he="product_shelf",xe=999999999e-2,ze=e=>{const t=e?.sku,_=e?.variants,E=_?.find(O=>O?.sku===t),K=E?.image?.url||_?.[0]?.image?.url||"",re=E?.image?.altText||_?.[0]?.image?.altText||e?.custom_name||e?.title||"";return{imageUrl:K,altText:re}},Fe=({items:e})=>e?.length?s("div",{className:"shelf-display-social-endorsements desktop:gap-2 absolute right-0 top-0 z-10 flex flex-col items-center gap-1",children:e.map((t,_)=>typeof t.icon=="string"?s("img",{src:t.icon,alt:t.label||"",loading:"lazy",className:"desktop:size-10 lg-desktop:size-12 size-8 object-contain"},_):s(Te,{"aria-label":t.label,className:"desktop:size-10 lg-desktop:size-12 size-8 [&_img]:size-full [&_svg]:size-full",children:t.icon},_))}):null,Ke=({data:e,configuration:t})=>{const{isDisplayBackImage:_=!1,itemShape:E,metafields:K,isTopTag:re=!1,isShowTag:O,isShowOriginalPrice:$,isShowShortTitle:ve=!1,isShowPricesTag:D=!1,pricesTagTextColor:W,pricesTagBgColor:H,itemsTagTextColor:v,itemsTagBgColor:Q,formatPrice:ie,renderOriginalPrice:X,renderPriceLabel:be,renderPrice:U}=t||{},{locale:T="es",copyWriting:oe,currencyDisplay:Y}=Ne(),{discounts:Z,discountsCopy:le}=K||{},ne=De(null),[n,ae]=j([]),[ce,I]=j(""),[pe,z]=j(!1),[b,R]=j(!1),me=(i,p,m,d)=>{const{primaryFun:x,onAddCart:S,onBuyNow:te,onLearnMore:se,event:we}=t||{};if(x){if(x==="AddCart"&&S)return S(i,p+1,m,d);if(x==="BuyNow"&&te)return te(i,p+1,m,d);if(x==="LearnMore"&&se)return se(i,p+1,m,d)}we?.primaryButton?.(i,p+1,m,d)},ke=(i,p,m,d)=>{const{secondaryFun:x,onAddCart:S,onBuyNow:te,onLearnMore:se,event:we}=t||{};if(x){if(x==="AddCart"&&S)return S(i,p+1,m,d);if(x==="BuyNow"&&te)return te(i,p+1,m,d);if(x==="LearnMore"&&se)return se(i,p+1,m,d)}we?.secondaryButton?.(i,p+1,m,d)},o=ye(()=>{const i=e?.variants||[];if(i.length)return e?.sku?i?.find?.(p=>p?.sku===e?.sku)||i[0]:i?.[0]},[e?.sku,e?.variants]),A=o?.id?.split?.("/")||[],N=A?.[A?.length-1],y=!o?.availableForSale||o?.price?.amount===xe||o?.price===xe,k=o?.coupons?.[0],de=e?.price?.currencyCode||"USD",q=ye(()=>Ce({locale:T,amount:k?k?.variant_price4wscode:o?.price,baseAmount:k?o?.price:0,currencyCode:de,currencyDisplay:Y,customFormatPrice:ie}),[de,T,k,Y,o,ie]),{price:F,basePrice:C,discount:B,discountAmount:M}=q,{imageUrl:V,altText:ue}=ze(e),G=e?.custom_name||e?.title,P=ve&&o?.metafields?.infos?.page_short_title||G,ee=e?.custom_description||e?.description,r=()=>{if(k?.value_type==="fixed_amount"){const i=M||"",p=i.match(/^(.*?)(\d[\d.,]*)(.*)$/);if(p){const[,m,d,x]=p;let S=d;return d.endsWith(".00")?S=d.replace(/\.00$/,""):d.endsWith(",00")&&(S=d.replace(/,00$/,"")),`${m}${S}${x}`}return i}return B||""};Ie(()=>{let i=[];if(B||M){const m=`${r()} ${Z?.off||le?.off||""}`;I(m)}const p=e?.tags?.filter?.(m=>m?.startsWith?.("CLtag"))?.map?.(m=>m?.replace?.("CLtag:",""))?.slice?.(0,B&&D?1:2)||[];ae(i.concat(p))},[e?.tags,B,M,D,Z?.off,le?.off]),$e(ne,{componentType:ge,componentName:he,componentTitle:G,componentDescription:ee,position:t?.index+1});const l=async()=>{if(!pe&&!e?.custom_primary_link){z(!0);try{await me(e,t?.index,t,k)}finally{z(!1)}}},a=async()=>{if(!b&&!e?.custom_secondary_link){R(!0);try{await ke(e,t?.index,t,k)}finally{R(!1)}}},c=()=>f("div",{className:"shelf-display-product-content desktop:gap-6 lg-desktop:flex-[221] desktop:flex-[190] flex flex-[178] flex-col justify-between gap-4",children:[f("div",{className:"shelf-display-product-content-title-desc",children:[P?s(Le,{as:"h3",title:P||"",size:2,className:"shelf-display-product-title text-info-primary mb-1 line-clamp-2",html:P||""}):null,s(Te,{size:2,className:w("lg-desktop:text-lg desktop:text-base shelf-display-product-description text-info-primary line-clamp-2 text-sm !leading-[1.4]"),html:ee||""})]}),f("div",{className:"shelf-display-product-content-price-button",children:[s("div",{className:"mb-2 flex items-center",children:U?U(e,{price:F,basePrice:C,discount:B,discountAmount:M,variant:o,coupon:k,isSoldOut:y,isShowOriginalPrice:$}):y?s("div",{className:"lg-desktop:text-2xl text-info-primary text-xl font-bold",children:oe?.soldOutText}):f(Ae,{children:[s("div",{className:"final-price lg-desktop:text-2xl text-info-primary text-xl font-bold !leading-[1.2]",children:o?.availableForSale&&F||""}),X?X(e,{price:F,basePrice:C,discount:B,discountAmount:M,isShowOriginalPrice:$}):C&&$&&s("div",{className:"origin-price lg-desktop:text-2xl text-info-quaternary ml-1 text-xl font-bold !leading-[1.2] line-through",children:o?.availableForSale&&C||""})]})}),!U&&be?.(e,o,{isShowOriginalPrice:$}),f("div",{className:w("shelf-flex-button-group","lg-desktop:gap-3 flex items-center gap-2",t.direction==="vertical"?"flex-col":""),children:[t?.secondaryButton&&!y?s(fe,{disabled:y&&t?.secondaryFun!=="LearnMore",variant:"secondary",href:e?.custom_secondary_link,as:e?.custom_secondary_link?"a":"button",onClick:a,loading:b,className:t.direction==="vertical"?"w-full":"",children:t?.secondaryButton||""}):null,t?.primaryButton?s(fe,{disabled:y&&t?.primaryFun!=="LearnMore",variant:"primary",href:e?.custom_primary_link,as:e?.custom_primary_link?"a":"button",onClick:l,loading:pe,className:t.direction==="vertical"?"w-full":"",children:t?.primaryButton||""}):null]})]})]}),u={...W?{color:W}:{},...H?{backgroundColor:H,backgroundImage:"none"}:{},...W||H?{outline:"none"}:{}},g={...v?{color:v}:{},...Q?{backgroundColor:Q,backgroundImage:"none"}:{},...v||Q?{outlineColor:v}:{}},L=()=>f("div",{className:"lg-desktop:flex-[28] box-border flex flex-[24] flex-wrap gap-1 overflow-hidden",children:[D&&ce&&s(Se,{className:"shelf-prices-tag",variant:"fill",style:u,children:ce||""}),O&&n?.length>0&&n?.map?.((i,p)=>s(Se,{className:"shelf-items-tag",variant:"outline",style:g,children:i},p))]}),h=e?.custom_bg_image,J=e?.custom_theme;return s("div",{ref:ne,className:w("box-border w-full cursor-pointer overflow-hidden duration-300","rounded-box","lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[545] desktop:aspect-w-[316] desktop:aspect-h-[450]","laptop:aspect-w-[288] laptop:aspect-h-[422] aspect-w-[296] aspect-h-[422] relative","md-tablet:h-[422px] shelf-display-item",h?"bg-cover bg-center bg-no-repeat":"bg-background tablet:hover:bg-info-white",{"aiui-dark":J==="dark","aiui-light":J==="light"}),style:h?{backgroundImage:`url(${h})`}:void 0,children:_?s("div",{className:"absolute inset-0 box-border overflow-hidden",children:f("div",{className:"relative inset-0 size-full",children:[s(L,{}),s(_e,{source:V,alt:ue,className:w("flex h-full justify-center object-cover [&_img]:w-auto",{"opacity-0":h})}),s("div",{className:"desktop:p-6 absolute inset-x-0 bottom-0 box-border overflow-hidden p-4",children:c()})]})}):f("div",{className:"desktop:p-6 desktop:pt-4 desktop:gap-2 absolute inset-0 box-border flex flex-col justify-between gap-1 overflow-hidden p-4",children:[s(L,{}),f("div",{className:w("shelf-display-item-image lg-desktop:flex-[240] relative inline-block w-full flex-[180] overflow-hidden",{"opacity-0":h}),children:[s("a",{"aria-label":G,target:t?.target,href:Pe(`${T==="us"||!T?"":`/${T}`}/products/${e?.handle}?variant=${N}`,`${ge}_${he}`),onClick:()=>{Be({event:"ga4Event",event_name:"select_item",event_parameters:{page_group:"Home Page",item_list_name:"Home_Page_Bundle",items:[{item_id:e?.sku||o?.sku,item_name:e?.name,item_variant:o?.name,price:o?.price,index:t?.index+1}]}})},children:s(_e,{source:V,alt:ue,className:"flex h-full justify-center object-cover [&_img]:w-auto"})}),s(Fe,{items:e?.socialEndorsements})]}),c()]})},e?.id||e?.handle)},Qe=({data:e,configuration:t})=>{const{itemShape:_,itemLength:E,metafields:K,isShowShortTitle:re,formatPrice:O,renderOriginalPrice:$,renderPriceLabel:ve,renderPrice:D}=t||{},{discounts:W,discountsCopy:H}=K||{},{locale:v="us",copyWriting:Q,currencyDisplay:ie}=Ne(),[X,be]=j([]),U=De(null),[T,oe]=j(!1),[Y,Z]=j(!1),le=(r,l,a,c)=>{const{primaryFun:u,onAddCart:g,onBuyNow:L,onLearnMore:h,event:J}=t||{};if(u){if(u==="AddCart"&&g)return g(r,l+1,a,c);if(u==="BuyNow"&&L)return L(r,l+1,a,c);if(u==="LearnMore"&&h)return h(r,l+1,a,c)}J?.primaryButton?.(r,l+1,a,c)},ne=(r,l,a,c)=>{const{secondaryFun:u,onAddCart:g,onBuyNow:L,onLearnMore:h,event:J}=t||{};if(u){if(u==="AddCart"&&g)return g(r,l+1,a,c);if(u==="BuyNow"&&L)return L(r,l+1,a,c);if(u==="LearnMore"&&h)return h(r,l+1,a,c)}J?.secondaryButton?.(r,l+1,a,c)},n=ye(()=>{const r=e?.variants||[];if(r.length)return e?.sku&&r.find(l=>l?.sku===e?.sku)||r[0]},[e?.sku,e?.variants]),ae=n?.id?.split?.("/")||[],ce=ae?.[ae?.length-1],I=!n?.availableForSale||n?.price?.amount===xe||n?.price===xe,pe=t?.isShowTag,z=t?.isShowOriginalPrice,b=n?.coupons?.[0],R=!!(z&&b),me=e?.price?.currencyCode||"USD",ke=ye(()=>Ce({locale:v,amount:R?b?.variant_price4wscode:n?.price,baseAmount:R?n?.price:0,currencyCode:me,currencyDisplay:ie,customFormatPrice:O}),[me,v,R,b?.variant_price4wscode,n,O]),{price:o,basePrice:A,discount:N,discountAmount:y}=ke,{imageUrl:k,altText:de}=ze(e),q=e?.custom_name||e?.title,F=re&&n?.metafields?.infos?.page_short_title||q,C=e?.custom_description||e?.description;$e(U,{componentType:ge,componentName:he,componentTitle:q,componentDescription:C,position:t?.index+1});const B=async()=>{if(!T&&!e?.custom_primary_link){oe(!0);try{await le(e,t?.index,t,b)}finally{oe(!1)}}},M=async()=>{if(!Y&&!e?.custom_secondary_link){Z(!0);try{await ne(e,t?.index,t,b)}finally{Z(!1)}}},V=()=>E>=2?{boxItem:"lg-desktop:max-w-[401px] desktop:max-w-[292px] max-w-full",imgItem:"m-tablet:m-auto lg-desktop:max-w-[330px] lg-desktop:max-h-[330px] desktop:max-w-[260px] desktop:max-h-[260px] max-w-[138px] max-h-[138px]",wrap:"lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[480] desktop:aspect-w-[648] desktop:aspect-h-[380] laptop:aspect-w-[440] laptop:aspect-h-[356] tablet:aspect-w-[346] tablet:aspect-h-[360] md-tablet:w-full"}:{boxItem:"lg-desktop:max-w-[401px] desktop:max-w-[292px] laptop:max-w-[289px] max-w-[262px]",imgItem:"md-tablet:m-auto lg-desktop:max-w-[450px] lg-desktop:max-h-[450px] desktop:max-w-[332px] desktop:max-h-[332px] max-w-[312px] max-h-[312px]",wrap:"lg-desktop:aspect-w-[1664] lg-desktop:aspect-h-[480] desktop:aspect-w-[1312] desktop:aspect-h-[380] laptop:aspect-w-[896] laptop:aspect-h-[356] tablet:aspect-w-[704] tablet:aspect-h-[360] md-tablet:w-full"},ue=()=>E>=2?"flex flex-col justify-between desktop:gap-12 desktop:flex-row desktop:justify-center desktop:items-center":"flex justify-center items-center gap-6 md-tablet:flex-col",G=()=>{if(b?.value_type==="fixed_amount"){const r=y||"",l=r.match(/^(.*?)(\d[\d.,]*)(.*)$/);if(l){const[,a,c,u]=l;let g=c;return c.endsWith(".00")?g=c.replace(/\.00$/,""):c.endsWith(",00")&&(g=c.replace(/,00$/,"")),`${a}${g}${u}`}return r}return N||""};Ie(()=>{let r=[];if(N||y){const a=`${G()} ${W?.off||H?.off||""}`;r.push(a)}const l=e?.tags?.filter?.(a=>a?.startsWith?.("CLtag"))?.map?.(a=>a?.replace?.("CLtag:",""))?.slice?.(0,N?1:2)||[];be(r.concat(l))},[e?.tags,N,y,W?.off,H?.off]);const P=e?.custom_bg_image,ee=e?.custom_theme;return s("div",{ref:U,className:w(V().wrap,"rounded-box","shelf-display-item","duration-300","md-tablet:h-[360px] relative box-border w-full cursor-pointer overflow-hidden",P?"bg-cover bg-center bg-no-repeat":"bg-container-secondary-1 tablet:hover:bg-info-white",{"aiui-dark":ee==="dark","aiui-light":ee==="light"}),style:P?{backgroundImage:`url(${P})`}:void 0,children:f("div",{className:w(ue(),"desktop:p-6 absolute inset-0 box-border overflow-hidden p-4"),children:[s("div",{className:w(V().imgItem,"desktop:mb-0 relative mb-1 overflow-hidden",{"opacity-0":P}),children:s("a",{"aria-label":q,target:t?.target,href:Pe(`${v==="us"||!v?"":`/${v}`}/products/${e?.handle}?variant=${ce}`,`${ge}_${he}`),onClick:()=>{Be({event:"ga4Event",event_name:"select_item",event_parameters:{page_group:"Home Page",item_list_name:"Home_Page_Bundle",items:[{item_id:e?.sku||n?.sku,item_name:e?.name,item_variant:n?.name,price:n?.price,index:t?.index+1}]}})},children:s(_e,{source:k,alt:de,className:"flex h-full justify-center object-cover [&_img]:w-auto"})})}),f("div",{className:w("flex flex-col items-start justify-center",V().boxItem),children:[pe&&s("div",{className:"mb-1 box-border flex h-8 flex-wrap gap-1 overflow-hidden",children:X?.length>0&&X?.map?.((r,l)=>s(Se,{className:"shelf-items-tag",variant:"fill",children:r},l))}),F?s(Le,{as:"h3",title:F||"",size:2,className:"shelf-display-product-title lg-desktop:h-[58px] text-info-primary mb-1 line-clamp-2 h-[48px]",html:F||""}):null,C?s(Te,{size:2,className:"lg-desktop:text-lg lg-desktop:h-[26px] desktop:text-base desktop:h-6 shelf-display-product-description text-info-primary line-clamp-1 h-5 text-sm",html:C||""}):null,s("div",{className:"mb-2 mt-5 flex items-center",children:D?D(e,{price:o,basePrice:A,discount:N,discountAmount:y,variant:n,coupon:b,isSoldOut:I,isShowOriginalPrice:z}):I?s("div",{className:"lg-desktop:text-2xl text-info-primary text-xl font-bold",children:Q?.soldOutText}):f(Ae,{children:[s("div",{className:"final-price tablet:text-xl text-info-primary text-xl font-bold",children:n?.availableForSale&&o||""}),$?$(e,{price:o,basePrice:A,discount:N,discountAmount:y,isShowOriginalPrice:z}):A&&s("div",{className:"origin-price tablet:text-xl text-info-quaternary ml-1 text-lg font-bold line-through",children:n?.availableForSale&&A||""})]})}),!D&&ve?.(e,n,{isShowOriginalPrice:z}),f("div",{className:w("shelf-flex-button-group","lg-desktop:gap-3 flex items-center gap-2",t.direction==="vertical"?"flex-col":""),children:[t?.secondaryButton&&!I?s(fe,{disabled:I&&t?.secondaryFun!=="LearnMore",variant:"secondary",href:e?.custom_secondary_link,as:e?.custom_secondary_link?"a":"button",onClick:M,loading:Y,className:t.direction==="vertical"?"w-full":"",children:t?.secondaryButton||""}):null,t?.primaryButton?s(fe,{disabled:I&&t?.primaryFun!=="LearnMore",variant:"primary",href:e?.custom_primary_link,as:e?.custom_primary_link?"a":"button",onClick:B,loading:T,className:t.direction==="vertical"?"w-full":"",children:t?.primaryButton||""}):null]})]})]})},e?.id||e?.handle)};export{Qe as ShelfDisplayHorizontalItem,Ke as ShelfDisplayWrapItem,ze as getProductImage};
1
+ import{Fragment as Ae,jsx as s,jsxs as f}from"react/jsx-runtime";import{useAiuiContext as Ne}from"../AiuiProvider/index.js";import{formatVariantPrice as Ce}from"./shelfDisplay.js";import _e from"../../components/picture.js";import Se from"../../components/badge.js";import{cn as w}from"../../helpers/utils.js";import{Text as Te}from"../../components/text.js";import fe from"../../components/button.js";import{gaTrack as Be}from"../../shared/track.js";import{trackUrlRef as Pe}from"../../shared/trackUrlRef.js";import{Heading as Le}from"../../components/heading.js";import{useExposure as $e}from"../../hooks/useExposure.js";import{useRef as De,useEffect as Ie,useMemo as ye,useState as j}from"react";const ge="image",he="product_shelf",xe=999999999e-2,ze=e=>{const t=e?.sku,_=e?.variants,E=_?.find(O=>O?.sku===t),K=E?.image?.url||_?.[0]?.image?.url||"",re=E?.image?.altText||_?.[0]?.image?.altText||e?.custom_name||e?.title||"";return{imageUrl:K,altText:re}},Fe=({items:e})=>e?.length?s("div",{className:"shelf-display-social-endorsements desktop:gap-2 absolute right-0 top-0 z-10 flex flex-col items-center gap-1",children:e.map((t,_)=>typeof t.icon=="string"?s("img",{src:t.icon,alt:t.label||"",loading:"lazy",className:"desktop:size-10 lg-desktop:size-12 size-8 object-contain"},_):s(Te,{"aria-label":t.label,className:"desktop:size-10 lg-desktop:size-12 size-8 [&_img]:size-full [&_svg]:size-full",children:t.icon},_))}):null,Ke=({data:e,configuration:t})=>{const{isDisplayBackImage:_=!1,itemShape:E,metafields:K,isTopTag:re=!1,isShowTag:O,isShowOriginalPrice:$,isShowShortTitle:ve=!1,isShowPricesTag:D=!1,pricesTagTextColor:W,pricesTagBgColor:H,itemsTagTextColor:v,itemsTagBgColor:Q,formatPrice:ie,renderOriginalPrice:X,renderPriceLabel:be,renderPrice:U}=t||{},{locale:T="es",copyWriting:oe,currencyDisplay:Y}=Ne(),{discounts:Z,discountsCopy:le}=K||{},ne=De(null),[n,ae]=j([]),[ce,I]=j(""),[pe,z]=j(!1),[b,R]=j(!1),me=(i,p,m,d)=>{const{primaryFun:x,onAddCart:S,onBuyNow:te,onLearnMore:se,event:we}=t||{};if(x){if(x==="AddCart"&&S)return S(i,p+1,m,d);if(x==="BuyNow"&&te)return te(i,p+1,m,d);if(x==="LearnMore"&&se)return se(i,p+1,m,d)}we?.primaryButton?.(i,p+1,m,d)},ke=(i,p,m,d)=>{const{secondaryFun:x,onAddCart:S,onBuyNow:te,onLearnMore:se,event:we}=t||{};if(x){if(x==="AddCart"&&S)return S(i,p+1,m,d);if(x==="BuyNow"&&te)return te(i,p+1,m,d);if(x==="LearnMore"&&se)return se(i,p+1,m,d)}we?.secondaryButton?.(i,p+1,m,d)},o=ye(()=>{const i=e?.variants||[];if(i.length)return e?.sku?i?.find?.(p=>p?.sku===e?.sku)||i[0]:i?.[0]},[e?.sku,e?.variants]),A=o?.id?.split?.("/")||[],N=A?.[A?.length-1],y=!o?.availableForSale||o?.price?.amount===xe||o?.price===xe,k=o?.coupons?.[0],de=e?.price?.currencyCode||"USD",q=ye(()=>Ce({locale:T,amount:k?k?.variant_price4wscode:o?.price,baseAmount:k?o?.price:0,currencyCode:de,currencyDisplay:Y,customFormatPrice:ie}),[de,T,k,Y,o,ie]),{price:F,basePrice:C,discount:B,discountAmount:M}=q,{imageUrl:V,altText:ue}=ze(e),G=e?.custom_name||e?.title,P=ve&&o?.metafields?.infos?.page_short_title||G,ee=e?.custom_description||e?.description,r=()=>{if(k?.value_type==="fixed_amount"){const i=M||"",p=i.match(/^(.*?)(\d[\d.,]*)(.*)$/);if(p){const[,m,d,x]=p;let S=d;return d.endsWith(".00")?S=d.replace(/\.00$/,""):d.endsWith(",00")&&(S=d.replace(/,00$/,"")),`${m}${S}${x}`}return i}return B||""};Ie(()=>{let i=[];if(B||M){const m=`${r()} ${Z?.off||le?.off||""}`;I(m)}const p=e?.tags?.filter?.(m=>m?.startsWith?.("CLtag"))?.map?.(m=>m?.replace?.("CLtag:",""))?.slice?.(0,B&&D?1:2)||[];ae(i.concat(p))},[e?.tags,B,M,D,Z?.off,le?.off]),$e(ne,{componentType:ge,componentName:he,componentTitle:G,componentDescription:ee,position:t?.index+1});const l=async()=>{if(!pe&&!e?.custom_primary_link){z(!0);try{await me(e,t?.index,t,k)}finally{z(!1)}}},a=async()=>{if(!b&&!e?.custom_secondary_link){R(!0);try{await ke(e,t?.index,t,k)}finally{R(!1)}}},c=()=>f("div",{className:"shelf-display-product-content desktop:gap-6 lg-desktop:flex-[221] desktop:flex-[190] flex flex-[178] flex-col justify-between gap-4",children:[f("div",{className:"shelf-display-product-content-title-desc",children:[P?s(Le,{as:"h3",title:P||"",size:2,className:"shelf-display-product-title text-info-primary mb-1 line-clamp-2",html:P||""}):null,s(Te,{size:2,className:w("lg-desktop:text-lg desktop:text-base shelf-display-product-description text-info-primary line-clamp-2 text-sm !leading-[1.4]"),html:ee||""})]}),f("div",{className:"shelf-display-product-content-price-button",children:[s("div",{className:"mb-2 flex items-center",children:U?U(e,{price:F,basePrice:C,discount:B,discountAmount:M,variant:o,coupon:k,isSoldOut:y,isShowOriginalPrice:$}):y?s("div",{className:"lg-desktop:text-2xl text-info-primary text-xl font-bold",children:oe?.soldOutText}):f(Ae,{children:[s("div",{className:"final-price lg-desktop:text-2xl text-info-primary text-xl font-bold !leading-[1.2]",children:o?.availableForSale&&F||""}),X?X(e,{price:F,basePrice:C,discount:B,discountAmount:M,isShowOriginalPrice:$}):C&&$&&s("div",{className:"origin-price lg-desktop:text-2xl text-info-quaternary ml-1 text-xl font-bold !leading-[1.2] line-through",children:o?.availableForSale&&C||""})]})}),!U&&be?.(e,o,{isShowOriginalPrice:$}),f("div",{className:w("shelf-flex-button-group","lg-desktop:gap-3 flex items-center gap-2",t.direction==="vertical"?"flex-col":""),children:[t?.secondaryButton&&!y?s(fe,{disabled:y&&t?.secondaryFun!=="LearnMore",variant:"secondary",href:e?.custom_secondary_link,as:e?.custom_secondary_link?"a":"button",onClick:a,loading:b,className:t.direction==="vertical"?"w-full":"",children:t?.secondaryButton||""}):null,t?.primaryButton?s(fe,{disabled:y&&t?.primaryFun!=="LearnMore",variant:"primary",href:e?.custom_primary_link,as:e?.custom_primary_link?"a":"button",onClick:l,loading:pe,className:t.direction==="vertical"?"w-full":"",children:t?.primaryButton||""}):null]})]})]}),u={...W?{color:W}:{},...H?{backgroundColor:H,backgroundImage:"none"}:{},...W||H?{outline:"none"}:{}},g={...v?{color:v}:{},...Q?{backgroundColor:Q,backgroundImage:"none"}:{},...v||Q?{outlineColor:v}:{}},L=()=>f("div",{className:"lg-desktop:min-h-[28px] lg-desktop:flex-[28] box-border flex min-h-6 flex-[24] flex-wrap gap-1 overflow-hidden",children:[D&&ce&&s(Se,{className:"shelf-prices-tag",variant:"fill",style:u,children:ce||""}),O&&n?.length>0&&n?.map?.((i,p)=>s(Se,{className:"shelf-items-tag",variant:"outline",style:g,children:i},p))]}),h=e?.custom_bg_image,J=e?.custom_theme;return s("div",{ref:ne,className:w("box-border w-full cursor-pointer overflow-hidden duration-300","rounded-box","lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[545] desktop:aspect-w-[316] desktop:aspect-h-[450]","laptop:aspect-w-[288] laptop:aspect-h-[422] aspect-w-[296] aspect-h-[422] relative","md-tablet:h-[422px] shelf-display-item",h?"bg-cover bg-center bg-no-repeat":"bg-background tablet:hover:bg-info-white",{"aiui-dark":J==="dark","aiui-light":J==="light"}),style:h?{backgroundImage:`url(${h})`}:void 0,children:_?s("div",{className:"absolute inset-0 box-border overflow-hidden",children:f("div",{className:"relative inset-0 size-full",children:[s(L,{}),s(_e,{source:V,alt:ue,className:w("flex h-full justify-center object-cover [&_img]:w-auto",{"opacity-0":h})}),s("div",{className:"desktop:p-6 absolute inset-x-0 bottom-0 box-border overflow-hidden p-4",children:c()})]})}):f("div",{className:"desktop:p-6 desktop:pt-4 desktop:gap-2 absolute inset-0 box-border flex flex-col justify-between gap-1 overflow-hidden p-4",children:[s(L,{}),f("div",{className:w("shelf-display-item-image lg-desktop:flex-[240] relative inline-block w-full flex-[180] overflow-hidden",{"opacity-0":h}),children:[s("a",{"aria-label":G,target:t?.target,href:Pe(`${T==="us"||!T?"":`/${T}`}/products/${e?.handle}?variant=${N}`,`${ge}_${he}`),onClick:()=>{Be({event:"ga4Event",event_name:"select_item",event_parameters:{page_group:"Home Page",item_list_name:"Home_Page_Bundle",items:[{item_id:e?.sku||o?.sku,item_name:e?.name,item_variant:o?.name,price:o?.price,index:t?.index+1}]}})},children:s(_e,{source:V,alt:ue,className:"flex h-full justify-center object-cover [&_img]:w-auto"})}),s(Fe,{items:e?.socialEndorsements})]}),c()]})},e?.id||e?.handle)},Qe=({data:e,configuration:t})=>{const{itemShape:_,itemLength:E,metafields:K,isShowShortTitle:re,formatPrice:O,renderOriginalPrice:$,renderPriceLabel:ve,renderPrice:D}=t||{},{discounts:W,discountsCopy:H}=K||{},{locale:v="us",copyWriting:Q,currencyDisplay:ie}=Ne(),[X,be]=j([]),U=De(null),[T,oe]=j(!1),[Y,Z]=j(!1),le=(r,l,a,c)=>{const{primaryFun:u,onAddCart:g,onBuyNow:L,onLearnMore:h,event:J}=t||{};if(u){if(u==="AddCart"&&g)return g(r,l+1,a,c);if(u==="BuyNow"&&L)return L(r,l+1,a,c);if(u==="LearnMore"&&h)return h(r,l+1,a,c)}J?.primaryButton?.(r,l+1,a,c)},ne=(r,l,a,c)=>{const{secondaryFun:u,onAddCart:g,onBuyNow:L,onLearnMore:h,event:J}=t||{};if(u){if(u==="AddCart"&&g)return g(r,l+1,a,c);if(u==="BuyNow"&&L)return L(r,l+1,a,c);if(u==="LearnMore"&&h)return h(r,l+1,a,c)}J?.secondaryButton?.(r,l+1,a,c)},n=ye(()=>{const r=e?.variants||[];if(r.length)return e?.sku&&r.find(l=>l?.sku===e?.sku)||r[0]},[e?.sku,e?.variants]),ae=n?.id?.split?.("/")||[],ce=ae?.[ae?.length-1],I=!n?.availableForSale||n?.price?.amount===xe||n?.price===xe,pe=t?.isShowTag,z=t?.isShowOriginalPrice,b=n?.coupons?.[0],R=!!(z&&b),me=e?.price?.currencyCode||"USD",ke=ye(()=>Ce({locale:v,amount:R?b?.variant_price4wscode:n?.price,baseAmount:R?n?.price:0,currencyCode:me,currencyDisplay:ie,customFormatPrice:O}),[me,v,R,b?.variant_price4wscode,n,O]),{price:o,basePrice:A,discount:N,discountAmount:y}=ke,{imageUrl:k,altText:de}=ze(e),q=e?.custom_name||e?.title,F=re&&n?.metafields?.infos?.page_short_title||q,C=e?.custom_description||e?.description;$e(U,{componentType:ge,componentName:he,componentTitle:q,componentDescription:C,position:t?.index+1});const B=async()=>{if(!T&&!e?.custom_primary_link){oe(!0);try{await le(e,t?.index,t,b)}finally{oe(!1)}}},M=async()=>{if(!Y&&!e?.custom_secondary_link){Z(!0);try{await ne(e,t?.index,t,b)}finally{Z(!1)}}},V=()=>E>=2?{boxItem:"lg-desktop:max-w-[401px] desktop:max-w-[292px] max-w-full",imgItem:"m-tablet:m-auto lg-desktop:max-w-[330px] lg-desktop:max-h-[330px] desktop:max-w-[260px] desktop:max-h-[260px] max-w-[138px] max-h-[138px]",wrap:"lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[480] desktop:aspect-w-[648] desktop:aspect-h-[380] laptop:aspect-w-[440] laptop:aspect-h-[356] tablet:aspect-w-[346] tablet:aspect-h-[360] md-tablet:w-full"}:{boxItem:"lg-desktop:max-w-[401px] desktop:max-w-[292px] laptop:max-w-[289px] max-w-[262px]",imgItem:"md-tablet:m-auto lg-desktop:max-w-[450px] lg-desktop:max-h-[450px] desktop:max-w-[332px] desktop:max-h-[332px] max-w-[312px] max-h-[312px]",wrap:"lg-desktop:aspect-w-[1664] lg-desktop:aspect-h-[480] desktop:aspect-w-[1312] desktop:aspect-h-[380] laptop:aspect-w-[896] laptop:aspect-h-[356] tablet:aspect-w-[704] tablet:aspect-h-[360] md-tablet:w-full"},ue=()=>E>=2?"flex flex-col justify-between desktop:gap-12 desktop:flex-row desktop:justify-center desktop:items-center":"flex justify-center items-center gap-6 md-tablet:flex-col",G=()=>{if(b?.value_type==="fixed_amount"){const r=y||"",l=r.match(/^(.*?)(\d[\d.,]*)(.*)$/);if(l){const[,a,c,u]=l;let g=c;return c.endsWith(".00")?g=c.replace(/\.00$/,""):c.endsWith(",00")&&(g=c.replace(/,00$/,"")),`${a}${g}${u}`}return r}return N||""};Ie(()=>{let r=[];if(N||y){const a=`${G()} ${W?.off||H?.off||""}`;r.push(a)}const l=e?.tags?.filter?.(a=>a?.startsWith?.("CLtag"))?.map?.(a=>a?.replace?.("CLtag:",""))?.slice?.(0,N?1:2)||[];be(r.concat(l))},[e?.tags,N,y,W?.off,H?.off]);const P=e?.custom_bg_image,ee=e?.custom_theme;return s("div",{ref:U,className:w(V().wrap,"rounded-box","shelf-display-item","duration-300","md-tablet:h-[360px] relative box-border w-full cursor-pointer overflow-hidden",P?"bg-cover bg-center bg-no-repeat":"bg-container-secondary-1 tablet:hover:bg-info-white",{"aiui-dark":ee==="dark","aiui-light":ee==="light"}),style:P?{backgroundImage:`url(${P})`}:void 0,children:f("div",{className:w(ue(),"desktop:p-6 absolute inset-0 box-border overflow-hidden p-4"),children:[s("div",{className:w(V().imgItem,"desktop:mb-0 relative mb-1 overflow-hidden",{"opacity-0":P}),children:s("a",{"aria-label":q,target:t?.target,href:Pe(`${v==="us"||!v?"":`/${v}`}/products/${e?.handle}?variant=${ce}`,`${ge}_${he}`),onClick:()=>{Be({event:"ga4Event",event_name:"select_item",event_parameters:{page_group:"Home Page",item_list_name:"Home_Page_Bundle",items:[{item_id:e?.sku||n?.sku,item_name:e?.name,item_variant:n?.name,price:n?.price,index:t?.index+1}]}})},children:s(_e,{source:k,alt:de,className:"flex h-full justify-center object-cover [&_img]:w-auto"})})}),f("div",{className:w("flex flex-col items-start justify-center",V().boxItem),children:[pe&&s("div",{className:"mb-1 box-border flex h-8 flex-wrap gap-1 overflow-hidden",children:X?.length>0&&X?.map?.((r,l)=>s(Se,{className:"shelf-items-tag",variant:"fill",children:r},l))}),F?s(Le,{as:"h3",title:F||"",size:2,className:"shelf-display-product-title lg-desktop:h-[58px] text-info-primary mb-1 line-clamp-2 h-[48px]",html:F||""}):null,C?s(Te,{size:2,className:"lg-desktop:text-lg lg-desktop:h-[26px] desktop:text-base desktop:h-6 shelf-display-product-description text-info-primary line-clamp-1 h-5 text-sm",html:C||""}):null,s("div",{className:"mb-2 mt-5 flex items-center",children:D?D(e,{price:o,basePrice:A,discount:N,discountAmount:y,variant:n,coupon:b,isSoldOut:I,isShowOriginalPrice:z}):I?s("div",{className:"lg-desktop:text-2xl text-info-primary text-xl font-bold",children:Q?.soldOutText}):f(Ae,{children:[s("div",{className:"final-price tablet:text-xl text-info-primary text-xl font-bold",children:n?.availableForSale&&o||""}),$?$(e,{price:o,basePrice:A,discount:N,discountAmount:y,isShowOriginalPrice:z}):A&&s("div",{className:"origin-price tablet:text-xl text-info-quaternary ml-1 text-lg font-bold line-through",children:n?.availableForSale&&A||""})]})}),!D&&ve?.(e,n,{isShowOriginalPrice:z}),f("div",{className:w("shelf-flex-button-group","lg-desktop:gap-3 flex items-center gap-2",t.direction==="vertical"?"flex-col":""),children:[t?.secondaryButton&&!I?s(fe,{disabled:I&&t?.secondaryFun!=="LearnMore",variant:"secondary",href:e?.custom_secondary_link,as:e?.custom_secondary_link?"a":"button",onClick:M,loading:Y,className:t.direction==="vertical"?"w-full":"",children:t?.secondaryButton||""}):null,t?.primaryButton?s(fe,{disabled:I&&t?.primaryFun!=="LearnMore",variant:"primary",href:e?.custom_primary_link,as:e?.custom_primary_link?"a":"button",onClick:B,loading:T,className:t.direction==="vertical"?"w-full":"",children:t?.primaryButton||""}):null]})]})]})},e?.id||e?.handle)};export{Qe as ShelfDisplayHorizontalItem,Ke as ShelfDisplayWrapItem,ze as getProductImage};
package/dist/esm/components/dialog.js CHANGED
@@ -1 +1 @@
1
- "use client";import{jsx as o,jsxs as r}from"react/jsx-runtime";import*as s from"react";import*as t from"@radix-ui/react-dialog";import{cn as l}from"../helpers/index.js";const u=e=>o("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",...e,children:o("path",{d:"M5.63657 5.63618C6.02704 5.2456 6.66026 5.24565 7.05079 5.63618L12.0005 10.5859L16.9503 5.63618C17.3408 5.24565 17.974 5.2456 18.3645 5.63618C18.7549 6.02672 18.7549 6.65986 18.3645 7.05039L13.4147 12.0001L18.3645 16.9499C18.7549 17.3404 18.7549 17.9736 18.3645 18.3641C17.974 18.7547 17.3408 18.7546 16.9503 18.3641L12.0005 13.4144L7.05079 18.3641C6.66026 18.7546 6.02704 18.7547 5.63657 18.3641C5.24614 17.9736 5.24615 17.3404 5.63657 16.9499L10.5863 12.0001L5.63657 7.05039C5.24615 6.65986 5.24614 6.02672 5.63657 5.63618Z",fill:"#4A4C56"})}),d=t.Root;d.displayName="Dialog";const C=t.Trigger,c=t.Portal,R=t.Close,n=s.forwardRef(({className:e,...a},i)=>o(t.Overlay,{ref:i,className:l("data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-[1000] bg-black/80",e),...a}));n.displayName=t.Overlay.displayName;const m=s.forwardRef(({className:e,children:a,overlayClassName:i,...y},v)=>r(c,{children:[o(n,{className:i}),r(t.Content,{ref:v,className:l("bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] tablet:rounded-lg fixed left-1/2 top-1/2 z-[1001] grid w-full max-w-lg -translate-x-1/2 -translate-y-1/2 gap-4 border p-6 shadow-lg duration-200",e),...y,children:[a,r(t.Close,{className:"dialog-close-button ring-offset-background focus:ring-ring data-[state=open]:bg-accent data-[state=open]:text-muted-foreground absolute right-4 top-4 rounded-sm opacity-70 transition-opacity hover:opacity-100 disabled:pointer-events-none",children:[o(u,{className:"dialog-close-icon tablet:size-6 size-4"}),o("span",{className:"sr-only",children:"Close"})]})]})]}));m.displayName=t.Content.displayName;const p=({className:e,...a})=>o("div",{className:l("tablet:text-left flex flex-col space-y-1.5 text-center",e),...a});p.displayName="DialogHeader";const g=({className:e,...a})=>o("div",{className:l("tablet:flex-row tablet:justify-end tablet:space-x-2 flex flex-col-reverse",e),...a});g.displayName="DialogFooter";const f=s.forwardRef(({className:e,...a},i)=>o(t.Title,{ref:i,className:l("text-lg font-semibold leading-none tracking-tight",e),...a}));f.displayName=t.Title.displayName;const D=s.forwardRef(({className:e,...a},i)=>o(t.Description,{ref:i,className:l("text-muted-foreground text-sm",e),...a}));D.displayName=t.Description.displayName;export{d as Dialog,R as DialogClose,m as DialogContent,D as DialogDescription,g as DialogFooter,p as DialogHeader,n as DialogOverlay,c as DialogPortal,f as DialogTitle,C as DialogTrigger};
1
+ "use client";import{jsx as o,jsxs as r}from"react/jsx-runtime";import*as s from"react";import*as t from"@radix-ui/react-dialog";import{cn as l}from"../helpers/index.js";const u=e=>o("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",...e,children:o("path",{d:"M5.63657 5.63618C6.02704 5.2456 6.66026 5.24565 7.05079 5.63618L12.0005 10.5859L16.9503 5.63618C17.3408 5.24565 17.974 5.2456 18.3645 5.63618C18.7549 6.02672 18.7549 6.65986 18.3645 7.05039L13.4147 12.0001L18.3645 16.9499C18.7549 17.3404 18.7549 17.9736 18.3645 18.3641C17.974 18.7547 17.3408 18.7546 16.9503 18.3641L12.0005 13.4144L7.05079 18.3641C6.66026 18.7546 6.02704 18.7547 5.63657 18.3641C5.24614 17.9736 5.24615 17.3404 5.63657 16.9499L10.5863 12.0001L5.63657 7.05039C5.24615 6.65986 5.24614 6.02672 5.63657 5.63618Z",fill:"#4A4C56"})}),d=t.Root;d.displayName="Dialog";const C=t.Trigger,c=t.Portal,R=t.Close,n=s.forwardRef(({className:e,...a},i)=>o(t.Overlay,{ref:i,className:l("data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-[1000] bg-black/80",e),...a}));n.displayName=t.Overlay.displayName;const m=s.forwardRef(({className:e,children:a,overlayClassName:i,...y},v)=>r(c,{children:[o(n,{className:i}),r(t.Content,{ref:v,className:l("bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] tablet:rounded-lg fixed left-1/2 top-1/2 z-[1001] grid w-full max-w-lg -translate-x-1/2 -translate-y-1/2 gap-4 border p-6 shadow-lg duration-200",e),...y,children:[a,r(t.Close,{className:"dialog-close-button ring-offset-background focus:ring-ring data-[state=open]:bg-accent data-[state=open]:text-muted-foreground absolute right-4 top-4 rounded-sm opacity-70 transition-opacity hover:opacity-100 disabled:pointer-events-none",children:[o(u,{className:"dialog-close-icon tablet:size-6 size-5"}),o("span",{className:"sr-only",children:"Close"})]})]})]}));m.displayName=t.Content.displayName;const p=({className:e,...a})=>o("div",{className:l("tablet:text-left flex flex-col space-y-1.5 text-center",e),...a});p.displayName="DialogHeader";const g=({className:e,...a})=>o("div",{className:l("tablet:flex-row tablet:justify-end tablet:space-x-2 flex flex-col-reverse",e),...a});g.displayName="DialogFooter";const f=s.forwardRef(({className:e,...a},i)=>o(t.Title,{ref:i,className:l("text-lg font-semibold leading-none tracking-tight",e),...a}));f.displayName=t.Title.displayName;const D=s.forwardRef(({className:e,...a},i)=>o(t.Description,{ref:i,className:l("text-muted-foreground text-sm",e),...a}));D.displayName=t.Description.displayName;export{d as Dialog,R as DialogClose,m as DialogContent,D as DialogDescription,g as DialogFooter,p as DialogHeader,n as DialogOverlay,c as DialogPortal,f as DialogTitle,C as DialogTrigger};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@anker-in/headless-ui",
3
- "version": "1.3.68",
3
+ "version": "1.3.69",
4
4
  "type": "commonjs",
5
5
  "main": "./dist/cjs/index.js",
6
6
  "types": "./dist/cjs/index.d.ts",
package/style.css CHANGED
@@ -1168,6 +1168,9 @@ video {
1168
1168
  .block {
1169
1169
  display: block;
1170
1170
  }
1171
+ .\!inline-block {
1172
+ display: inline-block !important;
1173
+ }
1171
1174
  .inline-block {
1172
1175
  display: inline-block;
1173
1176
  }
@@ -1735,6 +1738,9 @@ video {
1735
1738
  .min-h-5 {
1736
1739
  min-height: 1.25rem;
1737
1740
  }
1741
+ .min-h-6 {
1742
+ min-height: 1.5rem;
1743
+ }
1738
1744
  .min-h-\[100px\] {
1739
1745
  min-height: 100px;
1740
1746
  }
@@ -8386,6 +8392,9 @@ video {
8386
8392
  .lg-desktop\:max-h-\[450px\] {
8387
8393
  max-height: 450px;
8388
8394
  }
8395
+ .lg-desktop\:min-h-\[28px\] {
8396
+ min-height: 28px;
8397
+ }
8389
8398
  .lg-desktop\:min-h-\[309px\] {
8390
8399
  min-height: 309px;
8391
8400
  }