<xr-scene render-system="alpha:true" bind:ready="handleReady">
  <xr-node>
    <xr-mesh id="cube" node-id="mesh-cube" position="-0.5 0 0" geometry="cube" uniforms="u_baseColorFactor:0.298 0.764 0.85 {{cubeAlpha}}" states="alphaMode:BLEND" />
    <xr-mesh node-id="mesh-sphere" position="0.5 0 0" geometry="sphere" uniforms="u_baseColorFactor:0.937 0.176 0.368 {{sphereAlpha}}" states="alphaMode:BLEND" />
    <xr-node node-id="target" position="0 0 0" />
    <xr-camera
      id="camera" node-id="camera" position="0 2 2" clear-color="{{clearColor}}"
      target="target" camera-orbit-control=""
    ></xr-camera>
  </xr-node>
  <xr-node node-id="lights">
    <xr-light type="ambient" color="1 1 1" intensity="1" />
    <xr-light type="directional" rotation="40 170 0" color="1 1 1" intensity="3" />
  </xr-node>
</xr-scene>