@olwiba/cn 0.1.54 → 0.1.56

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/index.d.ts CHANGED
@@ -992,6 +992,51 @@ declare const SidebarMenuSubButton: React$1.ForwardRefExoticComponent<Omit<React
992
992
 
993
993
  declare function Skeleton({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): React$1.JSX.Element;
994
994
 
995
+ interface NotifyAction {
996
+ label: string;
997
+ onClick: () => void;
998
+ }
999
+ type NotifyVariant = "success" | "info" | "warning" | "error" | "message";
1000
+ interface NotifyOptions {
1001
+ variant?: NotifyVariant;
1002
+ title: string;
1003
+ description?: string;
1004
+ /** Avatar image, replacing the variant icon (e.g. a message from a person). */
1005
+ avatar?: string;
1006
+ /** Primary action (e.g. "Undo"). */
1007
+ action?: NotifyAction;
1008
+ /** Secondary action, rendered beside the primary one (e.g. "Decline"). */
1009
+ secondaryAction?: NotifyAction;
1010
+ /** Overrides the per-variant default below. */
1011
+ duration?: number;
1012
+ }
1013
+ /**
1014
+ * Fire a toast. Requires `<Toaster />` from this package mounted once.
1015
+ *
1016
+ * Deliberately built on sonner's *native* toast rather than `toast.custom`.
1017
+ * That is the whole point of this function existing here.
1018
+ *
1019
+ * sonner marks a toast `data-styled="false"` whenever it carries its own JSX
1020
+ * (`"data-styled": !Boolean(toast.jsx || toast.unstyled || unstyled)`), and
1021
+ * every rule the Toaster in this package ships — the grid layout, the type
1022
+ * scale, the close button, the success/error tinting, the action button
1023
+ * inversion, the smooth and playful modes — is scoped to
1024
+ * `[data-sonner-toast][data-styled='true']`. So a toast that brings its own
1025
+ * markup opts out of the entire design system and lands looking like a
1026
+ * different product's toast.
1027
+ *
1028
+ * That is exactly what happened: a parallel `notify()` in @olwiba/ui rendered
1029
+ * through `toast.custom`, and after the Toaster here was reworked the two no
1030
+ * longer resembled each other. One trigger, one renderer, one set of styles.
1031
+ *
1032
+ * Every feature of that richer component survives the move. `avatar` maps onto
1033
+ * sonner's `icon` slot, and `secondaryAction` onto `cancel`, so nothing has to
1034
+ * fall back to custom markup.
1035
+ */
1036
+ declare function notify({ variant, title, description, avatar, action, secondaryAction, duration, }: NotifyOptions): string | number;
1037
+ /** Dismiss a toast by id, or all of them when called with nothing. */
1038
+ declare function dismissNotification(id?: string | number): void;
1039
+
995
1040
  type SliderSize = "sm" | "default" | "lg";
996
1041
  interface SliderProps extends React$1.ComponentPropsWithoutRef<typeof SliderPrimitive.Root> {
997
1042
  size?: SliderSize;
@@ -1162,4 +1207,4 @@ interface EnchantedProps extends React$1.HTMLAttributes<HTMLDivElement> {
1162
1207
  }
1163
1208
  declare function Enchanted({ children, className, hoverOnly, glintClassName, ...props }: EnchantedProps): React$1.JSX.Element;
1164
1209
 
1165
- export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AsciiText, type AsciiTextProps, AspectRatio, Avatar, AvatarFallback, AvatarImage, Badge, type BadgeProps, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, type ButtonProps, Calendar, CalendarDayButton, Card, CardContent, CardDescription, CardFooter, CardHeader, type CardProps, CardTitle, Carousel, type CarouselApi, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, type ChartConfig, ChartContainer, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent, Checkbox, type CheckboxProps, Collapsible, CollapsibleContent, CollapsibleTrigger, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, type ConfettiOptions, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, Dialog, DialogClose, DialogContent, type DialogContentProps, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, type DialogPresentation, 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, Enchanted, type EnchantedProps, Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, HoverCard, HoverCardContent, HoverCardTrigger, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, InputOTP, InputOTPGroup, type InputOTPProps, InputOTPSeparator, InputOTPSlot, type InputProps, Item, ItemActions, ItemContent, ItemDescription, ItemFooter, ItemGroup, ItemHeader, ItemMedia, ItemSeparator, ItemTitle, Kbd, KbdGroup, type KbdProps, 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, NumberInput, type NumberInputProps, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, PasswordInput, type PasswordInputProps, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Progress, type ProgressProps, RadioGroup, RadioGroupItem, type RadioGroupItemProps, ResizableHandle, ResizablePanel, ResizablePanelGroup, ScrollArea, ScrollBar, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, 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, type SliderProps, Spinner, StatusIndicator, type StatusIndicatorProps, Switch, type SwitchProps, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, type TextareaProps, ThemeScript, Toaster, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, type UIVariant, UIVariantProvider, badgeVariants, buttonGroupVariants, buttonVariants, cn, fireConfetti, inputBase, inputPlayfulBacking, navigationMenuTriggerStyle, statusIndicatorDotVariants, toggleVariants, useCopyToClipboard, useFormField, useIsMobile, useResolvedTheme, useSidebar, useUIVariant };
1210
+ export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AsciiText, type AsciiTextProps, AspectRatio, Avatar, AvatarFallback, AvatarImage, Badge, type BadgeProps, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, type ButtonProps, Calendar, CalendarDayButton, Card, CardContent, CardDescription, CardFooter, CardHeader, type CardProps, CardTitle, Carousel, type CarouselApi, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, type ChartConfig, ChartContainer, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent, Checkbox, type CheckboxProps, Collapsible, CollapsibleContent, CollapsibleTrigger, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, type ConfettiOptions, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, Dialog, DialogClose, DialogContent, type DialogContentProps, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, type DialogPresentation, 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, Enchanted, type EnchantedProps, Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, HoverCard, HoverCardContent, HoverCardTrigger, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, InputOTP, InputOTPGroup, type InputOTPProps, InputOTPSeparator, InputOTPSlot, type InputProps, Item, ItemActions, ItemContent, ItemDescription, ItemFooter, ItemGroup, ItemHeader, ItemMedia, ItemSeparator, ItemTitle, Kbd, KbdGroup, type KbdProps, 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, type NotifyAction, type NotifyOptions, type NotifyVariant, NumberInput, type NumberInputProps, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, PasswordInput, type PasswordInputProps, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Progress, type ProgressProps, RadioGroup, RadioGroupItem, type RadioGroupItemProps, ResizableHandle, ResizablePanel, ResizablePanelGroup, ScrollArea, ScrollBar, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, 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, type SliderProps, Spinner, StatusIndicator, type StatusIndicatorProps, Switch, type SwitchProps, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, type TextareaProps, ThemeScript, Toaster, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, type UIVariant, UIVariantProvider, badgeVariants, buttonGroupVariants, buttonVariants, cn, dismissNotification, fireConfetti, inputBase, inputPlayfulBacking, navigationMenuTriggerStyle, notify, statusIndicatorDotVariants, toggleVariants, useCopyToClipboard, useFormField, useIsMobile, useResolvedTheme, useSidebar, useUIVariant };
package/dist/index.js CHANGED
@@ -34,8 +34,8 @@ import { Panel, Group, Separator as Separator$1 } from 'react-resizable-panels';
34
34
  import * as ScrollAreaPrimitive from '@radix-ui/react-scroll-area';
