preview-lab/me.tbsten.compose.preview.lab.previewlab.inspectorspane/InspectorTab

InspectorTab

Represents a tab in the PreviewLab inspector panel.

Built-in tabs (Fields and Events) are provided by InspectorTab.Fields and InspectorTab.Events. Custom tabs can be created by implementing this interface.

Creating Custom Tabs

To create a custom tab, implement this interface with your own tab content:

object CustomTab : InspectorTab {
    override val title = "Custom"
    override val icon: @Composable () -> Painter = { painterResource(PreviewLabUiRes.drawable.icon_custom) }

    @Composable
    override fun ContentContext.Content() {
        // Your custom tab content can access state via the ContentContext
        Column {
            Text("Custom Tab Content")
            Text("Field count: ${state.scope.fields.size}")
        }
    }
}

Then pass it to PreviewLab via the inspectorTabs parameter:

// Default tabs (Fields, Events) + custom tab
@Preview
@Composable
fun MyPreview() = PreviewLab(
    inspectorTabs = InspectorTab.defaults + listOf(CustomTab)
) {
    MyComponent()
}

// Custom tabs only (no default tabs)
@Preview
@Composable
fun MyPreview() = PreviewLab(
    inspectorTabs = listOf(CustomTab)
) {
    MyComponent()
}

Inheritors

Fields

Events

Code

Types

Code

data object Code : InspectorTab

Companion

object Companion

ContentContext

class ContentContext(val state: PreviewLabState, val inspectorTabs: List<InspectorTab>)

Context providing access to PreviewLabState for tab content.

Events

data object Events : InspectorTab

Built-in Events tab that displays all logged events.

Fields

data object Fields : InspectorTab

Built-in Fields tab that displays all interactive fields.

Properties

icon

open val icon: @Composable () -> Painter?

The icon to display for the tab. If null, the tab will be displayed without an icon.

title

abstract val title: String

The display title of the tab

Functions

Content

@Composable

abstract fun InspectorTab.ContentContext.Content()

The content to display when the tab is selected. Implement this composable function within ContentContext receiver scope to access the PreviewLabState via ContentContext.state.