@ekkolyth/ui 0.0.2 → 0.1.1

package/dist/index.d.ts

@@ -1,6 +1,4 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { ThemeProviderProps } from 'next-themes';
-export { ThemeProviderProps as NextThemeProviderProps, useTheme as useNextTheme } from 'next-themes';
 import * as React$1 from 'react';
 import { Accordion as Accordion$1, AlertDialog as AlertDialog$1, AspectRatio as AspectRatio$1, Avatar as Avatar$1, Separator as Separator$1, Checkbox as Checkbox$1, Collapsible as Collapsible$1, Dialog as Dialog$1, ContextMenu as ContextMenu$1, DropdownMenu as DropdownMenu$1, Label as Label$1, HoverCard as HoverCard$1, Menubar as Menubar$1, NavigationMenu as NavigationMenu$1, Popover as Popover$1, Progress as Progress$1, RadioGroup as RadioGroup$1, ScrollArea as ScrollArea$1, Select as Select$1, Tooltip as Tooltip$1, Slider as Slider$1, Switch as Switch$1, Tabs as Tabs$1, Toggle as Toggle$1, ToggleGroup as ToggleGroup$1 } from 'radix-ui';
 import * as class_variance_authority_types from 'class-variance-authority/types';
@@ -16,23 +14,6 @@ import * as ResizablePrimitive from 'react-resizable-panels';
 import { ToasterProps } from 'sonner';
 import { ClassValue } from 'clsx';
 
-declare function NextThemeProvider({ children, ...props }: React.PropsWithChildren<ThemeProviderProps>): react_jsx_runtime.JSX.Element;
-
-type ResolvedTheme = "dark" | "light";
-type Theme = ResolvedTheme | "system";
-interface TanstackThemeProviderProps {
-    children: React.ReactNode;
-    defaultTheme?: Theme;
-    storageKey?: string;
-}
-interface TanstackThemeProviderState {
-    theme: Theme;
-    resolvedTheme: ResolvedTheme;
-    setTheme: (theme: Theme) => void;
-}
-declare function TanstackThemeProvider({ children, defaultTheme, storageKey, }: TanstackThemeProviderProps): react_jsx_runtime.JSX.Element;
-declare function useTanstackTheme(): TanstackThemeProviderState;
-
 declare function Accordion({ className, ...props }: React$1.ComponentProps<typeof Accordion$1.Root>): react_jsx_runtime.JSX.Element;
 declare function AccordionItem({ className, ...props }: React$1.ComponentProps<typeof Accordion$1.Item>): react_jsx_runtime.JSX.Element;
 declare function AccordionTrigger({ className, children, ...props }: React$1.ComponentProps<typeof Accordion$1.Trigger>): react_jsx_runtime.JSX.Element;
