https://sparkly-axolotl-4651d9.netlify.app/_next/static/chunks/9779.9fcb10540384f1f4.js

1"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[9779,6558],{55998:function(n,t,r){r.d(t,{B:function(){return o}});var i=r(82729);function _templateObject(){var n=(0,i._)(["\n  position: absolute;\n  top: calc(50% - 27px) !important;\n  background: #fff !important;\n  opacity: 0.5 !important;\n  z-index: 2000;\n  width: 32px;\n  height: 32px;\n  display: flex !important;\n  justify-content: center;\n  align-items: center;\n  border-radius: 4px;\n  cursor: pointer;\n  &.control-prev {\n    left: 10px !important;\n    &:before {\n      border-right-color: #212121 !important;\n    }\n  }\n  &.control-next {\n    right: 10px !important;\n    &:before {\n      border-left-color: #212121 !important;\n    }\n  }\n"]);return _templateObject=function(){return n},n}var o=r(94589).ZP.div.withConfig({displayName:"styled__ArrowSlideWrapper",componentId:"Panoee__sc-aac30e82-0"})(_templateObject())},76558:function(n,t,r){r.r(t);var i=r(72253),o=r(14932),a=r(47702),l=r(85893),c=r(67294);function DangerouslySetHtmlContent(n){var t=n.html,r=(0,a._)(n,["html"]),s=(0,c.useRef)(null);return(0,c.useEffect)(function(){if(t){var n=document.createRange().createContextualFragment(t);s.current.innerHTML="",s.current.appendChild(n)}},[t]),(0,l.jsx)("div",(0,o._)((0,i._)({},r),{ref:s}))}t.default=DangerouslySetHtmlContent},12774:function(__unused_webpack_module,__webpack_exports__,__webpack_require__){__webpack_require__.d(__webpack_exports__,{s:function(){return loadScriptPaypal}});var process=__webpack_require__(83454);function loadAsync(n,t){var r=document.createElement("script");r.setAttribute("src",n),r.onload=t,document.head.insertBefore(r,document.head.firstElementChild)}var customPaymentSuccess=function(n){var t="return actions.order.capture().then(function(orderData) {\n  ",r="return actions.order.capture().then(function(orderData) {";return n.replace(r,t)},loadScriptPaypal=function(type,html){var regex=/<script\b[^>]*>([\s\S]*?)<\/script>/gm,scripts=html.match(regex),pureHtml=html;if("paypal"===type&&scripts&&2===scripts.length){var srcFirst=scripts[0].match(/src="(.*?)"/),src=(null==srcFirst?void 0:srcFirst.length)&&srcFirst.length>1?srcFirst[1]:"",func=scripts[1].replace(/<\/script>|<script>/g,"");func=customPaymentSuccess(func),scripts.forEach(function(n){pureHtml=pureHtml.replace(n,"")}),process.nextTick(function(){loadAsync(src,function(){eval(func)})})}return pureHtml}},49779:function(n,t,r){r.r(t),r.d(t,{DialogProduct:function(){return DialogProduct},default:function(){return C}});var i=r(91309),o=r(4586),a=r(85893),l=r(5152),c=r.n(l),s=r(67294),d=r(14047),u=r(76558),p=r(72253),m=r(14932),h=r(47702),f=r(55998),g=(0,s.memo)(function(n){var t=n.children,r=(0,h._)(n,["children"]);return(0,a.jsxs)(f.B,(0,m._)((0,p._)({},r),{className:"control-prev",children:[(0,a.jsx)("i",{"aria-hidden":!0,className:"fa fa-chevron-left"}),t]}))}),x=(0,s.memo)(function(n){var t=n.children,r=(0,h._)(n,["children"]);return(0,a.jsxs)(f.B,(0,m._)((0,p._)({},r),{className:"control-next",children:[(0,a.jsx)("i",{"aria-hidden":!0,className:"fa fa-chevron-right"}),t]}))}),v=r(82729),b=r(94589),y=r(72071);function _templateObject(){var n=(0,v._)(["\n      height: 100%;\n      /* height: 90vh;\n      max-height: 560px; */\n    "]);return _templateObject=function(){return n},n}function _templateObject1(){var n=(0,v._)(["\n  background: var(--color-popup-bg);\n  color: var(--color-popup-text);\n  ",";\n  align-items: flex-start;\n  width: 100%;\n  ","\n  .shopify {\n    &-embed {\n      width: 100%;\n      > div {\n        width: 100%;\n      }\n    }\n  }\n  .galleries {\n    width: 50%;\n    height: 100%;\n    background: #000;\n    position: relative;\n    display: flex;\n    flex-flow: column;\n    .image {\n      width: 100%;\n      height: 100%;\n      img {\n        width: unset !important;\n        height: unset;\n      }\n      .input-position {\n        height: 100%;\n        > div {\n          height: 100%;\n          > img {\n            width: 100% !important;\n            object-fit: contain;\n            height: 100%;\n          }\n        }\n      }\n    }\n    .preview {\n      width: 100%;\n      display: flex;\n      flex: 0 0 auto;\n      margin: 12px 0;\n      padding: 0 0.75rem;\n      justify-content: center;\n      &-item {\n        cursor: pointer;\n        position: relative;\n        overflow: hidden;\n        width: 54px;\n        height: 54px;\n        border-radius: 2px;\n        background-repeat: no-repeat;\n        background-position: center;\n        background-size: cover;\n        border: 2px solid #000;\n        box-shadow: 0 0 0 1px rgb(255 255 255 / 0.25);\n        @media (hover: hover) and (pointer: fine) {\n          &:hover {\n            box-shadow: 0 0 0 1px rgb(255 255 255 / 0.5);\n          }\n          &.active {\n            box-shadow: 0 0 0 1px rgb(255 255 255);\n          }\n        }\n        &:not(:last-child) {\n          margin-right: 12px;\n        }\n        &.more {\n          .overlay {\n            position: absolute;\n            ",";\n            top: 0px;\n            left: 0px;\n            width: 100%;\n            height: 100%;\n            color: var(--color-popup-text);\n            font-size: 11px;\n            text-align: center;\n            z-index: 2;\n            background-color: rgba(0, 0, 0, 0.7);\n          }\n        }\n      }\n    }\n  }\n  .content {\n    width: 50%;\n    height: 100%;\n    flex: 0 0 auto;\n    display: flex;\n    flex-direction: column;\n    justify-content: flex-end;\n    padding: 24px;\n    .--top {\n      border-bottom: 1px solid #dddddd4d;\n      padding-bottom: 1rem;\n    }\n    .title {\n      font-weight: 700;\n      color: var(--color-popup-text);\n      margin-bottom: 0.5rem;\n      line-height: 120%;\n    }\n    .price {\n      font-size: 16px;\n      color: var(--color-popup-text);\n    }\n    .description {\n      padding-top: 1rem;\n      flex: 1;\n      overflow: auto;\n    }\n    .action {\n      margin-top: 24px;\n      * {\n        color: var(--color-icon) !important;\n      }\n      img {\n        width: unset !important;\n        height: unset;\n      }\n\n      .btn {\n        position: relative;\n        width: 100%;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        background: #2ec26a;\n        transition: all 0.15s ease-out;\n        cursor: pointer;\n        border-radius: 4px;\n        padding: 12px;\n      }\n    }\n  }\n  @media (max-width: 575px) {\n    flex-flow: column;\n    height: auto;\n    max-height: initial;\n    .galleries {\n      width: 100%;\n      .image {\n        height: 320px;\n      }\n    }\n    .content {\n      width: 100%;\n    }\n  }\n"]);

