@solumflow-app/product-configurator 0.1.0 → 0.2.0

package/dist/model-part-CGYO323N.js

@@ -0,0 +1 @@
+import {d,c,b,f}from'./chunk-QLPSL2DY.js';import'./chunk-RNTBO6KY.js';import {useRef,useMemo,useLayoutEffect}from'react';import {useLoader,useThree,useFrame}from'@react-three/fiber';import*as l from'three';import {MeshoptDecoder}from'three/examples/jsm/libs/meshopt_decoder.module.js';import {GLTFLoader}from'three/examples/jsm/loaders/GLTFLoader.js';import {jsx}from'react/jsx-runtime';function G(s){return s===1?"stretch":s===2?"actual":"contain"}function P(s){let{frame:n,bounds:o,fit:a}=s;if(a==="actual")return {scale:[1,1,1],centre:[(o.min[0]+o.max[0])/2,o.min[1]+n[1]/2,o.max[2]-n[2]/2]};let m=[0,1,2].map(e=>o.max[e]-o.min[e]),p=[0,1,2].map(e=>{let d=m[e],u=n[e];return d>0&&u>0?u/d:null}),b=p.filter(e=>e!==null),c=b.length>0?Math.min(...b):1,i=[0,1,2].map(e=>a==="stretch"?p[e]??c:c),f=[0,1,2].map(e=>(o.min[e]+o.max[e])/2);return {scale:i,centre:f}}var J=.05,K=1e-4;function Q(s){s.setMeshoptDecoder(MeshoptDecoder);}function U(s){let{part:n,material:o}=s,a=useLoader(GLTFLoader,n.model,Q),m=useRef(null),p=useRef(new l.Vector3),b$1=useRef(new l.Vector3),c$1=useRef(false),i=useThree(r=>r.invalidate),f$1=n.params.paint===1,e=useMemo(()=>{let r=new l.Box3().setFromObject(a.scene);return {min:r.min.toArray(),max:r.max.toArray()}},[a.scene]),d$1=useMemo(()=>{let r=a.scene.clone(true);return r.traverse(F=>{let t=F;t.isMesh&&(f$1?t.material=o:d(t.material),t.castShadow=c(t.material),t.receiveShadow=true);}),r},[a.scene,f$1,o]),u=P({frame:[b(n.size[0]),b(n.size[1]),b(n.size[2])],bounds:e,fit:G(n.params.fit)}),[M,T,x]=f(n),[y,w,g]=u.scale,[_,j,N]=u.centre;return useLayoutEffect(()=>{let r=m.current;r&&!c$1.current&&(r.position.set(M,T,x),r.scale.set(y,w,g),c$1.current=true),i();},[M,T,x,y,w,g,i]),useFrame((r,F)=>{let t=m.current;if(!t)return;let H=1-Math.exp(-F/J),R=p.current.set(M,T,x),S=b$1.current.set(y,w,g),L=Math.max(t.position.distanceTo(R),t.scale.distanceTo(S));if(L<K){L>0&&(t.position.copy(R),t.scale.copy(S));return}t.position.lerp(R,H),t.scale.lerp(S,H),i();}),jsx("group",{ref:m,children:jsx("primitive",{object:d$1,position:[-_,-j,-N]})})}export{U as default};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@solumflow-app/product-configurator",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "description": "Show a product's 3D configurator on your own website and send what a visitor put together back as a request or an order.",
   "license": "MIT",
   "files": [
@@ -41,7 +41,7 @@
     "@react-three/fiber": ">=9 <10",
     "react": ">=19 <19.4",
     "react-dom": ">=19 <19.4",
-    "three": ">=0.159"
+    "three": ">=0.163"
   },
   "engines": {
     "node": ">=20"

package/dist/chunk-QVDJ45QE.js

@@ -1 +0,0 @@
-var s=Object.defineProperty;var i=(t,e)=>{for(var n in e)s(t,n,{get:e[n],enumerable:true});};function c(t){let e=t.material,n=e?.roughness??.7,r=e?.metalness??0,o=e?.emissive===true,a=e?.opacity??1;return {color:t.color,roughness:n,metalness:r,emissive:o,transparent:a<1,opacity:a,texture:e?.texture??null,textureSize:e?.textureSize??1e3}}function l(t){let[e,n]=t.size,r=Math.min(Math.max(t.params.niche_x??0,0),e),o=Math.min(Math.max(t.params.niche_y??0,0),n);return {x:r,y:o,width:Math.min(Math.max(t.params.niche_width??0,0),e-r),height:Math.min(Math.max(t.params.niche_height??0,0),n-o)}}export{i as a,l as b,c};

package/dist/configurator-scene-JY66JQRL.js

@@ -1 +0,0 @@
-import {c,b}from'./chunk-QVDJ45QE.js';import {useState,useRef,useLayoutEffect,useMemo,useEffect}from'react';import {ContactShadows,OrbitControls}from'@react-three/drei';import {Canvas,useThree,useFrame}from'@react-three/fiber';import*as h from'three';import {jsxs,jsx,Fragment}from'react/jsx-runtime';var v=1/1e3,g=32;function m(t){return t*v}function Q(t){t.computeBoundingBox();let e=t.boundingBox?.getCenter(new h.Vector3);return e&&t.translate(-e.x,-e.y,-e.z),t.computeBoundingBox(),t}function $(t){let e=t.getAttribute("position"),s=t.getAttribute("normal");if(!e||!s)return t;let n=new Float32Array(e.count*2);for(let o=0;o<e.count;o+=1){let a=Math.abs(s.getX(o)),r=Math.abs(s.getY(o)),i=Math.abs(s.getZ(o));a>=r&&a>=i?(n[o*2]=e.getZ(o),n[o*2+1]=e.getY(o)):r>=i?(n[o*2]=e.getX(o),n[o*2+1]=e.getZ(o)):(n[o*2]=e.getX(o),n[o*2+1]=e.getY(o));}return t.setAttribute("uv",new h.BufferAttribute(n,2)),t}function E(t){return $(Q(t))}function x(t){return {depth:t,bevelEnabled:false,curveSegments:g,steps:1}}var O=35,ee=1.5,R=Math.PI/180;function _(t){let{bounds:e,azimuth:s=0,elevation:n=10,aspect:o=ee}=t,a=f=>(e.min[f]+e.max[f])/2*v,r=f=>(e.max[f]-e.min[f])*v,i=[a(0),a(1),a(2)],c=Math.max(Math.hypot(r(0),r(1),r(2))/2,.1),l=O*R/2,y=Math.atan(Math.tan(l)*o),p=c/Math.sin(Math.min(l,y)),u=[i[0]+p*Math.sin(s*R)*Math.cos(n*R),i[1]+p*Math.sin(n*R),i[2]+p*Math.cos(s*R)*Math.cos(n*R)];return {target:i,position:u,radius:c,distance:p}}function te(t){let[e,,s]=t.size,n=Math.max(0,Math.min(t.params.thickness??0,e,s));return {width:e,depth:s,thickness:n,mirrored:(t.params.mirror??0)>=.5}}function re(t){let{width:e,depth:s,thickness:n,mirrored:o}=te(t),a=[];for(let r=0;r<=g;r+=1){let i=r/g*(Math.PI/2);a.push([e*Math.cos(i),s*Math.sin(i)]);}for(let r=g;r>=0;r-=1){let i=r/g*(Math.PI/2);a.push([(e-n)*Math.cos(i),(s-n)*Math.sin(i)]);}return a.map(([r,i])=>[o?e-r:r,i])}function k(t){let[,e]=t.size,s=new h.Shape(re(t).map(([o,a])=>new h.Vector2(m(o),m(a)))),n=new h.ExtrudeGeometry(s,x(m(e)));return n.rotateX(Math.PI/2),E(n)}function j(t){let[e,s,n]=t.size;return E(new h.BoxGeometry(m(e),m(s),m(n)))}function X(t){let[e,s,n]=t.size;return E(new h.BoxGeometry(m(e),m(s),m(n)))}function Y(t){let[e,s,n]=t.size,o=b(t),a=new h.Shape;if(a.moveTo(0,0),a.lineTo(m(e),0),a.lineTo(m(e),m(s)),a.lineTo(0,m(s)),a.closePath(),o.width>0&&o.height>0){let r=new h.Path;r.moveTo(m(o.x),m(o.y)),r.lineTo(m(o.x+o.width),m(o.y)),r.lineTo(m(o.x+o.width),m(o.y+o.height)),r.lineTo(m(o.x),m(o.y+o.height)),r.closePath(),a.holes.push(r);}return E(new h.ExtrudeGeometry(a,x(m(n))))}function oe(t){let[,e,s]=t.size,n=Math.max(0,Math.min(t.params.radius??0,e,s));return {depth:s,height:e,radius:n}}function J(t){let[e]=t.size,{depth:s,height:n,radius:o}=oe(t),a=m(s),r=m(n),i=m(o),c=new h.Shape;c.moveTo(0,0),c.lineTo(a,0),c.lineTo(a,r-i),i>0&&c.absarc(a-i,r-i,i,0,Math.PI/2,false),c.lineTo(0,r),c.closePath();let l=new h.ExtrudeGeometry(c,x(m(e)));return l.rotateY(-Math.PI/2),E(l)}function ne(t){let[e,s]=t.size;return Math.min(e,s)/2}function W(t){let[e,s,n]=t.size,o=m(e),a=m(s),r=m(ne(t)),i=new h.Shape;return i.moveTo(r,0),i.lineTo(o-r,0),i.absarc(o-r,r,r,-Math.PI/2,0,false),i.lineTo(o,a-r),i.absarc(o-r,a-r,r,0,Math.PI/2,false),i.lineTo(r,a),i.absarc(r,a-r,r,Math.PI/2,Math.PI,false),i.lineTo(0,r),i.absarc(r,r,r,Math.PI,3*Math.PI/2,false),E(new h.ExtrudeGeometry(i,x(m(n))))}var ae={box:j,rounded_top_box:J,stadium_prism:W,arc_panel:k,led_strip:X,niche_panel:Y};function Z(t){return ae[t.type](t)}function K(t){return [m(t.at[0]+t.size[0]/2),m(t.at[1]+t.size[1]/2),m(t.at[2]+t.size[2]/2)]}var ue=.05,le=1e-4;function Ke(t){let{geometry:e,slots:s,camera:n,interactive:o=true,className:a}=t,r=useState(()=>_({bounds:e.bounds,azimuth:n?.azimuth,elevation:n?.elevation}))[0],i=e.bounds.min[1]/1e3-.001;return jsxs(Canvas,{className:a,frameloop:"demand",dpr:[1,2],camera:{fov:O,position:r.position,near:.05,far:100},gl:{antialias:true,alpha:true},children:[jsx("hemisphereLight",{args:["#ffffff","#8a857c",1.1]}),jsx("directionalLight",{position:[3,5,4],intensity:1.6}),jsx("directionalLight",{position:[-4,2,3],intensity:.5}),jsx(de,{parts:e.parts,slots:s}),jsx(ContactShadows,{position:[r.target[0],i,r.target[2]],opacity:.45,scale:Math.max(r.radius*4,2),blur:2.4,far:1.5}),jsx(fe,{geometry:e,camera:n,interactive:o})]})}function fe(t){let{geometry:e,camera:s,interactive:n}=t,{camera:o,invalidate:a}=useThree(),r=useRef(null),i=useRef(null),c=_({bounds:e.bounds,azimuth:s?.azimuth,elevation:s?.elevation}),[l,y,p]=c.target,{radius:u}=c;return useLayoutEffect(()=>{let f=new h.Vector3(l,y,p),d=i.current;if(d){let G=o.position.clone().sub(d.target);G.multiplyScalar(u/d.radius),o.position.copy(f).add(G);}r.current?.target.copy(f),r.current?.update(),o.lookAt(f),i.current={target:f,radius:u},a();},[l,y,p,u,o,a]),jsx(OrbitControls,{ref:r,makeDefault:true,enabled:n,enablePan:false,minDistance:u*.8,maxDistance:u*8,maxPolarAngle:Math.PI/2+.05})}function de(t){let e=Ee(t.slots);return jsx(Fragment,{children:t.parts.map(s=>{let n=e[s.slot];return n?jsx(he,{part:s,material:n},s.key):null})})}function he(t){let{part:e,material:s}=t,n=useRef(null),o=useRef(false),a=useRef(e.size),r=useThree(u=>u.invalidate),[i,c,l]=K(e),y=JSON.stringify(e.params),p=useMemo(()=>Z(e),[e.type,e.size[0],e.size[1],e.size[2],y]);return useEffect(()=>()=>p.dispose(),[p]),useLayoutEffect(()=>{let u=n.current;if(u){if(!o.current)u.position.set(i,c,l),o.current=true;else {let f=a.current,d=u.scale;d.set(d.x*A(f[0],e.size[0]),d.y*A(f[1],e.size[1]),d.z*A(f[2],e.size[2]));}a.current=e.size,r();}},[p,e.size,i,c,l,r]),useFrame((u,f)=>{let d=n.current;if(!d)return;let G=1-Math.exp(-f/ue),w=new h.Vector3(i,c,l),C=new h.Vector3(1,1,1),D=Math.max(d.position.distanceTo(w),d.scale.distanceTo(C));if(D<le){D>0&&(d.position.copy(w),d.scale.copy(C));return}d.position.lerp(w,G),d.scale.lerp(C,G),r();}),jsx("mesh",{ref:n,geometry:p,material:s})}function A(t,e){return t>0&&e>0?t/e:1}function Ee(t){let e=useThree(a=>a.invalidate),s=JSON.stringify(Object.entries(t).map(([a,r])=>[a,c(r)])),n=useMemo(()=>JSON.parse(s),[s]),o=useMemo(()=>Object.fromEntries(n.map(([a,r])=>[a,ye(r)])),[n]);return useEffect(()=>{let a=new h.TextureLoader;a.setCrossOrigin("anonymous");let r=false,i=[];for(let[c,l]of n){let y=o[c];!l.texture||!y||a.load(l.texture,p=>{if(r){p.dispose();return}p.colorSpace=h.SRGBColorSpace,p.wrapS=h.RepeatWrapping,p.wrapT=h.RepeatWrapping;let u=1e3/l.textureSize;p.repeat.set(u,u),y.map=p,y.color.set("#ffffff"),y.needsUpdate=true,i.push(p),e();},void 0,()=>{});}return ()=>{r=true;for(let c of i)c.dispose();}},[n,o,e]),useEffect(()=>()=>{for(let a of Object.values(o))a.dispose();},[o]),o}function ye(t){let e=new h.MeshStandardMaterial({color:t.color,roughness:t.roughness,metalness:t.metalness});return t.emissive&&(e.emissive.set(t.color),e.emissiveIntensity=1.4),t.transparent&&(e.transparent=true,e.opacity=t.opacity,e.depthWrite=false),e}export{Ke as ConfiguratorScene};