<div class='type'>Composable Component</div>



Material design modal wide navigation rail.

<a id='references'></a>



<h2 id="modalwidenavigationrail-modifier-state-hideoncollapse-collapsedshape-expandedshape-colors-header-expandedheadertoppadding-windowinsets-arrangement-expandedproperties-contentpadding-content">ModalWideNavigationRail</h2>

<div class='sourceset sourceset-common'>Common</div>


```kotlin
@Composable
fun ModalWideNavigationRail(
    modifier: Modifier = Modifier,
    state: WideNavigationRailState = rememberWideNavigationRailState(),
    hideOnCollapse: Boolean = false,
    collapsedShape: Shape = WideNavigationRailDefaults.modalCollapsedShape,
    expandedShape: Shape = WideNavigationRailDefaults.modalExpandedShape,
    colors: WideNavigationRailColors = WideNavigationRailDefaults.colors(),
    header: @Composable (() -> Unit)? = null,
    expandedHeaderTopPadding: Dp = 0.dp,
    windowInsets: WindowInsets = WideNavigationRailDefaults.windowInsets,
    arrangement: Arrangement.Vertical = WideNavigationRailDefaults.arrangement,
    expandedProperties: ModalWideNavigationRailProperties =
        WideNavigationRailDefaults.ModalExpandedProperties,
    contentPadding: PaddingValues = WideNavigationRailDefaults.ContentPadding,
    content: @Composable () -> Unit,
)
```


#### Parameters

| | |
| --- | --- |
| modifier | the `Modifier` to be applied to this wide navigation rail |
| state | the `WideNavigationRailState` of this wide navigation rail |
| hideOnCollapse | whether this wide navigation rail should slide offscreen when it collapses and be hidden, or stay on screen as a collapsed wide navigation rail (default) |
| collapsedShape | the shape of this wide navigation rail's container when it's collapsed |
| expandedShape | the shape of this wide navigation rail's container when it's expanded |
| colors | `WideNavigationRailColors` that will be used to resolve the colors used for this wide navigation rail. See `WideNavigationRailDefaults.colors` |
| header | optional header that may hold a `FloatingActionButton` or a logo |
| expandedHeaderTopPadding | the padding to be applied to the top of the rail. It's usually needed in order to align the content of the rail between the collapsed and expanded animation |
| windowInsets | a window insets of the wide navigation rail |
| arrangement | the `Arrangement.Vertical` of this wide navigation rail |
| expandedProperties | `ModalWideNavigationRailProperties` for further customization of the expanded modal wide navigation rail's window behavior |
| contentPadding | the spacing values to apply internally between the container and the content |
| content | the content of this modal wide navigation rail, usually `WideNavigationRailItem`s |




<div class='sourceset sourceset-common'>Common</div>


> **Deprecated** Deprecated in favor of function with contentPadding parameter



<hr class="docs-overload-divider">


<h2 id="modalwidenavigationrail-modifier-state-hideoncollapse-collapsedshape-expandedshape-colors-header-expandedheadertoppadding-windowinsets-arrangement-expandedproperties-content">ModalWideNavigationRail</h2>

```kotlin
@Composable
fun ModalWideNavigationRail(
    modifier: Modifier = Modifier,
    state: WideNavigationRailState = rememberWideNavigationRailState(),
    hideOnCollapse: Boolean = false,
    collapsedShape: Shape = WideNavigationRailDefaults.modalCollapsedShape,
    expandedShape: Shape = WideNavigationRailDefaults.modalExpandedShape,
    colors: WideNavigationRailColors = WideNavigationRailDefaults.colors(),
    header: @Composable (() -> Unit)? = null,
    expandedHeaderTopPadding: Dp = 0.dp,
    windowInsets: WindowInsets = WideNavigationRailDefaults.windowInsets,
    arrangement: Arrangement.Vertical = WideNavigationRailDefaults.arrangement,
    expandedProperties: ModalWideNavigationRailProperties =
        WideNavigationRailDefaults.ModalExpandedProperties,
    content: @Composable () -> Unit,
)
```


#### Parameters

| | |
| --- | --- |
| modifier | the `Modifier` to be applied to this wide navigation rail |
| state | the `WideNavigationRailState` of this wide navigation rail |
| hideOnCollapse | whether this wide navigation rail should slide offscreen when it collapses and be hidden, or stay on screen as a collapsed wide navigation rail (default) |
| collapsedShape | the shape of this wide navigation rail's container when it's collapsed |
| expandedShape | the shape of this wide navigation rail's container when it's expanded |
| colors | `WideNavigationRailColors` that will be used to resolve the colors used for this wide navigation rail. See `WideNavigationRailDefaults.colors` |
| header | optional header that may hold a `FloatingActionButton` or a logo |
| expandedHeaderTopPadding | the padding to be applied to the top of the rail. It's usually needed in order to align the content of the rail between the collapsed and expanded animation |
| windowInsets | a window insets of the wide navigation rail |
| arrangement | the `Arrangement.Vertical` of this wide navigation rail |
| expandedProperties | `ModalWideNavigationRailProperties` for further customization of the expanded modal wide navigation rail's window behavior |
| content | the content of this modal wide navigation rail, usually `WideNavigationRailItem`s |