@@ -375,7 +356,7 @@ declare function Item({ className, variant, size, asChild, ...props }: React$1.C
     asChild?: boolean;
 }): react_jsx_runtime.JSX.Element;
 declare const itemMediaVariants: (props?: ({
-    variant?: "default" | "image" | "icon" | null | undefined;
+    variant?: "image" | "default" | "icon" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 declare function ItemMedia({ className, variant, ...props }: React$1.ComponentProps<"div"> & VariantProps<typeof itemMediaVariants>): react_jsx_runtime.JSX.Element;
 declare function ItemContent({ className, ...props }: React$1.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
@@ -465,7 +446,7 @@ declare function SelectValue({ ...props }: React$1.ComponentProps<typeof Select$
 declare function SelectTrigger({ className, size, children, ...props }: React$1.ComponentProps<typeof Select$1.Trigger> & {
     size?: "sm" | "default";
 }): react_jsx_runtime.JSX.Element;
-declare function SelectContent({ className, children, position, align, ...props }: React$1.ComponentProps<typeof Select$1.Content>): react_jsx_runtime.JSX.Element;
+declare function SelectContent({ className, children, position, align, side, sideOffset, ...props }: React$1.ComponentProps<typeof Select$1.Content>): react_jsx_runtime.JSX.Element;
 declare function SelectLabel({ className, ...props }: React$1.ComponentProps<typeof Select$1.Label>): react_jsx_runtime.JSX.Element;
 declare function SelectItem({ className, children, ...props }: React$1.ComponentProps<typeof Select$1.Item>): react_jsx_runtime.JSX.Element;
 declare function SelectSeparator({ className, ...props }: React$1.ComponentProps<typeof Select$1.Separator>): react_jsx_runtime.JSX.Element;
@@ -575,7 +556,7 @@ declare function TableCaption({ className, ...props }: React$1.ComponentProps<"c
 
 declare function Tabs({ className, orientation, ...props }: React$1.ComponentProps<typeof Tabs$1.Root>): react_jsx_runtime.JSX.Element;
 declare const tabsListVariants: (props?: ({
-    variant?: "default" | "line" | null | undefined;
+    variant?: "line" | "default" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 declare function TabsList({ className, variant, ...props }: React$1.ComponentProps<typeof Tabs$1.List> & VariantProps<typeof tabsListVariants>): react_jsx_runtime.JSX.Element;
 declare function TabsTrigger({ className, ...props }: React$1.ComponentProps<typeof Tabs$1.Trigger>): react_jsx_runtime.JSX.Element;
@@ -599,4 +580,4 @@ declare function useIsMobile(): boolean;
 
 declare function cn(...inputs: ClassValue[]): string;
 
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertAction, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AspectRatio, Avatar, AvatarBadge, AvatarFallback, AvatarGroup, AvatarGroupCount, AvatarImage, Badge, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, Calendar, CalendarDayButton, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, type CarouselApi, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, type ChartConfig, ChartContainer, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent, Checkbox, Collapsible, CollapsibleContent, CollapsibleTrigger, Combobox, ComboboxChip, ComboboxChips, ComboboxChipsInput, ComboboxCollection, ComboboxContent, ComboboxEmpty, ComboboxGroup, ComboboxInput, ComboboxItem, ComboboxLabel, ComboboxList, ComboboxSeparator, ComboboxTrigger, ComboboxValue, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle, Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle, HoverCard, HoverCardContent, HoverCardTrigger, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, Item, ItemActions, ItemContent, ItemDescription, ItemFooter, ItemGroup, ItemHeader, ItemMedia, ItemSeparator, ItemTitle, Kbd, KbdGroup, Label, Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarPortal, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, NextThemeProvider, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, Popover, PopoverAnchor, PopoverContent, PopoverDescription, PopoverHeader, PopoverTitle, PopoverTrigger, Progress, RadioGroup, RadioGroupItem, ResizableHandle, ResizablePanel, ResizablePanelGroup, type ResolvedTheme, ScrollArea, ScrollBar, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, Skeleton, Slider, Spinner, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, TanstackThemeProvider, Textarea, type Theme, Toaster, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, badgeVariants, buttonGroupVariants, buttonVariants, cn, navigationMenuTriggerStyle, tabsListVariants, toggleVariants, useCarousel, useComboboxAnchor, useIsMobile, useSidebar, useTanstackTheme };
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertAction, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AspectRatio, Avatar, AvatarBadge, AvatarFallback, AvatarGroup, AvatarGroupCount, AvatarImage, Badge, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, Calendar, CalendarDayButton, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, type CarouselApi, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, type ChartConfig, ChartContainer, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent, Checkbox, Collapsible, CollapsibleContent, CollapsibleTrigger, Combobox, ComboboxChip, ComboboxChips, ComboboxChipsInput, ComboboxCollection, ComboboxContent, ComboboxEmpty, ComboboxGroup, ComboboxInput, ComboboxItem, ComboboxLabel, ComboboxList, ComboboxSeparator, ComboboxTrigger, ComboboxValue, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle, Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle, HoverCard, HoverCardContent, HoverCardTrigger, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, Item, ItemActions, ItemContent, ItemDescription, ItemFooter, ItemGroup, ItemHeader, ItemMedia, ItemSeparator, ItemTitle, Kbd, KbdGroup, Label, Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarPortal, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, Popover, PopoverAnchor, PopoverContent, PopoverDescription, PopoverHeader, PopoverTitle, PopoverTrigger, Progress, RadioGroup, RadioGroupItem, ResizableHandle, ResizablePanel, ResizablePanelGroup, ScrollArea, ScrollBar, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, Skeleton, Slider, Spinner, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, Toaster, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, badgeVariants, buttonGroupVariants, buttonVariants, cn, navigationMenuTriggerStyle, tabsListVariants, toggleVariants, useCarousel, useComboboxAnchor, useIsMobile, useSidebar };

package/dist/index.js

@@ -1,14 +1,11 @@
-import { ThemeProvider, useTheme } from 'next-themes';
-export { useTheme as useNextTheme } from 'next-themes';
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import * as React2 from 'react';
-import { createContext, useState, useEffect, useMemo, use } from 'react';
-import { ScriptOnce } from '@tanstack/react-router';
 import { Accordion as Accordion$1, Slot, AlertDialog as AlertDialog$1, AspectRatio as AspectRatio$1, Avatar as Avatar$1, Separator as Separator$1, Checkbox as Checkbox$1, Collapsible as Collapsible$1, Dialog as Dialog$1, ContextMenu as ContextMenu$1, DropdownMenu as DropdownMenu$1, Label as Label$1, HoverCard as HoverCard$1, Menubar as Menubar$1, NavigationMenu as NavigationMenu$1, Popover as Popover$1, Progress as Progress$1, RadioGroup as RadioGroup$1, ScrollArea as ScrollArea$1, Select as Select$1, Tooltip, Slider as Slider$1, Switch as Switch$1, Tabs as Tabs$1, Toggle as Toggle$1, ToggleGroup as ToggleGroup$1 } from 'radix-ui';
 import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
 import { ChevronLeftIcon, ChevronRightIcon, ChevronDownIcon, CheckIcon, XIcon, SearchIcon, CircleIcon, Loader2Icon, ChevronUpIcon, MoreHorizontalIcon, MinusIcon, PanelLeftIcon, OctagonXIcon, TriangleAlertIcon, InfoIcon, CircleCheckIcon } from 'lucide-react';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { cva } from 'class-variance-authority';
+import * as React2 from 'react';
+import { useMemo, useState, useEffect } from 'react';
 import { getDefaultClassNames, DayPicker } from 'react-day-picker';
 import useEmblaCarousel from 'embla-carousel-react';
 import * as RechartsPrimitive from 'recharts';
@@ -50,87 +47,6 @@ var __objRest = (source, exclude) => {
     }
   return target;
 };
-function NextThemeProvider(_a) {
-  var _b = _a, {
-    children
-  } = _b, props = __objRest(_b, [
-    "children"
-  ]);
-  return /* @__PURE__ */ jsx(ThemeProvider, __spreadProps(__spreadValues({}, props), { children }));
-}
-var initialState = {
-  theme: "system",
-  resolvedTheme: "light",
-  setTheme: () => null
-};
-var TanstackThemeProviderContext = createContext(initialState);
-function FunctionOnce({
-  children,
-  param
-}) {
-  return /* @__PURE__ */ jsx(ScriptOnce, { children: `(${children.toString()})(${JSON.stringify(param)})` });
-}
-function TanstackThemeProvider({
-  children,
-  defaultTheme = "system",
-  storageKey = "ekko-ui.theme"
-}) {
-  const [theme, setThemeState] = useState(defaultTheme);
-  const [resolvedTheme, setResolvedTheme] = useState("light");
-  const [mounted, setMounted] = useState(false);
-  useEffect(() => {
-    setMounted(true);
-    const stored = localStorage.getItem(storageKey);
-    if (stored && (stored === "light" || stored === "dark" || stored === "system")) {
-      setThemeState(stored);
-    }
-  }, [storageKey]);
-  useEffect(() => {
-    const root = window.document.documentElement;
-    const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
-    function updateTheme() {
-      root.classList.remove("light", "dark");
-      if (theme === "system") {
-        const systemTheme = mediaQuery.matches ? "dark" : "light";
-        setResolvedTheme(systemTheme);
-        root.classList.add(systemTheme);
-        return;
-      }
-      setResolvedTheme(theme);
-      root.classList.add(theme);
-    }
-    mediaQuery.addEventListener("change", updateTheme);
-    updateTheme();
-    return () => mediaQuery.removeEventListener("change", updateTheme);
-  }, [theme]);
-  const value = useMemo(
-    () => ({
-      theme,
-      resolvedTheme,
-      setTheme: (newTheme) => {
-        localStorage.setItem(storageKey, newTheme);
-        setThemeState(newTheme);
-      }
-    }),
-    [theme, resolvedTheme, storageKey]
-  );
-  return /* @__PURE__ */ jsxs(TanstackThemeProviderContext.Provider, { value, children: [
-    /* @__PURE__ */ jsx(FunctionOnce, { param: storageKey, children: (storageKey2) => {
-      const theme2 = localStorage.getItem(storageKey2);
-      if (theme2 === "dark" || (theme2 === null || theme2 === "system") && window.matchMedia("(prefers-color-scheme: dark)").matches) {
-        document.documentElement.classList.add("dark");
-      }
-    } }),
-    children
-  ] });
-}
-function useTanstackTheme() {
-  const context = use(TanstackThemeProviderContext);
-  if (context === void 0) {
-    throw new Error("useTanstackTheme must be used within a TanstackThemeProvider");
-  }
-  return context;
-}
 function cn(...inputs) {
   return twMerge(clsx(inputs));
 }
@@ -298,7 +214,7 @@ function AlertAction(_a) {
   );
 }
 var buttonVariants = cva(
-  "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-lg 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",
+  "cursor-pointer 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-lg 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",
   {
     variants: {
       variant: {
@@ -4478,7 +4394,7 @@ function SelectTrigger(_a) {
       "data-slot": "select-trigger",
       "data-size": size,
       className: cn(
-        "border-input data-[placeholder]:text-muted-foreground dark:bg-input/30 dark:hover:bg-input/50 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 gap-1.5 rounded-lg border bg-transparent py-2 pr-2 pl-2.5 text-sm transition-colors select-none focus-visible:ring-[3px] aria-invalid:ring-[3px] data-[size=default]:h-8 data-[size=sm]:h-7 data-[size=sm]:rounded-[min(var(--radius-md),10px)] *:data-[slot=select-value]:flex *:data-[slot=select-value]:gap-1.5 **:[svg:not([class*='size-'])]:size-4 flex w-fit items-center justify-between whitespace-nowrap outline-none disabled:cursor-not-allowed disabled:opacity-50 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center **:[svg]:pointer-events-none **:[svg]:shrink-0",
+        "cursor-pointer border-input data-[placeholder]:text-muted-foreground dark:bg-input/30 dark:hover:bg-input/50 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 gap-1.5 rounded-lg border bg-transparent py-2 pr-2 pl-2.5 text-sm transition-colors select-none focus-visible:ring-[3px] aria-invalid:ring-[3px] data-[size=default]:h-8 data-[size=sm]:h-7 data-[size=sm]:rounded-[min(var(--radius-md),10px)] *:data-[slot=select-value]:flex *:data-[slot=select-value]:gap-1.5 **:[svg:not([class*='size-'])]:size-4 flex w-fit items-center justify-between whitespace-nowrap outline-none disabled:cursor-not-allowed disabled:opacity-50 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center **:[svg]:pointer-events-none **:[svg]:shrink-0",
         className
       )
     }, props), {
@@ -4493,13 +4409,17 @@ function SelectContent(_a) {
   var _b = _a, {
     className,
     children,
-    position = "item-aligned",
-    align = "center"
+    position = "popper",
+    align = "center",
+    side = "bottom",
+    sideOffset = 4
   } = _b, props = __objRest(_b, [
     "className",
     "children",
     "position",
-    "align"
+    "align",
+    "side",
+    "sideOffset"
   ]);
   return /* @__PURE__ */ jsx(Select$1.Portal, { children: /* @__PURE__ */ jsxs(
     Select$1.Content,
@@ -4511,7 +4431,9 @@ function SelectContent(_a) {
         className
       ),
       position,
-      align
+      align,
+      side,
+      sideOffset
     }, props), {
       children: [
         /* @__PURE__ */ jsx(SelectScrollUpButton, {}),
@@ -4561,7 +4483,7 @@ function SelectItem(_a) {
     __spreadProps(__spreadValues({
       "data-slot": "select-item",
       className: cn(
-        "focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground gap-1.5 rounded-md py-1 pr-8 pl-1.5 text-sm **:[svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2 relative flex w-full cursor-default items-center outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 **:[svg]:pointer-events-none **:[svg]:shrink-0",
+        "cursor-pointer focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground gap-1.5 rounded-md py-1 pr-8 pl-1.5 text-sm **:[svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2 relative flex w-full items-center outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 **:[svg]:pointer-events-none **:[svg]:shrink-0",
         className
       )
     }, props), {
@@ -5516,13 +5438,55 @@ function Slider(_a) {
     })
   );
 }
+var DARK_THEMES = /* @__PURE__ */ new Set([
+  "dark",
+  "frappe",
+  "macchiato",
+  "mocha",
+  "tokyo-night"
+]);
+var LIGHT_THEMES = /* @__PURE__ */ new Set(["light", "latte"]);
+var getSonnerTheme = (dataTheme) => {
+  if (!dataTheme) {
+    if (typeof window !== "undefined") {
+      const hasDarkClass = document.documentElement.classList.contains("dark") || document.body.classList.contains("dark");
+      if (hasDarkClass) return "dark";
+      const prefersDark = window.matchMedia(
+        "(prefers-color-scheme: dark)"
+      ).matches;
+      return prefersDark ? "dark" : "light";
+    }
+    return "dark";
+  }
+  if (DARK_THEMES.has(dataTheme)) return "dark";
+  if (LIGHT_THEMES.has(dataTheme)) return "light";
+  return "dark";
+};
 var Toaster = (_a) => {
   var props = __objRest(_a, []);
-  const { theme = "system" } = useTheme();
+  const [sonnerTheme, setSonnerTheme] = useState(
+    "dark"
+  );
+  useEffect(() => {
+    if (typeof window === "undefined") return;
+    const detectTheme = () => {
+      const dataTheme = document.documentElement.getAttribute("data-theme");
+      return getSonnerTheme(dataTheme);
+    };
+    setSonnerTheme(detectTheme());
+    const observer = new MutationObserver(() => {
+      setSonnerTheme(detectTheme());
+    });
+    observer.observe(document.documentElement, {
+      attributes: true,
+      attributeFilter: ["data-theme", "class"]
+    });
+    return () => observer.disconnect();
+  }, []);
   return /* @__PURE__ */ jsx(
     Toaster$1,
     __spreadValues({
-      theme,
+      theme: sonnerTheme,
       className: "toaster group",
       icons: {
         success: /* @__PURE__ */ jsx(CircleCheckIcon, { className: "size-4" }),
@@ -5536,11 +5500,6 @@ var Toaster = (_a) => {
         "--normal-text": "var(--popover-foreground)",
         "--normal-border": "var(--border)",
         "--border-radius": "var(--radius)"
-      },
-      toastOptions: {
-        classNames: {
-          toast: "cn-toast"
-        }
       }
     }, props)
   );
@@ -5890,4 +5849,4 @@ function ToggleGroupItem(_a) {
   );
 }
 
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertAction, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AspectRatio, Avatar, AvatarBadge, AvatarFallback, AvatarGroup, AvatarGroupCount, AvatarImage, Badge, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, Calendar, CalendarDayButton, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, ChartContainer, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent, Checkbox, Collapsible, CollapsibleContent, CollapsibleTrigger, Combobox, ComboboxChip, ComboboxChips, ComboboxChipsInput, ComboboxCollection, ComboboxContent, ComboboxEmpty, ComboboxGroup, ComboboxInput, ComboboxItem, ComboboxLabel, ComboboxList, ComboboxSeparator, ComboboxTrigger, ComboboxValue, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle, Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle, HoverCard, HoverCardContent, HoverCardTrigger, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, Item, ItemActions, ItemContent, ItemDescription, ItemFooter, ItemGroup, ItemHeader, ItemMedia, ItemSeparator, ItemTitle, Kbd, KbdGroup, Label, Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarPortal, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, NextThemeProvider, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, Popover, PopoverAnchor, PopoverContent, PopoverDescription, PopoverHeader, PopoverTitle, PopoverTrigger, Progress, RadioGroup, RadioGroupItem, ResizableHandle, ResizablePanel, ResizablePanelGroup, ScrollArea, ScrollBar, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, Skeleton, Slider, Spinner, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, TanstackThemeProvider, Textarea, Toaster, Toggle, ToggleGroup, ToggleGroupItem, Tooltip2 as Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, badgeVariants, buttonGroupVariants, buttonVariants, cn, navigationMenuTriggerStyle, tabsListVariants, toggleVariants, useCarousel, useComboboxAnchor, useIsMobile, useSidebar, useTanstackTheme };
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertAction, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AspectRatio, Avatar, AvatarBadge, AvatarFallback, AvatarGroup, AvatarGroupCount, AvatarImage, Badge, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, Calendar, CalendarDayButton, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, ChartContainer, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent, Checkbox, Collapsible, CollapsibleContent, CollapsibleTrigger, Combobox, ComboboxChip, ComboboxChips, ComboboxChipsInput, ComboboxCollection, ComboboxContent, ComboboxEmpty, ComboboxGroup, ComboboxInput, ComboboxItem, ComboboxLabel, ComboboxList, ComboboxSeparator, ComboboxTrigger, ComboboxValue, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle, Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle, HoverCard, HoverCardContent, HoverCardTrigger, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, Item, ItemActions, ItemContent, ItemDescription, ItemFooter, ItemGroup, ItemHeader, ItemMedia, ItemSeparator, ItemTitle, Kbd, KbdGroup, Label, Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarPortal, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, Popover, PopoverAnchor, PopoverContent, PopoverDescription, PopoverHeader, PopoverTitle, PopoverTrigger, Progress, RadioGroup, RadioGroupItem, ResizableHandle, ResizablePanel, ResizablePanelGroup, ScrollArea, ScrollBar, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, Skeleton, Slider, Spinner, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, Toaster, Toggle, ToggleGroup, ToggleGroupItem, Tooltip2 as Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, badgeVariants, buttonGroupVariants, buttonVariants, cn, navigationMenuTriggerStyle, tabsListVariants, toggleVariants, useCarousel, useComboboxAnchor, useIsMobile, useSidebar };

package/dist/next.d.ts

@@ -0,0 +1,3 @@
+export { NextThemeProvider as ThemeProvider } from './providers/next-theme-provider.js';
+export { ThemeProviderProps, useTheme } from 'next-themes';
+import 'react/jsx-runtime';

package/dist/next.js

@@ -0,0 +1,45 @@
+import { ThemeProvider } from 'next-themes';
+export { useTheme } from 'next-themes';
+import { jsx } from 'react/jsx-runtime';
+
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+function NextThemeProvider(_a) {
+  var _b = _a, {
+    children
+  } = _b, props = __objRest(_b, [
+    "children"
+  ]);
+  return /* @__PURE__ */ jsx(ThemeProvider, __spreadProps(__spreadValues({}, props), { children }));
+}
+
+export { NextThemeProvider as ThemeProvider };

package/dist/providers/next-theme-provider.d.ts

@@ -0,0 +1,7 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ThemeProviderProps } from 'next-themes';
+export { ThemeProviderProps as NextThemeProviderProps, useTheme as useNextTheme } from 'next-themes';
+
+declare function NextThemeProvider({ children, ...props }: React.PropsWithChildren<ThemeProviderProps>): react_jsx_runtime.JSX.Element;
+
+export { NextThemeProvider };

package/dist/providers/next-theme-provider.js

@@ -0,0 +1,45 @@
+import { ThemeProvider } from 'next-themes';
+export { useTheme as useNextTheme } from 'next-themes';
+import { jsx } from 'react/jsx-runtime';
+
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+function NextThemeProvider(_a) {
+  var _b = _a, {
+    children
+  } = _b, props = __objRest(_b, [
+    "children"
+  ]);
+  return /* @__PURE__ */ jsx(ThemeProvider, __spreadProps(__spreadValues({}, props), { children }));
+}
+
+export { NextThemeProvider };

package/dist/providers/tanstack-theme-provider.d.ts

@@ -0,0 +1,18 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+type ResolvedTheme = "dark" | "light";
+type Theme = ResolvedTheme | "system";
+interface TanstackThemeProviderProps {
+    children: React.ReactNode;
+    defaultTheme?: Theme;
+    storageKey?: string;
+}
+interface TanstackThemeProviderState {
+    theme: Theme;
+    resolvedTheme: ResolvedTheme;
+    setTheme: (theme: Theme) => void;
+}
+declare function TanstackThemeProvider({ children, defaultTheme, storageKey, }: TanstackThemeProviderProps): react_jsx_runtime.JSX.Element;
+declare function useTanstackTheme(): TanstackThemeProviderState;
+
+export { type ResolvedTheme, TanstackThemeProvider, type Theme, useTanstackTheme };

package/dist/providers/tanstack-theme-provider.js

@@ -0,0 +1,79 @@
+import { createContext, useState, useEffect, useMemo, use } from 'react';
+import { ScriptOnce } from '@tanstack/react-router';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var initialState = {
+  theme: "system",
+  resolvedTheme: "light",
+  setTheme: () => null
+};
+var TanstackThemeProviderContext = createContext(initialState);
+function FunctionOnce({
+  children,
+  param
+}) {
+  return /* @__PURE__ */ jsx(ScriptOnce, { children: `(${children.toString()})(${JSON.stringify(param)})` });
+}
+function TanstackThemeProvider({
+  children,
+  defaultTheme = "system",
+  storageKey = "ekko-ui.theme"
+}) {
+  const [theme, setThemeState] = useState(defaultTheme);
+  const [resolvedTheme, setResolvedTheme] = useState("light");
+  const [mounted, setMounted] = useState(false);
+  useEffect(() => {
+    setMounted(true);
+    const stored = localStorage.getItem(storageKey);
+    if (stored && (stored === "light" || stored === "dark" || stored === "system")) {
+      setThemeState(stored);
+    }
+  }, [storageKey]);
+  useEffect(() => {
+    const root = window.document.documentElement;
+    const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
+    function updateTheme() {
+      root.classList.remove("light", "dark");
+      if (theme === "system") {
+        const systemTheme = mediaQuery.matches ? "dark" : "light";
+        setResolvedTheme(systemTheme);
+        root.classList.add(systemTheme);
+        return;
+      }
+      setResolvedTheme(theme);
+      root.classList.add(theme);
+    }
+    mediaQuery.addEventListener("change", updateTheme);
+    updateTheme();
+    return () => mediaQuery.removeEventListener("change", updateTheme);
+  }, [theme]);
+  const value = useMemo(
+    () => ({
+      theme,
+      resolvedTheme,
+      setTheme: (newTheme) => {
+        localStorage.setItem(storageKey, newTheme);
+        setThemeState(newTheme);
+      }
+    }),
+    [theme, resolvedTheme, storageKey]
+  );
+  return /* @__PURE__ */ jsxs(TanstackThemeProviderContext.Provider, { value, children: [
+    /* @__PURE__ */ jsx(FunctionOnce, { param: storageKey, children: (storageKey2) => {
+      const theme2 = localStorage.getItem(storageKey2);
+      if (theme2 === "dark" || (theme2 === null || theme2 === "system") && window.matchMedia("(prefers-color-scheme: dark)").matches) {
+        document.documentElement.classList.add("dark");
+      }
+    } }),
+    children
+  ] });
+}
+function useTanstackTheme() {
+  const context = use(TanstackThemeProviderContext);
+  if (context === void 0) {
+    throw new Error("useTanstackTheme must be used within a TanstackThemeProvider");
+  }
+  return context;
+}
+
+export { TanstackThemeProvider, useTanstackTheme };

package/dist/tanstack.d.ts

@@ -0,0 +1,2 @@
+export { ResolvedTheme, Theme, TanstackThemeProvider as ThemeProvider, useTanstackTheme as useTheme } from './providers/tanstack-theme-provider.js';
+import 'react/jsx-runtime';

package/dist/tanstack.js

@@ -0,0 +1,80 @@
+import { createContext, useState, useEffect, useMemo, use } from 'react';
+import { ScriptOnce } from '@tanstack/react-router';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+// src/components/theme/providers/tanstack-theme-provider.tsx
+var initialState = {
+  theme: "system",
+  resolvedTheme: "light",
+  setTheme: () => null
+};
+var TanstackThemeProviderContext = createContext(initialState);
+function FunctionOnce({
+  children,
+  param
+}) {
+  return /* @__PURE__ */ jsx(ScriptOnce, { children: `(${children.toString()})(${JSON.stringify(param)})` });
+}
+function TanstackThemeProvider({
+  children,
+  defaultTheme = "system",
+  storageKey = "ekko-ui.theme"
+}) {
+  const [theme, setThemeState] = useState(defaultTheme);
+  const [resolvedTheme, setResolvedTheme] = useState("light");
+  const [mounted, setMounted] = useState(false);
+  useEffect(() => {
+    setMounted(true);
+    const stored = localStorage.getItem(storageKey);
+    if (stored && (stored === "light" || stored === "dark" || stored === "system")) {
+      setThemeState(stored);
+    }
+  }, [storageKey]);
+  useEffect(() => {
+    const root = window.document.documentElement;
+    const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
+    function updateTheme() {
+      root.classList.remove("light", "dark");
+      if (theme === "system") {
+        const systemTheme = mediaQuery.matches ? "dark" : "light";
+        setResolvedTheme(systemTheme);
+        root.classList.add(systemTheme);
+        return;
+      }
+      setResolvedTheme(theme);
+      root.classList.add(theme);
+    }
+    mediaQuery.addEventListener("change", updateTheme);
+    updateTheme();
+    return () => mediaQuery.removeEventListener("change", updateTheme);
+  }, [theme]);
+  const value = useMemo(
+    () => ({
+      theme,
+      resolvedTheme,
+      setTheme: (newTheme) => {
+        localStorage.setItem(storageKey, newTheme);
+        setThemeState(newTheme);
+      }
+    }),
+    [theme, resolvedTheme, storageKey]
+  );
+  return /* @__PURE__ */ jsxs(TanstackThemeProviderContext.Provider, { value, children: [
+    /* @__PURE__ */ jsx(FunctionOnce, { param: storageKey, children: (storageKey2) => {
+      const theme2 = localStorage.getItem(storageKey2);
+      if (theme2 === "dark" || (theme2 === null || theme2 === "system") && window.matchMedia("(prefers-color-scheme: dark)").matches) {
+        document.documentElement.classList.add("dark");
+      }
+    } }),
+    children
+  ] });
+}
+function useTanstackTheme() {
+  const context = use(TanstackThemeProviderContext);
+  if (context === void 0) {
+    throw new Error("useTanstackTheme must be used within a TanstackThemeProvider");
+  }
+  return context;
+}
+
+export { TanstackThemeProvider as ThemeProvider, useTanstackTheme as useTheme };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ekkolyth/ui",
-  "version": "0.0.2",
+  "version": "0.1.1",
   "description": "Shared UI Library for my personal projects",
   "keywords": [
     "theme",
@@ -21,6 +21,14 @@
       "types": "./dist/index.d.ts",
       "import": "./dist/index.js"
     },
+    "./next": {
+      "types": "./dist/next.d.ts",
+      "import": "./dist/next.js"
+    },
+    "./tanstack": {
+      "types": "./dist/tanstack.d.ts",
+      "import": "./dist/tanstack.js"
+    },
     "./providers/next-theme": {
       "types": "./dist/providers/next-theme-provider.d.ts",
       "import": "./dist/providers/next-theme-provider.js"