@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 +46 -1
- package/dist/index.js +147 -4
- package/dist/index.js.map +1 -1
- package/package.json +5 -5
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
|
|
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: `
|
|
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
|