@wise/art 2.5.0 → 2.6.0-beta.2

package/README.md

@@ -20,7 +20,6 @@ This package relies on following peer dependencies:
 
 - `react`
 - `react-dom`
-- `classnames`
 
 ## Illustrations
 

package/dist/CheckMark-1d199954.js

@@ -0,0 +1,39 @@
+'use strict';
+
+var drei = require('@react-three/drei');
+var fiber = require('@react-three/fiber');
+var react = require('react');
+var three = require('three');
+var index = require('./index-322e874c.js');
+var jsxRuntime = require('react/jsx-runtime');
+require('clsx');
+
+const CheckMark = () => {
+  const modelRef = react.useRef();
+  const model = drei.useGLTF(index.defineSrc('check-mark.gltf'));
+  const {
+    animations,
+    scene
+  } = model;
+  const lights = fiber.useLoader(three.ObjectLoader, index.defineSrc('check-mark-light.json'));
+  const {
+    mixer,
+    clips
+  } = drei.useAnimations(animations, modelRef);
+  fiber.useFrame(() => {
+    model.materials['Standard'].map.offset.x += -0.0025;
+    mixer.clipAction(clips[0]).play().setLoop(three.LoopOnce, 1);
+  });
+  return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
+    children: [/*#__PURE__*/jsxRuntime.jsx("primitive", {
+      ref: modelRef,
+      scale: 1.4,
+      object: scene
+    }), /*#__PURE__*/jsxRuntime.jsx("primitive", {
+      object: lights
+    })]
+  });
+};
+
+exports.default = CheckMark;
+//# sourceMappingURL=CheckMark-1d199954.js.map

package/dist/CheckMark-1d199954.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CheckMark-1d199954.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/CheckMark-dfa7e17d.js

@@ -0,0 +1,37 @@
+import { useGLTF, useAnimations } from '@react-three/drei';
+import { useLoader, useFrame } from '@react-three/fiber';
+import { useRef } from 'react';
+import { ObjectLoader, LoopOnce } from 'three';
+import { d as defineSrc } from './index-3bf9c1e9.js';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import 'clsx';
+
+const CheckMark = () => {
+  const modelRef = useRef();
+  const model = useGLTF(defineSrc('check-mark.gltf'));
+  const {
+    animations,
+    scene
+  } = model;
+  const lights = useLoader(ObjectLoader, defineSrc('check-mark-light.json'));
+  const {
+    mixer,
+    clips
+  } = useAnimations(animations, modelRef);
+  useFrame(() => {
+    model.materials['Standard'].map.offset.x += -0.0025;
+    mixer.clipAction(clips[0]).play().setLoop(LoopOnce, 1);
+  });
+  return /*#__PURE__*/jsxs(Fragment, {
+    children: [/*#__PURE__*/jsx("primitive", {
+      ref: modelRef,
+      scale: 1.4,
+      object: scene
+    }), /*#__PURE__*/jsx("primitive", {
+      object: lights
+    })]
+  });
+};
+
+export { CheckMark as default };
+//# sourceMappingURL=CheckMark-dfa7e17d.js.map

package/dist/CheckMark-dfa7e17d.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CheckMark-dfa7e17d.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/Confetti-3f6f42f8.js

@@ -0,0 +1,36 @@
+'use strict';
+
+var drei = require('@react-three/drei');
+var fiber = require('@react-three/fiber');
+var react = require('react');
+var three = require('three');
+var index = require('./index-322e874c.js');
+var jsxRuntime = require('react/jsx-runtime');
+require('clsx');
+
+const Confetti = () => {
+  const ref = react.useRef();
+  const model = drei.useGLTF(index.defineSrc('confetti.gltf'));
+  const lights = fiber.useLoader(three.ObjectLoader, index.defineSrc('confetti-light.json'));
+  const {
+    mixer,
+    clips
+  } = drei.useAnimations(model.animations, ref);
+  fiber.useFrame(() => {
+    model.materials['Tapestry WebGL'].map.offset.x += -0.0015;
+    mixer.clipAction(clips[0]).play().setLoop(three.LoopOnce, 1);
+  });
+  return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
+    children: [/*#__PURE__*/jsxRuntime.jsx("primitive", {
+      ref: ref,
+      scale: 1.5,
+      position: [0, 1.5, 0],
+      object: model.scene
+    }), /*#__PURE__*/jsxRuntime.jsx("primitive", {
+      object: lights
+    })]
+  });
+};
+
+exports.default = Confetti;
+//# sourceMappingURL=Confetti-3f6f42f8.js.map

