### Adaptive Layout with Window Size Classes

Source: https://context7.com/chrisbanes/material3-windowsizeclass-multiplatform/llms.txt

This composable function demonstrates how to implement adaptive layouts based on calculated window size classes. It switches between a two-pane layout for wider screens and a single-pane layout for narrower screens, adjusting content based on screen height as well.

```kotlin
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.padding
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Surface
import androidx.compose.material3.Text
import androidx.compose.material3.windowsizeclass.ExperimentalMaterial3WindowSizeClassApi
import androidx.compose.material3.windowsizeclass.WindowHeightSizeClass
import androidx.compose.material3.windowsizeclass.WindowWidthSizeClass
import androidx.compose.material3.windowsizeclass.calculateWindowSizeClass
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.unit.dp

@OptIn(ExperimentalMaterial3WindowSizeClassApi::class)
@Composable
fun AdaptiveApp() {
    MaterialTheme {
        Surface(Modifier.fillMaxSize()) {
            val windowSizeClass = calculateWindowSizeClass()

            // Determine layout configuration based on both dimensions
            val isWideScreen = windowSizeClass.widthSizeClass >= WindowWidthSizeClass.Medium
            val isTallScreen = windowSizeClass.heightSizeClass >= WindowHeightSizeClass.Medium

            if (isWideScreen) {
                // Two-pane layout for tablets and desktop
                Row(Modifier.fillMaxSize()) {
                    NavigationPane(
                        modifier = Modifier.weight(if (windowSizeClass.widthSizeClass == WindowWidthSizeClass.Expanded) 0.3f else 0.4f)
                    )
                    ContentPane(
                        modifier = Modifier.weight(if (windowSizeClass.widthSizeClass == WindowWidthSizeClass.Expanded) 0.7f else 0.6f),
                        showExtendedInfo = isTallScreen
                    )
                }
            } else {
                // Single-pane layout for phones
                Column(Modifier.fillMaxSize()) {
                    ContentPane(
                        modifier = Modifier.weight(1f),
                        showExtendedInfo = isTallScreen
                    )
                    CompactNavigationBar()
                }
            }
        }
    }
}

@Composable
fun NavigationPane(modifier: Modifier = Modifier) {
    Box(modifier.padding(16.dp)) {
        Text("Navigation")
    }
}

@Composable
fun ContentPane(modifier: Modifier = Modifier, showExtendedInfo: Boolean) {
    Column(modifier.padding(16.dp)) {
        Text("Main Content")
        if (showExtendedInfo) {
            Text("Extended information shown on taller screens")
        }
    }
}

@Composable
fun CompactNavigationBar() {
    Box(Modifier.padding(8.dp)) {
        Text("Bottom Nav")
    }
}

// Android entry point
// class MainActivity : ComponentActivity() {
//     override fun onCreate(savedInstanceState: Bundle?) {
//         super.onCreate(savedInstanceState)
//         setContent { AdaptiveApp() }
//     }
// }

// Desktop entry point
// fun main() = application {
//     Window(onCloseRequest = ::exitApplication) {
//         AdaptiveApp()
//     }
// }
```

--------------------------------

### Implement adaptive navigation layouts

Source: https://context7.com/chrisbanes/material3-windowsizeclass-multiplatform/llms.txt

Use WindowWidthSizeClass to switch between navigation components like bottom bars, rails, or drawers based on screen width.

