dioxus-hoverfx 0.1.0-alpha.2

Dioxus components and native metadata for worker-first cursor hover effects.
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
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114

# dioxus-hoverfx

Dioxus components and native metadata for worker-first cursor hover effects.

This crate is part of the Dioxus SSR package workspace. The APIs are pre-1.0 and may change between releases while the package family stabilizes.

## Install

```toml
[dependencies]
dioxus-hoverfx = "0.1.0-alpha.1"
```

## What It Provides

- `HoverFxProvider`, `HoverFxTarget`, and `HoverFxCard` components.
- SSR-safe controls for radius, shape, falloff, and strength.
- Native package action metadata for init, refresh, and control updates.
- Re-exports for `dioxus-hoverfx-core` config, registry, presets, shapes, falloff, renderer, and helpers.

## Targets

```rust
use dioxus::prelude::*;
use dioxus_hoverfx::{
    HoverFxCard, HoverFxFalloff, HoverFxPreset, HoverFxProvider, HoverFxShape, HoverFxTarget,
};

#[component]
fn HoverFxDemo() -> Element {
    rsx! {
        HoverFxProvider { class: "hoverfx-grid",
            HoverFxCard {
                preset: HoverFxPreset::Spotlight,
                radius: 320,
                shape: HoverFxShape::Circle,
                falloff: HoverFxFalloff::Smooth,
                strength: 1.2,
                class: "demo-card",
                "Spotlight card"
            }

            HoverFxTarget {
                effect: "brand-glow",
                radius: 420,
                shape: HoverFxShape::RoundedRect,
                falloff: HoverFxFalloff::Exponential,
                class: "demo-card custom-hoverfx",
                "Custom CSS/Rust effect target"
            }
        }
    }
}
```

Tagged targets emit `data-dxh-effect` and optional override attributes for radius, shape, falloff, and strength. The runtime can activate effects when the cursor is near the target, not only after the pointer enters the element.

## Controls

```rust
use dioxus::prelude::*;
use dioxus_hoverfx::{
    HoverFxFalloffSelect, HoverFxRadiusSlider, HoverFxShapeSelect, HoverFxStrengthSlider,
};

#[component]
fn HoverFxControls() -> Element {
    rsx! {
        div { class: "hoverfx-controls",
            HoverFxRadiusSlider { value: 280, apply_to_all: true }
            HoverFxShapeSelect { apply_to_all: true }
            HoverFxFalloffSelect { apply_to_all: true }
            HoverFxStrengthSlider { value: 100, apply_to_all: true }
        }
    }
}
```

Controls render SSR-safe HTML using resumability attributes:

- `data-dxr-on-input="hoverfx.radius"`
- `data-dxr-on-change="hoverfx.shape"`
- `data-dxr-on-change="hoverfx.falloff"`
- `data-dxr-on-input="hoverfx.strength"`

Each control includes stable generated ids, accessible labels, and `aria-live` output/current-value text.

By default, control updates preserve per-target radius, shape, falloff, and strength attributes. Set `apply_to_all: true` to emit `data-dxh-apply-to="all"` and make a lab control override every target on the page, including targets with their own preset defaults.

## Native Metadata

Use `hoverfx_native_package_actions(route)` to advertise native-port actions for non-web shells. `hoverfx_native_action` returns the configured handler id and fallback mode so native hosts can mirror the same controls.

Workspace package dependencies:

- `dioxus-hoverfx-core`
- `dioxus-native-port`

## Feature Flags

- `default`: `web`
- `desktop`: `dioxus/desktop`
- `native`: `dioxus/native`, `dioxus-native-port/native`
- `server`: `dioxus/server`
- `web`: `dioxus/web`, `dioxus-native-port/web`

## License

Licensed under either of:

- MIT license ([LICENSE-MIT](https://github.com/Collin-Budrick/dioxus_template/blob/main/LICENSE-MIT))
- Apache License, Version 2.0 ([LICENSE-APACHE](https://github.com/Collin-Budrick/dioxus_template/blob/main/LICENSE-APACHE))

Repository: <https://github.com/Collin-Budrick/dioxus_template>