Triplex 0.56: Live Editing Props

▵ Triplex 0.56 introduces developer experience improvements and fixes some bugs.

New features

Live edit props

Edit props given to the component you have open to test it in out over different states. Changed props only last during your session however — so when you close Triplex they're gone!

Number input improvements

The number input has been improved with slider and increment/decrement behavior. Use keyboard modifiers (shift/ctrl) to control how fine grained it should be!

Set constraints with prop description tags

Declare JSDoc tags in your prop descriptions and Triplex will use them where supported.

The first supported tags are @max and @min used in the number input, they constrain what values are allowed to be set.

interface CameraEntityProps {
  /**
   * @min -3
   * @max 1
   */
  offsetX?: number;
}

Adding GLTF assets to your scene

GLTF is a common asset exported from 3D software like Blender. Now you can add them to your components straight through Triplex without needing to write out the code for it.

Set host element names

Host elements such as mesh can now be labelled using the name prop. When set they are used as the name shown in the scene panel.

Bug fixes

Union type input fixes

Previously props that were a union type, such as one that takes a number and a string, would lose the ability switch between them in the context panel when the prop was set with a value. This is now fixed.

Other

• All undefined values are now preserved when saving props instead of being set to null.
• Color inputs can now be cleared when not required.
• Tuple inputs no longer fire change events when required values are only partially filled.

Triplex is the React Three Fiber editor where your code is source of truth. Download today.