diff --git a/content/guides/01.data-model/3.interfaces.md b/content/guides/01.data-model/3.interfaces.md
index 4f0bf13a..c49fdcec 100644
--- a/content/guides/01.data-model/3.interfaces.md
+++ b/content/guides/01.data-model/3.interfaces.md
@@ -296,45 +296,65 @@ Nested tree of checkboxes that can be expanded or collapsed.
::callout{icon="i-lucide-info"}
**Understanding Value Combining Options**
+
In a Checkboxes (Tree) interface, checkboxes can exist within a parent checkbox. Value combining determines the final value when selecting items in a tree.
-- `All` returns all checked values.
- :::collapsible{name="examples" class="mt-2"}
- | Selection | Final Value |
- | ------------------------------------------------------------------------------------------------------------------------ | -------------------------- |
- | :icon{name="material-symbols:check-box-outline"} `parent`
:icon{name="material-symbols:check-box"} `child1`
:icon{name="material-symbols:check-box-outline"} `child2` | `[child1]` |
- | :icon{name="material-symbols:check-box"} `parent`
:icon{name="material-symbols:check-box"} `child1`
:icon{name="material-symbols:check-box"} `child2` | `[child1, child2, parent]` |
- :::
-- `Branch` returns the top-most values that are selected.
- :::collapsible{name="examples" class="mt-2"}
- | Selection | Final Value |
- | ------------------------------------------------------------------------------------------------------------------------ | ----------- |
- | :icon{name="material-symbols:check-box-outline"} `parent`
:icon{name="material-symbols:check-box"} `child1`
:icon{name="material-symbols:check-box-outline"} `child2` | `[child1]` |
- | :icon{name="material-symbols:check-box"} `parent`
:icon{name="material-symbols:check-box"} `child1`
:icon{name="material-symbols:check-box"} `child2` | `[parent]` |
- :::
-- `Leaf` returns the deepest values that are selected
- :::collapsible{name="examples" class="mt-2"}
- | Selection | Final Value |
- | ------------------------------------------------------------------------------------------------------------------------ | ------------------ |
- | :icon{name="material-symbols:check-box-outline"} `parent`
:icon{name="material-symbols:check-box"} `child1`
:icon{name="material-symbols:check-box-outline"} `child2` | `[child1]` |
- | :icon{name="material-symbols:check-box"} `parent`
:icon{name="material-symbols:check-box"} `child1`
:icon{name="material-symbols:check-box"} `child2` | `[child1, child2]` |
- :::
-- `Indeterminate` returns checked items, and always returns a parent when one or more children are selected.
- :::collapsible{name="examples" class="mt-2"}
- | Selection | Final Value |
- | ------------------------------------------------------------------------------------------------------------------------ | -------------------------- |
- | :icon{name="material-symbols:check-box-outline"} `parent`
:icon{name="material-symbols:check-box"} `child1`
:icon{name="material-symbols:check-box-outline"} `child2` | `[child1, parent]` |
- | :icon{name="material-symbols:check-box"} `parent`
:icon{name="material-symbols:check-box"} `child1`
:icon{name="material-symbols:check-box"} `child2` | `[child1, child2, parent]` |
- :::
-- `Exclusive` returns either the parent or child elements, but not both.
- :::collapsible{name="examples" class="mt-2"}
- | Selection | Final Value |
- | ------------------------------------------------------------------------------------------------------------------------ | ------------------ |
- | :icon{name="material-symbols:check-box"} `parent`
:icon{name="material-symbols:check-box-outline"} `child1`
:icon{name="material-symbols:check-box-outline"} `child2` | `[parent]` |
- | :icon{name="material-symbols:check-box-outline"} `parent`
:icon{name="material-symbols:check-box"} `child1`
:icon{name="material-symbols:check-box-outline"} `child2` | `[child1]` |
- | :icon{name="material-symbols:check-box-outline"} `parent`
:icon{name="material-symbols:check-box"} `child1`
:icon{name="material-symbols:check-box"} `child2` | `[child1, child2]` |
- :::
- ::
+**`All`** returns all checked values.
+
+:::collapsible{name="examples" class="mt-2"}
+
+| Selection | Final Value |
+| ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------- |
+| :icon{name="material-symbols:check-box-outline"} `parent`
:icon{name="material-symbols:check-box"} `child1`
:icon{name="material-symbols:check-box-outline"} `child2` | `[child1]` |
+| :icon{name="material-symbols:check-box"} `parent`
:icon{name="material-symbols:check-box"} `child1`
:icon{name="material-symbols:check-box"} `child2` | `[child1, child2, parent]` |
+
+:::
+
+**`Branch`** returns the top-most values that are selected.
+
+:::collapsible{name="examples" class="mt-2"}
+
+| Selection | Final Value |
+| ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
+| :icon{name="material-symbols:check-box-outline"} `parent`
:icon{name="material-symbols:check-box"} `child1`
:icon{name="material-symbols:check-box-outline"} `child2` | `[child1]` |
+| :icon{name="material-symbols:check-box"} `parent`
:icon{name="material-symbols:check-box"} `child1`
:icon{name="material-symbols:check-box"} `child2` | `[parent]` |
+
+:::
+
+**`Leaf`** returns the deepest values that are selected.
+
+:::collapsible{name="examples" class="mt-2"}
+
+| Selection | Final Value |
+| ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------ |
+| :icon{name="material-symbols:check-box-outline"} `parent`
:icon{name="material-symbols:check-box"} `child1`
:icon{name="material-symbols:check-box-outline"} `child2` | `[child1]` |
+| :icon{name="material-symbols:check-box"} `parent`
:icon{name="material-symbols:check-box"} `child1`
:icon{name="material-symbols:check-box"} `child2` | `[child1, child2]` |
+
+:::
+
+**`Indeterminate`** returns checked items, and always returns a parent when one or more children are selected.
+
+:::collapsible{name="examples" class="mt-2"}
+
+| Selection | Final Value |
+| ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------- |
+| :icon{name="material-symbols:check-box-outline"} `parent`
:icon{name="material-symbols:check-box"} `child1`
:icon{name="material-symbols:check-box-outline"} `child2` | `[child1, parent]` |
+| :icon{name="material-symbols:check-box"} `parent`
:icon{name="material-symbols:check-box"} `child1`
:icon{name="material-symbols:check-box"} `child2` | `[child1, child2, parent]` |
+
+:::
+
+**`Exclusive`** returns either the parent or child elements, but not both.
+
+:::collapsible{name="examples" class="mt-2"}
+
+| Selection | Final Value |
+| ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------ |
+| :icon{name="material-symbols:check-box"} `parent`
:icon{name="material-symbols:check-box-outline"} `child1`
:icon{name="material-symbols:check-box-outline"} `child2` | `[parent]` |
+| :icon{name="material-symbols:check-box-outline"} `parent`
:icon{name="material-symbols:check-box"} `child1`
:icon{name="material-symbols:check-box-outline"} `child2` | `[child1]` |
+| :icon{name="material-symbols:check-box-outline"} `parent`
:icon{name="material-symbols:check-box"} `child1`
:icon{name="material-symbols:check-box"} `child2` | `[child1, child2]` |
+
+:::
+::
### Radio Buttons