tablo_ui/components/primitives/
input.rs

1// SYNC: topcoat-ui-registry@0.11.0 sha256:c96f34a75f49d24388eb854b864033954060896ae008e76a229ab306299185fd — do not hand-edit. Sync via `cargo xtask sync-topcoat-ui` (ADR-0007).
2use topcoat::{
3    Result,
4    view::{Attributes, StaticClass, View, class, component, view},
5};
6
7/// Classes for the input's dimensions, border, and interaction states.
8const INPUT: StaticClass = class!(
9    "h-9 w-full min-w-0 rounded-lg border border-border bg-transparent px-3",
10    "text-sm transition-colors outline-none",
11    "placeholder:text-muted-foreground",
12    "file:mr-3 file:h-full file:border-0 file:bg-transparent file:text-sm file:font-medium",
13    "focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
14    "aria-invalid:border-destructive aria-invalid:focus-visible:ring-destructive",
15    "focus-visible:ring-offset-background disabled:pointer-events-none disabled:opacity-50",
16);
17
18/// A styled input.
19///
20/// Pass input attributes and event handlers through `attrs`. Extra classes are added to
21/// the input's classes. It fills its container by default. Set `aria-invalid="true"` to
22/// show the error border and focus ring.
23///
24/// ```ignore
25/// view! {
26///     input(attrs: attributes! { type="email" placeholder="you@example.com" })
27/// }
28/// ```
29#[component]
30pub async fn input(#[default] mut attrs: Attributes) -> Result<impl View> {
31    Ok(view! { <input class=(class!(INPUT, attrs.remove("class"))) (attrs)> })
32}
tablo_ui/components/primitives/input.rs

tablo_ui/components/primitives/
input.rs
