Add class param to date picker (#56)

Co-authored-by: Cristobal Andrada <kandrelczyk@gmail.com>
This commit is contained in:
kandrelczyk 2023-12-21 06:35:15 +01:00 committed by GitHub
parent 62ce434774
commit fb06227fd8
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 23 additions and 8 deletions

View file

@ -81,6 +81,12 @@ pub fn CheckboxPage() -> impl IntoView {
<td></td>
<td>"Checkbox's content."</td>
</tr>
<tr>
<td>"class"</td>
<td>"MaybeSignal<String>"</td>
<td>"Default::default()"</td>
<td>"Addtional classes for the checkbox element."</td>
</tr>
</tbody>
</Table>
<h3>"CheckboxGroup Props"</h3>
@ -106,12 +112,6 @@ pub fn CheckboxPage() -> impl IntoView {
<td></td>
<td>"CheckboxGroup's content."</td>
</tr>
<tr>
<td>"class"</td>
<td>"MaybeSignal<String>"</td>
<td>"Default::default()"</td>
<td>"Addtional classes for the checkbox element."</td>
</tr>
</tbody>
</Table>
<h3>"CheckboxItem Props"</h3>
@ -137,6 +137,12 @@ pub fn CheckboxPage() -> impl IntoView {
<td>"None"</td>
<td>"Checkbox's label."</td>
</tr>
<tr>
<td>"class"</td>
<td>"MaybeSignal<String>"</td>
<td>"Default::default()"</td>
<td>"Addtional classes for the checkbox element."</td>
</tr>
</tbody>
</Table>
</div>

View file

@ -51,6 +51,12 @@ pub fn DatePickerPage() -> impl IntoView {
"Set the date picker value"
</td>
</tr>
<tr>
<td>"class"</td>
<td>"MaybeSignal<String>"</td>
<td>"Default::default()"</td>
<td>"Addtional classes for the date picker element."</td>
</tr>
</tbody>
</Table>
</div>

View file

@ -12,7 +12,10 @@ use panel::{Panel, PanelRef};
pub use theme::DatePickerTheme;
#[component]
pub fn DatePicker(#[prop(optional, into)] value: RwSignal<Option<NaiveDate>>) -> impl IntoView {
pub fn DatePicker(
#[prop(optional, into)] value: RwSignal<Option<NaiveDate>>,
#[prop(optional, into)] class: MaybeSignal<String>,
) -> impl IntoView {
mount_style("date-picker", include_str!("./date-picker.css"));
let date_picker_ref = create_node_ref::<html::Div>();
let is_show_panel = create_rw_signal(false);
@ -70,7 +73,7 @@ pub fn DatePicker(#[prop(optional, into)] value: RwSignal<Option<NaiveDate>>) ->
view! {
<Binder target_ref=date_picker_ref>
<div ref=date_picker_ref>
<Input value=show_date_text on_focus=open_panel on_blur=on_input_blur>
<Input class value=show_date_text on_focus=open_panel on_blur=on_input_blur>
<InputSuffix slot>
<Icon icon=Icon::from(AiIcon::AiCalendarOutlined) style="font-size: 18px"/>
</InputSuffix>