package/dist/Confetti-3f6f42f8.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Confetti-3f6f42f8.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/Confetti-a1500ca5.js

@@ -0,0 +1,34 @@
+import { useGLTF, useAnimations } from '@react-three/drei';
+import { useLoader, useFrame } from '@react-three/fiber';
+import { useRef } from 'react';
+import { ObjectLoader, LoopOnce } from 'three';
+import { d as defineSrc } from './index-3bf9c1e9.js';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import 'clsx';
+
+const Confetti = () => {
+  const ref = useRef();
+  const model = useGLTF(defineSrc('confetti.gltf'));
+  const lights = useLoader(ObjectLoader, defineSrc('confetti-light.json'));
+  const {
+    mixer,
+    clips
+  } = useAnimations(model.animations, ref);
+  useFrame(() => {
+    model.materials['Tapestry WebGL'].map.offset.x += -0.0015;
+    mixer.clipAction(clips[0]).play().setLoop(LoopOnce, 1);
+  });
+  return /*#__PURE__*/jsxs(Fragment, {
+    children: [/*#__PURE__*/jsx("primitive", {
+      ref: ref,
+      scale: 1.5,
+      position: [0, 1.5, 0],
+      object: model.scene
+    }), /*#__PURE__*/jsx("primitive", {
+      object: lights
+    })]
+  });
+};
+
+export { Confetti as default };
+//# sourceMappingURL=Confetti-a1500ca5.js.map

package/dist/Confetti-a1500ca5.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Confetti-a1500ca5.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/Flower-01a6ad2e.js

@@ -0,0 +1,27 @@
+import { useGLTF } from '@react-three/drei';
+import { useLoader, useFrame } from '@react-three/fiber';
+import 'react';
+import { ObjectLoader } from 'three';
+import { d as defineSrc } from './index-3bf9c1e9.js';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import 'clsx';
+
+const Flower = () => {
+  const model = useGLTF(defineSrc('flower.gltf'));
+  const lights = useLoader(ObjectLoader, defineSrc('flower-light.json'));
+  useFrame(() => {
+    model.materials['Tapestry WebGL'].map.offset.x += -0.001;
+  });
+  return /*#__PURE__*/jsxs(Fragment, {
+    children: [/*#__PURE__*/jsx("primitive", {
+      scale: 1.3,
+      position: [0, -9, 0],
+      object: model.scene
+    }), /*#__PURE__*/jsx("primitive", {
+      object: lights
+    })]
+  });
+};
+
+export { Flower as default };
+//# sourceMappingURL=Flower-01a6ad2e.js.map

package/dist/Flower-01a6ad2e.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Flower-01a6ad2e.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/Flower-194046f6.js

@@ -0,0 +1,29 @@
+'use strict';
+
+var drei = require('@react-three/drei');
+var fiber = require('@react-three/fiber');
+require('react');
+var three = require('three');
+var index = require('./index-322e874c.js');
+var jsxRuntime = require('react/jsx-runtime');
+require('clsx');
+
+const Flower = () => {
+  const model = drei.useGLTF(index.defineSrc('flower.gltf'));
+  const lights = fiber.useLoader(three.ObjectLoader, index.defineSrc('flower-light.json'));
+  fiber.useFrame(() => {
+    model.materials['Tapestry WebGL'].map.offset.x += -0.001;
+  });
+  return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
+    children: [/*#__PURE__*/jsxRuntime.jsx("primitive", {
+      scale: 1.3,
+      position: [0, -9, 0],
+      object: model.scene
+    }), /*#__PURE__*/jsxRuntime.jsx("primitive", {
+      object: lights
+    })]
+  });
+};
+
+exports.default = Flower;
+//# sourceMappingURL=Flower-194046f6.js.map

