# Examples

> Small copyable SymbioteNative examples for React, Vue, Angular, Svelte, and Solid.

Examples stay intentionally small. Each one shows the same native behavior in
React, Vue, Angular, Svelte, and Solid so you can see which parts are shared
and which parts are framework-specific.

## Available examples

- [Counter](/docs/examples/counter/) — state, `view`, `text`, and `pressable`.
- [Pressable](/docs/examples/pressable/) — pressed state as a React render prop,
  or mirrored into local state on the other adapters.
- [TextInput](/docs/examples/text-input/) — controlled text input and event
  naming differences.

## Reading examples

The native route is the same in every example:

```txt
framework state → adapter component → @symbiote-native/engine → Fabric → native view
```

The code shape differs by adapter. React, Svelte, and Solid use camelCase
callback props (`onPress`) and children render functions. Svelte also adds
`bind:value` two-way binding on controlled inputs. Vue uses emits, `v-model`,
and slots. Angular uses `@Output()` `(event)` bindings everywhere, except the
permanent scroll-family exception (`onScroll` and friends), which stays a
callback `@Input()` since it can carry an `Animated.event(...)` marker.