Оффлайн
- Регистрация
- 1 Мар 2015
- Сообщения
- 1,481
- Баллы
- 155
You know what's surprisingly hard to get right? A good slider component.
Sure, you can slap together a and call it a day, but once you start wanting custom styling, accessibility, double-thumb range selectors, and gasp actual usability... well, things get messy.
That's why we're beyond excited (and mildly sleep-deprived) to announce the release of : an open-source, fully customizable slider component for your favorite Rust & WASM frameworks like Yew, Dioxus, and Leptos.
It's slick. It's precise. It's accessible. And yes, Ferris the Crab personally approves ?.
? Why Slider RS Exists
Modern web apps need sliders that don't suck. Periodt. From fancy dashboards to media scrubbers and range filters, every app deserves a component that:
Looks good (without writing a CSS thesis). Works with screen readers (hello, accessibility!). Supports single & double thumbs (because sometimes, one thumb just ain't enough). Plays nice with WASM frameworks. Doesn't make you cry at 2 AM.Slider RS gives you fine-grained control over styling, behaviors, and accessibility, all while staying efficient, reactive, and smooth. And yes, it even has tooltips for people who like their sliders with a touch of extra flair.
? What Can Slider RS Do?
Let's break it down. Slider RS comes packed with features like:
- ?️ Single & Range Sliders: One thumb? Two thumbs? Your choice.
- ? Fully Customizable Styling: Classes, inline styles, custom thumb content, icon slots, tweak it till it's yours.
- ? Accessibility First: ARIA attributes, keyboard navigation, focus management, it's all baked in.
Reactive & Efficient: Optimized rendering with prop diffing.- ? Advanced Goodies: Tick marks, tooltips, step indicators, horizontal & vertical orientation, you name it.
- ?️ Smooth UX: Drag ranges, fine-tune with keyboard, hover for tooltips, smooth as butter.
Basically, it's the slider component you always wished you had, now in Rust-flavored WASM form.
? Getting Started
Here's how to get started with Yew:
1. Add Slider RS to Your Project
cargo add slider-rs --features=yew
2. Import the Slider Component
use yew::prelude::*;
use slider_rs::yew::Slider;
use slider_rs::Orientation;
3. Use It In Your App
#[function_component(App)]
pub fn app() -> Html {
let value = use_state(|| 50.0);
html! {
<Slider
min={0.0}
max={100.0}
step={1.0}
value={Some(*value)}
on_change={Callback::from(|val| log::info!("Slider changed to: {}", val))}
orientation={Orientation::Horizontal}
show_value=true
show_steps=true
/>
}
}
And boom, you've got a fully functional, accessible slider in your Rust app.
Even Ferris gave it a test drive (and you know how picky he is about UX).
? But Wait, There's More
Want to customize everything? Good news, you can. Slider RS comes with a rich set of props to tweak appearance and behavior to your heart's content:
| What You Can Do | ? How It Works |
|---|---|
| Single or Range Mode | double={true} for range selectors |
| Control Size & Color | Use size and color props |
| Custom Icons & Thumbs | Slots like icon_start, icon_end, custom_thumb_html |
| Full Styling Control | Classes & inline styles for every part |
| Show Values, Steps & Tooltips | show_value, show_steps, show_tooltip |
| Accessible by Default | ARIA labels, keyboard nav, focus events |
| Reactive Callbacks | on_change, on_change_range, on_focus, on_blur |
It's like a Swiss Army knife, but for sliders. And it won't poke you in the pocket.
? Ferris Approved, Open SASS Blessed
We built Slider RS because Rust+WASM developers deserve better components. It's open-source, MIT-licensed, and ready to be your new favorite UI friend. Whether you're building dashboards, music players, data visualizations, or just a very fancy volume knob, Slider RS has your back.
? Join the Party
Got ideas? Found a bug? Want to show off your slick Slider RS-powered app?
We're a friendly bunch of Rustaceans, building cool things for the web.
? Final Thoughts
If you're building Rust-based web apps, Slider RS is the slider component you didn't know you needed, but now you do. It's precise. It's pretty. It's accessible. And it's yours.
?️ A slider component for WASM frameworks.
?️ Slider RS
? Demo
| Framework | Live Demo |
|---|---|
| Yew | |
| Dioxus | TODO |
| Leptos | TODO |
Slider RS is a highly customizable, precision-focused slider component designed for WASM-based frameworks like Yew, Dioxus, and Leptos. It supports single and range (double-thumb) sliders, rich styling options, full keyboard navigation, and robust accessibility features for inclusive user interfaces.
? Why Use Slider RS?
The following features make Slider RS an essential component for modern web apps built with Rust & WebAssembly:
- ?️ Single & Range Sliders: Supports both single-value sliders and double-thumb range selectors out of the box.
- ? Fully Customizable Styling: Fine-grained control over classes, inline styles, custom thumb content, and icon slots.
- ? Accessibility Ready: Built-in ARIA support, keyboard interactions, and focus management for screen readers.
- Reactive & Efficient: Powered by Callback system with optimized rendering via prop diffing.
- ? Advanced Features…