package/dist/Flower-194046f6.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Flower-194046f6.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/Globe-e0b92541.js

@@ -0,0 +1,43 @@
+import { useGLTF } from '@react-three/drei';
+import { useLoader, useFrame } from '@react-three/fiber';
+import 'react';
+import { ObjectLoader, TextureLoader } from 'three';
+import { d as defineSrc } from './index-3bf9c1e9.js';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import 'clsx';
+
+const Globe = () => {
+  const {
+    scene
+  } = useGLTF(defineSrc('globe.gltf'));
+  const lights = useLoader(ObjectLoader, defineSrc('globe-light.json'));
+  const wiseLogo = useLoader(TextureLoader, defineSrc('wise-flag-map-bump.jpg'));
+  const planet = scene.getObjectByName('Globe');
+  const orbit = scene.getObjectByName('Coins_Axis_Rotation_Animate');
+  scene.traverse(child => {
+    if (child.name.startsWith('Coin_')) {
+      const mesh = child;
+      const material = mesh.material;
+      material.bumpMap = wiseLogo;
+      material.bumpMap.flipY = false;
+      mesh.castShadow = false;
+      mesh.receiveShadow = false;
+    }
+  });
+  useFrame(() => {
+    orbit.rotation.y += 0.002;
+    planet.material.map.offset.x += -0.0002;
+  });
+  return /*#__PURE__*/jsxs(Fragment, {
+    children: [/*#__PURE__*/jsx("primitive", {
+      position: [0, -10, 0],
+      scale: 1.3,
+      object: scene
+    }), /*#__PURE__*/jsx("primitive", {
+      object: lights
+    })]
+  });
+};
+
+export { Globe as default };
+//# sourceMappingURL=Globe-e0b92541.js.map

package/dist/Globe-e0b92541.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Globe-e0b92541.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/Globe-f9a29570.js

@@ -0,0 +1,45 @@
+'use strict';
+
+var drei = require('@react-three/drei');
+var fiber = require('@react-three/fiber');
+require('react');
+var three = require('three');
+var index = require('./index-322e874c.js');
+var jsxRuntime = require('react/jsx-runtime');
+require('clsx');
+
+const Globe = () => {
+  const {
+    scene
+  } = drei.useGLTF(index.defineSrc('globe.gltf'));
+  const lights = fiber.useLoader(three.ObjectLoader, index.defineSrc('globe-light.json'));
+  const wiseLogo = fiber.useLoader(three.TextureLoader, index.defineSrc('wise-flag-map-bump.jpg'));
+  const planet = scene.getObjectByName('Globe');
+  const orbit = scene.getObjectByName('Coins_Axis_Rotation_Animate');
+  scene.traverse(child => {
+    if (child.name.startsWith('Coin_')) {
+      const mesh = child;
+      const material = mesh.material;
+      material.bumpMap = wiseLogo;
+      material.bumpMap.flipY = false;
+      mesh.castShadow = false;
+      mesh.receiveShadow = false;
+    }
+  });
+  fiber.useFrame(() => {
+    orbit.rotation.y += 0.002;
+    planet.material.map.offset.x += -0.0002;
+  });
+  return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
+    children: [/*#__PURE__*/jsxRuntime.jsx("primitive", {
+      position: [0, -10, 0],
+      scale: 1.3,
+      object: scene
+    }), /*#__PURE__*/jsxRuntime.jsx("primitive", {
+      object: lights
+    })]
+  });
+};
+
+exports.default = Globe;
+//# sourceMappingURL=Globe-f9a29570.js.map

