mobiler-web 0.37.0

Mobiler's web shell — renders any Mobiler app's Widget tree to the DOM (Leptos/WASM).
Documentation 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50

# mobiler-web

> Mobiler's web shell — the same Rust core, rendered to the DOM.

The web twin of Mobiler's generic Android (Jetpack Compose) and iOS (SwiftUI)
shells. It drives any [`MobilerApp`](https://crates.io/crates/mobiler-core)'s core
with [Crux](https://github.com/redbadger/crux), renders its `Widget` tree to the DOM
with [Leptos](https://leptos.dev) (CSR/WASM), and fulfils the built-in capabilities
natively in the browser — write your app once; it runs on the web with one line. Built in:

<!-- capabilities:start format=inline (generated from capabilities.json — run `cargo run -p xtask -- gen-readme`) -->
HTTP, storage, clipboard, share, browser, toast, device info, haptics, a confirm dialog, the photo picker, camera capture, the date picker, and the time picker.
<!-- capabilities:end -->

```rust
// src/main.rs of a Trunk project
fn main() {
    mobiler_web::run::<my_app::App>();
}
```

```html
<!-- index.html — that's all the markup you need -->
<!DOCTYPE html>
<html>
  <head><link data-trunk rel="rust" /></head>
  <body></body>
</html>
```

- **No CSS required.** The shell ships its own theme (`mobiler.css`) and injects it
  on mount, so `run::<App>()` renders a fully-styled app. It's injected at the front
  of `<head>`, so your own stylesheet (if you add one) overrides any widget class.
- **Theme-as-data.** `Scaffold.dark_mode` flips the whole theme — the web twin of
  the native shells' `preferredColorScheme` / Material theme. `Density::Large` scales up
  control sizing and spacing the same way.
- **Complete widget coverage.** Every [`mobiler-ui`](https://crates.io/crates/mobiler-ui)
  `Widget` variant renders (the `match` is exhaustive, like the native shells), so a
  core that runs on Android/iOS renders identically on the web — including the **charts**
  (bar/line/stacked/pie/donut/rings/gauge + region/coverage), drawn with SVG + CSS here, the
  **video player** / **web view** / **PDF viewer**, and an interactive **map** (MapLibre-GL).

Build and serve with [Trunk](https://trunkrs.dev): `trunk serve`. See the
[`fullstack-todo`](https://github.com/mobiler/mobiler/tree/main/demos/fullstack-todo)
and [`coffee`](https://github.com/mobiler/mobiler/tree/main/demos/coffee) demos for
working examples (one core, three platforms).

## License

Dual-licensed under either [MIT](https://github.com/mobiler/mobiler/blob/main/LICENSE-MIT) or [Apache-2.0](https://github.com/mobiler/mobiler/blob/main/LICENSE-APACHE), at your option.