Writing toString functions to display custom data values is straightforward, but building custom interfaces to manipulate such values is more difficult. Though tolerable in many scenarios, this difficulty is acute in emerging value-centric IDEs—such as those that provide programming by examples (PBE) or bidirectional transformation (BX) modalities, in which users manipulate output values to specify programs.

We present an approach that automatically generates custom GUIs from ordinary toString functions. By tracing the execution of the toString function on an input value, our technique overlays a tiny structure editor upon the output string: UI widgets for selecting, adding, removing, and modifying elements of the original value are displayed atop appropriate substrings.

We implement our technique—in a tool called TSE—for a simple functional language with custom algebraic data types (ADTs), and evaluate the tiny structure editors produced by TSE on a selection of existing and custom toString functions.