package/dist/Globe-f9a29570.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Globe-f9a29570.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/Graph-a5cabcf9.js

@@ -0,0 +1,33 @@
+'use strict';
+
+var drei = require('@react-three/drei');
+var fiber = require('@react-three/fiber');
+require('react');
+var three = require('three');
+var index = require('./index-322e874c.js');
+var jsxRuntime = require('react/jsx-runtime');
+require('clsx');
+
+const Graph = () => {
+  const model = drei.useGLTF(index.defineSrc(`graph.gltf`));
+  const lights = fiber.useLoader(three.ObjectLoader, index.defineSrc('graph-light.json'));
+  fiber.useFrame(() => {
+    const {
+      offset
+    } = model.materials['Standard '].map;
+    offset.x += -0.0015;
+    offset.y += 0.0015;
+  });
+  return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
+    children: [/*#__PURE__*/jsxRuntime.jsx("primitive", {
+      scale: 1.3,
+      position: [0, -10, 0],
+      object: model.scene
+    }), /*#__PURE__*/jsxRuntime.jsx("primitive", {
+      object: lights
+    })]
+  });
+};
+
+exports.default = Graph;
+//# sourceMappingURL=Graph-a5cabcf9.js.map

package/dist/Graph-a5cabcf9.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Graph-a5cabcf9.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/Graph-d719e9bc.js

@@ -0,0 +1,31 @@
+import { useGLTF } from '@react-three/drei';
+import { useLoader, useFrame } from '@react-three/fiber';
+import 'react';
+import { ObjectLoader } from 'three';
+import { d as defineSrc } from './index-3bf9c1e9.js';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import 'clsx';
+
+const Graph = () => {
+  const model = useGLTF(defineSrc(`graph.gltf`));
+  const lights = useLoader(ObjectLoader, defineSrc('graph-light.json'));
+  useFrame(() => {
+    const {
+      offset
+    } = model.materials['Standard '].map;
+    offset.x += -0.0015;
+    offset.y += 0.0015;
+  });
+  return /*#__PURE__*/jsxs(Fragment, {
+    children: [/*#__PURE__*/jsx("primitive", {
+      scale: 1.3,
+      position: [0, -10, 0],
+      object: model.scene
+    }), /*#__PURE__*/jsx("primitive", {
+      object: lights
+    })]
+  });
+};
+
+export { Graph as default };
+//# sourceMappingURL=Graph-d719e9bc.js.map

package/dist/Graph-d719e9bc.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Graph-d719e9bc.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/Illustration.css

