(props: TabTriggerProps)
| 278 | /// - `data-disabled`: Indicates if the tab trigger is disabled. Values are `true` or `false`. |
| 279 | #[component] |
| 280 | pub fn TabTrigger(props: TabTriggerProps) -> Element { |
| 281 | let mut ctx: TabsContext = use_context(); |
| 282 | |
| 283 | let value = props.value.clone(); |
| 284 | let selected = use_memo(move || (ctx.value)() == value); |
| 285 | |
| 286 | let disabled = move || (ctx.disabled)() || (props.disabled)(); |
| 287 | let item = use_item( |
| 288 | collection_item(ctx.focus, props.index) |
| 289 | .disabled(disabled) |
| 290 | .selected(move || selected.cloned()), |
| 291 | ); |
| 292 | let onmounted = item.onmounted(); |
| 293 | let tab_index = item.tabindex; |
| 294 | |
| 295 | rsx! { |
| 296 | button { |
| 297 | role: "tab", |
| 298 | id: props.id, |
| 299 | class: props.class, |
| 300 | tabindex: tab_index, |
| 301 | type: "button", |
| 302 | |
| 303 | aria_selected: selected, |
| 304 | aria_controls: (ctx.tab_content_ids)().get((props.index)()).cloned(), |
| 305 | "data-state": if selected() { "active" } else { "inactive" }, |
| 306 | "data-disabled": disabled(), |
| 307 | disabled: disabled(), |
| 308 | |
| 309 | onmounted, |
| 310 | onclick: move |_| { |
| 311 | let value = props.value.clone(); |
| 312 | if !selected() { |
| 313 | ctx.set_value.call(value); |
| 314 | } |
| 315 | }, |
| 316 | |
| 317 | onfocus: move |_| ctx.focus.set_focus(Some((props.index)())), |
| 318 | |
| 319 | onkeydown: move |event: Event<KeyboardData>| { |
| 320 | let key = event.key(); |
| 321 | let horizontal = (ctx.horizontal)(); |
| 322 | let mut prevent_default = true; |
| 323 | match key { |
| 324 | Key::ArrowUp if !horizontal => ctx.focus.focus_prev(), |
| 325 | Key::ArrowDown if !horizontal => ctx.focus.focus_next(), |
| 326 | Key::ArrowLeft if horizontal => ctx.focus.focus_prev(), |
| 327 | Key::ArrowRight if horizontal => ctx.focus.focus_next(), |
| 328 | Key::Home => ctx.focus.focus_first(), |
| 329 | Key::End => ctx.focus.focus_last(), |
| 330 | _ => prevent_default = false, |
| 331 | }; |
| 332 | if prevent_default { |
| 333 | event.prevent_default(); |
| 334 | } |
| 335 | }, |
| 336 | |
| 337 | ..props.attributes, |
nothing calls this directly
no test coverage detected