monadical/opencode
13
0
Fork 0
Code Issues Pull Requests Actions 5 Packages Projects Releases Wiki Activity

chore(desktop): vertical tabs

Browse Source
This commit is contained in:
Adam
2025-12-27 19:43:52 -06:00
parent 7ea0d37ee3
commit 953e4e9446
2 changed files with 70 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
packages/ui/src/components/tabs.tsx
View File

@@ -4,6 +4,7 @@ import type { ComponentProps, ParentProps } from "solid-js"
export interface TabsProps extends ComponentProps<typeof Kobalte> {
variant?: "normal" | "alt"
orientation?: "horizontal" | "vertical"
}
export interface TabsListProps extends ComponentProps<typeof Kobalte.List> {}
export interface TabsTriggerProps extends ComponentProps<typeof Kobalte.Trigger> {
@@ -16,12 +17,14 @@ export interface TabsTriggerProps extends ComponentProps<typeof Kobalte.Trigger>
export interface TabsContentProps extends ComponentProps<typeof Kobalte.Content> {}
function TabsRoot(props: TabsProps) {
const [split, rest] = splitProps(props, ["class", "classList", "variant"])
const [split, rest] = splitProps(props, ["class", "classList", "variant", "orientation"])
return (
<Kobalte
{...rest}
orientation={split.orientation}
data-component="tabs"
data-variant={split.variant || "normal"}
data-orientation={split.orientation || "horizontal"}
classList={{
...(split.classList ?? {}),
[split.class ?? ""]: !!split.class,