@@ -6,3 +6,22 @@ img.wds-illustration {
 .wds-illustration-padding {
   padding: 24px;
 }
+
+.wds-illustration-3d {
+  display: inline-flex;
+}
+
+.wds-illustration-3d-small {
+  width: 200px;
+  height: 200px;
+}
+
+.wds-illustration-3d-medium {
+  width: 300px;
+  height: 300px;
+}
+
+.wds-illustration-3d-large {
+  width: 500px;
+  height: 500px;
+}

package/dist/Jars-786486f1.js

@@ -0,0 +1,50 @@
+import { useGLTF, useAnimations } from '@react-three/drei';
+import { useLoader, useFrame } from '@react-three/fiber';
+import { useRef } from 'react';
+import { ObjectLoader, TextureLoader } from 'three';
+import { d as defineSrc } from './index-3bf9c1e9.js';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import 'clsx';
+
+const Jars = () => {
+  const ref = useRef();
+  const model = useGLTF(defineSrc('jars.gltf'));
+  const lights = useLoader(ObjectLoader, defineSrc('jars-light.json'));
+  const wiseLogo = useLoader(TextureLoader, defineSrc('wise-flag-map-bump.jpg'));
+  const jars = [];
+  model.scene.traverse(child => {
+    if (child.name.startsWith('Coin_')) {
+      child.material.bumpMap = wiseLogo;
+      child.material.bumpMap.flipY = false;
+      child.castShadow = false;
+      child.receiveShadow = false;
+    }
+    if (child.name.startsWith('Jar_')) {
+      jars.push(child);
+    }
+  });
+  const {
+    mixer,
+    clips
+  } = useAnimations(model.animations, ref);
+  useFrame(() => {
+    mixer.clipAction(clips[0]).play();
+    jars.forEach(jar => {
+      jar.material.map.offset.x += 0.001;
+      jar.material.map.offset.y += 0.0;
+    });
+  });
+  return /*#__PURE__*/jsxs(Fragment, {
+    children: [/*#__PURE__*/jsx("primitive", {
+      ref: ref,
+      scale: 1.3,
+      position: [0, -10, 0],
+      object: model.scene
+    }), /*#__PURE__*/jsx("primitive", {
+      object: lights
+    })]
+  });
+};
+
+export { Jars as default };
+//# sourceMappingURL=Jars-786486f1.js.map

package/dist/Jars-786486f1.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Jars-786486f1.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/Jars-ce225524.js

@@ -0,0 +1,52 @@
+'use strict';
+
+var drei = require('@react-three/drei');
+var fiber = require('@react-three/fiber');
+var react = require('react');
+var three = require('three');
+var index = require('./index-322e874c.js');
+var jsxRuntime = require('react/jsx-runtime');
+require('clsx');
+
+const Jars = () => {
+  const ref = react.useRef();
+  const model = drei.useGLTF(index.defineSrc('jars.gltf'));
+  const lights = fiber.useLoader(three.ObjectLoader, index.defineSrc('jars-light.json'));
+  const wiseLogo = fiber.useLoader(three.TextureLoader, index.defineSrc('wise-flag-map-bump.jpg'));
+  const jars = [];
+  model.scene.traverse(child => {
+    if (child.name.startsWith('Coin_')) {
+      child.material.bumpMap = wiseLogo;
+      child.material.bumpMap.flipY = false;
+      child.castShadow = false;
+      child.receiveShadow = false;
+    }
+    if (child.name.startsWith('Jar_')) {
+      jars.push(child);
+    }
+  });
+  const {
+    mixer,
+    clips
+  } = drei.useAnimations(model.animations, ref);
+  fiber.useFrame(() => {
+    mixer.clipAction(clips[0]).play();
+    jars.forEach(jar => {
+      jar.material.map.offset.x += 0.001;
+      jar.material.map.offset.y += 0.0;
+    });
+  });
+  return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
+    children: [/*#__PURE__*/jsxRuntime.jsx("primitive", {
+      ref: ref,
+      scale: 1.3,
+      position: [0, -10, 0],
+      object: model.scene
+    }), /*#__PURE__*/jsxRuntime.jsx("primitive", {
+      object: lights
+    })]
+  });
+};
+
+exports.default = Jars;
+//# sourceMappingURL=Jars-ce225524.js.map

package/dist/Jars-ce225524.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Jars-ce225524.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/Lock-32a1942d.js

