@biotechusa/pdo-ui 1.0.3 → 1.0.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/circular-progress.d.ts +5 -0
- package/dist/circular-progress.js +66 -0
- package/dist/index.css +31 -0
- package/dist/index.d.ts +48 -44
- package/dist/index.js +3 -1
- package/dist/input.d.ts +1 -1
- package/dist/input.js +1 -1
- package/dist/menu.d.ts +10 -4
- package/dist/menu.js +12 -8
- package/dist/styles.css +146 -125
- package/package.json +1 -1
|
@@ -0,0 +1,66 @@
|
|
|
1
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
+
const SIZE_MAP = {
|
|
3
|
+
sm: 12,
|
|
4
|
+
md: 14,
|
|
5
|
+
lg: 18
|
|
6
|
+
};
|
|
7
|
+
function getColor(value) {
|
|
8
|
+
if (0 === value) return "var(--muted-foreground)";
|
|
9
|
+
if (value > 0 && value <= 25) return "var(--chart-1)";
|
|
10
|
+
if (value > 25 && value <= 50) return "var(--warning)";
|
|
11
|
+
if (value > 50 && value < 100) return "var(--info)";
|
|
12
|
+
if (value > 99) return "var(--success)";
|
|
13
|
+
}
|
|
14
|
+
function CircularProgress({ value, size = "md" }) {
|
|
15
|
+
const pct = Math.min(100, Math.max(0, value));
|
|
16
|
+
const sizePx = "number" == typeof size ? size : SIZE_MAP[size];
|
|
17
|
+
const r = 2;
|
|
18
|
+
const dash = 11.3097335529;
|
|
19
|
+
const gap = 22.6194671058;
|
|
20
|
+
const strokeDashoffset = dash - pct / 100 * dash;
|
|
21
|
+
const color = getColor(value);
|
|
22
|
+
if (100 === pct) return /*#__PURE__*/ jsx("svg", {
|
|
23
|
+
width: sizePx,
|
|
24
|
+
height: sizePx,
|
|
25
|
+
viewBox: "0 0 14 14",
|
|
26
|
+
fill: color,
|
|
27
|
+
"aria-hidden": "true",
|
|
28
|
+
className: "checkmark-animated",
|
|
29
|
+
children: /*#__PURE__*/ jsx("path", {
|
|
30
|
+
fillRule: "evenodd",
|
|
31
|
+
clipRule: "evenodd",
|
|
32
|
+
d: "M7 0C3.13401 0 0 3.13401 0 7C0 10.866 3.13401 14 7 14C10.866 14 14 10.866 14 7C14 3.13401 10.866 0 7 0ZM11.101 5.10104C11.433 4.76909 11.433 4.23091 11.101 3.89896C10.7691 3.56701 10.2309 3.56701 9.89896 3.89896L5.5 8.29792L4.10104 6.89896C3.7691 6.56701 3.2309 6.56701 2.89896 6.89896C2.56701 7.2309 2.56701 7.7691 2.89896 8.10104L4.89896 10.101C5.2309 10.433 5.7691 10.433 6.10104 10.101L11.101 5.10104Z"
|
|
33
|
+
})
|
|
34
|
+
});
|
|
35
|
+
return /*#__PURE__*/ jsxs("svg", {
|
|
36
|
+
width: sizePx,
|
|
37
|
+
height: sizePx,
|
|
38
|
+
viewBox: "0 0 14 14",
|
|
39
|
+
fill: "none",
|
|
40
|
+
children: [
|
|
41
|
+
/*#__PURE__*/ jsx("circle", {
|
|
42
|
+
cx: "7",
|
|
43
|
+
cy: "7",
|
|
44
|
+
r: "6",
|
|
45
|
+
fill: "none",
|
|
46
|
+
stroke: color,
|
|
47
|
+
strokeWidth: "1.5",
|
|
48
|
+
strokeDasharray: "3.14 0",
|
|
49
|
+
strokeDashoffset: "-0.7"
|
|
50
|
+
}),
|
|
51
|
+
/*#__PURE__*/ jsx("circle", {
|
|
52
|
+
className: "transition-colors duration-300",
|
|
53
|
+
cx: "7",
|
|
54
|
+
cy: "7",
|
|
55
|
+
r: r,
|
|
56
|
+
fill: "none",
|
|
57
|
+
stroke: color,
|
|
58
|
+
strokeWidth: "4",
|
|
59
|
+
strokeDasharray: `${dash} ${gap}`,
|
|
60
|
+
strokeDashoffset: strokeDashoffset,
|
|
61
|
+
transform: "rotate(-90 7 7)"
|
|
62
|
+
})
|
|
63
|
+
]
|
|
64
|
+
});
|
|
65
|
+
}
|
|
66
|
+
export { CircularProgress };
|
package/dist/index.css
CHANGED
|
@@ -1596,6 +1596,10 @@
|
|
|
1596
1596
|
padding-block: calc(calc(var(--spacing) * 2) - 1px);
|
|
1597
1597
|
}
|
|
1598
1598
|
|
|
1599
|
+
.py-\[calc\(--spacing\(4\)-1px\)\] {
|
|
1600
|
+
padding-block: calc(calc(var(--spacing) * 4) - 1px);
|
|
1601
|
+
}
|
|
1602
|
+
|
|
1599
1603
|
.ps-1\.5 {
|
|
1600
1604
|
padding-inline-start: calc(var(--spacing) * 1.5);
|
|
1601
1605
|
}
|
|
@@ -3597,6 +3601,10 @@
|
|
|
3597
3601
|
transform: translateY(calc(-100% - var(--toast-inset)));
|
|
3598
3602
|
}
|
|
3599
3603
|
|
|
3604
|
+
.data-\[size\=touch\]\:py-\(--spacing-touch\)[data-size="touch"] {
|
|
3605
|
+
padding-block: var(--spacing-touch);
|
|
3606
|
+
}
|
|
3607
|
+
|
|
3600
3608
|
:is(.has-\[\+\[data-slot\=autocomplete-trigger\]\,\+\[data-slot\=autocomplete-clear\]\]\:\*\:data-\[slot\=autocomplete-input\]\:pe-6\.5:has( + [data-slot="autocomplete-trigger"], + [data-slot="autocomplete-clear"]) > *)[data-slot="autocomplete-input"] {
|
|
3601
3609
|
padding-inline-end: calc(var(--spacing) * 6.5);
|
|
3602
3610
|
}
|
|
@@ -4873,6 +4881,7 @@
|
|
|
4873
4881
|
--sidebar-accent-foreground: oklch(20.5% 0 0);
|
|
4874
4882
|
--sidebar-border: oklch(92.2% 0 0);
|
|
4875
4883
|
--sidebar-ring: oklch(70.8% 0 0);
|
|
4884
|
+
--spacing-touch: calc(var(--spacing) * 4);
|
|
4876
4885
|
--info: var(--color-blue-500);
|
|
4877
4886
|
--info-foreground: var(--color-blue-700);
|
|
4878
4887
|
--success: var(--color-emerald-500);
|
|
@@ -4922,6 +4931,28 @@
|
|
|
4922
4931
|
--warning-foreground: var(--color-amber-400);
|
|
4923
4932
|
}
|
|
4924
4933
|
|
|
4934
|
+
@keyframes checkmark-pop {
|
|
4935
|
+
0% {
|
|
4936
|
+
opacity: 0;
|
|
4937
|
+
transform: scale(.5);
|
|
4938
|
+
}
|
|
4939
|
+
|
|
4940
|
+
60% {
|
|
4941
|
+
opacity: 1;
|
|
4942
|
+
transform: scale(1.1);
|
|
4943
|
+
}
|
|
4944
|
+
|
|
4945
|
+
to {
|
|
4946
|
+
opacity: 1;
|
|
4947
|
+
transform: scale(1);
|
|
4948
|
+
}
|
|
4949
|
+
}
|
|
4950
|
+
|
|
4951
|
+
.checkmark-animated {
|
|
4952
|
+
transform-origin: 50%;
|
|
4953
|
+
animation: .2s ease-out forwards checkmark-pop;
|
|
4954
|
+
}
|
|
4955
|
+
|
|
4925
4956
|
@property --tw-translate-x {
|
|
4926
4957
|
syntax: "*";
|
|
4927
4958
|
inherits: false;
|
package/dist/index.d.ts
CHANGED
|
@@ -1,44 +1,48 @@
|
|
|
1
|
-
import
|
|
2
|
-
export { Alert, AlertAction, AlertDescription, AlertTitle } from
|
|
3
|
-
export { AlertDialog, AlertDialogBackdrop, AlertDialogClose, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPopup, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, } from
|
|
4
|
-
export { Autocomplete, AutocompleteClear, AutocompleteCollection, AutocompleteEmpty, AutocompleteGroup, AutocompleteGroupLabel, AutocompleteInput, AutocompleteItem, AutocompleteList, AutocompletePopup, AutocompleteRow, AutocompleteSeparator, AutocompleteStatus, AutocompleteTrigger, AutocompleteValue, } from
|
|
5
|
-
export { Avatar, AvatarFallback, AvatarImage } from
|
|
6
|
-
export { Badge, badgeVariants } from
|
|
7
|
-
export { Button, buttonVariants } from
|
|
8
|
-
export { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardPanel, CardTitle, } from
|
|
9
|
-
export { Checkbox } from
|
|
10
|
-
export { CheckboxGroup } from
|
|
11
|
-
export { Combobox, ComboboxChip, ComboboxChips, ComboboxClear, ComboboxCollection, ComboboxEmpty, ComboboxGroup, ComboboxGroupLabel, ComboboxInput, ComboboxItem, ComboboxList, ComboboxPopup, ComboboxRow, ComboboxSeparator, ComboboxStatus, ComboboxTrigger, ComboboxValue, } from
|
|
12
|
-
export { Dialog, DialogBackdrop, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPopup, DialogPortal, DialogTitle, DialogTrigger, } from
|
|
13
|
-
export { Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle, } from
|
|
14
|
-
export { Field, FieldControl, FieldDescription, FieldError, FieldLabel, FieldValidity, } from
|
|
15
|
-
export { Fieldset, FieldsetLegend } from
|
|
16
|
-
export { Form } from
|
|
17
|
-
export { Frame, FrameDescription, FrameFooter, FrameHeader, FramePanel, FrameTitle, } from
|
|
18
|
-
export { ButtonGroup, ButtonGroupSeparator, ButtonGroupText, Group, GroupSeparator, GroupText, groupVariants, } from
|
|
19
|
-
export type { InputProps } from
|
|
20
|
-
export { Input } from
|
|
21
|
-
export { InputGroup, InputGroupAddon, InputGroupInput, InputGroupText, InputGroupTextarea, } from
|
|
22
|
-
export { Label } from
|
|
23
|
-
export { DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Menu, MenuCheckboxItem, MenuGroup, MenuGroupLabel, MenuItem, MenuPopup, MenuPortal, MenuRadioGroup, MenuRadioItem, MenuSeparator, MenuShortcut, MenuSub, MenuSubPopup, MenuSubTrigger, MenuTrigger, } from
|
|
24
|
-
export { NumberField, NumberFieldDecrement, NumberFieldGroup, NumberFieldIncrement, NumberFieldInput, NumberFieldScrubArea, } from
|
|
25
|
-
export { Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, } from
|
|
26
|
-
export { Popover, PopoverClose, PopoverContent, PopoverDescription, PopoverPopup, PopoverTitle, PopoverTrigger, } from
|
|
27
|
-
export { Progress, ProgressIndicator, ProgressLabel, ProgressTrack, ProgressValue, } from
|
|
28
|
-
export { Radio, RadioGroup, RadioGroupItem } from
|
|
29
|
-
export { ScrollArea, ScrollBar } from
|
|
30
|
-
export { Select, SelectContent, SelectGroup, SelectGroupLabel, SelectItem, SelectPopup, SelectSeparator, SelectTrigger, SelectValue, } from
|
|
31
|
-
export { Separator } from
|
|
32
|
-
export { Sheet, SheetBackdrop, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPopup, SheetPortal, SheetTitle, SheetTrigger, sheetPopupVariants, } from
|
|
33
|
-
export { Skeleton } from
|
|
34
|
-
export { Slider, SliderValue } from
|
|
35
|
-
export { Spinner } from
|
|
36
|
-
export { Switch } from
|
|
37
|
-
export { Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, } from
|
|
38
|
-
export { Tabs, TabsContent, TabsList, TabsPanel, TabsTab, TabsTrigger, } from
|
|
39
|
-
export type { TextareaProps } from
|
|
40
|
-
export { Textarea } from
|
|
41
|
-
export { Toggle, toggleVariants } from
|
|
42
|
-
export { ToggleGroup, ToggleGroupItem, ToggleGroupSeparator, } from
|
|
43
|
-
export { Toolbar, ToolbarButton, ToolbarGroup, ToolbarInput, ToolbarLink, ToolbarSeparator, } from
|
|
44
|
-
export { Tooltip, TooltipContent, TooltipPopup, TooltipProvider, TooltipTrigger, } from
|
|
1
|
+
import "./index.css";
|
|
2
|
+
export { Alert, AlertAction, AlertDescription, AlertTitle } from "./alert";
|
|
3
|
+
export { AlertDialog, AlertDialogBackdrop, AlertDialogClose, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPopup, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, } from "./alert-dialog";
|
|
4
|
+
export { Autocomplete, AutocompleteClear, AutocompleteCollection, AutocompleteEmpty, AutocompleteGroup, AutocompleteGroupLabel, AutocompleteInput, AutocompleteItem, AutocompleteList, AutocompletePopup, AutocompleteRow, AutocompleteSeparator, AutocompleteStatus, AutocompleteTrigger, AutocompleteValue, } from "./autocomplete";
|
|
5
|
+
export { Avatar, AvatarFallback, AvatarImage } from "./avatar";
|
|
6
|
+
export { Badge, badgeVariants } from "./badge";
|
|
7
|
+
export { Button, buttonVariants } from "./button";
|
|
8
|
+
export { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardPanel, CardTitle, } from "./card";
|
|
9
|
+
export { Checkbox } from "./checkbox";
|
|
10
|
+
export { CheckboxGroup } from "./checkbox-group";
|
|
11
|
+
export { Combobox, ComboboxChip, ComboboxChips, ComboboxClear, ComboboxCollection, ComboboxEmpty, ComboboxGroup, ComboboxGroupLabel, ComboboxInput, ComboboxItem, ComboboxList, ComboboxPopup, ComboboxRow, ComboboxSeparator, ComboboxStatus, ComboboxTrigger, ComboboxValue, } from "./combobox";
|
|
12
|
+
export { Dialog, DialogBackdrop, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPopup, DialogPortal, DialogTitle, DialogTrigger, } from "./dialog";
|
|
13
|
+
export { Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle, } from "./empty";
|
|
14
|
+
export { Field, FieldControl, FieldDescription, FieldError, FieldLabel, FieldValidity, } from "./field";
|
|
15
|
+
export { Fieldset, FieldsetLegend } from "./fieldset";
|
|
16
|
+
export { Form } from "./form";
|
|
17
|
+
export { Frame, FrameDescription, FrameFooter, FrameHeader, FramePanel, FrameTitle, } from "./frame";
|
|
18
|
+
export { ButtonGroup, ButtonGroupSeparator, ButtonGroupText, Group, GroupSeparator, GroupText, groupVariants, } from "./group";
|
|
19
|
+
export type { InputProps } from "./input";
|
|
20
|
+
export { Input } from "./input";
|
|
21
|
+
export { InputGroup, InputGroupAddon, InputGroupInput, InputGroupText, InputGroupTextarea, } from "./input-group";
|
|
22
|
+
export { Label } from "./label";
|
|
23
|
+
export { DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Menu, MenuCheckboxItem, MenuGroup, MenuGroupLabel, MenuItem, MenuPopup, MenuPortal, MenuRadioGroup, MenuRadioItem, MenuSeparator, MenuShortcut, MenuSub, MenuSubPopup, MenuSubTrigger, MenuTrigger, } from "./menu";
|
|
24
|
+
export { NumberField, NumberFieldDecrement, NumberFieldGroup, NumberFieldIncrement, NumberFieldInput, NumberFieldScrubArea, } from "./number-field";
|
|
25
|
+
export { Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, } from "./pagination";
|
|
26
|
+
export { Popover, PopoverClose, PopoverContent, PopoverDescription, PopoverPopup, PopoverTitle, PopoverTrigger, } from "./popover";
|
|
27
|
+
export { Progress, ProgressIndicator, ProgressLabel, ProgressTrack, ProgressValue, } from "./progress";
|
|
28
|
+
export { Radio, RadioGroup, RadioGroupItem } from "./radio-group";
|
|
29
|
+
export { ScrollArea, ScrollBar } from "./scroll-area";
|
|
30
|
+
export { Select, SelectContent, SelectGroup, SelectGroupLabel, SelectItem, SelectPopup, SelectSeparator, SelectTrigger, SelectValue, } from "./select";
|
|
31
|
+
export { Separator } from "./separator";
|
|
32
|
+
export { Sheet, SheetBackdrop, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPopup, SheetPortal, SheetTitle, SheetTrigger, sheetPopupVariants, } from "./sheet";
|
|
33
|
+
export { Skeleton } from "./skeleton";
|
|
34
|
+
export { Slider, SliderValue } from "./slider";
|
|
35
|
+
export { Spinner } from "./spinner";
|
|
36
|
+
export { Switch } from "./switch";
|
|
37
|
+
export { Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, } from "./table";
|
|
38
|
+
export { Tabs, TabsContent, TabsList, TabsPanel, TabsTab, TabsTrigger, } from "./tabs";
|
|
39
|
+
export type { TextareaProps } from "./textarea";
|
|
40
|
+
export { Textarea } from "./textarea";
|
|
41
|
+
export { Toggle, toggleVariants } from "./toggle";
|
|
42
|
+
export { ToggleGroup, ToggleGroupItem, ToggleGroupSeparator, } from "./toggle-group";
|
|
43
|
+
export { Toolbar, ToolbarButton, ToolbarGroup, ToolbarInput, ToolbarLink, ToolbarSeparator, } from "./toolbar";
|
|
44
|
+
export { Tooltip, TooltipContent, TooltipPopup, TooltipProvider, TooltipTrigger, } from "./tooltip";
|
|
45
|
+
export { ToastProvider, toastManager } from "./toast";
|
|
46
|
+
export type { ToastPosition } from "./toast";
|
|
47
|
+
export { CircularProgress } from "./circular-progress";
|
|
48
|
+
export type { CircularProgressProps } from "./circular-progress";
|
package/dist/index.js
CHANGED
|
@@ -40,4 +40,6 @@ import { Toggle, toggleVariants } from "./toggle.js";
|
|
|
40
40
|
import { ToggleGroup, ToggleGroupItem, ToggleGroupSeparator } from "./toggle-group.js";
|
|
41
41
|
import { Toolbar, ToolbarButton, ToolbarGroup, ToolbarInput, ToolbarLink, ToolbarSeparator } from "./toolbar.js";
|
|
42
42
|
import { Tooltip, TooltipContent, TooltipPopup, TooltipProvider, TooltipTrigger } from "./tooltip.js";
|
|
43
|
-
|
|
43
|
+
import { ToastProvider, toastManager } from "./toast.js";
|
|
44
|
+
import { CircularProgress } from "./circular-progress.js";
|
|
45
|
+
export { Alert, AlertAction, AlertDescription, AlertDialog, AlertDialogBackdrop, AlertDialogClose, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPopup, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, Autocomplete, AutocompleteClear, AutocompleteCollection, AutocompleteEmpty, AutocompleteGroup, AutocompleteGroupLabel, AutocompleteInput, AutocompleteItem, AutocompleteList, AutocompletePopup, AutocompleteRow, AutocompleteSeparator, AutocompleteStatus, AutocompleteTrigger, AutocompleteValue, Avatar, AvatarFallback, AvatarImage, Badge, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardPanel, CardTitle, Checkbox, CheckboxGroup, CircularProgress, Combobox, ComboboxChip, ComboboxChips, ComboboxClear, ComboboxCollection, ComboboxEmpty, ComboboxGroup, ComboboxGroupLabel, ComboboxInput, ComboboxItem, ComboboxList, ComboboxPopup, ComboboxRow, ComboboxSeparator, ComboboxStatus, ComboboxTrigger, ComboboxValue, Dialog, DialogBackdrop, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPopup, DialogPortal, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle, Field, FieldControl, FieldDescription, FieldError, FieldLabel, FieldValidity, Fieldset, FieldsetLegend, Form, Frame, FrameDescription, FrameFooter, FrameHeader, FramePanel, FrameTitle, Group, GroupSeparator, GroupText, Input, InputGroup, InputGroupAddon, InputGroupInput, InputGroupText, InputGroupTextarea, Label, Menu, MenuCheckboxItem, MenuGroup, MenuGroupLabel, MenuItem, MenuPopup, MenuPortal, MenuRadioGroup, MenuRadioItem, MenuSeparator, MenuShortcut, MenuSub, MenuSubPopup, MenuSubTrigger, MenuTrigger, NumberField, NumberFieldDecrement, NumberFieldGroup, NumberFieldIncrement, NumberFieldInput, NumberFieldScrubArea, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, Popover, PopoverClose, PopoverContent, PopoverDescription, PopoverPopup, PopoverTitle, PopoverTrigger, Progress, ProgressIndicator, ProgressLabel, ProgressTrack, ProgressValue, Radio, RadioGroup, RadioGroupItem, ScrollArea, ScrollBar, Select, SelectContent, SelectGroup, SelectGroupLabel, SelectItem, SelectPopup, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetBackdrop, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPopup, SheetPortal, SheetTitle, SheetTrigger, Skeleton, Slider, SliderValue, Spinner, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsPanel, TabsTab, TabsTrigger, Textarea, ToastProvider, Toggle, ToggleGroup, ToggleGroupItem, ToggleGroupSeparator, Toolbar, ToolbarButton, ToolbarGroup, ToolbarInput, ToolbarLink, ToolbarSeparator, Tooltip, TooltipContent, TooltipPopup, TooltipProvider, TooltipTrigger, badgeVariants, buttonVariants, groupVariants, sheetPopupVariants, toastManager, toggleVariants };
|
package/dist/input.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { Input as InputPrimitive } from "@base-ui-components/react/input";
|
|
2
2
|
import type * as React from "react";
|
|
3
3
|
type InputProps = Omit<InputPrimitive.Props & React.RefAttributes<HTMLInputElement>, "size"> & {
|
|
4
|
-
size?: "sm" | "default" | "lg" | number;
|
|
4
|
+
size?: "sm" | "default" | "lg" | "touch" | number;
|
|
5
5
|
unstyled?: boolean;
|
|
6
6
|
};
|
|
7
7
|
declare function Input({ className, size, unstyled, ...props }: InputProps): import("react/jsx-runtime").JSX.Element;
|
package/dist/input.js
CHANGED
|
@@ -7,7 +7,7 @@ function input_Input({ className, size = "default", unstyled = false, ...props }
|
|
|
7
7
|
"data-size": size,
|
|
8
8
|
"data-slot": "input-control",
|
|
9
9
|
children: /*#__PURE__*/ jsx(Input, {
|
|
10
|
-
className: cn("w-full min-w-0 rounded-[inherit] px-[calc(--spacing(3)-1px)] py-[calc(--spacing(1.5)-1px)] outline-none placeholder:text-muted-foreground/64", "sm" === size && "px-[calc(--spacing(2.5)-1px)] py-[calc(--spacing(1)-1px)]", "lg" === size && "py-[calc(--spacing(2)-1px)]", "search" === props.type && "[&::-webkit-search-cancel-button]:appearance-none [&::-webkit-search-decoration]:appearance-none [&::-webkit-search-results-button]:appearance-none [&::-webkit-search-results-decoration]:appearance-none", "file" === props.type && "text-muted-foreground file:me-3 file:bg-transparent file:font-medium file:text-foreground file:text-sm"),
|
|
10
|
+
className: cn("w-full min-w-0 rounded-[inherit] px-[calc(--spacing(3)-1px)] py-[calc(--spacing(1.5)-1px)] outline-none placeholder:text-muted-foreground/64", "sm" === size && "px-[calc(--spacing(2.5)-1px)] py-[calc(--spacing(1)-1px)]", "lg" === size && "py-[calc(--spacing(2)-1px)]", "touch" === size && "py-[calc(--spacing(4)-1px)] px-[calc(--spacing(4)-1px)]", "search" === props.type && "[&::-webkit-search-cancel-button]:appearance-none [&::-webkit-search-decoration]:appearance-none [&::-webkit-search-results-button]:appearance-none [&::-webkit-search-results-decoration]:appearance-none", "file" === props.type && "text-muted-foreground file:me-3 file:bg-transparent file:font-medium file:text-foreground file:text-sm"),
|
|
11
11
|
"data-slot": "input",
|
|
12
12
|
size: "number" == typeof size ? size : void 0,
|
|
13
13
|
...props
|
package/dist/menu.d.ts
CHANGED
|
@@ -10,21 +10,27 @@ declare function MenuPopup({ className, sideOffset, align, alignOffset, side, ..
|
|
|
10
10
|
side?: MenuPrimitive.Positioner.Props["side"];
|
|
11
11
|
}): import("react/jsx-runtime").JSX.Element;
|
|
12
12
|
declare function MenuGroup(props: MenuPrimitive.Group.Props): import("react/jsx-runtime").JSX.Element;
|
|
13
|
-
declare function MenuItem({ className, inset, variant, ...props }: MenuPrimitive.Item.Props & {
|
|
13
|
+
declare function MenuItem({ className, inset, variant, size, ...props }: MenuPrimitive.Item.Props & {
|
|
14
14
|
inset?: boolean;
|
|
15
15
|
variant?: "default" | "destructive";
|
|
16
|
+
size?: "default" | "touch";
|
|
17
|
+
}): import("react/jsx-runtime").JSX.Element;
|
|
18
|
+
declare function MenuCheckboxItem({ className, children, checked, size, ...props }: MenuPrimitive.CheckboxItem.Props & {
|
|
19
|
+
size?: "default" | "touch";
|
|
16
20
|
}): import("react/jsx-runtime").JSX.Element;
|
|
17
|
-
declare function MenuCheckboxItem({ className, children, checked, ...props }: MenuPrimitive.CheckboxItem.Props): import("react/jsx-runtime").JSX.Element;
|
|
18
21
|
declare function MenuRadioGroup(props: MenuPrimitive.RadioGroup.Props): import("react/jsx-runtime").JSX.Element;
|
|
19
|
-
declare function MenuRadioItem({ className, children, ...props }: MenuPrimitive.RadioItem.Props
|
|
22
|
+
declare function MenuRadioItem({ className, children, size, ...props }: MenuPrimitive.RadioItem.Props & {
|
|
23
|
+
size?: "default" | "touch";
|
|
24
|
+
}): import("react/jsx-runtime").JSX.Element;
|
|
20
25
|
declare function MenuGroupLabel({ className, inset, ...props }: MenuPrimitive.GroupLabel.Props & {
|
|
21
26
|
inset?: boolean;
|
|
22
27
|
}): import("react/jsx-runtime").JSX.Element;
|
|
23
28
|
declare function MenuSeparator({ className, ...props }: MenuPrimitive.Separator.Props): import("react/jsx-runtime").JSX.Element;
|
|
24
29
|
declare function MenuShortcut({ className, ...props }: React.ComponentProps<"span">): import("react/jsx-runtime").JSX.Element;
|
|
25
30
|
declare function MenuSub(props: MenuPrimitive.SubmenuRoot.Props): import("react/jsx-runtime").JSX.Element;
|
|
26
|
-
declare function MenuSubTrigger({ className, inset, children, ...props }: MenuPrimitive.SubmenuTrigger.Props & {
|
|
31
|
+
declare function MenuSubTrigger({ className, inset, children, size, ...props }: MenuPrimitive.SubmenuTrigger.Props & {
|
|
27
32
|
inset?: boolean;
|
|
33
|
+
size?: "default" | "touch";
|
|
28
34
|
}): import("react/jsx-runtime").JSX.Element;
|
|
29
35
|
declare function MenuSubPopup({ className, sideOffset, alignOffset, align, ...props }: MenuPrimitive.Popup.Props & {
|
|
30
36
|
align?: MenuPrimitive.Positioner.Props["align"];
|
package/dist/menu.js
CHANGED
|
@@ -36,20 +36,22 @@ function MenuGroup(props) {
|
|
|
36
36
|
...props
|
|
37
37
|
});
|
|
38
38
|
}
|
|
39
|
-
function MenuItem({ className, inset, variant = "default", ...props }) {
|
|
39
|
+
function MenuItem({ className, inset, variant = "default", size = "default", ...props }) {
|
|
40
40
|
return /*#__PURE__*/ jsx(Menu.Item, {
|
|
41
|
-
className: cn("flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1 text-base outline-none data-disabled:pointer-events-none data-highlighted:bg-accent data-inset:ps-8 data-[variant=destructive]:text-destructive-foreground data-highlighted:text-accent-foreground data-disabled:opacity-64 sm:text-sm [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0", className),
|
|
41
|
+
className: cn("flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1 text-base outline-none data-disabled:pointer-events-none data-highlighted:bg-accent data-inset:ps-8 data-[variant=destructive]:text-destructive-foreground data-highlighted:text-accent-foreground data-disabled:opacity-64 sm:text-sm [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0 data-[size=touch]:py-(--spacing-touch)", className),
|
|
42
42
|
"data-inset": inset,
|
|
43
43
|
"data-slot": "menu-item",
|
|
44
44
|
"data-variant": variant,
|
|
45
|
+
"data-size": size,
|
|
45
46
|
...props
|
|
46
47
|
});
|
|
47
48
|
}
|
|
48
|
-
function MenuCheckboxItem({ className, children, checked, ...props }) {
|
|
49
|
+
function MenuCheckboxItem({ className, children, checked, size = "default", ...props }) {
|
|
49
50
|
return /*#__PURE__*/ jsxs(Menu.CheckboxItem, {
|
|
50
51
|
checked: checked,
|
|
51
|
-
className: cn("grid in-data-[side=none]:min-w-[calc(var(--anchor-width)+1.25rem)] cursor-default grid-cols-[1rem_1fr] items-center gap-2 rounded-sm py-1 ps-2 pe-4 text-base outline-none data-disabled:pointer-events-none data-highlighted:bg-accent data-highlighted:text-accent-foreground data-disabled:opacity-64 sm:text-sm [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0", className),
|
|
52
|
+
className: cn("grid in-data-[side=none]:min-w-[calc(var(--anchor-width)+1.25rem)] cursor-default grid-cols-[1rem_1fr] items-center gap-2 rounded-sm py-1 ps-2 pe-4 text-base outline-none data-disabled:pointer-events-none data-highlighted:bg-accent data-highlighted:text-accent-foreground data-disabled:opacity-64 sm:text-sm [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0 data-[size=touch]:py-(--spacing-touch)", className),
|
|
52
53
|
"data-slot": "menu-checkbox-item",
|
|
54
|
+
"data-size": size,
|
|
53
55
|
...props,
|
|
54
56
|
children: [
|
|
55
57
|
/*#__PURE__*/ jsx(Menu.CheckboxItemIndicator, {
|
|
@@ -69,10 +71,11 @@ function MenuRadioGroup(props) {
|
|
|
69
71
|
...props
|
|
70
72
|
});
|
|
71
73
|
}
|
|
72
|
-
function MenuRadioItem({ className, children, ...props }) {
|
|
74
|
+
function MenuRadioItem({ className, children, size = "default", ...props }) {
|
|
73
75
|
return /*#__PURE__*/ jsxs(Menu.RadioItem, {
|
|
74
|
-
className: cn("grid in-data-[side=none]:min-w-[calc(var(--anchor-width)+1.25rem)] cursor-default grid-cols-[1rem_1fr] items-center gap-2 rounded-sm py-1 ps-2 pe-4 text-base outline-none data-disabled:pointer-events-none data-highlighted:bg-accent data-highlighted:text-accent-foreground data-disabled:opacity-64 sm:text-sm [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0", className),
|
|
76
|
+
className: cn("grid in-data-[side=none]:min-w-[calc(var(--anchor-width)+1.25rem)] cursor-default grid-cols-[1rem_1fr] items-center gap-2 rounded-sm py-1 ps-2 pe-4 text-base outline-none data-disabled:pointer-events-none data-highlighted:bg-accent data-highlighted:text-accent-foreground data-disabled:opacity-64 sm:text-sm [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0 data-[size=touch]:py-(--spacing-touch)", className),
|
|
75
77
|
"data-slot": "menu-radio-item",
|
|
78
|
+
"data-size": size,
|
|
76
79
|
...props,
|
|
77
80
|
children: [
|
|
78
81
|
/*#__PURE__*/ jsx(Menu.RadioItemIndicator, {
|
|
@@ -114,11 +117,12 @@ function MenuSub(props) {
|
|
|
114
117
|
...props
|
|
115
118
|
});
|
|
116
119
|
}
|
|
117
|
-
function MenuSubTrigger({ className, inset, children, ...props }) {
|
|
120
|
+
function MenuSubTrigger({ className, inset, children, size = "default", ...props }) {
|
|
118
121
|
return /*#__PURE__*/ jsxs(Menu.SubmenuTrigger, {
|
|
119
|
-
className: cn("flex items-center gap-2 rounded-sm px-2 py-1 text-base outline-none data-disabled:pointer-events-none data-highlighted:bg-accent data-inset:ps-8 data-highlighted:text-accent-foreground data-disabled:opacity-64 sm:text-sm [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none", className),
|
|
122
|
+
className: cn("flex items-center gap-2 rounded-sm px-2 py-1 text-base outline-none data-disabled:pointer-events-none data-highlighted:bg-accent data-inset:ps-8 data-highlighted:text-accent-foreground data-disabled:opacity-64 sm:text-sm [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none data-[size=touch]:py-(--spacing-touch)", className),
|
|
120
123
|
"data-inset": inset,
|
|
121
124
|
"data-slot": "menu-sub-trigger",
|
|
125
|
+
"data-size": size,
|
|
122
126
|
...props,
|
|
123
127
|
children: [
|
|
124
128
|
children,
|
package/dist/styles.css
CHANGED
|
@@ -4,141 +4,162 @@
|
|
|
4
4
|
@custom-variant dark (&:is(.dark *));
|
|
5
5
|
|
|
6
6
|
:root {
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
7
|
+
--background: oklch(1 0 0);
|
|
8
|
+
--foreground: oklch(0.145 0 0);
|
|
9
|
+
--card: oklch(1 0 0);
|
|
10
|
+
--card-foreground: oklch(0.145 0 0);
|
|
11
|
+
--popover: oklch(1 0 0);
|
|
12
|
+
--popover-foreground: oklch(0.145 0 0);
|
|
13
|
+
--primary: oklch(0.205 0 0);
|
|
14
|
+
--primary-foreground: oklch(0.985 0 0);
|
|
15
|
+
--secondary: oklch(0.97 0 0);
|
|
16
|
+
--secondary-foreground: oklch(0.205 0 0);
|
|
17
|
+
--muted: oklch(0.97 0 0);
|
|
18
|
+
--muted-foreground: oklch(0.556 0 0);
|
|
19
|
+
--accent: oklch(0.97 0 0);
|
|
20
|
+
--accent-foreground: oklch(0.205 0 0);
|
|
21
|
+
--destructive: oklch(0.577 0.245 27.325);
|
|
22
|
+
--destructive-foreground: oklch(0.577 0.245 27.325);
|
|
23
|
+
--border: oklch(0.922 0 0);
|
|
24
|
+
--input: oklch(0.922 0 0);
|
|
25
|
+
--ring: oklch(0.708 0 0);
|
|
26
|
+
--chart-1: oklch(0.646 0.222 41.116);
|
|
27
|
+
--chart-2: oklch(0.6 0.118 184.704);
|
|
28
|
+
--chart-3: oklch(0.398 0.07 227.392);
|
|
29
|
+
--chart-4: oklch(0.828 0.189 84.429);
|
|
30
|
+
--chart-5: oklch(0.769 0.188 70.08);
|
|
31
|
+
--radius: 0.625rem;
|
|
32
|
+
--sidebar: oklch(0.985 0 0);
|
|
33
|
+
--sidebar-foreground: oklch(0.145 0 0);
|
|
34
|
+
--sidebar-primary: oklch(0.205 0 0);
|
|
35
|
+
--sidebar-primary-foreground: oklch(0.985 0 0);
|
|
36
|
+
--sidebar-accent: oklch(0.97 0 0);
|
|
37
|
+
--sidebar-accent-foreground: oklch(0.205 0 0);
|
|
38
|
+
--sidebar-border: oklch(0.922 0 0);
|
|
39
|
+
--sidebar-ring: oklch(0.708 0 0);
|
|
40
|
+
--spacing-touch: calc(var(--spacing) * 4);
|
|
40
41
|
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
42
|
+
--info: var(--color-blue-500);
|
|
43
|
+
--info-foreground: var(--color-blue-700);
|
|
44
|
+
--success: var(--color-emerald-500);
|
|
45
|
+
--success-foreground: var(--color-emerald-700);
|
|
46
|
+
--warning: var(--color-amber-500);
|
|
47
|
+
--warning-foreground: var(--color-amber-700);
|
|
47
48
|
}
|
|
48
49
|
|
|
49
50
|
.dark {
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
51
|
+
--background: oklch(0.145 0 0);
|
|
52
|
+
--foreground: oklch(0.985 0 0);
|
|
53
|
+
--card: oklch(0.145 0 0);
|
|
54
|
+
--card-foreground: oklch(0.985 0 0);
|
|
55
|
+
--popover: oklch(0.145 0 0);
|
|
56
|
+
--popover-foreground: oklch(0.985 0 0);
|
|
57
|
+
--primary: oklch(0.985 0 0);
|
|
58
|
+
--primary-foreground: oklch(0.205 0 0);
|
|
59
|
+
--secondary: oklch(0.269 0 0);
|
|
60
|
+
--secondary-foreground: oklch(0.985 0 0);
|
|
61
|
+
--muted: oklch(0.269 0 0);
|
|
62
|
+
--muted-foreground: oklch(0.708 0 0);
|
|
63
|
+
--accent: oklch(0.269 0 0);
|
|
64
|
+
--accent-foreground: oklch(0.985 0 0);
|
|
65
|
+
--destructive: oklch(0.396 0.141 25.723);
|
|
66
|
+
--destructive-foreground: oklch(0.637 0.237 25.331);
|
|
67
|
+
--border: oklch(0.269 0 0);
|
|
68
|
+
--input: oklch(0.269 0 0);
|
|
69
|
+
--ring: oklch(0.439 0 0);
|
|
70
|
+
--chart-1: oklch(0.488 0.243 264.376);
|
|
71
|
+
--chart-2: oklch(0.696 0.17 162.48);
|
|
72
|
+
--chart-3: oklch(0.769 0.188 70.08);
|
|
73
|
+
--chart-4: oklch(0.627 0.265 303.9);
|
|
74
|
+
--chart-5: oklch(0.645 0.246 16.439);
|
|
75
|
+
--sidebar: oklch(0.205 0 0);
|
|
76
|
+
--sidebar-foreground: oklch(0.985 0 0);
|
|
77
|
+
--sidebar-primary: oklch(0.488 0.243 264.376);
|
|
78
|
+
--sidebar-primary-foreground: oklch(0.985 0 0);
|
|
79
|
+
--sidebar-accent: oklch(0.269 0 0);
|
|
80
|
+
--sidebar-accent-foreground: oklch(0.985 0 0);
|
|
81
|
+
--sidebar-border: oklch(0.269 0 0);
|
|
82
|
+
--sidebar-ring: oklch(0.439 0 0);
|
|
82
83
|
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
84
|
+
--info: var(--color-blue-500);
|
|
85
|
+
--info-foreground: var(--color-blue-400);
|
|
86
|
+
--success: var(--color-emerald-500);
|
|
87
|
+
--success-foreground: var(--color-emerald-400);
|
|
88
|
+
--warning: var(--color-amber-500);
|
|
89
|
+
--warning-foreground: var(--color-amber-400);
|
|
89
90
|
}
|
|
90
91
|
|
|
91
92
|
@theme inline {
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
93
|
+
--color-background: var(--background);
|
|
94
|
+
--color-foreground: var(--foreground);
|
|
95
|
+
--color-card: var(--card);
|
|
96
|
+
--color-card-foreground: var(--card-foreground);
|
|
97
|
+
--color-popover: var(--popover);
|
|
98
|
+
--color-popover-foreground: var(--popover-foreground);
|
|
99
|
+
--color-primary: var(--primary);
|
|
100
|
+
--color-primary-foreground: var(--primary-foreground);
|
|
101
|
+
--color-secondary: var(--secondary);
|
|
102
|
+
--color-secondary-foreground: var(--secondary-foreground);
|
|
103
|
+
--color-muted: var(--muted);
|
|
104
|
+
--color-muted-foreground: var(--muted-foreground);
|
|
105
|
+
--color-accent: var(--accent);
|
|
106
|
+
--color-accent-foreground: var(--accent-foreground);
|
|
107
|
+
--color-destructive: var(--destructive);
|
|
108
|
+
--color-destructive-foreground: var(--destructive-foreground);
|
|
109
|
+
--color-border: var(--border);
|
|
110
|
+
--color-input: var(--input);
|
|
111
|
+
--color-ring: var(--ring);
|
|
112
|
+
--color-chart-1: var(--chart-1);
|
|
113
|
+
--color-chart-2: var(--chart-2);
|
|
114
|
+
--color-chart-3: var(--chart-3);
|
|
115
|
+
--color-chart-4: var(--chart-4);
|
|
116
|
+
--color-chart-5: var(--chart-5);
|
|
117
|
+
--radius-sm: calc(var(--radius) - 4px);
|
|
118
|
+
--radius-md: calc(var(--radius) - 2px);
|
|
119
|
+
--radius-lg: var(--radius);
|
|
120
|
+
--radius-xl: calc(var(--radius) + 4px);
|
|
121
|
+
--color-sidebar: var(--sidebar);
|
|
122
|
+
--color-sidebar-foreground: var(--sidebar-foreground);
|
|
123
|
+
--color-sidebar-primary: var(--sidebar-primary);
|
|
124
|
+
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
|
125
|
+
--color-sidebar-accent: var(--sidebar-accent);
|
|
126
|
+
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
|
127
|
+
--color-sidebar-border: var(--sidebar-border);
|
|
128
|
+
--color-sidebar-ring: var(--sidebar-ring);
|
|
128
129
|
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
130
|
+
--color-info: var(--info);
|
|
131
|
+
--color-info-foreground: var(--info-foreground);
|
|
132
|
+
--color-success: var(--success);
|
|
133
|
+
--color-success-foreground: var(--success-foreground);
|
|
134
|
+
--color-warning: var(--warning);
|
|
135
|
+
--color-warning-foreground: var(--warning-foreground);
|
|
135
136
|
}
|
|
136
137
|
|
|
137
138
|
@layer base {
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
139
|
+
* {
|
|
140
|
+
@apply border-border outline-ring/50;
|
|
141
|
+
}
|
|
142
|
+
body {
|
|
143
|
+
@apply bg-background text-foreground;
|
|
144
|
+
}
|
|
145
|
+
}
|
|
146
|
+
|
|
147
|
+
@keyframes checkmark-pop {
|
|
148
|
+
0% {
|
|
149
|
+
opacity: 0;
|
|
150
|
+
transform: scale(0.5);
|
|
151
|
+
}
|
|
152
|
+
60% {
|
|
153
|
+
opacity: 1;
|
|
154
|
+
transform: scale(1.1);
|
|
155
|
+
}
|
|
156
|
+
100% {
|
|
157
|
+
opacity: 1;
|
|
158
|
+
transform: scale(1);
|
|
159
|
+
}
|
|
160
|
+
}
|
|
161
|
+
|
|
162
|
+
.checkmark-animated {
|
|
163
|
+
animation: checkmark-pop 200ms ease-out forwards;
|
|
164
|
+
transform-origin: center;
|
|
144
165
|
}
|