generated from mitchell/rust_template
remove todos in favor of issues. Fmt
This commit is contained in:
parent
ead75f050a
commit
749ccc272b
@ -38,8 +38,6 @@ impl<FS, FD, F> RenderFn<FS, FD> for F where
|
||||
{
|
||||
}
|
||||
|
||||
// TODO: vanity signals should have an optional getter.
|
||||
|
||||
/// A trait for the data needed to render an read-only control.
|
||||
pub trait VanityControlData: 'static {
|
||||
/// Builds the control, returning the [`View`] that was built.
|
||||
|
||||
@ -7,19 +7,6 @@ use crate::controls::{
|
||||
use leptos::*;
|
||||
use std::rc::Rc;
|
||||
|
||||
// TODO: move validation from happening on set, to happening on get
|
||||
// I think.
|
||||
// That might fix some issues where the field updates but the validation doesn't
|
||||
/// I don't know if that will cause any loops or not...
|
||||
|
||||
// TODO: send the server fn directly instead of parsing from form data perhaps.
|
||||
// This would need a note in the docs about graceful degration.
|
||||
|
||||
// TODO: some components dont have validation functions. They should not be able
|
||||
// to specify one in the builder.
|
||||
|
||||
// TODO: add button
|
||||
|
||||
pub enum GridFormStylingAttributes {
|
||||
Width(u32),
|
||||
}
|
||||
@ -31,20 +18,12 @@ impl FormStyle for GridFormStyle {
|
||||
type StylingAttributes = GridFormStylingAttributes;
|
||||
|
||||
fn form_frame(&self, children: View) -> View {
|
||||
view! {
|
||||
<div class="form_grid">
|
||||
{children}
|
||||
</div>
|
||||
}
|
||||
view! { <div class="form_grid">{children}</div> }
|
||||
.into_view()
|
||||
}
|
||||
|
||||
fn heading(&self, control: ControlRenderData<Self, HeadingData>) -> View {
|
||||
view! {
|
||||
<h2 class="form_heading">
|
||||
{&control.data.title}
|
||||
</h2>
|
||||
}
|
||||
view! { <h2 class="form_heading">{&control.data.title}</h2> }
|
||||
.into_view()
|
||||
}
|
||||
|
||||
@ -66,25 +45,24 @@ impl FormStyle for GridFormStyle {
|
||||
view! {
|
||||
<div style:grid-column=format!("span {}", width)>
|
||||
<div>
|
||||
<label for={&control.data.name} class="form_label">
|
||||
<label for=&control.data.name class="form_label">
|
||||
{control.data.label.as_ref()}
|
||||
</label>
|
||||
<span class="form_error">
|
||||
{move || validation_state.get().err()}
|
||||
</span>
|
||||
<span class="form_error">{move || validation_state.get().err()}</span>
|
||||
</div>
|
||||
<input
|
||||
type=control.data.input_type
|
||||
id=&control.data.name
|
||||
name=control.data.name
|
||||
placeholder=control.data.placeholder
|
||||
prop:value=move || value_getter.get()
|
||||
on:focusout=move |ev| {
|
||||
value_setter(event_target_value(&ev));
|
||||
}
|
||||
class="form_input"
|
||||
class=("form_input_invalid", move || validation_state.get().is_err())
|
||||
/>
|
||||
<input
|
||||
type=control.data.input_type
|
||||
id=&control.data.name
|
||||
name=control.data.name
|
||||
placeholder=control.data.placeholder
|
||||
prop:value=move || value_getter.get()
|
||||
on:focusout=move |ev| {
|
||||
value_setter(event_target_value(&ev));
|
||||
}
|
||||
|
||||
class="form_input"
|
||||
class=("form_input_invalid", move || validation_state.get().is_err())
|
||||
/>
|
||||
</div>
|
||||
}
|
||||
.into_view()
|
||||
@ -117,31 +95,26 @@ impl FormStyle for GridFormStyle {
|
||||
|
||||
view! {
|
||||
<div>
|
||||
<span>{control.data.label}</span>
|
||||
{move || validation_state.get().err()}
|
||||
<select
|
||||
id=&control.data.name
|
||||
name=control.data.name
|
||||
class="form_input"
|
||||
on:change=move |ev| {
|
||||
value_setter(event_target_value(&ev));
|
||||
}
|
||||
>
|
||||
{options_view}
|
||||
</select>
|
||||
<span>{control.data.label}</span>
|
||||
{move || validation_state.get().err()}
|
||||
<select
|
||||
id=&control.data.name
|
||||
name=control.data.name
|
||||
class="form_input"
|
||||
on:change=move |ev| {
|
||||
value_setter(event_target_value(&ev));
|
||||
}
|
||||
>
|
||||
|
||||
{options_view}
|
||||
</select>
|
||||
</div>
|
||||
}
|
||||
.into_view()
|
||||
}
|
||||
|
||||
fn submit(&self, control: ControlRenderData<Self, SubmitData>) -> View {
|
||||
view! {
|
||||
<input
|
||||
type="submit"
|
||||
value=control.data.text
|
||||
class="col-span-full form_submit"
|
||||
/>
|
||||
}
|
||||
view! { <input type="submit" value=control.data.text class="col-span-full form_submit"/> }
|
||||
.into_view()
|
||||
}
|
||||
|
||||
@ -154,17 +127,18 @@ impl FormStyle for GridFormStyle {
|
||||
) -> View {
|
||||
view! {
|
||||
<div>
|
||||
{move || format!("{:?}", validation_state.get())}
|
||||
<textarea
|
||||
id=&control.data.name
|
||||
name=control.data.name
|
||||
placeholder=control.data.placeholder
|
||||
class="form_input"
|
||||
prop:value=move || value_getter.get()
|
||||
on:change=move |ev| {
|
||||
value_setter(event_target_value(&ev));
|
||||
}
|
||||
/>
|
||||
{move || format!("{:?}", validation_state.get())}
|
||||
<textarea
|
||||
id=&control.data.name
|
||||
name=control.data.name
|
||||
placeholder=control.data.placeholder
|
||||
class="form_input"
|
||||
prop:value=move || value_getter.get()
|
||||
on:change=move |ev| {
|
||||
value_setter(event_target_value(&ev));
|
||||
}
|
||||
></textarea>
|
||||
|
||||
</div>
|
||||
}
|
||||
.into_view()
|
||||
@ -179,9 +153,7 @@ impl FormStyle for GridFormStyle {
|
||||
_control: ControlRenderData<Self, HiddenData>,
|
||||
value_getter: Signal<String>,
|
||||
) -> View {
|
||||
view! {
|
||||
<input prop:value=value_getter style="visibility: hidden"/>
|
||||
}
|
||||
view! { <input prop:value=value_getter style="visibility: hidden"/> }
|
||||
.into_view()
|
||||
}
|
||||
|
||||
@ -213,13 +185,21 @@ impl FormStyle for GridFormStyle {
|
||||
let o_clone1 = o.clone();
|
||||
let o_clone2 = o.clone();
|
||||
view! {
|
||||
<input type="radio" id=o.clone()_str name=&control.data.name value=o.clone() prop:checked=move || {value_getter.get() == o_clone1} on:input=move |ev| {
|
||||
let new_value = event_target_checked(&ev);
|
||||
if new_value {
|
||||
value_setter(o_clone2.clone());
|
||||
<input
|
||||
type="radio"
|
||||
id=o.clone()
|
||||
_str
|
||||
name=&control.data.name
|
||||
value=o.clone()
|
||||
prop:checked=move || { value_getter.get() == o_clone1 }
|
||||
on:input=move |ev| {
|
||||
let new_value = event_target_checked(&ev);
|
||||
if new_value {
|
||||
value_setter(o_clone2.clone());
|
||||
}
|
||||
}
|
||||
} />
|
||||
<label for=&o> {&o} </label>
|
||||
/>
|
||||
<label for=&o>{&o}</label>
|
||||
<br/>
|
||||
}
|
||||
})
|
||||
@ -228,14 +208,15 @@ impl FormStyle for GridFormStyle {
|
||||
view! {
|
||||
<div style:grid-column=format!("span {}", width)>
|
||||
<div>
|
||||
<label for={&control.data.name} class="form_label">
|
||||
<label for=&control.data.name class="form_label">
|
||||
{control.data.label.as_ref()}
|
||||
</label>
|
||||
<span class="form_error">
|
||||
{move || validation_state.get().err()}
|
||||
</span>
|
||||
<span class="form_error">{move || validation_state.get().err()}</span>
|
||||
</div>
|
||||
<div class="form_input" class:form_input_invalid=move || validation_state.get().is_err()>
|
||||
<div
|
||||
class="form_input"
|
||||
class:form_input_invalid=move || validation_state.get().is_err()
|
||||
>
|
||||
{buttons_view}
|
||||
</div>
|
||||
</div>
|
||||
@ -258,7 +239,7 @@ impl FormStyle for GridFormStyle {
|
||||
|
||||
view! {
|
||||
<div style:grid-column=format!("span {}", width)>
|
||||
<label for={&control.data.name} class="form_label">
|
||||
<label for=&control.data.name class="form_label">
|
||||
{control.data.label.as_ref()}
|
||||
</label>
|
||||
<label class="form_input" for=&control.data.name>
|
||||
@ -272,6 +253,7 @@ impl FormStyle for GridFormStyle {
|
||||
value_setter(new_value);
|
||||
}
|
||||
/>
|
||||
|
||||
<span>{control.data.label}</span>
|
||||
</label>
|
||||
</div>
|
||||
@ -298,18 +280,21 @@ impl FormStyle for GridFormStyle {
|
||||
view! {
|
||||
<div style:grid-column=format!("span {}", width)>
|
||||
<div>
|
||||
<label for={&control.data.name} class="form_label">
|
||||
<label for=&control.data.name class="form_label">
|
||||
{control.data.label.as_ref()}
|
||||
</label>
|
||||
<span class="form_error">
|
||||
{move || validation_state.get().err()}
|
||||
</span>
|
||||
<span class="form_error">{move || validation_state.get().err()}</span>
|
||||
</div>
|
||||
<input type="number" id=&control.data.name name=&control.data.name step=control.data.step
|
||||
<input
|
||||
type="number"
|
||||
id=&control.data.name
|
||||
name=&control.data.name
|
||||
step=control.data.step
|
||||
prop:value=move || value_getter.get()
|
||||
on:change=move |ev| {
|
||||
value_setter(event_target_value(&ev));
|
||||
}
|
||||
|
||||
class="form_input"
|
||||
/>
|
||||
</div>
|
||||
@ -321,9 +306,7 @@ impl FormStyle for GridFormStyle {
|
||||
_control: ControlRenderData<Self, OutputData>,
|
||||
value_getter: Signal<String>,
|
||||
) -> View {
|
||||
view! {
|
||||
<div> {move || value_getter.get()} </div>
|
||||
}
|
||||
view! { <div>{move || value_getter.get()}</div> }
|
||||
.into_view()
|
||||
}
|
||||
|
||||
@ -344,14 +327,17 @@ impl FormStyle for GridFormStyle {
|
||||
view! {
|
||||
<div style:grid-column=format!("span {}", width)>
|
||||
<div>
|
||||
<label for={&control.data.name} class="form_label">
|
||||
<label for=&control.data.name class="form_label">
|
||||
{control.data.label.as_ref()}
|
||||
</label>
|
||||
<span class="form_error">
|
||||
{move || validation_state.get().err()}
|
||||
</span>
|
||||
<span class="form_error">{move || validation_state.get().err()}</span>
|
||||
</div>
|
||||
<input type="range" id=&control.data.name name=&control.data.name min=control.data.min max=control.data.max
|
||||
<input
|
||||
type="range"
|
||||
id=&control.data.name
|
||||
name=&control.data.name
|
||||
min=control.data.min
|
||||
max=control.data.max
|
||||
prop:value=move || value_getter.get()
|
||||
on:input=move |ev| {
|
||||
let value = event_target_value(&ev).parse::<i32>().ok();
|
||||
@ -359,6 +345,7 @@ impl FormStyle for GridFormStyle {
|
||||
value_setter(value);
|
||||
}
|
||||
}
|
||||
|
||||
class="form_input"
|
||||
/>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user