```kotlin
import androidx.compose.material3.windowsizeclass.ExperimentalMaterial3WindowSizeClassApi
import androidx.compose.material3.windowsizeclass.WindowWidthSizeClass
import androidx.compose.material3.windowsizeclass.calculateWindowSizeClass
import androidx.compose.runtime.Composable
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Column

@OptIn(ExperimentalMaterial3WindowSizeClassApi::class)
@Composable
fun AdaptiveNavigationLayout() {
    val windowSizeClass = calculateWindowSizeClass()

    when (windowSizeClass.widthSizeClass) {
        WindowWidthSizeClass.Compact -> {
            // Phone layout: Bottom navigation bar
            Column {
                ContentArea(modifier = Modifier.weight(1f))
                BottomNavigationBar()
            }
        }
        WindowWidthSizeClass.Medium -> {
            // Tablet portrait: Navigation rail on the side
            Row {
                NavigationRail()
                ContentArea(modifier = Modifier.weight(1f))
            }
        }
        WindowWidthSizeClass.Expanded -> {
            // Large screen: Full navigation drawer
            Row {
                NavigationDrawer()
                ContentArea(modifier = Modifier.weight(1f))
            }
        }
    }

    // Size classes support comparison operators
    if (windowSizeClass.widthSizeClass >= WindowWidthSizeClass.Medium) {
        // Show additional content for medium and expanded screens
        SidePanel()
    }
}
```

--------------------------------

### Adaptive Header Layout based on WindowHeightSizeClass

Source: https://context7.com/chrisbanes/material3-windowsizeclass-multiplatform/llms.txt

Adjusts UI elements like headers based on the window's height size class. Requires `ExperimentalMaterial3WindowSizeClassApi`. Use `when` statement to conditionally render different layouts.

```kotlin
import androidx.compose.material3.windowsizeclass.ExperimentalMaterial3WindowSizeClassApi
import androidx.compose.material3.windowsizeclass.WindowHeightSizeClass
import androidx.compose.material3.windowsizeclass.calculateWindowSizeClass
import androidx.compose.runtime.Composable

@OptIn(ExperimentalMaterial3WindowSizeClassApi::class)
@Composable
fun AdaptiveHeaderLayout() {
    val windowSizeClass = calculateWindowSizeClass()

    when (windowSizeClass.heightSizeClass) {
        WindowHeightSizeClass.Compact -> {
            // Landscape phone: Minimal header, maximize content area
            Column {
                CompactHeader(height = 48.dp)
                ScrollableContent(modifier = Modifier.weight(1f))
            }
        }
        WindowHeightSizeClass.Medium -> {
            // Standard layout with moderate header
            Column {
                StandardHeader(height = 96.dp)
                ScrollableContent(modifier = Modifier.weight(1f))
            }
        }
        WindowHeightSizeClass.Expanded -> {
            // Tablet portrait: Large hero header with image
            Column {
                HeroHeader(height = 200.dp)
                ScrollableContent(modifier = Modifier.weight(1f))
            }
        }
    }

    // Use comparison for conditional features
    val showFloatingButton = windowSizeClass.heightSizeClass > WindowHeightSizeClass.Compact
}
```

--------------------------------

### Calculate Window Size Class from Custom Size

Source: https://context7.com/chrisbanes/material3-windowsizeclass-multiplatform/llms.txt

Manually calculates window size class from pixel dimensions and density. Useful for testing or custom scenarios. Supports filtering by supported size classes. Requires `ExperimentalMaterial3WindowSizeClassApi`.

```kotlin
import androidx.compose.material3.windowsizeclass.ExperimentalMaterial3WindowSizeClassApi
import androidx.compose.material3.windowsizeclass.WindowSizeClass
import androidx.compose.material3.windowsizeclass.WindowWidthSizeClass
import androidx.compose.material3.windowsizeclass.WindowHeightSizeClass
import androidx.compose.ui.geometry.Size
import androidx.compose.ui.unit.Density

@OptIn(ExperimentalMaterial3WindowSizeClassApi::class)
fun calculateCustomWindowSizeClass() {
    // Calculate from pixel size with density
    val windowSizeClass = WindowSizeClass.calculateFromSize(
        size = Size(width = 1200f, height = 800f),  // Pixels
        density = Density(density = 2f, fontScale = 1f),
        supportedWidthSizeClasses = WindowWidthSizeClass.DefaultSizeClasses,
        supportedHeightSizeClasses = WindowHeightSizeClass.DefaultSizeClasses
    )

    println("Width class: ${windowSizeClass.widthSizeClass}")   // Medium (600dp = 1200px / 2)
    println("Height class: ${windowSizeClass.heightSizeClass}") // Compact (400dp = 800px / 2)

    // Limit to specific size classes only
    val limitedSizeClass = WindowSizeClass.calculateFromSize(
        size = Size(width = 1800f, height = 1200f),
        density = Density(density = 1f, fontScale = 1f),
        supportedWidthSizeClasses = setOf(
            WindowWidthSizeClass.Compact,
            WindowWidthSizeClass.Medium
            // Expanded is NOT supported - will fall back to Medium
        ),
        supportedHeightSizeClasses = WindowHeightSizeClass.DefaultSizeClasses
    )

    println("Limited width: ${limitedSizeClass.widthSizeClass}") // Medium (best match)
}
```

