lecom-ui 5.2.71 → 5.2.73
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/components/Combobox/Combobox.js +5 -19
- package/dist/components/CustomDivider/CustomDivider.js +18 -36
- package/dist/components/DataTable/DataTable.utils.js +1 -5
- package/dist/components/DataTable/Table.js +40 -60
- package/dist/components/Sheet/Sheet.js +1 -31
- package/dist/components/Steps/{StepsTimeline.js → Steps.js} +1 -0
- package/dist/components/Switch/Switch.js +20 -5
- package/dist/components/TagInput/TagInput.js +55 -58
- package/dist/index.d.ts +67 -93
- package/dist/index.js +3 -4
- package/dist/style.min.css +1 -1
- package/package.json +4 -3
- package/dist/badge.js +0 -26
- package/dist/button-dropdown.js +0 -117
- package/dist/button.js +0 -104
- package/dist/calendar.js +0 -62
- package/dist/card.js +0 -56
- package/dist/checkbox.js +0 -55
- package/dist/collapse.js +0 -60
- package/dist/collapsible.js +0 -7
- package/dist/command.js +0 -107
- package/dist/components/DataTable/useOptimizedTable.js +0 -75
- package/dist/data-table/data-table.js +0 -490
- package/dist/date-picker.js +0 -92
- package/dist/dialog.js +0 -95
- package/dist/dropdown-menu.js +0 -138
- package/dist/fonts/Montserrat-Bold.otf +0 -0
- package/dist/fonts/Montserrat-Medium.otf +0 -0
- package/dist/fonts/Montserrat-Regular.otf +0 -0
- package/dist/fonts/Roboto-Bold.otf +0 -0
- package/dist/fonts/Roboto-Light.otf +0 -0
- package/dist/fonts/Roboto-Medium.otf +0 -0
- package/dist/fonts/Roboto-Regular.otf +0 -0
- package/dist/form.js +0 -102
- package/dist/header.js +0 -90
- package/dist/hook/useDebounce.js +0 -16
- package/dist/icon-handler.js +0 -72
- package/dist/icons/brandModules.js +0 -27
- package/dist/icons/companyLogo.js +0 -61
- package/dist/icons/createUseAuxiliary.js +0 -107
- package/dist/icons/footerInfo.js +0 -25
- package/dist/icons/logo_lecom.svg.js +0 -3
- package/dist/icons/newUpdate.js +0 -23
- package/dist/icons/robertyRPA.js +0 -30
- package/dist/ilustrations/access_denied.js +0 -252
- package/dist/ilustrations/page_not_found.js +0 -188
- package/dist/input.js +0 -42
- package/dist/label.js +0 -20
- package/dist/modal.js +0 -27
- package/dist/pagination.js +0 -474
- package/dist/plugin/extend.ts +0 -78
- package/dist/plugin/fontFaces.ts +0 -172
- package/dist/plugin/general.ts +0 -12
- package/dist/plugin/pluginDev.js +0 -5
- package/dist/plugin/pluginNext.js +0 -5
- package/dist/plugin/pluginVite.js +0 -5
- package/dist/plugin/template.ts +0 -31
- package/dist/plugin/typographies.ts +0 -152
- package/dist/plugin/varsTheme.ts +0 -79
- package/dist/plugin.cjs +0 -298
- package/dist/popover.js +0 -24
- package/dist/radio-group.js +0 -74
- package/dist/range-picker.js +0 -99
- package/dist/scroll-area.js +0 -37
- package/dist/search-bar.js +0 -151
- package/dist/select.js +0 -156
- package/dist/separator.js +0 -24
- package/dist/sheet.js +0 -106
- package/dist/sidebar.js +0 -188
- package/dist/skeleton.js +0 -17
- package/dist/slider.js +0 -23
- package/dist/status-screen.js +0 -71
- package/dist/switch.js +0 -27
- package/dist/table.js +0 -83
- package/dist/tabs.js +0 -44
- package/dist/tag.js +0 -33
- package/dist/textarea.js +0 -22
- package/dist/toast.js +0 -105
- package/dist/toaster.js +0 -23
- package/dist/tooltip.js +0 -133
- package/dist/use-toast.js +0 -121
package/dist/table.js
DELETED
|
@@ -1,83 +0,0 @@
|
|
|
1
|
-
import { jsx } from 'react/jsx-runtime';
|
|
2
|
-
import * as React from 'react';
|
|
3
|
-
import { cn } from './lib/utils.js';
|
|
4
|
-
|
|
5
|
-
const Table = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { className: "relative w-full overflow-auto scrollbar-thin", children: /* @__PURE__ */ jsx(
|
|
6
|
-
"table",
|
|
7
|
-
{
|
|
8
|
-
ref,
|
|
9
|
-
className: cn("w-full caption-bottom text-sm", className),
|
|
10
|
-
...props
|
|
11
|
-
}
|
|
12
|
-
) }));
|
|
13
|
-
Table.displayName = "Table";
|
|
14
|
-
const TableHeader = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("thead", { ref, className: cn("[&_tr]:border-b", className), ...props }));
|
|
15
|
-
TableHeader.displayName = "TableHeader";
|
|
16
|
-
const TableBody = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
17
|
-
"tbody",
|
|
18
|
-
{
|
|
19
|
-
ref,
|
|
20
|
-
className: cn("[&_tr:last-child]:border-0", className),
|
|
21
|
-
...props
|
|
22
|
-
}
|
|
23
|
-
));
|
|
24
|
-
TableBody.displayName = "TableBody";
|
|
25
|
-
const TableFooter = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
26
|
-
"tfoot",
|
|
27
|
-
{
|
|
28
|
-
ref,
|
|
29
|
-
className: cn(
|
|
30
|
-
"border-t bg-muted/50 font-medium [&>tr]:last:border-b-0",
|
|
31
|
-
className
|
|
32
|
-
),
|
|
33
|
-
...props
|
|
34
|
-
}
|
|
35
|
-
));
|
|
36
|
-
TableFooter.displayName = "TableFooter";
|
|
37
|
-
const TableRow = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
38
|
-
"tr",
|
|
39
|
-
{
|
|
40
|
-
ref,
|
|
41
|
-
className: cn(
|
|
42
|
-
"border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted",
|
|
43
|
-
className
|
|
44
|
-
),
|
|
45
|
-
...props
|
|
46
|
-
}
|
|
47
|
-
));
|
|
48
|
-
TableRow.displayName = "TableRow";
|
|
49
|
-
const TableHead = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
50
|
-
"th",
|
|
51
|
-
{
|
|
52
|
-
ref,
|
|
53
|
-
className: cn(
|
|
54
|
-
"h-10 px-2 text-left align-middle font-medium text-muted-foreground [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]",
|
|
55
|
-
className
|
|
56
|
-
),
|
|
57
|
-
...props
|
|
58
|
-
}
|
|
59
|
-
));
|
|
60
|
-
TableHead.displayName = "TableHead";
|
|
61
|
-
const TableCell = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
62
|
-
"td",
|
|
63
|
-
{
|
|
64
|
-
ref,
|
|
65
|
-
className: cn(
|
|
66
|
-
"p-2 align-middle [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]",
|
|
67
|
-
className
|
|
68
|
-
),
|
|
69
|
-
...props
|
|
70
|
-
}
|
|
71
|
-
));
|
|
72
|
-
TableCell.displayName = "TableCell";
|
|
73
|
-
const TableCaption = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
74
|
-
"caption",
|
|
75
|
-
{
|
|
76
|
-
ref,
|
|
77
|
-
className: cn("mt-4 text-sm text-muted-foreground", className),
|
|
78
|
-
...props
|
|
79
|
-
}
|
|
80
|
-
));
|
|
81
|
-
TableCaption.displayName = "TableCaption";
|
|
82
|
-
|
|
83
|
-
export { Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow };
|
package/dist/tabs.js
DELETED
|
@@ -1,44 +0,0 @@
|
|
|
1
|
-
import { jsx } from 'react/jsx-runtime';
|
|
2
|
-
import * as React from 'react';
|
|
3
|
-
import * as TabsPrimitive from '@radix-ui/react-tabs';
|
|
4
|
-
import { cn } from './lib/utils.js';
|
|
5
|
-
|
|
6
|
-
const Tabs = TabsPrimitive.Root;
|
|
7
|
-
const TabsList = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
8
|
-
TabsPrimitive.List,
|
|
9
|
-
{
|
|
10
|
-
ref,
|
|
11
|
-
className: cn(
|
|
12
|
-
"inline-flex h-9 items-center justify-center rounded-lg bg-muted p-1 text-muted-foreground",
|
|
13
|
-
className
|
|
14
|
-
),
|
|
15
|
-
...props
|
|
16
|
-
}
|
|
17
|
-
));
|
|
18
|
-
TabsList.displayName = TabsPrimitive.List.displayName;
|
|
19
|
-
const TabsTrigger = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
20
|
-
TabsPrimitive.Trigger,
|
|
21
|
-
{
|
|
22
|
-
ref,
|
|
23
|
-
className: cn(
|
|
24
|
-
"inline-flex items-center justify-center whitespace-nowrap rounded-md px-3 py-1 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow",
|
|
25
|
-
className
|
|
26
|
-
),
|
|
27
|
-
...props
|
|
28
|
-
}
|
|
29
|
-
));
|
|
30
|
-
TabsTrigger.displayName = TabsPrimitive.Trigger.displayName;
|
|
31
|
-
const TabsContent = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
32
|
-
TabsPrimitive.Content,
|
|
33
|
-
{
|
|
34
|
-
ref,
|
|
35
|
-
className: cn(
|
|
36
|
-
"mt-2 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
|
|
37
|
-
className
|
|
38
|
-
),
|
|
39
|
-
...props
|
|
40
|
-
}
|
|
41
|
-
));
|
|
42
|
-
TabsContent.displayName = TabsPrimitive.Content.displayName;
|
|
43
|
-
|
|
44
|
-
export { Tabs, TabsContent, TabsList, TabsTrigger };
|
package/dist/tag.js
DELETED
|
@@ -1,33 +0,0 @@
|
|
|
1
|
-
import { jsx } from 'react/jsx-runtime';
|
|
2
|
-
import { cva } from 'class-variance-authority';
|
|
3
|
-
import { cn } from './lib/utils.js';
|
|
4
|
-
|
|
5
|
-
const tagVariants = cva(
|
|
6
|
-
"inline-flex items-center rounded-md border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
|
|
7
|
-
{
|
|
8
|
-
variants: {
|
|
9
|
-
variant: {
|
|
10
|
-
default: "border-default/30 bg-default/10 text-default",
|
|
11
|
-
magenta: "border-magenta/30 bg-magenta/10 text-magenta",
|
|
12
|
-
red: "border-red/30 bg-red/10 text-red",
|
|
13
|
-
volcano: "border-volcano/30 bg-volcano/10 text-volcano",
|
|
14
|
-
orange: "border-orange/30 bg-orange/10 text-orange",
|
|
15
|
-
gold: "border-gold/30 bg-gold/10 text-gold",
|
|
16
|
-
lime: "border-lime/30 bg-lime/10 text-lime",
|
|
17
|
-
green: "border-green/30 bg-green/10 text-green",
|
|
18
|
-
cyan: "border-cyan/30 bg-cyan/10 text-cyan",
|
|
19
|
-
blue: "border-blue/30 bg-blue/10 text-blue",
|
|
20
|
-
geekblue: "border-geekblue/30 bg-geekblue/10 text-geekblue",
|
|
21
|
-
purple: "border-purple/30 bg-purple/10 text-purple"
|
|
22
|
-
}
|
|
23
|
-
},
|
|
24
|
-
defaultVariants: {
|
|
25
|
-
variant: "default"
|
|
26
|
-
}
|
|
27
|
-
}
|
|
28
|
-
);
|
|
29
|
-
function Tag({ className, variant, ...props }) {
|
|
30
|
-
return /* @__PURE__ */ jsx("div", { className: cn(tagVariants({ variant }), className), ...props });
|
|
31
|
-
}
|
|
32
|
-
|
|
33
|
-
export { Tag, tagVariants };
|
package/dist/textarea.js
DELETED
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
import { jsx } from 'react/jsx-runtime';
|
|
2
|
-
import * as React from 'react';
|
|
3
|
-
import { cn } from './lib/utils.js';
|
|
4
|
-
|
|
5
|
-
const Textarea = React.forwardRef(
|
|
6
|
-
({ className, ...props }, ref) => {
|
|
7
|
-
return /* @__PURE__ */ jsx(
|
|
8
|
-
"textarea",
|
|
9
|
-
{
|
|
10
|
-
className: cn(
|
|
11
|
-
"flex min-h-[60px] w-full rounded-md border border-input bg-transparent px-3 py-2 text-sm shadow-sm placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50",
|
|
12
|
-
className
|
|
13
|
-
),
|
|
14
|
-
ref,
|
|
15
|
-
...props
|
|
16
|
-
}
|
|
17
|
-
);
|
|
18
|
-
}
|
|
19
|
-
);
|
|
20
|
-
Textarea.displayName = "Textarea";
|
|
21
|
-
|
|
22
|
-
export { Textarea };
|
package/dist/toast.js
DELETED
|
@@ -1,105 +0,0 @@
|
|
|
1
|
-
import { jsx } from 'react/jsx-runtime';
|
|
2
|
-
import * as React from 'react';
|
|
3
|
-
import * as ToastPrimitives from '@radix-ui/react-toast';
|
|
4
|
-
import { cva } from 'class-variance-authority';
|
|
5
|
-
import { XIcon } from 'lucide-react';
|
|
6
|
-
import { cn } from './lib/utils.js';
|
|
7
|
-
|
|
8
|
-
const ToastProvider = ({ ...props }) => {
|
|
9
|
-
return /* @__PURE__ */ jsx(ToastPrimitives.Provider, { ...props });
|
|
10
|
-
};
|
|
11
|
-
ToastProvider.displayName = ToastPrimitives.Provider.displayName;
|
|
12
|
-
const ToastViewport = React.forwardRef(({ className, swipeDirectionY = "bottom", swipeDirectionX = "left", ...props }, ref) => /* @__PURE__ */ jsx(
|
|
13
|
-
ToastPrimitives.Viewport,
|
|
14
|
-
{
|
|
15
|
-
ref,
|
|
16
|
-
className: cn(
|
|
17
|
-
"fixed top-0 z-[9998] flex max-h-screen w-full flex-col-reverse p-4 sm:flex-col md:max-w-[420px]",
|
|
18
|
-
{
|
|
19
|
-
"sm:bottom-4 sm:left-2 sm:top-auto": swipeDirectionX === "left" && swipeDirectionY === "bottom",
|
|
20
|
-
"sm:top-2 sm:left-2 sm:bottom-auto": swipeDirectionX === "left" && swipeDirectionY === "top",
|
|
21
|
-
"sm:bottom-4 sm:right-2 sm:top-auto": swipeDirectionX === "right" && swipeDirectionY === "bottom",
|
|
22
|
-
"sm:top-2 sm:right-2 sm:bottom-auto": swipeDirectionX === "right" && swipeDirectionY === "top"
|
|
23
|
-
},
|
|
24
|
-
className
|
|
25
|
-
),
|
|
26
|
-
...props
|
|
27
|
-
}
|
|
28
|
-
));
|
|
29
|
-
ToastViewport.displayName = ToastPrimitives.Viewport.displayName;
|
|
30
|
-
const toastVariants = cva(
|
|
31
|
-
"group pointer-events-auto relative flex w-full items-center justify-between space-x-2 overflow-hidden rounded-md border p-4 pr-6 shadow-lg transition-all data-[swipe=cancel]:translate-x-0 data-[swipe=end]:translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:transition-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[swipe=end]:animate-out data-[state=closed]:fade-out-80 data-[state=closed]:slide-out-to-right-full data-[state=open]:slide-in-from-top-full data-[state=open]:sm:slide-in-from-bottom-full",
|
|
32
|
-
{
|
|
33
|
-
variants: {
|
|
34
|
-
variant: {
|
|
35
|
-
default: "border bg-background text-foreground",
|
|
36
|
-
destructive: "destructive group border-red-dark bg-red-dark text-destructive-foreground",
|
|
37
|
-
success: "success group border-brand-green-foreground bg-brand-green text-neutral-50",
|
|
38
|
-
info: "info group border-blue-dark bg-blue-dark text-neutral-50",
|
|
39
|
-
alert: "alert group border-yellow-dark bg-yellow-dark text-neutral-50"
|
|
40
|
-
}
|
|
41
|
-
},
|
|
42
|
-
defaultVariants: {
|
|
43
|
-
variant: "default"
|
|
44
|
-
}
|
|
45
|
-
}
|
|
46
|
-
);
|
|
47
|
-
const Toast = React.forwardRef(({ className, variant, ...props }, ref) => {
|
|
48
|
-
return /* @__PURE__ */ jsx(
|
|
49
|
-
ToastPrimitives.Root,
|
|
50
|
-
{
|
|
51
|
-
ref,
|
|
52
|
-
className: cn(toastVariants({ variant }), className),
|
|
53
|
-
...props
|
|
54
|
-
}
|
|
55
|
-
);
|
|
56
|
-
});
|
|
57
|
-
Toast.displayName = ToastPrimitives.Root.displayName;
|
|
58
|
-
const ToastAction = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
59
|
-
ToastPrimitives.Action,
|
|
60
|
-
{
|
|
61
|
-
ref,
|
|
62
|
-
className: cn(
|
|
63
|
-
"inline-flex h-8 shrink-0 items-center justify-center rounded-md border bg-transparent px-3 text-sm font-medium transition-colors hover:bg-secondary focus:outline-none focus:ring-1 focus:ring-ring disabled:pointer-events-none disabled:opacity-50 group-[.destructive]:border-muted/40 group-[.destructive]:hover:border-destructive/30 group-[.destructive]:hover:bg-destructive group-[.destructive]:hover:text-destructive-foreground group-[.destructive]:focus:ring-destructive",
|
|
64
|
-
className
|
|
65
|
-
),
|
|
66
|
-
...props
|
|
67
|
-
}
|
|
68
|
-
));
|
|
69
|
-
ToastAction.displayName = ToastPrimitives.Action.displayName;
|
|
70
|
-
const ToastClose = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
71
|
-
ToastPrimitives.Close,
|
|
72
|
-
{
|
|
73
|
-
"aria-label": "Close",
|
|
74
|
-
ref,
|
|
75
|
-
className: cn(
|
|
76
|
-
"absolute right-1 top-1 rounded-md p-1 text-white opacity-80 transition-opacity focus:outline-none focus:ring-transparent hover:opacity-100",
|
|
77
|
-
className
|
|
78
|
-
),
|
|
79
|
-
"toast-close": "T",
|
|
80
|
-
...props,
|
|
81
|
-
children: /* @__PURE__ */ jsx(XIcon, { className: "h-4 w-4", strokeWidth: "3" })
|
|
82
|
-
}
|
|
83
|
-
));
|
|
84
|
-
ToastClose.displayName = ToastPrimitives.Close.displayName;
|
|
85
|
-
const ToastTitle = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
86
|
-
ToastPrimitives.Title,
|
|
87
|
-
{
|
|
88
|
-
ref,
|
|
89
|
-
className: cn("text-base font-semibold [&+div]:text-xs", className),
|
|
90
|
-
...props
|
|
91
|
-
}
|
|
92
|
-
));
|
|
93
|
-
ToastTitle.displayName = ToastPrimitives.Title.displayName;
|
|
94
|
-
const ToastDescription = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
95
|
-
ToastPrimitives.Description,
|
|
96
|
-
{
|
|
97
|
-
ref,
|
|
98
|
-
style: { fontSize: "14px" },
|
|
99
|
-
className: cn("opacity-90", className),
|
|
100
|
-
...props
|
|
101
|
-
}
|
|
102
|
-
));
|
|
103
|
-
ToastDescription.displayName = ToastPrimitives.Description.displayName;
|
|
104
|
-
|
|
105
|
-
export { Toast, ToastAction, ToastClose, ToastDescription, ToastProvider, ToastTitle, ToastViewport };
|
package/dist/toaster.js
DELETED
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
-
import { cn } from './lib/utils.js';
|
|
3
|
-
import { ToastProvider, Toast, ToastTitle, ToastDescription, ToastClose, ToastViewport } from './toast.js';
|
|
4
|
-
import { useToast } from './use-toast.js';
|
|
5
|
-
|
|
6
|
-
function Toaster({ swipeDirectionY = "bottom", swipeDirectionX = "left" }) {
|
|
7
|
-
const { toasts } = useToast();
|
|
8
|
-
return /* @__PURE__ */ jsxs(ToastProvider, { children: [
|
|
9
|
-
toasts.map(function({ id, title, description, action, ...props }) {
|
|
10
|
-
return /* @__PURE__ */ jsxs(Toast, { ...props, children: [
|
|
11
|
-
/* @__PURE__ */ jsxs("div", { className: "grid gap-1", children: [
|
|
12
|
-
title && /* @__PURE__ */ jsx(ToastTitle, { children: title }),
|
|
13
|
-
description && /* @__PURE__ */ jsx(ToastDescription, { className: cn({ "px-1 py-1 min-w-full": !title }), children: description })
|
|
14
|
-
] }),
|
|
15
|
-
action,
|
|
16
|
-
/* @__PURE__ */ jsx(ToastClose, {})
|
|
17
|
-
] }, id);
|
|
18
|
-
}),
|
|
19
|
-
/* @__PURE__ */ jsx(ToastViewport, { swipeDirectionX, swipeDirectionY })
|
|
20
|
-
] });
|
|
21
|
-
}
|
|
22
|
-
|
|
23
|
-
export { Toaster };
|
package/dist/tooltip.js
DELETED
|
@@ -1,133 +0,0 @@
|
|
|
1
|
-
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
2
|
-
import * as React from 'react';
|
|
3
|
-
import * as TooltipPrimitive from '@radix-ui/react-tooltip';
|
|
4
|
-
import { cn } from './lib/utils.js';
|
|
5
|
-
|
|
6
|
-
const TooltipProvider = TooltipPrimitive.Provider;
|
|
7
|
-
const TooltipRoot = TooltipPrimitive.Root;
|
|
8
|
-
const TooltipTrigger = TooltipPrimitive.Trigger;
|
|
9
|
-
const TooltipArrow = React.forwardRef(
|
|
10
|
-
({ className, style, color, ...props }, ref) => {
|
|
11
|
-
return /* @__PURE__ */ jsx(
|
|
12
|
-
TooltipPrimitive.Arrow,
|
|
13
|
-
{
|
|
14
|
-
width: 12,
|
|
15
|
-
height: 7,
|
|
16
|
-
ref,
|
|
17
|
-
className: cn(
|
|
18
|
-
"fill-current text-primary",
|
|
19
|
-
className
|
|
20
|
-
),
|
|
21
|
-
style: { ...style, color },
|
|
22
|
-
...props
|
|
23
|
-
}
|
|
24
|
-
);
|
|
25
|
-
}
|
|
26
|
-
);
|
|
27
|
-
TooltipArrow.displayName = TooltipPrimitive.Arrow.displayName;
|
|
28
|
-
const TooltipContent = React.forwardRef(({ className, style, children, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
29
|
-
TooltipPrimitive.Content,
|
|
30
|
-
{
|
|
31
|
-
ref,
|
|
32
|
-
className: cn(
|
|
33
|
-
`z-50 overflow-hidden rounded-md bg-primary px-3 py-1.5 text-xs text-primary-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=delayed-open]:data-[side=bottom]:animate-slideUpAndFade data-[state=delayed-open]:data-[side=left]:animate-slideRightAndFade data-[state=delayed-open]:data-[side=right]:animate-slideLeftAndFade data-[state=delayed-open]:data-[side=top]:animate-slideDownAndFade`,
|
|
34
|
-
className
|
|
35
|
-
),
|
|
36
|
-
style,
|
|
37
|
-
...props,
|
|
38
|
-
children
|
|
39
|
-
}
|
|
40
|
-
));
|
|
41
|
-
TooltipContent.displayName = TooltipPrimitive.Content.displayName;
|
|
42
|
-
const Tooltip = ({
|
|
43
|
-
title,
|
|
44
|
-
side = "top",
|
|
45
|
-
align = "center",
|
|
46
|
-
arrow = false,
|
|
47
|
-
color,
|
|
48
|
-
defaultOpen = false,
|
|
49
|
-
mouseEnterDelay = 0.3,
|
|
50
|
-
mouseLeaveDelay = 0.3,
|
|
51
|
-
overlayStyle,
|
|
52
|
-
overlayInnerStyle,
|
|
53
|
-
trigger = "hover",
|
|
54
|
-
open,
|
|
55
|
-
zIndex,
|
|
56
|
-
onOpenChange,
|
|
57
|
-
sideOffset = 2,
|
|
58
|
-
alignOffset = 2,
|
|
59
|
-
ariaLabel = "",
|
|
60
|
-
asChild = false,
|
|
61
|
-
className = "",
|
|
62
|
-
children
|
|
63
|
-
}) => {
|
|
64
|
-
const [isOpen, setIsOpen] = React.useState(defaultOpen);
|
|
65
|
-
const [isTouchDevice, setIsTouchDevice] = React.useState(false);
|
|
66
|
-
const elementRef = React.useRef(null);
|
|
67
|
-
React.useEffect(() => {
|
|
68
|
-
const checkIfTouchDevice = () => {
|
|
69
|
-
setIsTouchDevice(
|
|
70
|
-
"ontouchstart" in window || navigator.maxTouchPoints > 0 || window.matchMedia("(pointer: coarse)").matches
|
|
71
|
-
);
|
|
72
|
-
};
|
|
73
|
-
checkIfTouchDevice();
|
|
74
|
-
window.addEventListener("resize", checkIfTouchDevice);
|
|
75
|
-
return () => {
|
|
76
|
-
window.removeEventListener("resize", checkIfTouchDevice);
|
|
77
|
-
};
|
|
78
|
-
}, []);
|
|
79
|
-
const handleOpenChange = (isOpen2) => {
|
|
80
|
-
if (!isTouchDevice) {
|
|
81
|
-
if (onOpenChange) {
|
|
82
|
-
onOpenChange(isOpen2);
|
|
83
|
-
}
|
|
84
|
-
}
|
|
85
|
-
};
|
|
86
|
-
const handleClick = (event) => {
|
|
87
|
-
if (isTouchDevice) {
|
|
88
|
-
event.preventDefault();
|
|
89
|
-
setIsOpen((prev) => !prev);
|
|
90
|
-
}
|
|
91
|
-
};
|
|
92
|
-
const triggerProps = {
|
|
93
|
-
onMouseEnter: trigger === "hover" && !isTouchDevice ? () => setTimeout(() => setIsOpen(true), mouseEnterDelay * 1e3) : void 0,
|
|
94
|
-
onMouseLeave: trigger === "hover" && !isTouchDevice ? () => setTimeout(() => setIsOpen(false), mouseLeaveDelay * 1e3) : void 0,
|
|
95
|
-
onFocus: trigger === "focus" ? () => setIsOpen(true) : void 0,
|
|
96
|
-
onBlur: trigger === "focus" ? () => setIsOpen(false) : void 0,
|
|
97
|
-
onClick: isTouchDevice || trigger === "click" ? handleClick : void 0
|
|
98
|
-
};
|
|
99
|
-
return /* @__PURE__ */ jsx(TooltipProvider, { delayDuration: mouseEnterDelay * 1e3, children: /* @__PURE__ */ jsxs(
|
|
100
|
-
TooltipRoot,
|
|
101
|
-
{
|
|
102
|
-
open: open !== void 0 ? open : isOpen,
|
|
103
|
-
onOpenChange: handleOpenChange,
|
|
104
|
-
children: [
|
|
105
|
-
/* @__PURE__ */ jsx(TooltipTrigger, { className: "relative", asChild, ...triggerProps, ref: elementRef, children: /* @__PURE__ */ jsx("span", { children }) }),
|
|
106
|
-
/* @__PURE__ */ jsxs(
|
|
107
|
-
TooltipContent,
|
|
108
|
-
{
|
|
109
|
-
className: cn("bg-slate-900 text-white", className),
|
|
110
|
-
side,
|
|
111
|
-
align,
|
|
112
|
-
"aria-label": ariaLabel,
|
|
113
|
-
sideOffset,
|
|
114
|
-
alignOffset,
|
|
115
|
-
style: { ...overlayStyle, zIndex, backgroundColor: color },
|
|
116
|
-
children: [
|
|
117
|
-
/* @__PURE__ */ jsx("div", { style: overlayInnerStyle, children: title }),
|
|
118
|
-
arrow && /* @__PURE__ */ jsx(
|
|
119
|
-
TooltipArrow,
|
|
120
|
-
{
|
|
121
|
-
className: cn("text-slate-900"),
|
|
122
|
-
style: { color }
|
|
123
|
-
}
|
|
124
|
-
)
|
|
125
|
-
]
|
|
126
|
-
}
|
|
127
|
-
)
|
|
128
|
-
]
|
|
129
|
-
}
|
|
130
|
-
) });
|
|
131
|
-
};
|
|
132
|
-
|
|
133
|
-
export { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger };
|
package/dist/use-toast.js
DELETED
|
@@ -1,121 +0,0 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
|
|
3
|
-
const TOAST_LIMIT = 1;
|
|
4
|
-
const TOAST_REMOVE_DELAY = 1e6;
|
|
5
|
-
let count = 0;
|
|
6
|
-
function genId() {
|
|
7
|
-
count = (count + 1) % Number.MAX_SAFE_INTEGER;
|
|
8
|
-
return count.toString();
|
|
9
|
-
}
|
|
10
|
-
const toastTimeouts = /* @__PURE__ */ new Map();
|
|
11
|
-
const addToRemoveQueue = (toastId) => {
|
|
12
|
-
if (toastTimeouts.has(toastId)) {
|
|
13
|
-
return;
|
|
14
|
-
}
|
|
15
|
-
const timeout = setTimeout(() => {
|
|
16
|
-
toastTimeouts.delete(toastId);
|
|
17
|
-
dispatch({
|
|
18
|
-
type: "REMOVE_TOAST",
|
|
19
|
-
toastId
|
|
20
|
-
});
|
|
21
|
-
}, TOAST_REMOVE_DELAY);
|
|
22
|
-
toastTimeouts.set(toastId, timeout);
|
|
23
|
-
};
|
|
24
|
-
const reducer = (state, action) => {
|
|
25
|
-
switch (action.type) {
|
|
26
|
-
case "ADD_TOAST":
|
|
27
|
-
return {
|
|
28
|
-
...state,
|
|
29
|
-
toasts: [action.toast, ...state.toasts].slice(0, TOAST_LIMIT)
|
|
30
|
-
};
|
|
31
|
-
case "UPDATE_TOAST":
|
|
32
|
-
return {
|
|
33
|
-
...state,
|
|
34
|
-
toasts: state.toasts.map(
|
|
35
|
-
(t) => t.id === action.toast.id ? { ...t, ...action.toast } : t
|
|
36
|
-
)
|
|
37
|
-
};
|
|
38
|
-
case "DISMISS_TOAST": {
|
|
39
|
-
const { toastId } = action;
|
|
40
|
-
if (toastId) {
|
|
41
|
-
addToRemoveQueue(toastId);
|
|
42
|
-
} else {
|
|
43
|
-
state.toasts.forEach((toast2) => {
|
|
44
|
-
addToRemoveQueue(toast2.id);
|
|
45
|
-
});
|
|
46
|
-
}
|
|
47
|
-
return {
|
|
48
|
-
...state,
|
|
49
|
-
toasts: state.toasts.map(
|
|
50
|
-
(t) => t.id === toastId || toastId === void 0 ? {
|
|
51
|
-
...t,
|
|
52
|
-
open: false
|
|
53
|
-
} : t
|
|
54
|
-
)
|
|
55
|
-
};
|
|
56
|
-
}
|
|
57
|
-
case "REMOVE_TOAST":
|
|
58
|
-
if (action.toastId === void 0) {
|
|
59
|
-
return {
|
|
60
|
-
...state,
|
|
61
|
-
toasts: []
|
|
62
|
-
};
|
|
63
|
-
}
|
|
64
|
-
return {
|
|
65
|
-
...state,
|
|
66
|
-
toasts: state.toasts.filter((t) => t.id !== action.toastId)
|
|
67
|
-
};
|
|
68
|
-
}
|
|
69
|
-
};
|
|
70
|
-
const listeners = [];
|
|
71
|
-
let memoryState = { toasts: [] };
|
|
72
|
-
function dispatch(action) {
|
|
73
|
-
memoryState = reducer(memoryState, action);
|
|
74
|
-
listeners.forEach((listener) => {
|
|
75
|
-
listener(memoryState);
|
|
76
|
-
});
|
|
77
|
-
}
|
|
78
|
-
function toast({ ...props }) {
|
|
79
|
-
const id = genId();
|
|
80
|
-
const update = (props2) => dispatch({
|
|
81
|
-
type: "UPDATE_TOAST",
|
|
82
|
-
toast: { ...props2, id }
|
|
83
|
-
});
|
|
84
|
-
const dismiss = () => dispatch({ type: "DISMISS_TOAST", toastId: id });
|
|
85
|
-
dispatch({
|
|
86
|
-
type: "ADD_TOAST",
|
|
87
|
-
toast: {
|
|
88
|
-
...props,
|
|
89
|
-
id,
|
|
90
|
-
open: true,
|
|
91
|
-
onOpenChange: (open) => {
|
|
92
|
-
if (!open)
|
|
93
|
-
dismiss();
|
|
94
|
-
}
|
|
95
|
-
}
|
|
96
|
-
});
|
|
97
|
-
return {
|
|
98
|
-
id,
|
|
99
|
-
dismiss,
|
|
100
|
-
update
|
|
101
|
-
};
|
|
102
|
-
}
|
|
103
|
-
function useToast() {
|
|
104
|
-
const [state, setState] = React.useState(memoryState);
|
|
105
|
-
React.useEffect(() => {
|
|
106
|
-
listeners.push(setState);
|
|
107
|
-
return () => {
|
|
108
|
-
const index = listeners.indexOf(setState);
|
|
109
|
-
if (index > -1) {
|
|
110
|
-
listeners.splice(index, 1);
|
|
111
|
-
}
|
|
112
|
-
};
|
|
113
|
-
}, [state]);
|
|
114
|
-
return {
|
|
115
|
-
...state,
|
|
116
|
-
toast,
|
|
117
|
-
dismiss: (toastId) => dispatch({ type: "DISMISS_TOAST", toastId })
|
|
118
|
-
};
|
|
119
|
-
}
|
|
120
|
-
|
|
121
|
-
export { reducer, toast, useToast };
|