1return _templateObject1=function(){return n},n}var _=b.ZP.div.withConfig({displayName:"styled__DialogHotspotProductWrapper",componentId:"Panoee__sc-563086ea-0"})(_templateObject1(),y.ep,function(n){return!n.isHeightAuto&&(0,b.iv)(_templateObject())},y.b0),j=r(12774),w=c()(function(){return Promise.all([r.e(5400),r.e(1130),r.e(3879),r.e(3582)]).then(r.bind(r,51700))},{loadableGenerated:{webpack:function(){return[51700]}}}),k=c()(function(){return Promise.all([r.e(9206),r.e(1921)]).then(r.bind(r,58405))},{loadableGenerated:{webpack:function(){return[58405]}}}),DialogProduct=function(n){var t,r,l=n.visible,c=n.onCancel,p=n.product,m=(0,i._)((0,s.useState)(void 0),2),h=m[0],f=m[1],v=(0,i._)((0,s.useState)(0),2),b=v[0],y=v[1],C=(0,i._)((0,s.useState)(!1),2),N=C[0],P=C[1],S=(0,s.useMemo)(function(){return p.gallery.findIndex(function(n){return n.id===(null==h?void 0:h.id)})},[null==h?void 0:h.id,p.gallery]),O=(0,s.useMemo)(function(){return(0,j.s)(p.buttonType,p.button||"")},[p.button,p.buttonType]),T=(0,s.useMemo)(function(){if(p.gallery.length>4){var n=(0,o._)(p.gallery);return n.length=4,n}return p.gallery},[p.gallery]),D=(0,s.useMemo)(function(){return p.gallery.length>4?{item:p.gallery[4],rest:p.gallery.length-4}:{item:void 0,rest:p.gallery.length-4}},[p.gallery]);(0,s.useEffect)(function(){!h&&p.gallery.length&&f(p.gallery[0])},[p]);var I=(0,s.useCallback)(function(n){f(n)},[]),A=(0,s.useCallback)(function(n){var t=arguments.length>1&&void 0!==arguments[1]&&arguments[1],r=4;t||(r=S),y(r),P(!0)},[S]),E=(0,s.useCallback)(function(){return P(!1)},[]),H=(0,s.useCallback)(function(){var n=0===S?p.gallery.length-1:S-1;f(p.gallery[n])},[S,p.gallery]),z=(0,s.useCallback)(function(){var n=S+1===p.gallery.length?0:S+1;f(p.gallery[n])},[S,p.gallery]);return(0,a.jsxs)(w,{visible:l,onCancel:c,maskClosable:!0,centered:!0,width:"800px",bodyStyle:{maxWidth:"800px",width:"100%"},children:["shopify"===p.buttonType&&p.button?(0,a.jsx)(_,{isHeightAuto:!0,children:(0,a.jsx)(u.default,{className:"shopify-embed",html:O})}):(0,a.jsxs)(_,{children:[(0,a.jsxs)("div",{className:"galleries",children:[(0,a.jsxs)("div",{className:"image",onClick:A,children:[(0,a.jsx)(d.Q7,{className:"input-position",style:{order:"1"},imageSrc:(null==h?void 0:h.src)||"https://dummyimage.com/300x300/000/fff.png",largeImageSrc:(null==h?void 0:h.src)||"https://dummyimage.com/300x300/000/fff.png",alwaysInPlace:!0,overlayOpacity:.25,switchSides:!0,zoomPosition:"right",fillAlignTop:!0,fillGapTop:10,fillGapRight:10,fillGapBottom:10,fillGapLeft:10}),(0,a.jsx)(g,{onClick:function(n){n.stopPropagation(),H()}}),(0,a.jsx)(x,{onClick:function(n){z(),n.stopPropagation()}})]}),(0,a.jsxs)("div",{className:"preview",children:[null==T?void 0:T.map(function(n){return(0,a.jsx)("div",{className:"preview-item ".concat(n.id===(null==h?void 0:h.id)?"active":""),style:{backgroundImage:"url('".concat((null==n?void 0:n.src_thumb)||(null==n?void 0:n.src)||"https://dummyimage.com/300x300/000/fff.png","')")},onClick:function(){return I(n)}},n.id)}),D.rest>0&&(0,a.jsx)("div",{className:"preview-item more",style:{backgroundImage:"url('".concat((null===(t=D.item)||void 0===t?void 0:t.src_thumb)||(null===(r=D.item)||void 0===r?void 0:r.src)||"https://dummyimage.com/300x300/000/fff.png","')")},onClick:function(){return A(!0)},children:(0,a.jsxs)("div",{className:"overlay",children:["+",null==D?void 0:D.rest," more images"]})})]})]}),(0,a.jsxs)("div",{className:"content",children:[(0,a.jsxs)("div",{className:"--top",children:[(0,a.jsx)("h1",{className:"title",children:p.name}),(0,a.jsxs)("div",{className:"price",children:[p.price," ",p.currency||""]})]}),(0,a.jsx)("div",{className:"--center description ctn__html sun-editor sun-editor-editable hide-scrollbar",children:(0,a.jsx)("div",{dangerouslySetInnerHTML:{__html:p.description||""}})}),(0,a.jsx)("div",{className:"--bottom action",children:"link"===p.buttonType?(0,a.jsx)("a",{className:"btn",target:"_blank",href:p.button,rel:"noreferrer",style:{backgroundColor:p.buttonColor||"#2ec26a"},children:p.buttonText||"Checkout"}):(0,a.jsx)(u.default,{className:"article",html:O})})]})]}),N&&(0,a.jsx)(k,{galleries:p.gallery||[],startIndex:b,onClose:E})]})},C=(0,s.memo)(DialogProduct)}}]);
2//# sourceMappingURL=9779.9fcb10540384f1f4.js.map