--------------------------------

### Calculate window size class in Composable

Source: https://context7.com/chrisbanes/material3-windowsizeclass-multiplatform/llms.txt

Use calculateWindowSizeClass to retrieve current viewport breakpoints and adjust UI elements accordingly.

```kotlin
import androidx.compose.material3.windowsizeclass.ExperimentalMaterial3WindowSizeClassApi
import androidx.compose.material3.windowsizeclass.WindowWidthSizeClass
import androidx.compose.material3.windowsizeclass.WindowHeightSizeClass
import androidx.compose.material3.windowsizeclass.calculateWindowSizeClass
import androidx.compose.runtime.Composable
import androidx.compose.ui.unit.sp

@OptIn(ExperimentalMaterial3WindowSizeClassApi::class)
@Composable
fun MyResponsiveApp() {
    val windowSizeClass = calculateWindowSizeClass()

    // Adjust font size based on screen width
    val fontSize = when (windowSizeClass.widthSizeClass) {
        WindowWidthSizeClass.Compact -> 16.sp   // Phones in portrait
        WindowWidthSizeClass.Medium -> 24.sp    // Tablets in portrait
        else -> 30.sp                            // Tablets in landscape, large displays
    }

    // Adjust layout based on screen height
    val useCompactLayout = when (windowSizeClass.heightSizeClass) {
        WindowHeightSizeClass.Compact -> true   // Phones in landscape
        else -> false
    }

    // Use these values in your composables
    Text(
        text = "Window: ${windowSizeClass.widthSizeClass}, ${windowSizeClass.heightSizeClass}",
        fontSize = fontSize
    )
}
```

--------------------------------

### Calculate Window Size Class in Compose

Source: https://github.com/chrisbanes/material3-windowsizeclass-multiplatform/blob/main/README.md

Use calculateWindowSizeClass to determine the current window size class and adjust UI components accordingly.

```kotlin
import androidx.compose.material3.windowsizeclass.calculateWindowSizeClass

@Composable
fun MyApplication() {
    val windowSizeClass = calculateWindowSizeClass()

    // Example of how to change the font size based on the screen width
    val fontSize = when (windowSizeClass.widthSizeClass) {
        WindowWidthSizeClass.Compact -> 16.sp
        WindowWidthSizeClass.Medium -> 24.sp
        else -> 30.sp
    }

    Column( /* ... */) {  
        Box (/* ... */){
            Image (/* ... */)
            Text (fontSize = fontSize)
        }
    }
}
```

--------------------------------

### License Information

Source: https://github.com/chrisbanes/material3-windowsizeclass-multiplatform/blob/main/README.md

The library is licensed under the Apache License, Version 2.0.

```text
Copyright 2022 The Android Open Source Project
Portions 2023 Christopher Banes
 
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    https://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
```

--------------------------------

### Add Dependency to Gradle

Source: https://github.com/chrisbanes/material3-windowsizeclass-multiplatform/blob/main/README.md

Include the library in your commonMain dependencies block to use it in a multiplatform project.

```kotlin
val commonMain by getting {
    dependencies {
        implementation("dev.chrisbanes.material3:material3-window-size-class-multiplatform:0.5.0")
    }
}
```

=== COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.