"use strict";(self.webpackChunkR2U=self.webpackChunkR2U||[]).push([[428],{8305:function(e,t,o){o.r(t),o.d(t,{default:function(){return z}});var n=o(7294),r=o(3935),i=o(9361),a=o.n(i),u=o(2367),l=o(5060),c=o(3026),s=o(9163);const d=s.default.div`
  width: 100%;
  height: 100%;

  --r2u-viewer-background-color: transparent;
  --r2u-viewer-box-shadow: 0px 2px 12px #f2f2f2;

  .viewer-container {
    width: 100%;
    height: 100%;

    background-color: var(--r2u-viewer-background-color);
    /* box-shadow: var(--r2u-viewer-box-shadow); */

    & > div {
      opacity: 1 !important;
      width: 100%;
      height: 100%;

      .expand-button {
        padding: 12px;
        position: absolute;
        bottom: 5px;
        right: 5px;
        width: 24px;
        z-index: 999999;
        cursor: pointer;
        background: none !important;
        border: none !important;
        outline: none;
        transition: opacity 2s;
        img {
          transition: 0.5s ease;
          width: 24px;
          height: 24px;
          backface-visibility: hidden;
        }
      }

      .expand-image {
        position: absolute;
        right: 0px;
        bottom: 0px;
      }

      .bloomButton {
        padding: 8px;
        position: absolute;
        left: 16px;
        right: auto !important;
        top: 4px;
        z-index: 9999999;
        background: #f9f9f9;
        ${({bloom:e})=>e?s.css`
                box-shadow: inset -2px -2px 4px #ffffff,
                  inset 2px 2px 4px rgba(86, 86, 86, 0.25);
              `:s.css`
                box-shadow: -2px -2px 4px #ffffff,
                  2px 2px 4px rgba(86, 86, 86, 0.25);
              `}
        border-radius: 20px;
        margin: 0px 10px;
        outline: none;
        border: none;
        cursor: pointer;

        :hover {
          box-shadow: inset -2px -2px 4px #ffffff,
            inset 2px 2px 4px rgba(86, 86, 86, 0.25);
        }

        .lamp {
          width: 30px;
          height: 30px;
        }
      }

      .exit-button {
        width: 26px;
        height: auto;
        position: absolute;
        top: 0;
        right: 0;
        z-index: 99;
        margin: 12px;
        padding: 3px;

        cursor: pointer;
        background: none !important;
        border: none !important;
        outline: none;
        img {
          width: 100%;
        }
      }
    }

    canvas {
      min-height: 220px;
    }
  }

  .background {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9999999;
    background-color: rgba(0, 0, 0, 0.4);

    display: ${({expanded:e})=>e?"flex":"none"};
    justify-content: center;
    align-items: center;

    .popup {
      background-color: #fff;
      width: 60vw;
      height: 60vh;
      box-shadow: none;
    }
  }
`;var p=function(e,t){var o={};for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&t.indexOf(n)<0&&(o[n]=e[n]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var r=0;for(n=Object.getOwnPropertySymbols(e);r<n.length;r++)t.indexOf(n[r])<0&&Object.prototype.propertyIsEnumerable.call(e,n[r])&&(o[n[r]]=e[n[r]])}return o};var f=e=>{const{exitImgSrc:t="https://sdk.r2u.io/assets/exit-icon.png",expandImgSrc:o="https://sdk.r2u.io/assets/expand-icon.png",popup:r=!0,children:i=null,waterMarkPosition:a,refViewerPopup:u,ModelViewerElement:s,refViewerFunctions:f}=e,m=p(e,["exitImgSrc","expandImgSrc","popup","children","waterMarkPosition","refViewerPopup","ModelViewerElement","refViewerFunctions"]),[v,b]=(0,n.useState)(!1),g=()=>{b(!1)};(0,n.useEffect)((()=>{u&&u.current&&u.current.addEventListener("mousedown",(e=>(e.preventDefault(),e.stopPropagation(),e.stopImmediatePropagation(),!1)))}),[u]);const w=(0,n.useRef)(null),[h,x]=(0,n.useState)(!1);return n.createElement(d,{expanded:v,bloom:h},n.createElement("div",{className:"viewer-container"},m.glbSrc&&n.createElement(s,Object.assign({ref:f,componentDidMount:m.componentDidMount,onClick:m.onClick,onSessionTimeCollect:m.onSessionTimeCollect},m),i,r&&n.createElement("button",{className:"expand-button",type:"button",onClick:()=>{b(!0)}},n.createElement("img",{className:"expand-image",alt:"",src:o})),a&&n.createElement(l.Z,{position:a}))),r&&v&&n.createElement("div",{className:"background",onMouseDown:g},n.createElement("div",{className:"viewer-container popup"},m.glbSrc&&n.createElement(s,Object.assign({ref:w,componentDidMount:m.componentDidMount,onClick:m.onClick,onSessionTimeCollect:m.onSessionTimeCollect},m,{enableBloomButton:!1}),i,m.bloom&&n.createElement("button",{className:"bloomButton",type:"button",onMouseDown:e=>e.stopPropagation(),onClick:()=>{x(!h),w.current&&w.current.updateBloom(!h)}},h?n.createElement(c.cu,{className:"lamp"}):n.createElement(c.H_,{className:"lamp"})),n.createElement("button",{className:"exit-button",type:"button",onClick:g},n.createElement("img",{alt:"",src:t})),a&&n.createElement(l.Z,{position:a})))))},m=o(1841),v=o.n(m),b=o(7523),g=o(7374),w=o(2297),h=function(e,t,o,n){return new(o||(o=Promise))((function(r,i){function a(e){try{l(n.next(e))}catch(e){i(e)}}function u(e){try{l(n.throw(e))}catch(e){i(e)}}function l(e){var t;e.done?r(e.value):(t=e.value,t instanceof o?t:new o((function(e){e(t)}))).then(a,u)}l((n=n.apply(e,t||[])).next())}))};function x(e,t){return h(this,void 0,void 0,(function*(){const o=`/viewer-customization/customer/${u.Z.customer._id}/products/${e}?customization=${encodeURI(JSON.stringify(t))}`;return(yield(0,w.U2)(o))||{}}))}function y(e){return h(this,void 0,void 0,(function*(){const{status:t}=yield(0,w.U2)(`/job-status/${e}`);return["waiting","processing"].includes(t)?y(e):t}))}var E=o(5865);const S=({materialSlots:e,modelSlots:t})=>{e.sort(((e,t)=>e.slot>t.slot?1:e.slot<t.slot?-1:0)),t.sort(((e,t)=>e.slot>t.slot?1:e.slot<t.slot?-1:0)),t.forEach((e=>{S(e.activeModel)}))};var k=S;class C extends Error{constructor(e){super(e),this.name="ViewerError"}}var M=function(e,t,o,n){return new(o||(o=Promise))((function(r,i){function a(e){try{l(n.next(e))}catch(e){i(e)}}function u(e){try{l(n.throw(e))}catch(e){i(e)}}function l(e){var t;e.done?r(e.value):(t=e.value,t instanceof o?t:new o((function(e){e(t)}))).then(a,u)}l((n=n.apply(e,t||[])).next())}))};var z={create:({element:e,sku:t,name:o,popup:i=!0,progressBarPosition:l="top",progressBarColor:c,poster:s,autoRotate:d=!0})=>M(void 0,void 0,void 0,(function*(){if(!u.Z.init)return Promise.reject(new Error("R2U - Not initialized"));if(!t)return Promise.reject(new Error("R2U - Missing SKU"));const{glb:p,name:m,viewerOptions:S}=yield(0,b.Z)(t);let z=p;const P=u.Z.customer.waterMarkPosition,O=S||u.Z.customer.viewerOptions||void 0,N=(0,n.createRef)(),R=(0,n.createRef)(),j=(0,n.createRef)(),$=()=>M(void 0,void 0,void 0,(function*(){if(!j.current)throw new C("Viewer not completely loaded!");const e=j.current.getCurrentCustomization();if(!e)throw new C("No customization returned!");k(e);const o=yield x(t,e);if(!o.glb){const n=yield j.current.getCustomizedModel();if(!n)throw new C("Could not export the customization glb!");o.glb=yield function(e,t,o){return h(this,void 0,void 0,(function*(){const n=`/viewer-customization/customer/${u.Z.customer._id}/products/${e}/upload-customization-data?customization=${encodeURI(JSON.stringify(t))}`,r=yield(0,w.U2)(n),i=new File([o],r.filename),a=new FormData;return Object.keys(r.fields).forEach((e=>a.append(e,r.fields[e]))),a.append("file",i),yield fetch(r.url,{method:"POST",body:a}),r.url.concat(r.fields.key)}))}(t,e,n)}if(!o.usdz){const e=yield function(e,t){return h(this,void 0,void 0,(function*(){const o=`/viewer-customization/customers/${u.Z.customer._id}/products/${e}/convert`;return yield(0,w.v_)(o,{filename:t})}))}(t,o.glb.split("/").pop());if("success"!==(yield y(e.jobId)))throw new C("Error while converting to usdz!");o.usdz=e.usdz}return x(t,e),o}));return r.render(n.createElement(f,Object.assign({glbSrc:z,alt:o||m,autoRotate:d,poster:s,refViewer:N,refViewerPopup:R,refViewerFunctions:j,waterMarkPosition:P,progressBarPosition:l,progressBarColor:c,popup:i,componentDidMount:g.E9.componentDidMount,onClick:g.E9.onClick,onSessionTimeCollect:g.E9.onSessionTimeCollect,ModelViewerElement:v()},O)),e),{setSku:e=>M(void 0,void 0,void 0,(function*(){const{glb:t}=yield(0,b.Z)(e);(N.current||R.current)&&(z=t)})),insertModelNode:(...e)=>{var t;null===(t=j.current)||void 0===t||t.insertModelNode(...e)},insertSlotModelNode:(...e)=>M(void 0,void 0,void 0,(function*(){var t;yield null===(t=j.current)||void 0===t?void 0:t.insertSlotModelNode(...e)})),deleteModelNode:(...e)=>{var t;null===(t=j.current)||void 0===t||t.deleteModelNode(...e)},setMaterial:(...e)=>{var t;null===(t=j.current)||void 0===t||t.setMaterial(...e)},getAllSlotsMaterials:()=>{var e;return(null===(e=j.current)||void 0===e?void 0:e.getAllSlotsMaterials())||null},updateBloom:(...e)=>{var t;null===(t=j.current)||void 0===t||t.updateBloom(...e)},getAllSlotsModels:()=>{var e;return(null===(e=j.current)||void 0===e?void 0:e.getAllSlotsModels())||null},setModel:(...e)=>{var t;null===(t=j.current)||void 0===t||t.setModel(...e)},setCamera:(...e)=>{var t;null===(t=j.current)||void 0===t||t.setCamera(...e)},updateShadow:(...e)=>{var t;null===(t=j.current)||void 0===t||t.updateShadow(...e)},updateFog:(...e)=>{var t;null===(t=j.current)||void 0===t||t.updateFog(...e)},updateBloomProps:(...e)=>{var t;null===(t=j.current)||void 0===t||t.updateBloomProps(...e)},updateEnvironment:(...e)=>{var t;null===(t=j.current)||void 0===t||t.updateEnvironment(...e)},getCamera:()=>{var e;return(null===(e=j.current)||void 0===e?void 0:e.getCamera())||null},customization:{openAR:()=>M(void 0,void 0,void 0,(function*(){try{const e=yield $();return(0,E.activateAR)({glb:e.glb,usdz:e.usdz,mode:"ar_preferred"}),!0}catch(e){return console.error(`Error opening AR: ${e.message}`),!1}})),renderQRCode:e=>M(void 0,void 0,void 0,(function*(){try{const t=yield $(),o=`https://viewer.r2u.io/?glb=${encodeURIComponent(t.glb)}&usdz=${encodeURIComponent(t.usdz)}&autoOpen=1`;return r.render(n.createElement(a(),Object.assign({},{"data-url":o},{value:o,style:{width:"100%",height:"100%"},renderAs:"svg"})),e),!0}catch(e){return console.error(`Error generating QR Code: ${e.message}`),!1}}))},downloadGlb:(...e)=>{j.current&&j.current.downloadGlb(...e)}}}))}},5671:function(e,t,o){function n(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}o.d(t,{Z:function(){return n}})},3144:function(e,t,o){function n(e,t){for(var o=0;o<t.length;o++){var n=t[o];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}function r(e,t,o){return t&&n(e.prototype,t),o&&n(e,o),e}o.d(t,{Z:function(){return r}})},4942:function(e,t,o){function n(e,t,o){return t in e?Object.defineProperty(e,t,{value:o,enumerable:!0,configurable:!0,writable:!0}):e[t]=o,e}o.d(t,{Z:function(){return n}})},1002:function(e,t,o){function n(e){return n="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},n(e)}o.d(t,{Z:function(){return n}})}}]);