@vadimcomanescu/nadicode-design-system 4.0.11 → 5.0.1

package/dist/chunk-LH5KBOIA.js

@@ -0,0 +1,228 @@
+import { CircleIcon } from './chunk-GCUTJI7M.js';
+import { CheckIcon } from './chunk-CXACRCZ4.js';
+import { ChevronRightIcon } from './chunk-G24VV5NO.js';
+import { cn } from './chunk-QYZT24TS.js';
+import * as MenubarPrimitive from '@radix-ui/react-menubar';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+function Menubar({
+  className,
+  ref,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    MenubarPrimitive.Root,
+    {
+      ref,
+      className: cn(
+        "flex h-10 items-center space-x-1.5 rounded-md border border-border bg-surface p-1.5",
+        className
+      ),
+      ...props
+    }
+  );
+}
+var MenubarMenu = MenubarPrimitive.Menu;
+function MenubarTrigger({
+  className,
+  ref,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    MenubarPrimitive.Trigger,
+    {
+      ref,
+      className: cn(
+        "flex cursor-default select-none items-center rounded-sm px-4 py-1.5 text-sm font-medium outline-none focus-visible:ring-2 focus-visible:ring-focus-ring focus:bg-surface-hover focus:text-text-primary data-[state=open]:bg-surface-hover data-[state=open]:text-text-primary",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function MenubarSubTrigger({
+  className,
+  inset,
+  children,
+  ref,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs(
+    MenubarPrimitive.SubTrigger,
+    {
+      ref,
+      className: cn(
+        "flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus-visible:ring-2 focus-visible:ring-focus-ring focus:bg-surface-hover focus:text-text-primary data-[state=open]:bg-surface-hover data-[state=open]:text-text-primary",
+        inset && "pl-8",
+        className
+      ),
+      ...props,
+      children: [
+        children,
+        /* @__PURE__ */ jsx(ChevronRightIcon, { size: 16, className: "ml-auto text-text-tertiary", "aria-hidden": "true" })
+      ]
+    }
+  );
+}
+function MenubarSubContent({
+  className,
+  ref,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    MenubarPrimitive.SubContent,
+    {
+      ref,
+      className: cn(
+        "z-50 min-w-[8rem] overflow-hidden rounded-md glass-panel p-1.5 text-text-primary data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function MenubarContent({
+  className,
+  align = "start",
+  alignOffset = -4,
+  sideOffset = 8,
+  ref,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(MenubarPrimitive.Portal, { children: /* @__PURE__ */ jsx(
+    MenubarPrimitive.Content,
+    {
+      ref,
+      align,
+      alignOffset,
+      sideOffset,
+      className: cn(
+        "z-50 min-w-[12rem] overflow-hidden rounded-md glass-panel p-1.5 text-text-primary data-[state=open]:animate-in data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+        className
+      ),
+      ...props
+    }
+  ) });
+}
+function MenubarItem({
+  className,
+  inset,
+  children,
+  shortcut,
+  ref,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs(
+    MenubarPrimitive.Item,
+    {
+      ref,
+      className: cn(
+        "relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus-visible:ring-2 focus-visible:ring-focus-ring focus:bg-surface-hover focus:text-text-primary data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+        inset && "pl-8",
+        className
+      ),
+      ...props,
+      children: [
+        children,
+        !!shortcut && /* @__PURE__ */ jsx("span", { className: "ml-auto text-xs tracking-widest text-text-tertiary", children: shortcut }),
+        inset && !shortcut && /* @__PURE__ */ jsx(ChevronRightIcon, { size: 16, className: "ml-auto text-text-tertiary", "aria-hidden": "true" })
+      ]
+    }
+  );
+}
+function MenubarCheckboxItem({
+  className,
+  children,
+  checked,
+  ref,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs(
+    MenubarPrimitive.CheckboxItem,
+    {
+      ref,
+      className: cn(
+        "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus-visible:ring-2 focus-visible:ring-focus-ring focus:bg-surface-hover focus:text-text-primary data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+        className
+      ),
+      checked,
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx(MenubarPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx(CheckIcon, { size: 8, className: "fill-current" }) }) }),
+        children
+      ]
+    }
+  );
+}
+function MenubarRadioItem({
+  className,
+  children,
+  ref,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs(
+    MenubarPrimitive.RadioItem,
+    {
+      ref,
+      className: cn(
+        "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus-visible:ring-2 focus-visible:ring-focus-ring focus:bg-surface-hover focus:text-text-primary data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx(MenubarPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx(CircleIcon, { size: 8, className: "fill-current" }) }) }),
+        children
+      ]
+    }
+  );
+}
+function MenubarLabel({
+  className,
+  inset,
+  ref,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    MenubarPrimitive.Label,
+    {
+      ref,
+      className: cn(
+        "px-2 py-1.5 text-sm font-semibold",
+        inset && "pl-8",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function MenubarSeparator({
+  className,
+  ref,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    MenubarPrimitive.Separator,
+    {
+      ref,
+      className: cn("-mx-1.5 my-1.5 h-px bg-border", className),
+      ...props
+    }
+  );
+}
+var MenubarShortcut = ({
+  className,
+  ...props
+}) => {
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      className: cn(
+        "ml-auto text-xs tracking-widest text-text-tertiary",
+        className
+      ),
+      ...props
+    }
+  );
+};
+
+export { Menubar, MenubarCheckboxItem, MenubarContent, MenubarItem, MenubarLabel, MenubarMenu, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSubContent, MenubarSubTrigger, MenubarTrigger };

package/dist/chunk-LO3MDQSJ.js

@@ -0,0 +1,130 @@
+import { ChevronDownIcon } from './chunk-HJBXUXTD.js';
+import { cn } from './chunk-QYZT24TS.js';
+import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu';
+import { cva } from 'class-variance-authority';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+function NavigationMenu({
+  className,
+  children,
+  ref,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs(
+    NavigationMenuPrimitive.Root,
+    {
+      ref,
+      className: cn(
+        "relative z-10 flex max-w-max flex-1 items-center justify-center",
+        className
+      ),
+      ...props,
+      children: [
+        children,
+        /* @__PURE__ */ jsx(NavigationMenuViewport, {})
+      ]
+    }
+  );
+}
+function NavigationMenuList({
+  className,
+  ref,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    NavigationMenuPrimitive.List,
+    {
+      ref,
+      className: cn(
+        "group flex flex-1 list-none items-center justify-center space-x-1.5",
+        className
+      ),
+      ...props
+    }
+  );
+}
+var NavigationMenuItem = NavigationMenuPrimitive.Item;
+var navigationMenuTriggerStyle = cva(
+  "group inline-flex h-10 w-max items-center justify-center rounded-md bg-surface px-4 py-2 text-sm font-medium transition-[color,background-color,border-color,text-decoration-color,fill,stroke,box-shadow] hover:bg-surface-hover hover:text-text-primary focus:bg-surface-hover focus:text-text-primary focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-accent disabled:pointer-events-none disabled:opacity-50 data-[active]:text-accent data-[active]:shadow-[inset_0_-2px_0_rgb(var(--color-accent))] data-[state=open]:text-accent data-[state=open]:shadow-[inset_0_-2px_0_rgb(var(--color-accent))]"
+);
+function NavigationMenuTrigger({
+  className,
+  children,
+  ref,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs(
+    NavigationMenuPrimitive.Trigger,
+    {
+      ref,
+      className: cn(navigationMenuTriggerStyle(), "group", className),
+      ...props,
+      children: [
+        children,
+        /* @__PURE__ */ jsx(
+          ChevronDownIcon,
+          {
+            size: 12,
+            className: "relative top-[1px] ml-1.5 transition duration-200 group-data-[state=open]:rotate-180",
+            "aria-hidden": "true"
+          }
+        )
+      ]
+    }
+  );
+}
+function NavigationMenuContent({
+  className,
+  ref,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    NavigationMenuPrimitive.Content,
+    {
+      ref,
+      className: cn(
+        "left-0 top-0 w-full data-[motion^=from-]:animate-in data-[motion^=to-]:animate-out data-[motion^=from-]:fade-in data-[motion^=to-]:fade-out data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52 data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52 md:absolute md:w-auto",
+        className
+      ),
+      ...props
+    }
+  );
+}
+var NavigationMenuLink = NavigationMenuPrimitive.Link;
+function NavigationMenuViewport({
+  className,
+  ref,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx("div", { className: cn("absolute left-0 top-full flex justify-center"), children: /* @__PURE__ */ jsx(
+    NavigationMenuPrimitive.Viewport,
+    {
+      className: cn(
+        "origin-top-center relative mt-1.5 h-[var(--radix-navigation-menu-viewport-height)] w-full overflow-hidden rounded-md glass-panel text-text-primary data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-90 md:w-[var(--radix-navigation-menu-viewport-width)]",
+        className
+      ),
+      ref,
+      ...props
+    }
+  ) });
+}
+function NavigationMenuIndicator({
+  className,
+  ref,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    NavigationMenuPrimitive.Indicator,
+    {
+      ref,
+      className: cn(
+        "top-full z-base flex h-1.5 items-end justify-center overflow-hidden data-[state=visible]:animate-in data-[state=hidden]:animate-out data-[state=hidden]:fade-out data-[state=visible]:fade-in",
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ jsx("div", { className: "relative top-[60%] h-2 w-2 rotate-45 rounded-tl-sm bg-surface/80 shadow-sm border border-border/30" })
+    }
+  );
+}
+
+export { NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, navigationMenuTriggerStyle };

package/dist/chunk-LYI5YMC6.js

@@ -0,0 +1,125 @@
+import { z } from 'zod';
+
+// src/catalog/definitions/overlay.ts
+var overlayDefinitions = {
+  AlertDialog: {
+    props: z.object({
+      title: z.string().nullable(),
+      description: z.string().nullable(),
+      confirmLabel: z.string().nullable(),
+      cancelLabel: z.string().nullable(),
+      open: z.boolean().nullable(),
+      triggerLabel: z.string().nullable()
+    }),
+    events: ["confirm", "cancel"],
+    description: "Destructive-action confirmation dialog with title, description, and confirm/cancel buttons. Built on Radix AlertDialog; blocks interaction until dismissed. Use for irreversible actions. triggerLabel sets the default trigger button text when no children are provided.",
+    example: { title: "Delete workspace?", description: "This will permanently remove all projects and data in this workspace.", confirmLabel: "Delete", cancelLabel: "Keep workspace", open: null, triggerLabel: "Delete workspace" }
+  },
+  Command: {
+    props: z.object({
+      placeholder: z.string().nullable(),
+      items: z.array(
+        z.object({
+          group: z.string().nullable(),
+          label: z.string(),
+          value: z.string(),
+          shortcut: z.string().nullable()
+        })
+      ).nullable()
+    }),
+    events: ["select"],
+    description: "Keyboard-navigable command menu (cmdk) with search input, grouped items, and keyboard shortcuts. Use standalone or inside CommandDialog. Fires select with the chosen item value.",
+    example: {
+      placeholder: "Type a command or search...",
+      items: [
+        { group: "Navigation", label: "Go to Dashboard", value: "dashboard", shortcut: "G D" },
+        { group: "Navigation", label: "Go to Settings", value: "settings", shortcut: "G S" },
+        { group: "Actions", label: "Create New Project", value: "new-project", shortcut: "C P" }
+      ]
+    }
+  },
+  ContextMenu: {
+    props: z.object({
+      items: z.array(
+        z.object({
+          label: z.string(),
+          value: z.string(),
+          shortcut: z.string().nullable(),
+          group: z.string().nullable()
+        })
+      ),
+      className: z.string().nullable()
+    }),
+    slots: ["default"],
+    events: ["select"],
+    description: "Right-click context menu. Wraps children as the trigger area. Items are rendered as menu items grouped by the group field. Fires select on item click.",
+    example: {
+      items: [
+        { label: "Copy", value: "copy", shortcut: "Ctrl+C", group: "Edit" },
+        { label: "Paste", value: "paste", shortcut: "Ctrl+V", group: "Edit" },
+        { label: "Delete", value: "delete", shortcut: null, group: null }
+      ],
+      className: null
+    }
+  },
+  Dialog: {
+    props: z.object({
+      title: z.string().nullable(),
+      description: z.string().nullable(),
+      open: z.boolean().nullable()
+    }),
+    slots: ["default"],
+    events: ["close"],
+    description: "Modal dialog with glass-panel surface, title, description, and default content slot. Built on Radix Dialog with spring entry animation. Fires close when dismissed via the close button or overlay click.",
+    example: { title: "Edit Profile", description: "Update your personal information below.", open: true }
+  },
+  HoverCard: {
+    props: z.object({
+      trigger: z.string().nullable(),
+      side: z.enum(["top", "right", "bottom", "left"]).nullable(),
+      align: z.enum(["start", "center", "end"]).nullable(),
+      sideOffset: z.number().nullable(),
+      className: z.string().nullable()
+    }),
+    slots: ["default"],
+    events: ["openChange"],
+    description: "Content card shown on hover over a trigger text span. side and align control placement. Built on Radix HoverCard with glass-floating surface.",
+    example: { trigger: "@elenavasquez", side: "bottom", align: "start", sideOffset: 4, className: null }
+  },
+  Popover: {
+    props: z.object({
+      trigger: z.string().nullable(),
+      side: z.enum(["top", "right", "bottom", "left"]).nullable(),
+      align: z.enum(["start", "center", "end"]).nullable(),
+      sideOffset: z.number().nullable()
+    }),
+    slots: ["default"],
+    events: ["close"],
+    description: "Floating content panel anchored to a trigger element. trigger sets the button label. side and align control placement relative to the trigger. Glass-panel surface with scroll containment. Fires close on dismiss.",
+    example: { trigger: "Open settings", side: "bottom", align: "end", sideOffset: 4 }
+  },
+  Sheet: {
+    props: z.object({
+      title: z.string().nullable(),
+      description: z.string().nullable(),
+      side: z.enum(["top", "right", "bottom", "left"]).nullable(),
+      open: z.boolean().nullable()
+    }),
+    slots: ["default"],
+    events: ["close"],
+    description: "Slide-in panel that overlays the page from a chosen edge (default: right). Glass-panel surface with spring slide animation and drag-to-dismiss on horizontal sides. Fires close when dismissed.",
+    example: { title: "Filters", description: "Narrow down your search results.", side: "right", open: true }
+  },
+  Tooltip: {
+    props: z.object({
+      content: z.string(),
+      side: z.enum(["top", "right", "bottom", "left"]).nullable(),
+      sideOffset: z.number().nullable()
+    }),
+    slots: ["default"],
+    description: "Informational tooltip shown on hover over the trigger slot. Glass-overlay surface with fade+zoom animation. side controls placement relative to the trigger. No events \u2014 purely presentational.",
+    example: { content: "Copy to clipboard", side: "top", sideOffset: 4 }
+  }
+};
+
+export { overlayDefinitions };

package/dist/chunk-MB75U2OV.js

@@ -0,0 +1,77 @@
+import { m } from './chunk-PD2YEH3H.js';
+import { cn } from './chunk-QYZT24TS.js';
+import { useReducedMotion } from 'motion/react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var FADE_DURATION_S = 0.3;
+var TITLE_DELAY_S = 0;
+var SUBTITLE_DELAY_S = 0.1;
+function ChatGreeting({
+  title = "Hello!",
+  subtitle = "How can I help you today?",
+  children,
+  className,
+  ref,
+  ...props
+}) {
+  const prefersReduced = useReducedMotion();
+  if (children) {
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        className: cn("flex flex-col items-center justify-center gap-2", className),
+        ...props,
+        children
+      }
+    );
+  }
+  if (prefersReduced) {
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn("flex flex-col items-center justify-center gap-2", className),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsx("p", { className: "text-xl font-semibold text-text-primary", children: title }),
+          subtitle ? /* @__PURE__ */ jsx("p", { className: "text-lg text-text-secondary", children: subtitle }) : null
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref,
+      className: cn("flex flex-col items-center justify-center gap-2", className),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx(
+          m.p,
+          {
+            className: "text-xl font-semibold text-text-primary",
+            initial: { opacity: 0, y: 10 },
+            animate: { opacity: 1, y: 0 },
+            exit: { opacity: 0, y: 10 },
+            transition: { duration: FADE_DURATION_S, delay: TITLE_DELAY_S },
+            children: title
+          }
+        ),
+        subtitle ? /* @__PURE__ */ jsx(
+          m.p,
+          {
+            className: "text-lg text-text-secondary",
+            initial: { opacity: 0, y: 10 },
+            animate: { opacity: 1, y: 0 },
+            exit: { opacity: 0, y: 10 },
+            transition: { duration: FADE_DURATION_S, delay: SUBTITLE_DELAY_S },
+            children: subtitle
+          }
+        ) : null
+      ]
+    }
+  );
+}
+
+export { ChatGreeting };

package/dist/{components/ui/AnimatedTabs.js → chunk-MFZYC6QC.js}

@@ -1,15 +1,21 @@
-'use client';
-import { m, motionSpring, useMotionConfig } from '../../chunk-PD2YEH3H.js';
-import '../../chunk-CRY67BIF.js';
-import '../../chunk-HJC6U46F.js';
-import { cn } from '../../chunk-QYZT24TS.js';
+import { useReducedMotion } from './chunk-KRBLVZII.js';
+import { m, motionSpring, useMotionConfig } from './chunk-PD2YEH3H.js';
+import { cn } from './chunk-QYZT24TS.js';
 import * as React from 'react';
 import { use } from 'react';
 import * as TabsPrimitive from '@radix-ui/react-tabs';
 import { AnimatePresence } from 'motion/react';
 import { jsx, jsxs } from 'react/jsx-runtime';
 
-function AnimatedTabs({
+var TabsContext = React.createContext({
+  prevIndex: 0,
+  currentIndex: 0,
+  activeValue: "",
+  baseId: "tabs",
+  registerTab: () => {
+  }
+});
+function Tabs({
   className,
   onValueChange,
   value: controlledValue,
@@ -26,7 +32,7 @@ function AnimatedTabs({
   const generatedId = React.useId();
   const baseId = React.useMemo(() => {
     if (id) return String(id);
-    return `animated-tabs-${generatedId.replace(/:/g, "")}`;
+    return `tabs-${generatedId.replace(/:/g, "")}`;
   }, [generatedId, id]);
   const tabValues = React.useRef([]);
   React.useEffect(() => {
@@ -55,7 +61,7 @@ function AnimatedTabs({
     () => ({ prevIndex, currentIndex, activeValue, baseId, registerTab }),
     [prevIndex, currentIndex, activeValue, baseId, registerTab]
   );
-  return /* @__PURE__ */ jsx(AnimatedTabsContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx(TabsContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(
     TabsPrimitive.Root,
     {
       ref,
@@ -68,15 +74,7 @@ function AnimatedTabs({
     }
   ) });
 }
-var AnimatedTabsContext = React.createContext({
-  prevIndex: 0,
-  currentIndex: 0,
-  activeValue: "",
-  baseId: "animated-tabs",
-  registerTab: () => {
-  }
-});
-function AnimatedTabsList({
+function TabsList({
   className,
   ref,
   ...props
@@ -93,14 +91,15 @@ function AnimatedTabsList({
     }
   );
 }
-function AnimatedTabsTrigger({
+function TabsTrigger({
   className,
   value,
   children,
   ref,
   ...props
 }) {
-  const { registerTab, activeValue, baseId } = use(AnimatedTabsContext);
+  const { registerTab, activeValue, baseId } = use(TabsContext);
+  const reducedMotion = useReducedMotion();
   const isActive = value === activeValue;
   const triggerId = props.id ?? `${baseId}-trigger-${value}`;
   const contentId = props["aria-controls"] ?? `${baseId}-content-${value}`;
@@ -116,14 +115,15 @@ function AnimatedTabsTrigger({
       "aria-controls": contentId,
       className: cn(
         "relative inline-flex items-center justify-center whitespace-nowrap rounded-sm px-4 py-1.5 text-sm font-medium transition-colors duration-200 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:text-text-primary hover:bg-surface/30 hover:text-text-primary",
+        reducedMotion && "data-[state=active]:glass-tab-active",
         className
       ),
       ...props,
       children: [
-        isActive && /* @__PURE__ */ jsx(
+        isActive && !reducedMotion && /* @__PURE__ */ jsx(
           m.span,
           {
-            layoutId: "active-tab-indicator",
+            layoutId: `${baseId}-active-indicator`,
             className: "absolute inset-0 rounded-sm glass-tab-active",
             transition: motionSpring.snappy,
             style: { zIndex: 0 }
@@ -134,17 +134,34 @@ function AnimatedTabsTrigger({
     }
   );
 }
-function AnimatedTabsContent({
+function TabsContent({
   className,
   children,
   ref,
   ...props
 }) {
-  const { prevIndex, currentIndex, baseId } = use(AnimatedTabsContext);
+  const { prevIndex, currentIndex, baseId } = use(TabsContext);
+  const reducedMotion = useReducedMotion();
   const motionConfig = useMotionConfig();
   const direction = currentIndex > prevIndex ? 1 : -1;
   const contentId = props.id ?? `${baseId}-content-${props.value}`;
   const labelledBy = props["aria-labelledby"] ?? `${baseId}-trigger-${props.value}`;
+  if (reducedMotion) {
+    return /* @__PURE__ */ jsx(
+      TabsPrimitive.Content,
+      {
+        ref,
+        id: contentId,
+        "aria-labelledby": labelledBy,
+        className: cn(
+          "mt-2 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent focus-visible:ring-offset-2",
+          className
+        ),
+        ...props,
+        children
+      }
+    );
+  }
   return /* @__PURE__ */ jsx(
     TabsPrimitive.Content,
     {
@@ -172,4 +189,4 @@ function AnimatedTabsContent({
   );
 }
 
-export { AnimatedTabs, AnimatedTabsContent, AnimatedTabsList, AnimatedTabsTrigger };
+export { Tabs, TabsContent, TabsList, TabsTrigger };