> For the complete documentation index, see [llms.txt](https://cognitox.gitbook.io/cognito-kmm-docs/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://cognitox.gitbook.io/cognito-kmm-docs/sequential-content-with-indefinitesurface.md).

# Sequential Content with IndefiniteSurface

### IndefiniteSurface Composable: A Dynamic Component for Sequential Content

**Purpose:**

The `IndefiniteSurface` composable is a versatile component that can be used to display a series of items sequentially, one at a time. It's particularly useful for scenarios where the number of items is unknown or dynamic, such as an exam with an undefined number of questions.

**Parameters:**

* **`modifier`:** A `Modifier` to apply to the surface.
* **`items`:** A `Map<Int, T>` containing the items to be displayed.
* **`selectedIndex`:** The current index of the selected item.
* **`itemView`:** A composable function that renders the item content.
* **`resultView`:** A composable function that renders the result view after the user has interacted with the item.
* **`onFinished`:** A callback function that is invoked when all items have been displayed.

**Functionality:**

1. **Initialization:** The component initializes with the provided `items` and `selectedIndex`.
2. **Index Tracking:** The `selectedIndex` is used to determine which item is currently visible.
3. **Item Rendering:** The `itemView` function is called for the selected item.
4. **Result Handling:** If the user indicates that they have finished with the current item, the `resultView` is displayed, and the `selectedIndex` is incremented.
5. **Completion:** When the `selectedIndex` reaches the end of the `items` list, the `onFinished` callback is invoked.

**Scenario: Exam Questionnaire**

In the provided scenario, the `IndefiniteSurface` can be used to display the exam questions sequentially:

1. **Load Initial Question:** The component loads the first question and displays it using the `itemView` function.
2. **Handle Next/Previous:** When the user clicks the "next" or "previous" buttons, the `selectedIndex` is updated, and the corresponding question is displayed.
3. **Handle Completion:** When all questions have been answered, the `onFinished` callback can be used to display a final result or navigate to the next screen.

**Example Usage**

```kotlin
@Composable
fun QuizApp() {
    val questions = listOf(
        "What is the capital of Bangladesh?",
        "Who is the author of 'Harry Potter'?",
        // ... more questions
    )

    IndefiniteSurface(
        items = questions.withIndex().associate { it },
        selectedIndex = 0,
        itemView = { index, question, onNext ->
            QuestionCard(
                question = question,
                onAnswerSubmitted = { isCorrect ->
                    // Handle answer submission here
                    onNext(isCorrect)
                }
            )
        },
        resultView = { question, onNext ->
            ResultCard(
                question = question,
                isCorrect = true, // Replace with actual correctness
                onNext = onNext
            )
        },
        onFinished = {
            // Show final score or other completion message
        }
    )
}
```

**Key Points:**

* **Dynamic Content:** The component can handle an arbitrary number of items.
* **Sequential Display:** Items are displayed one at a time.
* **Result Handling:** The `resultView` can be used to display additional information or actions after the user has interacted with an item.
* **Customizable:** The `itemView` and `resultView` functions can be customized to suit specific requirements.

By using `IndefiniteSurface`, you can create dynamic and engaging user interfaces that can handle various scenarios involving sequential content.


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://cognitox.gitbook.io/cognito-kmm-docs/sequential-content-with-indefinitesurface.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
