The formula editor

The formula editor is where you construct your business logic. Formulas are used to perform logical operations. This could be data transformation, mathematical calculations, or filtering and search. Formulas are pure functions in a mathematical sense, so they have no side-effect and always return the same output, given the same input(s).

Formula editor example on how to compose different formulas to return the highest number in a list

The formulas you build are composed of other formulas. In the example above, the formula "Max from list" consists of multiple different formulas such as `Reduce` & `Max` that are able to search a list of numbers to return the highest entry.

When building the toddle editor ( toddle is built in toddle ), we use formulas for everything (!) We use them to search the files in your project, to calculate element bounds, and even in the formula editor itself to run your formulas to give you live feedback.

Reusable formulas

When working on formulas, you sometimes end up repeating the same functionality multiple times. In such cases, you can consider moving your code to a component-level formula. Moving formulas to a reusable block also has performance benefits as inputs can be cached to their outputs since they are pure functions 🤯

Further documentation

toddle builds on top of the modern web platform, so many built-in formulas have a one-to-one connection to similar named JavaScript formulas. It can be a good idea to read up on essential functions in javascript:

Custom formulas

You can build almost anything by composing just a few of the built-in formulas! However, once in a while, usually, if you have a completely unique problem integrating with a third-party library, you may need to extend functionality with a custom formula. You can do this by writing a new custom code formula in the code editor. This is a rare use case, so remember to first reach out to our community on Discord to see if anyone can come up with a better solution using the toddle fundamentals. Otherwise, check out the documentation on custom code to extend toddle even further!