35
35
  import * as SelectPrimitive from '@radix-ui/react-select';
36
36
  import * as TooltipPrimitive from '@radix-ui/react-tooltip';
37
+ import { toast, Toaster as Toaster$1 } from 'sonner';
37
38
  import * as SliderPrimitive from '@radix-ui/react-slider';
38
- import { Toaster as Toaster$1 } from 'sonner';
39
39
  import * as SwitchPrimitives from '@radix-ui/react-switch';
40
40
  import * as TabsPrimitive from '@radix-ui/react-tabs';
41
41
  import * as TogglePrimitive from '@radix-ui/react-toggle';
@@ -5125,6 +5125,43 @@ var SidebarMenuSubButton = React39.forwardRef(({ asChild = false, size = "md", i
5125
5125
  );
5126
5126
  });
5127
5127
  SidebarMenuSubButton.displayName = "SidebarMenuSubButton";
5128
+ function defaultDuration(variant, hasAction) {
5129
+ if (variant === "error") return 1e4;
5130
+ if (variant === "warning") return 8e3;
5131
+ if (hasAction) return 8e3;
5132
+ return void 0;
5133
+ }
5134
+ function notify({
5135
+ variant = "info",
5136
+ title,
5137
+ description,
5138
+ avatar,
5139
+ action,
5140
+ secondaryAction,
5141
+ duration
5142
+ }) {
5143
+ const fire = variant === "message" ? toast : toast[variant];
5144
+ return fire(title, {
5145
+ description,
5146
+ duration: duration ?? defaultDuration(variant, Boolean(action || secondaryAction)),
5147
+ // An avatar replaces the icon rather than sitting beside it: the toast has
5148
+ // one icon column, and a message from a person is identified by the person,
5149
+ // not by the fact that it is a message.
5150
+ icon: avatar ? /* @__PURE__ */ jsx(
5151
+ "img",
5152
+ {
5153
+ src: avatar,
5154
+ alt: "",
5155
+ className: "size-5 shrink-0 rounded-full object-cover"
5156
+ }
5157
+ ) : void 0,
5158
+ action: action ? { label: action.label, onClick: action.onClick } : void 0,
5159
+ cancel: secondaryAction ? { label: secondaryAction.label, onClick: secondaryAction.onClick } : void 0
5160
+ });
5161
+ }
5162
+ function dismissNotification(id) {
5163
+ toast.dismiss(id);
5164
+ }
5128
5165
  var sliderTrackSizes = {
5129
5166
  sm: "h-1.5",
5130
5167
  default: "h-2",
@@ -5220,6 +5257,15 @@ var Toaster = ({
5220
5257
  left: unset;
5221
5258
  right: 0;
5222
5259
  top: 0;
5260
+ /* sonner's own transform: var(--toast-close-button-transform) is
5261
+ still in play here, and on ltr it resolves to
5262
+ translate(-35%, -35%) \u2014 the offset that makes *its* button straddle
5263
+ the top-left edge. Setting left/right/top moved the box; the
5264
+ transform then dragged it back out by ~8px up and left, which is
5265
+ why the button read as floating above and outside the corner even
5266
+ though the coordinates said 0/0. The offset has to be cancelled,
5267
+ not just overridden at the other end. */
5268
+ transform: none;
5223
5269
  height: 1.5rem;
5224
5270
  width: 1.5rem;
5225
5271
  padding: 0;
@@ -5235,7 +5281,15 @@ var Toaster = ({
5235
5281
  where the card ends and the two curves are one line. The remaining
5236
5282
  corners stay square, since they meet content rather than an edge. */
5237
5283
  border-radius: 0;
5238
- border-top-right-radius: var(--border-radius);
5284
+ /* Minus the border, because the two curves are measured from
5285
+ different edges. The toast's --border-radius describes its *outer*
5286
+ edge, but this button is absolutely positioned, so top/right: 0
5287
+ puts it on the padding box \u2014 the *inner* edge of that 1px border,
5288
+ where the curve is one pixel tighter. Drawing the outer radius here
5289
+ made the button fall away from the corner faster than the card
5290
+ does, which is the hairline gap that showed up in the curve and
5291
+ nowhere along the straight edges. */
5292
+ border-top-right-radius: calc(var(--border-radius) - 1px);
5239
5293
  background: transparent;
5240
5294
  /* Inherited rather than a fixed token: on a richColors toast the
5241
5295
  text is already the only colour guaranteed to read against that
@@ -5358,8 +5412,97 @@ var Toaster = ({
5358
5412
  color: inherit;
5359
5413
  opacity: 1;
5360
5414
  }
5415
+ /* Success and error carry a colour; everything else stays neutral.
5416
+
5417
+ Expressed by overriding sonner's own --normal-bg/-border/-text
5418
+ rather than painting background and border directly, because those
5419
+ three variables are what the rest of this stylesheet already reads:
5420
+ the action button inverts --normal-text against --normal-bg, the
5421
+ close button inherits the text colour. Retinting the variables moves
5422
+ all of it at once, and a tinted toast keeps a legible action button
5423
+ without a rule per type.
5424
+
5425
+ The tint is deliberately weak. The accent carries the icon at full
5426
+ strength and the border at a third, while the card stays within a
5427
+ few percent of the page background and the text stays --foreground.
5428
+ That is enough to read as green or red at a glance and not enough to
5429
+ turn a toast into a banner, which is what sonner's own richColors
5430
+ does. Anyone who wants that can still pass richColors: these rules
5431
+ bow out of a toast that has it, despite outranking it, because
5432
+ opting in to richColors should not land you in a third thing that is
5433
+ neither. */
5434
+ [data-sonner-toaster] [data-sonner-toast][data-styled='true'][data-type='success']:not([data-rich-colors='true']) {
5435
+ /* Falls back to a green of our own: --destructive is part of the
5436
+ shadcn token set and can be relied on, but there is no --success
5437
+ counterpart, and a registry item cannot require the consumer to go
5438
+ and add one. Named through var() anyway, so a project that does
5439
+ have the token gets its own green rather than ours. */
5440
+ --toast-accent: var(--success, oklch(0.55 0.14 152));
5441
+ }
5442
+ [data-sonner-toaster][data-sonner-theme='dark'] [data-sonner-toast][data-styled='true'][data-type='success']:not([data-rich-colors='true']) {
5443
+ /* Lightened for dark mode by hand. --destructive gets this for free
5444
+ from the theme; a literal cannot, and the light-mode green goes
5445
+ muddy against a dark card. */
5446
+ --toast-accent: var(--success, oklch(0.76 0.15 155));
5447
+ }
5448
+ [data-sonner-toaster] [data-sonner-toast][data-styled='true'][data-type='error']:not([data-rich-colors='true']) {
5449
+ --toast-accent: var(--destructive);
5450
+ }
5451
+ [data-sonner-toaster] [data-sonner-toast][data-styled='true']:is([data-type='success'], [data-type='error']):not([data-rich-colors='true']) {
5452
+ --normal-bg: color-mix(in oklab, var(--toast-accent) 7%, var(--background));
5453
+ --normal-border: color-mix(in oklab, var(--toast-accent) 30%, var(--border));
5454
+ --normal-text: var(--foreground);
5455
+ /* Restated as concrete properties, not left to sonner's base rule to
5456
+ pick up from the variables. The toastOptions classNames below set
5457
+ bg-background/text-foreground/border-border as utilities, which tie
5458
+ with sonner's own rule on specificity and win on order, so the
5459
+ variables alone would change nothing visible. */
5460
+ background: var(--normal-bg);
5461
+ border-color: var(--normal-border);
5462
+ color: var(--normal-text);
5463
+ }
5464
+ [data-sonner-toaster][data-sonner-theme='dark'] [data-sonner-toast][data-styled='true']:is([data-type='success'], [data-type='error']):not([data-rich-colors='true']) {
5465
+ /* A dark card needs more of the accent to shift by the same visible
5466
+ amount, since the mix is against near-black rather than near-white. */
5467
+ --normal-bg: color-mix(in oklab, var(--toast-accent) 14%, var(--background));
5468
+ }
5469
+ [data-sonner-toaster] [data-sonner-toast][data-styled='true']:is([data-type='success'], [data-type='error']):not([data-rich-colors='true']) [data-icon] {
5470
+ color: var(--toast-accent);
5471
+ }
5361
5472
  ` }),
5362
- mode === "smooth" && /* @__PURE__ */ jsx("style", { children: `[data-sonner-toaster].toaster-smooth { --border-radius: 1.5rem; }` }),
5473
+ mode === "smooth" && /* @__PURE__ */ jsx("style", { children: `
5474
+ [data-sonner-toaster].toaster-smooth { --border-radius: 1.5rem; }
5475
+ /* The corner-hugging close button is a default-mode idea and does not
5476
+ survive the move to a 1.5rem radius. At 8px the button's own curve
5477
+ is a small correction to a mostly square corner; at 24px the corner
5478
+ is deeper than the button is wide, so the shape degenerates into a
5479
+ bare quarter-circle whose two straight edges cut across the card's
5480
+ curve. Rounder cards want the opposite treatment: pull the button
5481
+ off the edge and let it be a circle.
5482
+
5483
+ The inset is derived rather than chosen. A rounded corner is an arc
5484
+ whose centre sits --border-radius in from both edges, so putting the
5485
+ button's centre on that same point makes the two concentric, and
5486
+ the gap between button and card edge stays equal the whole way
5487
+ around the curve instead of pinching at the diagonal. That centre
5488
+ is --border-radius from the card's outer edge, the button reaches
5489
+ half its own width back toward it, and top/right are measured from
5490
+ the padding box, one border inside. Hence the 1px.
5491
+
5492
+ It follows --border-radius, so this stays true if the smooth radius
5493
+ is ever retuned. */
5494
+ [data-sonner-toaster].toaster-smooth [data-sonner-toast][data-styled='true'] [data-close-button] {
5495
+ top: calc(var(--border-radius) - 0.75rem - 1px);
5496
+ right: calc(var(--border-radius) - 0.75rem - 1px);
5497
+ border-radius: 50%;
5498
+ }
5499
+ /* Reserving the corner again, now that the button has moved inward:
5500
+ its far edge is the inset plus its own width, and the content stops
5501
+ short of that. */
5502
+ [data-sonner-toaster].toaster-smooth [data-sonner-toast][data-styled='true']:has([data-close-button]) {
5503
+ padding-right: calc(var(--border-radius) + 1.25rem);
5504
+ }
5505
+ ` }),
5363
5506
  mode === "playful" && /* @__PURE__ */ jsx("style", { children: `
5364
5507
  [data-sonner-toaster].toaster-playful [data-sonner-toast][data-mounted=true] {
5365
5508
  transform: var(--y) rotate(0.3deg);
@@ -7564,6 +7707,6 @@ function Enchanted({ children, className, hoverOnly = false, glintClassName, ...
7564
7707
  ] });
7565
7708
  }
7566
7709
 
7567
- export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AsciiText, AspectRatio, Avatar, AvatarFallback, AvatarImage, Badge, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, Calendar, CalendarDayButton, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, ChartContainer, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent, Checkbox, Collapsible, CollapsibleContent2 as CollapsibleContent, CollapsibleTrigger2 as CollapsibleTrigger, 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, Enchanted, Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, HoverCard, HoverCardContent, HoverCardTrigger, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, Item4 as Item, ItemActions, ItemContent, ItemDescription, ItemFooter, ItemGroup, ItemHeader, ItemMedia, ItemSeparator, ItemTitle, Kbd, KbdGroup, Label3 as 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, NumberInput, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, PasswordInput, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Progress, RadioGroup4 as RadioGroup, RadioGroupItem, ResizableHandle, ResizablePanel, ResizablePanelGroup, ScrollArea, ScrollBar, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, 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, StatusIndicator, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, ThemeScript, Toaster, Toggle, ToggleGroup, ToggleGroupItem, Tooltip2 as Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, UIVariantProvider, badgeVariants, buttonGroupVariants, buttonVariants, cn, fireConfetti, inputBase, inputPlayfulBacking, navigationMenuTriggerStyle, statusIndicatorDotVariants, toggleVariants, useCopyToClipboard, useFormField, useIsMobile, useResolvedTheme, useSidebar, useUIVariant };
7710
+ export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AsciiText, AspectRatio, Avatar, AvatarFallback, AvatarImage, Badge, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, Calendar, CalendarDayButton, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, ChartContainer, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent, Checkbox, Collapsible, CollapsibleContent2 as CollapsibleContent, CollapsibleTrigger2 as CollapsibleTrigger, 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, Enchanted, Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, HoverCard, HoverCardContent, HoverCardTrigger, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, Item4 as Item, ItemActions, ItemContent, ItemDescription, ItemFooter, ItemGroup, ItemHeader, ItemMedia, ItemSeparator, ItemTitle, Kbd, KbdGroup, Label3 as 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, NumberInput, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, PasswordInput, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Progress, RadioGroup4 as RadioGroup, RadioGroupItem, ResizableHandle, ResizablePanel, ResizablePanelGroup, ScrollArea, ScrollBar, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, 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, StatusIndicator, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, ThemeScript, Toaster, Toggle, ToggleGroup, ToggleGroupItem, Tooltip2 as Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, UIVariantProvider, badgeVariants, buttonGroupVariants, buttonVariants, cn, dismissNotification, fireConfetti, inputBase, inputPlayfulBacking, navigationMenuTriggerStyle, notify, statusIndicatorDotVariants, toggleVariants, useCopyToClipboard, useFormField, useIsMobile, useResolvedTheme, useSidebar, useUIVariant };
7568
7711
  //# sourceMappingURL=index.js.map
7569
7712
  //# sourceMappingURL=index.js.map