# 💧 Liquid Navigation & Layouts Sample App

This sample project demonstrates a multi-page app constructed with the **Liquid Declarative UI Framework**.

## 🌟 Features Demonstrated

1. **Shared State-Sharing Buttons**:
   - The global counter resides in `AppStore`.
   - `HomeScreen` features increment and decrement buttons mutating the shared state.
   - Any screen utilizing `$appStore.counter` will automatically reactive-update across target environments.

2. **Multi-Page Navigation**:
   - `MainApp` acts as the navigation controller wrapping the `<Navigator>` component.
   - We route `/home` to `HomeScreen`, `/list` to `ListViewScreen`, and `/grid` to `GridViewScreen`.
   - Mutating `appStore.activeRoute` triggers automatic navigation.

3. **ListView Rendering**:
   - `ListViewScreen` uses the dynamic `For` layout loop mapping each entry to dynamic components.

4. **GridView Layout**:
   - `GridViewScreen` uses stacked `Row` and `Column` wrappers styled with `Container` to produce a fully responsive grid alignment.

---

## 🛠️ How to Compile

To compile the sample project for all 5 targets:

1. Make sure you have the Liquid compiler binary compiled or execute using cargo.
2. In this folder directory, run:
   ```bash
   cargo run --release --manifest-path ../Cargo.toml -- build --input src/main.liq
   ```

To output the transpilation results to stdout (for example SwiftUI target):
```bash
cargo run --release --manifest-path ../Cargo.toml -- build ios --input src/main.liq
```

This will output clean, fully ready-to-run UI code for **SwiftUI**, **Jetpack Compose**, **WinUI 3 (XAML + C#)**, and **Rust WASM / Pure JS**.
