KotStep Stepper UI Library

repository·master·Indexed 43 days ago

https://github.com/binayshaw7777/kotstep

An expressive, high-performance Stepper UI library built natively for Compose Multiplatform. KotStep allows developers to create multi-step workflows, timelines, and progress flows across Android, iOS, Desktop, and Web from a single shared codebase. It features a modern V3 DSL supporting horizontal and vertical layouts, animated fractional progress, customizable line styles (dotted/dashed), and collapsible steps.

Tokens
25.2K
Snippets
66
Records
103
Agent score
53%

What's inside KotStep

  1. Understand the KotStep Compose Multiplatform (CMP) Migration Plan

    master

    KotStep is transitioning from an Android-only library to a Compose Multiplatform (CMP) library. This migration aims to support Android, iOS, Desktop (JVM), and Web (Wasm/JS) while maintaining 100% backward compatibility for the existing V3 DSL API.

    Key Migration Principles:

    • No Rewrite: The V3 core is already ~97% portable as it uses standard androidx.compose.* imports.
    • Gradual Approach: Migration is performed module-by-module to ensure the build remains stable.
    • API Preservation: The public API (KotStep(), KotStepScope, step(), and styles) will remain unchanged for Android consumers.
    • Scope: The migration focuses on V3. The legacy V2 API (using ConstraintLayout) is explicitly out of scope for multiplatform support and may be deprecated or kept as Android-only.
  2. Configure slot reservation strategies

    master

    Planned updates to the API will introduce a slot reservation strategy to control how leadingLabel and trailingLabel affect the stepper layout. Developers will eventually be able to choose between strategies such as:

    • Natural: Standard layout behavior.
    • AlignToLargest: Ensures all steps align based on the largest measured label in the set.
    • Fixed(...): Provides a specific fixed size for the label slots.
  3. Conflict Resolution Strategy (Arbitration Protocol)

    master

    To prevent conflicts during agent delegation, the project follows a strict ownership model where most conflicts are avoided by design. If a conflict occurs, follow the Arbitration Protocol:

    1. Detection & Retreat: If git status shows overlap with a non-owned path, the agent touching the non-owned path must immediately back out (revert changes in that path only).
    2. Escalation: If retreat is not possible, escalate to the Navigator. The Navigator decides ownership, applies conflict-free consolidation, and re-runs the gated build.
    3. Re-sequencing: If a task requires a file owned by another track, the Navigator must reorder the checklist to create a dependency rather than allowing shared writes.
    4. Break-glass: In extreme cases, checkpoint at the migrate-baseline tag. Use git checkout <tag> and rebase the divergent track onto the checkpoint.

    CRITICAL: Never use force-push. Conflicts must be resolved via new commits to preserve the audit log.

  4. How progress state and mathematical semantics work

    master

    The currentStep parameter is a lambda returning a Float. This value drives both the StepState (Todo, Current, Done) and the animation of the connecting lines.

    • < 0f: All steps are Todo; lines are empty.
    • 0f: Step 0 is Current; Step 1+ are Todo; Line 0 progress is 0%.
    • 0.5f: Step 0 is Current; Step 1+ are Todo; Line between Step 0 and 1 is 50% filled.
    • 1.0f: Step 0 is Done; Step 1 is Current; Step 2+ are Todo; Line between Step 0 and 1 is 100% filled.
    • >= totalSteps: All steps are Done; all lines are 100% completed.
  5. Identify Agent Roles and Responsibilities

    master

    The project defines specific roles to manage the migration and build process:

    RoleResponsibility
    Navigator (arbiter)Owns build-touchpoint files (Gradle, settings, CI); runs all build/test verification; owns git commit; updates MIGRATION_CHECKLIST.md; arbitrates conflicts.
    Builder(s)Implement tasks within their assigned file paths; report progress; never commit directly.
    AuditorPerforms cross-track reviews (e.g., grep-auditing for Android leaks in commonMain).
    ReviewerPerforms diff reviews against gate criteria.

    Critical Rule: Builders are not trusted to verify their own builds. The Navigator is the only role authorized to run Gradle commands and verify that a build is green before merging.

  6. Understand `currentStep` Float semantics

    master

    In KotStep V3, currentStep is a Float. This allows for smooth animations of the connecting progress line between steps.

    • Whole numbers (e.g., 0f, 1f) represent fully-completed or active steps.
    • Fractions (e.g., 0.5f) represent partial progress on the line between two indices.

    Value Mapping:

    • -1f: All steps are in the Todo state.
    • 0f: Index 0 is the Current step.
    • 0.5f: 50% progress on the line between index 0 and index 1.
    • 1f: Index 1 is Current; index 0 is Done.
    • 3f: Index 3 is Current; indices 0-2 are Done.
  7. Verify task completion (Definition of DONE)

    master

    A task is only considered [x] (DONE) when the following criteria are met:

    1. Builder: The checklist row is updated with Owner, Verify command, and Pass/Fail status.
    2. Navigator: The Navigator has re-run the gate command. For Kotlin Multiplatform, ensure grep -rn "android\." kotstep/src/commonMain returns no results where applicable.
    3. Reviewer: A different track has reviewed the diff. Any violations result in a ticket and the task returning to [~] status.
    4. Finalization: Only after these steps are complete is the task marked [x] and committed.
  8. Understand the Agent Delegation and Conflict Resolution Model

    master

    The project uses a delegation model designed for parallel work by multiple agents (e.g., Claude Code, Antigravity, opencode, Codex). The core principle is partitioning by file ownership rather than by phase.

    To prevent merge conflicts, agents are assigned disjoint file paths. Two agents only conflict if they attempt to touch the same file. This transforms conflict resolution from a reactive merge process into a proactive prevention and arbitration protocol.

  9. Understand the V2 Deprecation Policy

    master

    KotStep follows a structured deprecation lifecycle for its V2 APIs. If you are using V2 components, be aware of the following timeline to avoid breaking changes:

    • v3.2.0: APIs are marked with a WARNING.
    • v3.4.x: APIs remain in maintenance mode.
    • v3.5.x: APIs will trigger an ERROR.
    • v4.0: APIs are completely removed.

    Plan your migration to V3 APIs before version 3.5 to ensure compatibility.

  10. Understand the Leading/Trailing Label API roadmap

    master

    The KotStep V3 API includes leadingLabel and trailingLabel slots. The project is moving towards a more robust implementation that aligns with Jetpack Compose best practices.

    Key architectural shifts include:

    • Immutability: Step objects are being transitioned from mutable properties (var) to immutable properties (val) to improve Compose state reasoning.
    • Slot Handling: DSL defaults are moving from empty composables to null for optional slots, following standard Material patterns (like leadingIcon or suffix).
    • Layout Behavior: The current layout reserves cross-axis space to keep step indicators aligned. Future updates aim to implement per-step cached measurements so that reserved space can grow and shrink dynamically based on content, rather than only growing to the largest measured size.
  11. Target Architecture for KotStep Multiplatform

    master

    The post-migration architecture separates the shared logic from platform-specific entry points. The :kotstep module becomes a KMP library, while platform-specific applications are created as separate modules.

    Module Structure:

    • :kotstep (KMP Library):
      • commonMain: Contains the V3 DSL, models, styles, layout components, and progress bars.
      • androidMain: Android-specific implementations.
      • iosMain: iOS-specific implementations.
      • jvmMain: Desktop-specific implementations.
      • wasmJsMain: Web-specific implementations.
      • commonTest: Shared UI tests.
    • :app: Existing Android demo app (remains a pure Android module).
    • :desktopApp: New Desktop entry point.
    • :iosApp: New iOS Xcode project.
    • :webApp: New Web (Wasm/JS) entry point.
  12. Decouple Android-only code from commonMain

    master

    To ensure the library is truly multiplatform, the commonMain source set must be free of Android-specific dependencies. Perform a 'Grep sweep' to ensure zero occurrences of the following in commonMain:

    • android.* packages
    • R. (Android Resource class)
    • LocalContext
    • Toast
    • java.* packages

    Resource Strategy: The library should ship with zero resources to avoid compose.components.resources dependencies. Move demo assets (like kotlin.xml) to the consumer application's src/main/res/drawable/ folder.