Bug fix

Author: Shags

example/src/App.js

@@ -12,13 +12,15 @@ const App = () => {
           anchorVert={CENTER}
           width={80}
           fontSize={50}
-          textColor={[.1, .1, .1, 1]}
-          backgroundColor={[1.0, .8, .8, 1]}
-          borderColor={[.7, 0, .7, 1]}
-          borderWidth={20}
-          borderRadius={50}
+          textColor={0x0E0E0E}
+          backgroundColor={'hsl(0, 100%, 50%)'}
+          backgroundAlpha={.8}
+          borderColor={'skyblue'}
+          borderAlpha={.9}
+          borderWidth={5}
+          borderRadius={10}
           borderSmoothing={0.1}
-          borderBuffer={30}
+          borderBuffer={3}
         />
       </Suspense>
     </Canvas>

example/src/index.css

@@ -1,5 +1,3 @@
-import './index.css'
-
 import React from 'react'
 import ReactDOM from 'react-dom'
 import App from './App'

example/src/index.js

@@ -33,7 +33,7 @@ export const RIGHT = 'right'
  * anchorVert, anchorHorz: The anchor point of the text object that will be placed at the placement point - defaults to the center
  * positionVert, positionHorz: Percentage of viewport between the anchor and the top/left - defaults to the center of the viewport
  */
-const Text = ({
+export const Text = ({
   text = '',
   width = 100,
   alignment = CENTER,
@@ -67,7 +67,7 @@ const Text = ({
   ])
 
   // Texture Data
-  const texture = useLoader(THREE.TextureLoader, textureData)
+  const { texture } = useLoader(THREE.TextureLoader, textureData)
 
   // Uniforms for shader
   const uniforms = useMemo(() => {
@@ -199,5 +199,3 @@ const Text = ({
     </mesh>
   )
 }
-
-export default Text