@@ -0,0 +1,41 @@
+import { useGLTF, useAnimations } from '@react-three/drei';
+import { useLoader, useFrame } from '@react-three/fiber';
+import { useRef } from 'react';
+import { ObjectLoader, LoopOnce } from 'three';
+import { d as defineSrc } from './index-3bf9c1e9.js';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import 'clsx';
+
+const Lock = () => {
+  const ref = useRef();
+  const model = useGLTF(defineSrc('lock.gltf'));
+  const lights = useLoader(ObjectLoader, defineSrc('lock-light.json'));
+  model.scene.traverse(node => {
+    if (node.isMesh) {
+      node.castShadow = true;
+      node.receiveShadow = true;
+    }
+  });
+  const {
+    clips,
+    mixer
+  } = useAnimations(model.animations, ref);
+  let frame = 0;
+  useFrame(() => {
+    mixer.clipAction(clips[0]).play().setLoop(LoopOnce, 1);
+    model.scene.position.y = Math.sin(frame++ * 0.04) * 0.2;
+    model.materials.Standard.map.offset.x += -0.001;
+  });
+  return /*#__PURE__*/jsxs(Fragment, {
+    children: [/*#__PURE__*/jsx("primitive", {
+      ref: ref,
+      scale: 1.4,
+      object: model.scene
+    }), /*#__PURE__*/jsx("primitive", {
+      object: lights
+    })]
+  });
+};
+
+export { Lock as default };
+//# sourceMappingURL=Lock-32a1942d.js.map

package/dist/Lock-32a1942d.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Lock-32a1942d.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/Lock-a8143e20.js

@@ -0,0 +1,43 @@
+'use strict';
+
+var drei = require('@react-three/drei');
+var fiber = require('@react-three/fiber');
+var react = require('react');
+var three = require('three');
+var index = require('./index-322e874c.js');
+var jsxRuntime = require('react/jsx-runtime');
+require('clsx');
+
+const Lock = () => {
+  const ref = react.useRef();
+  const model = drei.useGLTF(index.defineSrc('lock.gltf'));
+  const lights = fiber.useLoader(three.ObjectLoader, index.defineSrc('lock-light.json'));
+  model.scene.traverse(node => {
+    if (node.isMesh) {
+      node.castShadow = true;
+      node.receiveShadow = true;
+    }
+  });
+  const {
+    clips,
+    mixer
+  } = drei.useAnimations(model.animations, ref);
+  let frame = 0;
+  fiber.useFrame(() => {
+    mixer.clipAction(clips[0]).play().setLoop(three.LoopOnce, 1);
+    model.scene.position.y = Math.sin(frame++ * 0.04) * 0.2;
+    model.materials.Standard.map.offset.x += -0.001;
+  });
+  return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
+    children: [/*#__PURE__*/jsxRuntime.jsx("primitive", {
+      ref: ref,
+      scale: 1.4,
+      object: model.scene
+    }), /*#__PURE__*/jsxRuntime.jsx("primitive", {
+      object: lights
+    })]
+  });
+};
+
+exports.default = Lock;
+//# sourceMappingURL=Lock-a8143e20.js.map

package/dist/Lock-a8143e20.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Lock-a8143e20.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/MagnifyingGlass-8d2fb672.js

@@ -0,0 +1,32 @@
+'use strict';
+
+var drei = require('@react-three/drei');
+var fiber = require('@react-three/fiber');
+require('react');
+var three = require('three');
+var index = require('./index-322e874c.js');
+var jsxRuntime = require('react/jsx-runtime');
+require('clsx');
+
+const MagnifyingGlass = () => {
+  const model = drei.useGLTF(index.defineSrc(`magnifying-glass.gltf`));
+  const lights = fiber.useLoader(three.ObjectLoader, index.defineSrc('magnifying-glass-light.json'));
+  const lens = model.scene.getObjectByName('Optimised_lens');
+  fiber.useFrame(() => {
+    lens.material.transparent = true;
+    lens.material.opacity = 0.8;
+    model.materials['Tapestry WebGL'].map.offset.x += -0.0006;
+  });
+  return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
+    children: [/*#__PURE__*/jsxRuntime.jsx("primitive", {
+      scale: 1.5,
+      position: [0, -12, 0],
+      object: model.scene
+    }), /*#__PURE__*/jsxRuntime.jsx("primitive", {
+      object: lights
+    })]
+  });
+};
+
+exports.default = MagnifyingGlass;
+//# sourceMappingURL=MagnifyingGlass-8d2fb672.js.map

package/dist/MagnifyingGlass-8d2fb672.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MagnifyingGlass-8d2fb672.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}