Boolean$tree-disable-everything: false !default;Set to true to disable all the styles
Boolean$tree-disable-expander-left: false !default;Set to true to disable displaying the TreeItem expander to the left instead of the right.
Boolean$tree-disable-expander-left-as-media: false !default;Set to true to disable displaying the TreeItem expander to the left instead of the right.
Boolean$tree-disable-expander-left-as-media-offset: false !default;Set to true if the TreeItem will never need to set the leftAddonType
to media or large-media.
Boolean$tree-disable-selected-background-color: false !default;Set to true to disable applying the default interaction selected background color while a TreeItem is selected.
Number$tree-item-padding-base: list.$item-horizontal-padding !default;The default horizontal padding to apply to a TreeItem
Number$tree-item-padding-incrementor: calc(list.$item-horizontal-padding * 1.5) !default;The additional amount of padding to apply to each TreeItem that is not rendered at the root.
Number$tree-expander-right-from: icon.$rotate-from !default;The default TreeItemExpander rotation starting position when rendered as a rightAddon.
Number$tree-expander-right-to: 90deg !default;The default TreeItemExpander rotation ending position when rendered as a
rightAddon.
Number$tree-expander-left-from: 0deg !default;The default TreeItemExpander rotation starting position when rendered as a leftAddon.
Number$tree-expander-left-to: -90deg !default;The default TreeItemExpander rotation ending position when rendered as a
leftAddon.
Map$tree-selected-styles: (
font-weight: typography.$font-weight-bold,
) !default;The default styles to apply when a TreeItem has been selected.
List$tree-variables: (depth, item-padding, item-padding-base, item-padding-incrementor);The available configurable css variables and mostly used internally for the
get-var, set-var, and use-var utils.
String$tree-item-padding: calc(
get-var(depth) * get-var(item-padding-incrementor) +
get-var(item-padding-base)
) !default;The padding-left to apply to each TreeItem.
mixin@mixin set-var($name, $value) { … }| Name | Description | Type | Default Value |
|---|---|---|---|
$name | The supported variable name | String | — |
$value | The value to set the variable to. Supports | any | — |
mixin@mixin use-var($property, $name: $property, $fallback: null) { … }mixin@mixin variables { … }Conditionally applies the css variables based on feature flags
mixin@mixin styles($disable-layer: false) { … }Generates all the styles based on feature flags.
| Name | Description | Type | Default Value |
|---|---|---|---|
$disable-layer | Set this to | Boolean | false |
function@function get-var($name, $fallback: null) { … }Stringa var() statement
| Name | Description | Type | Default Value |
|---|---|---|---|
$name | The supported variable name | String | — |
$fallback | An optional fallback value | any | null |