Skip to main content

orbital_base_components/table/
table_component.rs

1use leptos::{either::Either, prelude::*};
2
3#[component]
4pub fn BaseTable(
5    #[prop(optional, into)] class: MaybeProp<String>,
6    children: Children,
7) -> impl IntoView {
8    view! {
9        <table
10            class=move || {
11                let extra = class.get().unwrap_or_default();
12                if extra.is_empty() {
13                    "orbital-table".to_string()
14                } else {
15                    format!("orbital-table {extra}")
16                }
17            }
18        >
19            {children()}
20        </table>
21    }
22}
23
24#[component]
25pub fn BaseTableHeader(
26    #[prop(optional, into)] class: MaybeProp<String>,
27    children: Children,
28) -> impl IntoView {
29    view! {
30        <thead
31            class=move || {
32                let extra = class.get().unwrap_or_default();
33                if extra.is_empty() {
34                    "orbital-table-header".to_string()
35                } else {
36                    format!("orbital-table-header {extra}")
37                }
38            }
39        >
40            {children()}
41        </thead>
42    }
43}
44
45#[component]
46pub fn BaseTableBody(
47    #[prop(optional, into)] class: MaybeProp<String>,
48    children: Children,
49) -> impl IntoView {
50    view! {
51        <tbody
52            class=move || {
53                let extra = class.get().unwrap_or_default();
54                if extra.is_empty() {
55                    "orbital-table-body".to_string()
56                } else {
57                    format!("orbital-table-body {extra}")
58                }
59            }
60        >
61            {children()}
62        </tbody>
63    }
64}
65
66#[component]
67pub fn BaseTableRow(
68    #[prop(optional, into)] class: MaybeProp<String>,
69    children: Children,
70) -> impl IntoView {
71    view! {
72        <tr
73            class=move || {
74                let extra = class.get().unwrap_or_default();
75                if extra.is_empty() {
76                    "orbital-table-row".to_string()
77                } else {
78                    format!("orbital-table-row {extra}")
79                }
80            }
81        >
82            {children()}
83        </tr>
84    }
85}
86
87#[component]
88pub fn BaseTableCell(
89    #[prop(optional, into)] class: MaybeProp<String>,
90    #[prop(optional, into)] style: MaybeProp<String>,
91    #[prop(default = None)] colspan: Option<u32>,
92    #[prop(default = None)] rowspan: Option<u32>,
93    #[prop(optional)] children: Option<Children>,
94) -> impl IntoView {
95    view! {
96        <td
97            class=move || {
98                let extra = class.get().unwrap_or_default();
99                if extra.is_empty() {
100                    "orbital-table-cell".to_string()
101                } else {
102                    format!("orbital-table-cell {extra}")
103                }
104            }
105            style=move || style.get()
106            colspan=colspan
107            rowspan=rowspan
108        >
109            {if let Some(children) = children {
110                Either::Left(children())
111            } else {
112                Either::Right(())
113            }}
114        </td>
115    }
116}
117
118#[component]
119pub fn BaseTableCellLayout(
120    #[prop(optional, into)] class: MaybeProp<String>,
121    #[prop(optional, into)] truncate: Signal<bool>,
122    children: Children,
123) -> impl IntoView {
124    view! {
125        <div
126            class=move || {
127                let mut parts = vec!["orbital-table-cell-layout".to_string()];
128                if truncate.get() {
129                    parts.push("orbital-table-cell-layout--truncate".to_string());
130                }
131                if let Some(extra) = class.get() {
132                    if !extra.is_empty() {
133                        parts.push(extra);
134                    }
135                }
136                parts.join(" ")
137            }
138        >
139            <div class="orbital-table-cell-layout__content">
140                <span class="orbital-table-cell-layout__main">{children()}</span>
141            </div>
142        </div>
143    }
144}