UseTexture as component

[JaimeTorrealba]

Description

As a developer, what if we provide a function similar to vuesuse

In which we can use a composable as a component too. This could be maybe handy for others composable.

Suggested solution

EJ...

<Suspense>
   <UseTexture :map="MYMAPTEXTURE" v-slot="{ map }" />
      <TresMeshStandardMaterial :map="map"
   <UseTexture />
</Suspense>

Alternative

Could be similar to: https://github.com/vueuse/vueuse/blob/main/packages/core/useMouse/component.ts

Any other alternative is considered

Additional context

What do you think?

Validations

• I agree to follow this project's Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.

[andretchen0]

I think the following is possible with R3F, but not with Tres, atm:

<script setup lang="ts">
const texture = {... load my texture}
</script>

<template>
  <TresMeshStandardMaterial>
    <primitive :object="texture" attach="map" />
  </TresMeshStandardMaterial>
</template>

Would that cover the use case here?

[JaimeTorrealba]

With the component approach, we don't have to create two components, we can get rid of one layer. Ej

//theExperiences.vue

<script setup lang="ts">
import { TresCanvas } from '@tresjs/core'
</script>

<template>
  <TresCanvas >
    ...
   <Suspense>
      <MyComponent />
   </Suspense >
   ...
  </TresCanvas >
</template>

// MyComponent

<script setup lang="ts">
const texture = {... load my texture}
</script>

<template>
   <TresMesh>
     <TresBoxGeometry />
    <TresStandardMaterial :map="map" />
   <TresMesh>
</template>

Obviusly there're many ways to not do this, but we can, abstract one step by just

<TresCanvas >
<Suspense>
   <UseTexture :map="MYMAPTEXTURE" v-slot="{ map }" />
      <TresMeshStandardMaterial :map="map"
   <UseTexture />
</Suspense>
</TresCanvas >

Is just one way to improve DX to our Users

[andretchen0]

Ok, I see.