@neynar/ui 1.0.3 → 1.0.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/ui/button.d.ts.map +1 -1
- package/dist/components/ui/button.js +1 -0
- package/dist/components/ui/button.js.map +1 -1
- package/dist/components/ui/tabs.js +1 -1
- package/dist/components/ui/tabs.js.map +1 -1
- package/package.json +1 -1
- package/src/components/ui/button.tsx +2 -0
- package/src/components/ui/tabs.tsx +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/components/ui/button.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/components/ui/button.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAClE,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAIlE,QAAA,MAAM,cAAc;;;8EAwCnB,CAAC;AAEF;;;GAGG;AACH,KAAK,WAAW,GAAG,eAAe,CAAC,KAAK,GAAG,YAAY,CAAC,OAAO,cAAc,CAAC,CAAC;AAE/E;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,iBAAS,MAAM,CAAC,EACd,SAAS,EACT,OAAmB,EACnB,IAAgB,EAChB,GAAG,KAAK,EACT,EAAE,WAAW,2CAQb;AAED,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,KAAK,WAAW,EAAE,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button.js","sources":["../../../src/components/ui/button.tsx"],"sourcesContent":["
|
|
1
|
+
{"version":3,"file":"button.js","sources":["../../../src/components/ui/button.tsx"],"sourcesContent":["\"use client\";\n\nimport { Button as ButtonPrimitive } from \"@base-ui/react/button\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\n\nimport { cn } from \"@/lib/utils\";\n\nconst buttonVariants = cva(\n \"focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 rounded-md border border-transparent bg-clip-padding text-sm font-medium focus-visible:ring-[3px] aria-invalid:ring-[3px] [&_svg:not([class*='size-'])]:size-4 inline-flex items-center justify-center whitespace-nowrap transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none shrink-0 [&_svg]:shrink-0 outline-none group/button select-none\",\n {\n variants: {\n variant: {\n default: \"bg-primary text-primary-foreground hover:bg-primary/80\",\n outline:\n \"border-border bg-background hover:bg-muted hover:text-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 aria-expanded:bg-muted aria-expanded:text-foreground shadow-xs\",\n secondary:\n \"bg-secondary text-secondary-foreground hover:bg-secondary/80 aria-expanded:bg-secondary aria-expanded:text-secondary-foreground\",\n ghost:\n \"hover:bg-muted hover:text-foreground dark:hover:bg-muted/50 aria-expanded:bg-muted aria-expanded:text-foreground\",\n destructive:\n \"bg-destructive/10 hover:bg-destructive/20 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/20 text-destructive focus-visible:border-destructive/40 dark:hover:bg-destructive/30\",\n success:\n \"bg-success/10 hover:bg-success/20 focus-visible:ring-success/20 dark:focus-visible:ring-success/40 dark:bg-success/20 text-success focus-visible:border-success/40 dark:hover:bg-success/30\",\n warning:\n \"bg-warning/10 hover:bg-warning/20 focus-visible:ring-warning/20 dark:focus-visible:ring-warning/40 dark:bg-warning/20 text-warning focus-visible:border-warning/40 dark:hover:bg-warning/30\",\n info: \"bg-info/10 hover:bg-info/20 focus-visible:ring-info/20 dark:focus-visible:ring-info/40 dark:bg-info/20 text-info focus-visible:border-info/40 dark:hover:bg-info/30\",\n link: \"text-primary underline-offset-4 hover:underline\",\n },\n size: {\n default:\n \"h-9 gap-1.5 px-2.5 in-data-[slot=button-group]:rounded-md has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2\",\n xs: \"h-6 gap-1 rounded-[min(var(--radius-md),8px)] px-2 text-xs in-data-[slot=button-group]:rounded-md has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3\",\n sm: \"h-8 gap-1 rounded-[min(var(--radius-md),10px)] px-2.5 in-data-[slot=button-group]:rounded-md has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5\",\n lg: \"h-10 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-3 has-data-[icon=inline-start]:pl-3\",\n icon: \"size-9\",\n \"icon-xs\":\n \"size-6 rounded-[min(var(--radius-md),8px)] in-data-[slot=button-group]:rounded-md [&_svg:not([class*='size-'])]:size-3\",\n \"icon-sm\":\n \"size-8 rounded-[min(var(--radius-md),10px)] in-data-[slot=button-group]:rounded-md\",\n \"icon-lg\": \"size-10\",\n },\n },\n defaultVariants: {\n variant: \"default\",\n size: \"default\",\n },\n },\n);\n\n/**\n * Props for the Button component.\n * Combines Base UI Button props with variant styling options.\n */\ntype ButtonProps = ButtonPrimitive.Props & VariantProps<typeof buttonVariants>;\n\n/**\n * Versatile button component with multiple visual variants and sizes.\n *\n * Supports icon placement via `data-icon=\"inline-start\"` or `data-icon=\"inline-end\"` attributes\n * on child elements. Use the `render` prop to compose with other components or change the\n * underlying element while maintaining button semantics.\n *\n * @example\n * ```tsx\n * // Basic button\n * <Button variant=\"default\">Click me</Button>\n *\n * // With icon\n * <Button>\n * <PlusIcon data-icon=\"inline-start\" />\n * Create\n * </Button>\n *\n * // Icon only\n * <Button size=\"icon\" aria-label=\"Settings\">\n * <SettingsIcon />\n * </Button>\n *\n * // Custom element\n * <Button render={<a href=\"/login\" />}>Sign in</Button>\n * ```\n */\nfunction Button({\n className,\n variant = \"default\",\n size = \"default\",\n ...props\n}: ButtonProps) {\n return (\n <ButtonPrimitive\n data-slot=\"button\"\n className={cn(buttonVariants({ variant, size, className }))}\n {...props}\n />\n );\n}\n\nexport { Button, buttonVariants, type ButtonProps };\n"],"names":["ButtonPrimitive"],"mappings":";;;;;AAOA;AAAuB;AACrB;AACA;AACY;AACC;AACE;AAEP;AAEA;AAEA;AAEA;AAEA;AAEA;AACI;AACA;AAAA;AAEF;AAEF;AACE;AACA;AACA;AACE;AAEJ;AAEA;AACS;AAAA;AACb;AAEe;AACN;AACH;AAAA;AAGZ;AAmCA;AAAgB;AACd;AACU;AACH;AAET;AACE;AACE;AAACA;AAAA;AACW;AACgD;AACtD;AAAA;AAGV;;;;;"}
|
|
@@ -51,7 +51,7 @@ function TabsTrigger({ className, ...props }) {
|
|
|
51
51
|
{
|
|
52
52
|
"data-slot": "tabs-trigger",
|
|
53
53
|
className: cn(
|
|
54
|
-
"gap-1.5 rounded-md border border-transparent px-2 py-1 text-sm font-medium group-data-[variant=default]/tabs-list:data-active:shadow-sm group-data-[variant=line]/tabs-list:data-active:shadow-none [&_svg:not([class*='size-'])]:size-4 focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:outline-ring text-foreground/60 hover:text-foreground dark:text-muted-foreground dark:hover:text-foreground relative inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center whitespace-nowrap transition-all group-data-[orientation=vertical]/tabs:w-full group-data-[orientation=vertical]/tabs:justify-start focus-visible:ring-[3px] focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0",
|
|
54
|
+
"gap-1.5 rounded-md border border-transparent px-2 py-1 text-sm font-medium group-data-[variant=default]/tabs-list:data-active:shadow-sm group-data-[variant=line]/tabs-list:data-active:shadow-none [&_svg:not([class*='size-'])]:size-4 focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:outline-ring text-foreground/60 hover:text-foreground dark:text-muted-foreground dark:hover:text-foreground relative inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center whitespace-nowrap transition-all group-data-[orientation=vertical]/tabs:w-full group-data-[orientation=vertical]/tabs:justify-start focus-visible:ring-[3px] focus-visible:outline-1 data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0",
|
|
55
55
|
"group-data-[variant=line]/tabs-list:bg-transparent group-data-[variant=line]/tabs-list:data-active:bg-transparent dark:group-data-[variant=line]/tabs-list:data-active:border-transparent dark:group-data-[variant=line]/tabs-list:data-active:bg-transparent",
|
|
56
56
|
"data-active:bg-background dark:data-active:text-foreground dark:data-active:border-input dark:data-active:bg-input/30 data-active:text-foreground",
|
|
57
57
|
"after:bg-foreground after:absolute after:opacity-0 after:transition-opacity group-data-[orientation=horizontal]/tabs:after:inset-x-0 group-data-[orientation=horizontal]/tabs:after:bottom-[-5px] group-data-[orientation=horizontal]/tabs:after:h-0.5 group-data-[orientation=vertical]/tabs:after:inset-y-0 group-data-[orientation=vertical]/tabs:after:-right-1 group-data-[orientation=vertical]/tabs:after:w-0.5 group-data-[variant=line]/tabs-list:data-active:after:opacity-100",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tabs.js","sources":["../../../src/components/ui/tabs.tsx"],"sourcesContent":["\"use client\";\n\nimport { Tabs as TabsPrimitive } from \"@base-ui/react/tabs\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\n\nimport { cn } from \"@/lib/utils\";\n\ntype TabsProps = TabsPrimitive.Root.Props;\n\n/**\n * Root container for tabs component that manages tab state and orientation.\n * Supports both controlled and uncontrolled usage with horizontal or vertical layout.\n */\nfunction Tabs({ className, orientation = \"horizontal\", ...props }: TabsProps) {\n return (\n <TabsPrimitive.Root\n data-slot=\"tabs\"\n data-orientation={orientation}\n className={cn(\n \"gap-2 group/tabs flex data-[orientation=horizontal]:flex-col\",\n className,\n )}\n {...props}\n />\n );\n}\n\nconst tabsListVariants = cva(\n \"rounded-lg p-[3px] group-data-horizontal/tabs:h-9 data-[variant=line]:rounded-none group/tabs-list text-muted-foreground inline-flex w-fit items-center justify-center group-data-[orientation=vertical]/tabs:h-fit group-data-[orientation=vertical]/tabs:flex-col\",\n {\n variants: {\n variant: {\n default: \"bg-muted\",\n line: \"gap-1 bg-transparent\",\n },\n },\n defaultVariants: {\n variant: \"default\",\n },\n },\n);\n\ntype TabsListProps = TabsPrimitive.List.Props &\n VariantProps<typeof tabsListVariants>;\n\n/**\n * Container for tab triggers with two visual variants.\n * @param variant - Visual style: \"default\" (background highlight) or \"line\" (underline indicator). @default \"default\"\n */\nfunction TabsList({ className, variant = \"default\", ...props }: TabsListProps) {\n return (\n <TabsPrimitive.List\n data-slot=\"tabs-list\"\n data-variant={variant}\n className={cn(tabsListVariants({ variant }), className)}\n {...props}\n />\n );\n}\n\ntype TabsTriggerProps = TabsPrimitive.Tab.Props;\n\n/**\n * Individual tab button that activates the corresponding panel.\n * Supports icons, badges, and disabled state. Active tab has visual highlight or underline based on variant.\n */\nfunction TabsTrigger({ className, ...props }: TabsTriggerProps) {\n return (\n <TabsPrimitive.Tab\n data-slot=\"tabs-trigger\"\n className={cn(\n \"gap-1.5 rounded-md border border-transparent px-2 py-1 text-sm font-medium group-data-[variant=default]/tabs-list:data-active:shadow-sm group-data-[variant=line]/tabs-list:data-active:shadow-none [&_svg:not([class*='size-'])]:size-4 focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:outline-ring text-foreground/60 hover:text-foreground dark:text-muted-foreground dark:hover:text-foreground relative inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center whitespace-nowrap transition-all group-data-[orientation=vertical]/tabs:w-full group-data-[orientation=vertical]/tabs:justify-start focus-visible:ring-[3px] focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n \"group-data-[variant=line]/tabs-list:bg-transparent group-data-[variant=line]/tabs-list:data-active:bg-transparent dark:group-data-[variant=line]/tabs-list:data-active:border-transparent dark:group-data-[variant=line]/tabs-list:data-active:bg-transparent\",\n \"data-active:bg-background dark:data-active:text-foreground dark:data-active:border-input dark:data-active:bg-input/30 data-active:text-foreground\",\n \"after:bg-foreground after:absolute after:opacity-0 after:transition-opacity group-data-[orientation=horizontal]/tabs:after:inset-x-0 group-data-[orientation=horizontal]/tabs:after:bottom-[-5px] group-data-[orientation=horizontal]/tabs:after:h-0.5 group-data-[orientation=vertical]/tabs:after:inset-y-0 group-data-[orientation=vertical]/tabs:after:-right-1 group-data-[orientation=vertical]/tabs:after:w-0.5 group-data-[variant=line]/tabs-list:data-active:after:opacity-100\",\n className,\n )}\n {...props}\n />\n );\n}\n\ntype TabsContentProps = TabsPrimitive.Panel.Props;\n\n/**\n * Content panel that displays when its corresponding tab is active.\n * Automatically hidden/shown based on active tab value.\n */\nfunction TabsContent({ className, ...props }: TabsContentProps) {\n return (\n <TabsPrimitive.Panel\n data-slot=\"tabs-content\"\n className={cn(\"text-sm flex-1 outline-none\", className)}\n {...props}\n />\n );\n}\n\nexport {\n Tabs,\n TabsList,\n TabsTrigger,\n TabsContent,\n tabsListVariants,\n type TabsProps,\n type TabsListProps,\n type TabsTriggerProps,\n type TabsContentProps,\n};\n"],"names":["TabsPrimitive.Root","TabsPrimitive.List","TabsPrimitive.Tab","TabsPrimitive.Panel"],"mappings":";;;;;;;;AAaA;AACE;AACE;AAACA;AAAA;AACW;AACQ;AACP;AACT;AACA;AAAA;AAEE;AAAA;AAGV;AAEA;AAAyB;AACvB;AACA;AACY;AACC;AACE;AACH;AAAA;AACR;AAEe;AACN;AAAA;AAGf;AASA;AACE;AACE;AAACC;AAAA;AACW;AACI;AACwC;AAClD;AAAA;AAGV;AAQA;AACE;AACE;AAACC;AAAA;AACW;AACC;AACT;AACA;AACA;AACA;AACA;AAAA;AAEE;AAAA;AAGV;AAQA;AACE;AACE;AAACC;AAAA;AACW;AAC4C;AAClD;AAAA;AAGV;;;;;;;;"}
|
|
1
|
+
{"version":3,"file":"tabs.js","sources":["../../../src/components/ui/tabs.tsx"],"sourcesContent":["\"use client\";\n\nimport { Tabs as TabsPrimitive } from \"@base-ui/react/tabs\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\n\nimport { cn } from \"@/lib/utils\";\n\ntype TabsProps = TabsPrimitive.Root.Props;\n\n/**\n * Root container for tabs component that manages tab state and orientation.\n * Supports both controlled and uncontrolled usage with horizontal or vertical layout.\n */\nfunction Tabs({ className, orientation = \"horizontal\", ...props }: TabsProps) {\n return (\n <TabsPrimitive.Root\n data-slot=\"tabs\"\n data-orientation={orientation}\n className={cn(\n \"gap-2 group/tabs flex data-[orientation=horizontal]:flex-col\",\n className,\n )}\n {...props}\n />\n );\n}\n\nconst tabsListVariants = cva(\n \"rounded-lg p-[3px] group-data-horizontal/tabs:h-9 data-[variant=line]:rounded-none group/tabs-list text-muted-foreground inline-flex w-fit items-center justify-center group-data-[orientation=vertical]/tabs:h-fit group-data-[orientation=vertical]/tabs:flex-col\",\n {\n variants: {\n variant: {\n default: \"bg-muted\",\n line: \"gap-1 bg-transparent\",\n },\n },\n defaultVariants: {\n variant: \"default\",\n },\n },\n);\n\ntype TabsListProps = TabsPrimitive.List.Props &\n VariantProps<typeof tabsListVariants>;\n\n/**\n * Container for tab triggers with two visual variants.\n * @param variant - Visual style: \"default\" (background highlight) or \"line\" (underline indicator). @default \"default\"\n */\nfunction TabsList({ className, variant = \"default\", ...props }: TabsListProps) {\n return (\n <TabsPrimitive.List\n data-slot=\"tabs-list\"\n data-variant={variant}\n className={cn(tabsListVariants({ variant }), className)}\n {...props}\n />\n );\n}\n\ntype TabsTriggerProps = TabsPrimitive.Tab.Props;\n\n/**\n * Individual tab button that activates the corresponding panel.\n * Supports icons, badges, and disabled state. Active tab has visual highlight or underline based on variant.\n */\nfunction TabsTrigger({ className, ...props }: TabsTriggerProps) {\n return (\n <TabsPrimitive.Tab\n data-slot=\"tabs-trigger\"\n className={cn(\n \"gap-1.5 rounded-md border border-transparent px-2 py-1 text-sm font-medium group-data-[variant=default]/tabs-list:data-active:shadow-sm group-data-[variant=line]/tabs-list:data-active:shadow-none [&_svg:not([class*='size-'])]:size-4 focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:outline-ring text-foreground/60 hover:text-foreground dark:text-muted-foreground dark:hover:text-foreground relative inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center whitespace-nowrap transition-all group-data-[orientation=vertical]/tabs:w-full group-data-[orientation=vertical]/tabs:justify-start focus-visible:ring-[3px] focus-visible:outline-1 data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n \"group-data-[variant=line]/tabs-list:bg-transparent group-data-[variant=line]/tabs-list:data-active:bg-transparent dark:group-data-[variant=line]/tabs-list:data-active:border-transparent dark:group-data-[variant=line]/tabs-list:data-active:bg-transparent\",\n \"data-active:bg-background dark:data-active:text-foreground dark:data-active:border-input dark:data-active:bg-input/30 data-active:text-foreground\",\n \"after:bg-foreground after:absolute after:opacity-0 after:transition-opacity group-data-[orientation=horizontal]/tabs:after:inset-x-0 group-data-[orientation=horizontal]/tabs:after:bottom-[-5px] group-data-[orientation=horizontal]/tabs:after:h-0.5 group-data-[orientation=vertical]/tabs:after:inset-y-0 group-data-[orientation=vertical]/tabs:after:-right-1 group-data-[orientation=vertical]/tabs:after:w-0.5 group-data-[variant=line]/tabs-list:data-active:after:opacity-100\",\n className,\n )}\n {...props}\n />\n );\n}\n\ntype TabsContentProps = TabsPrimitive.Panel.Props;\n\n/**\n * Content panel that displays when its corresponding tab is active.\n * Automatically hidden/shown based on active tab value.\n */\nfunction TabsContent({ className, ...props }: TabsContentProps) {\n return (\n <TabsPrimitive.Panel\n data-slot=\"tabs-content\"\n className={cn(\"text-sm flex-1 outline-none\", className)}\n {...props}\n />\n );\n}\n\nexport {\n Tabs,\n TabsList,\n TabsTrigger,\n TabsContent,\n tabsListVariants,\n type TabsProps,\n type TabsListProps,\n type TabsTriggerProps,\n type TabsContentProps,\n};\n"],"names":["TabsPrimitive.Root","TabsPrimitive.List","TabsPrimitive.Tab","TabsPrimitive.Panel"],"mappings":";;;;;;;;AAaA;AACE;AACE;AAACA;AAAA;AACW;AACQ;AACP;AACT;AACA;AAAA;AAEE;AAAA;AAGV;AAEA;AAAyB;AACvB;AACA;AACY;AACC;AACE;AACH;AAAA;AACR;AAEe;AACN;AAAA;AAGf;AASA;AACE;AACE;AAACC;AAAA;AACW;AACI;AACwC;AAClD;AAAA;AAGV;AAQA;AACE;AACE;AAACC;AAAA;AACW;AACC;AACT;AACA;AACA;AACA;AACA;AAAA;AAEE;AAAA;AAGV;AAQA;AACE;AACE;AAACC;AAAA;AACW;AAC4C;AAClD;AAAA;AAGV;;;;;;;;"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@neynar/ui",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.5",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"author": "Neynar Inc.",
|
|
6
6
|
"description": "AI-first React component library for coding agents. LLM-optimized docs, sensible defaults, zero config. Built on shadcn patterns, Base UI, and Tailwind CSS v4.",
|
|
@@ -69,7 +69,7 @@ function TabsTrigger({ className, ...props }: TabsTriggerProps) {
|
|
|
69
69
|
<TabsPrimitive.Tab
|
|
70
70
|
data-slot="tabs-trigger"
|
|
71
71
|
className={cn(
|
|
72
|
-
"gap-1.5 rounded-md border border-transparent px-2 py-1 text-sm font-medium group-data-[variant=default]/tabs-list:data-active:shadow-sm group-data-[variant=line]/tabs-list:data-active:shadow-none [&_svg:not([class*='size-'])]:size-4 focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:outline-ring text-foreground/60 hover:text-foreground dark:text-muted-foreground dark:hover:text-foreground relative inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center whitespace-nowrap transition-all group-data-[orientation=vertical]/tabs:w-full group-data-[orientation=vertical]/tabs:justify-start focus-visible:ring-[3px] focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0",
|
|
72
|
+
"gap-1.5 rounded-md border border-transparent px-2 py-1 text-sm font-medium group-data-[variant=default]/tabs-list:data-active:shadow-sm group-data-[variant=line]/tabs-list:data-active:shadow-none [&_svg:not([class*='size-'])]:size-4 focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:outline-ring text-foreground/60 hover:text-foreground dark:text-muted-foreground dark:hover:text-foreground relative inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center whitespace-nowrap transition-all group-data-[orientation=vertical]/tabs:w-full group-data-[orientation=vertical]/tabs:justify-start focus-visible:ring-[3px] focus-visible:outline-1 data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0",
|
|
73
73
|
"group-data-[variant=line]/tabs-list:bg-transparent group-data-[variant=line]/tabs-list:data-active:bg-transparent dark:group-data-[variant=line]/tabs-list:data-active:border-transparent dark:group-data-[variant=line]/tabs-list:data-active:bg-transparent",
|
|
74
74
|
"data-active:bg-background dark:data-active:text-foreground dark:data-active:border-input dark:data-active:bg-input/30 data-active:text-foreground",
|
|
75
75
|
"after:bg-foreground after:absolute after:opacity-0 after:transition-opacity group-data-[orientation=horizontal]/tabs:after:inset-x-0 group-data-[orientation=horizontal]/tabs:after:bottom-[-5px] group-data-[orientation=horizontal]/tabs:after:h-0.5 group-data-[orientation=vertical]/tabs:after:inset-y-0 group-data-[orientation=vertical]/tabs:after:-right-1 group-data-[orientation=vertical]/tabs:after:w-0.5 group-data-[variant=line]/tabs-list:data-active:after:opacity-100",
|