DEV Community

Jeff Lindsay
Jeff Lindsay

Posted on

Treehouse 0.3.0: Fields, Live Search, and References

New Node Types: Fields, Live Search, and References

This release we added some exciting new features: Fields, Live Search, and References. These new node types represent our first step into becoming much more than a simple outliner. Quality of live improvements include making the node menu easier to click, initial work towards a mobile view, and improving interactivity of the command palette. We also cleaned up all our UI elements to match our design system, allowing for better custom CSS support.

New Feature: Fields

A field is a node that can store a key-value pair. This introduces structured data to your nodes, letting you create nodes as data records. You can also search for nodes by field. This initial pass supports text values, but we'll soon provide more value types.

To turn a node into a field:

  1. Indent underneath the node you want to contain the field, and type the field name
  2. Command/Control + K to open the command palette, and choose "Create Field"
  3. Add your field value in the value section

New Feature: Live Search

Live Search allows you to create search nodes where the children are auto-updating search results. Simply type a keyword, or use the format "fieldname:value" to filter by fields. The Live Search nodes will update automatically as your workspace content changes. This is a powerful way to view your data in new configurations.

To create a Live Search:

  1. Create a new node where you want your search node, and type your search value
  2. Command/Control + K to open the command palette, and choose "Create Search Node"

Tips: Search terms are case-insensitive, and you can filter on multiple fields (uses AND, not OR) like so: "fieldname:value fieldname:value".

New Feature: References

References are nodes that refer to another node and its children inline. They're sort of like symlinks on the filesystem. This lets you have a node exist in multiple places at once. References are differentiated from normal nodes with a dashed outline around their outline bullet. Deleting a reference node does not delete the node it points to. You may notice that Live Search results are reference nodes!

To create a reference node:

  1. Select the node you want to make a reference to
  2. Command/Control + K to open the command palette, and choose "Create Reference"

Bugfixes

  • Command palette now uses normalized title #117
  • Command palette supports mouse interactivity #102
  • Components no longer fail with bundled library #119
  • Ensure Node IDs are unique #104
  • Reference sub-nodes now include fields #121
  • Search nodes no longer production workspace #118
  • Prevent indenting/outdenting a field node #116

Enhancements and Chores

  • New feature: Field nodes
  • New feature: Live Search nodes
  • New feature: Reference nodes
  • Clear out non-existent node keys in workspace document under expanded #120
  • Don't show bullet for empty nodes #31
  • Allow hovering over menu area to show menu #76
  • Clean up styles on search bar, palette, quick add, menu, buttons #81, #85, #96, #108, #110
  • Show placeholder text for empty field key/value inputs #135
  • Implement initial version of mobile web app #103

Top comments (0)