@codefast/ui 0.3.15 → 0.3.16-canary.1
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/CHANGELOG.md +14 -0
- package/dist/components/accordion.d.mts +30 -0
- package/dist/components/accordion.mjs +15 -0
- package/dist/components/alert-dialog.d.mts +60 -0
- package/dist/components/alert-dialog.mjs +30 -0
- package/dist/components/alert.d.mts +21 -0
- package/dist/components/alert.mjs +12 -0
- package/dist/components/aspect-ratio.d.mts +6 -0
- package/dist/components/aspect-ratio.mjs +3 -0
- package/dist/components/avatar.d.mts +18 -0
- package/dist/components/avatar.mjs +9 -0
- package/dist/components/badge.d.mts +9 -0
- package/dist/components/badge.mjs +6 -0
- package/dist/components/breadcrumb.d.mts +42 -0
- package/dist/components/breadcrumb.mjs +21 -0
- package/dist/components/button-group.d.mts +21 -0
- package/dist/components/button-group.mjs +12 -0
- package/dist/components/button.d.mts +9 -0
- package/dist/components/button.mjs +6 -0
- package/dist/components/calendar.d.mts +12 -0
- package/dist/components/calendar.mjs +7 -1
- package/dist/components/card.d.mts +42 -0
- package/dist/components/card.mjs +21 -0
- package/dist/components/carousel.d.mts +33 -0
- package/dist/components/carousel.mjs +15 -0
- package/dist/components/chart.d.mts +40 -1
- package/dist/components/chart.mjs +18 -0
- package/dist/components/checkbox-cards.d.mts +12 -0
- package/dist/components/checkbox-cards.mjs +6 -0
- package/dist/components/checkbox-group.d.mts +12 -0
- package/dist/components/checkbox-group.mjs +6 -0
- package/dist/components/checkbox.d.mts +6 -0
- package/dist/components/checkbox.mjs +3 -0
- package/dist/components/collapsible.d.mts +18 -0
- package/dist/components/collapsible.mjs +9 -0
- package/dist/components/command.d.mts +60 -0
- package/dist/components/command.mjs +30 -0
- package/dist/components/context-menu.d.mts +90 -0
- package/dist/components/context-menu.mjs +45 -0
- package/dist/components/dialog.d.mts +54 -0
- package/dist/components/dialog.mjs +27 -0
- package/dist/components/drawer.d.mts +54 -0
- package/dist/components/drawer.mjs +27 -0
- package/dist/components/dropdown-menu.d.mts +90 -0
- package/dist/components/dropdown-menu.mjs +45 -0
- package/dist/components/empty.d.mts +39 -0
- package/dist/components/empty.mjs +21 -0
- package/dist/components/field.d.mts +64 -1
- package/dist/components/field.mjs +33 -0
- package/dist/components/form.d.mts +42 -0
- package/dist/components/form.mjs +21 -0
- package/dist/components/hover-card.d.mts +24 -0
- package/dist/components/hover-card.mjs +12 -0
- package/dist/components/input-group.d.mts +45 -0
- package/dist/components/input-group.mjs +27 -0
- package/dist/components/input-number.d.mts +6 -0
- package/dist/components/input-number.mjs +3 -0
- package/dist/components/input-otp.d.mts +24 -0
- package/dist/components/input-otp.mjs +12 -0
- package/dist/components/input-password.d.mts +6 -0
- package/dist/components/input-password.mjs +3 -0
- package/dist/components/input-search.d.mts +6 -0
- package/dist/components/input-search.mjs +3 -0
- package/dist/components/input.d.mts +6 -0
- package/dist/components/input.mjs +3 -0
- package/dist/components/item.d.mts +66 -0
- package/dist/components/item.mjs +36 -0
- package/dist/components/kbd.d.mts +12 -0
- package/dist/components/kbd.mjs +6 -0
- package/dist/components/label.d.mts +6 -0
- package/dist/components/label.mjs +3 -0
- package/dist/components/menubar.d.mts +96 -0
- package/dist/components/menubar.mjs +48 -0
- package/dist/components/native-select.d.mts +18 -0
- package/dist/components/native-select.mjs +9 -0
- package/dist/components/navigation-menu.d.mts +39 -0
- package/dist/components/navigation-menu.mjs +21 -0
- package/dist/components/pagination.d.mts +42 -0
- package/dist/components/pagination.mjs +21 -0
- package/dist/components/popover.d.mts +30 -0
- package/dist/components/popover.mjs +15 -0
- package/dist/components/progress-circle.d.mts +9 -0
- package/dist/components/progress-circle.mjs +6 -0
- package/dist/components/progress.d.mts +6 -0
- package/dist/components/progress.mjs +3 -0
- package/dist/components/radio-cards.d.mts +12 -0
- package/dist/components/radio-cards.mjs +6 -0
- package/dist/components/radio-group.d.mts +12 -0
- package/dist/components/radio-group.mjs +6 -0
- package/dist/components/radio.d.mts +6 -0
- package/dist/components/radio.mjs +3 -0
- package/dist/components/resizable.d.mts +18 -0
- package/dist/components/resizable.mjs +9 -0
- package/dist/components/scroll-area.d.mts +15 -0
- package/dist/components/scroll-area.mjs +9 -0
- package/dist/components/select.d.mts +60 -0
- package/dist/components/select.mjs +30 -0
- package/dist/components/separator.d.mts +15 -0
- package/dist/components/separator.mjs +9 -0
- package/dist/components/sheet.d.mts +57 -0
- package/dist/components/sheet.mjs +30 -0
- package/dist/components/sidebar.d.mts +141 -0
- package/dist/components/sidebar.mjs +72 -0
- package/dist/components/skeleton.d.mts +6 -0
- package/dist/components/skeleton.mjs +3 -0
- package/dist/components/slider.d.mts +6 -0
- package/dist/components/slider.mjs +3 -0
- package/dist/components/sonner.d.mts +6 -0
- package/dist/components/sonner.mjs +3 -0
- package/dist/components/spinner.d.mts +6 -0
- package/dist/components/spinner.mjs +3 -0
- package/dist/components/switch.d.mts +6 -0
- package/dist/components/switch.mjs +3 -0
- package/dist/components/table.d.mts +48 -0
- package/dist/components/table.mjs +24 -0
- package/dist/components/tabs.d.mts +24 -0
- package/dist/components/tabs.mjs +12 -0
- package/dist/components/textarea.d.mts +6 -0
- package/dist/components/textarea.mjs +3 -0
- package/dist/components/toggle-group.d.mts +12 -0
- package/dist/components/toggle-group.mjs +6 -0
- package/dist/components/toggle.d.mts +12 -0
- package/dist/components/toggle.mjs +6 -0
- package/dist/components/tooltip.d.mts +30 -0
- package/dist/components/tooltip.mjs +15 -0
- package/dist/hooks/use-animated-value.d.mts +2 -0
- package/dist/hooks/use-animated-value.mjs +2 -0
- package/dist/hooks/use-copy-to-clipboard.d.mts +2 -0
- package/dist/hooks/use-copy-to-clipboard.mjs +2 -0
- package/dist/hooks/use-is-mobile.d.mts +2 -0
- package/dist/hooks/use-is-mobile.mjs +2 -0
- package/dist/hooks/use-media-query.d.mts +2 -0
- package/dist/hooks/use-media-query.mjs +2 -0
- package/dist/hooks/use-mutation-observer.d.mts +2 -0
- package/dist/hooks/use-mutation-observer.mjs +2 -0
- package/dist/hooks/use-pagination.d.mts +8 -1
- package/dist/hooks/use-pagination.mjs +4 -0
- package/dist/lib/utils.d.mts +1 -1
- package/dist/primitives/checkbox-group.d.mts +15 -3
- package/dist/primitives/checkbox-group.mjs +6 -0
- package/dist/primitives/input-number.d.mts +22 -0
- package/dist/primitives/input-number.mjs +12 -0
- package/dist/primitives/input.d.mts +10 -0
- package/dist/primitives/input.mjs +6 -0
- package/dist/primitives/progress-circle.d.mts +31 -1
- package/dist/primitives/progress-circle.mjs +12 -0
- package/package.json +17 -9
|
@@ -1,42 +1,90 @@
|
|
|
1
1
|
import { ComponentProps, JSX } from "react";
|
|
2
2
|
|
|
3
3
|
//#region src/components/table.d.ts
|
|
4
|
+
/**
|
|
5
|
+
* @since 0.3.16-canary.0
|
|
6
|
+
*/
|
|
4
7
|
type TableProps = ComponentProps<"table">;
|
|
8
|
+
/**
|
|
9
|
+
* @since 0.3.16-canary.0
|
|
10
|
+
*/
|
|
5
11
|
declare function Table({
|
|
6
12
|
className,
|
|
7
13
|
...props
|
|
8
14
|
}: TableProps): JSX.Element;
|
|
15
|
+
/**
|
|
16
|
+
* @since 0.3.16-canary.0
|
|
17
|
+
*/
|
|
9
18
|
type TableHeaderProps = ComponentProps<"thead">;
|
|
19
|
+
/**
|
|
20
|
+
* @since 0.3.16-canary.0
|
|
21
|
+
*/
|
|
10
22
|
declare function TableHeader({
|
|
11
23
|
className,
|
|
12
24
|
...props
|
|
13
25
|
}: TableHeaderProps): JSX.Element;
|
|
26
|
+
/**
|
|
27
|
+
* @since 0.3.16-canary.0
|
|
28
|
+
*/
|
|
14
29
|
type TableBodyProps = ComponentProps<"tbody">;
|
|
30
|
+
/**
|
|
31
|
+
* @since 0.3.16-canary.0
|
|
32
|
+
*/
|
|
15
33
|
declare function TableBody({
|
|
16
34
|
className,
|
|
17
35
|
...props
|
|
18
36
|
}: TableBodyProps): JSX.Element;
|
|
37
|
+
/**
|
|
38
|
+
* @since 0.3.16-canary.0
|
|
39
|
+
*/
|
|
19
40
|
type TableFooterProps = ComponentProps<"tfoot">;
|
|
41
|
+
/**
|
|
42
|
+
* @since 0.3.16-canary.0
|
|
43
|
+
*/
|
|
20
44
|
declare function TableFooter({
|
|
21
45
|
className,
|
|
22
46
|
...props
|
|
23
47
|
}: TableFooterProps): JSX.Element;
|
|
48
|
+
/**
|
|
49
|
+
* @since 0.3.16-canary.0
|
|
50
|
+
*/
|
|
24
51
|
type TableRowProps = ComponentProps<"tr">;
|
|
52
|
+
/**
|
|
53
|
+
* @since 0.3.16-canary.0
|
|
54
|
+
*/
|
|
25
55
|
declare function TableRow({
|
|
26
56
|
className,
|
|
27
57
|
...props
|
|
28
58
|
}: TableRowProps): JSX.Element;
|
|
59
|
+
/**
|
|
60
|
+
* @since 0.3.16-canary.0
|
|
61
|
+
*/
|
|
29
62
|
type TableHeadProps = ComponentProps<"th">;
|
|
63
|
+
/**
|
|
64
|
+
* @since 0.3.16-canary.0
|
|
65
|
+
*/
|
|
30
66
|
declare function TableHead({
|
|
31
67
|
className,
|
|
32
68
|
...props
|
|
33
69
|
}: TableHeadProps): JSX.Element;
|
|
70
|
+
/**
|
|
71
|
+
* @since 0.3.16-canary.0
|
|
72
|
+
*/
|
|
34
73
|
type TableCellProps = ComponentProps<"td">;
|
|
74
|
+
/**
|
|
75
|
+
* @since 0.3.16-canary.0
|
|
76
|
+
*/
|
|
35
77
|
declare function TableCell({
|
|
36
78
|
className,
|
|
37
79
|
...props
|
|
38
80
|
}: TableCellProps): JSX.Element;
|
|
81
|
+
/**
|
|
82
|
+
* @since 0.3.16-canary.0
|
|
83
|
+
*/
|
|
39
84
|
type TableCaptionProps = ComponentProps<"caption">;
|
|
85
|
+
/**
|
|
86
|
+
* @since 0.3.16-canary.0
|
|
87
|
+
*/
|
|
40
88
|
declare function TableCaption({
|
|
41
89
|
className,
|
|
42
90
|
...props
|
|
@@ -1,6 +1,9 @@
|
|
|
1
1
|
import { cn } from "../lib/utils.mjs";
|
|
2
2
|
import { jsx } from "react/jsx-runtime";
|
|
3
3
|
//#region src/components/table.tsx
|
|
4
|
+
/**
|
|
5
|
+
* @since 0.3.16-canary.0
|
|
6
|
+
*/
|
|
4
7
|
function Table({ className, ...props }) {
|
|
5
8
|
return /* @__PURE__ */ jsx("div", {
|
|
6
9
|
className: cn("relative", "w-full overflow-auto"),
|
|
@@ -12,6 +15,9 @@ function Table({ className, ...props }) {
|
|
|
12
15
|
})
|
|
13
16
|
});
|
|
14
17
|
}
|
|
18
|
+
/**
|
|
19
|
+
* @since 0.3.16-canary.0
|
|
20
|
+
*/
|
|
15
21
|
function TableHeader({ className, ...props }) {
|
|
16
22
|
return /* @__PURE__ */ jsx("thead", {
|
|
17
23
|
className: cn("*:border-b", "*:has-aria-expanded:bg-transparent", className),
|
|
@@ -19,6 +25,9 @@ function TableHeader({ className, ...props }) {
|
|
|
19
25
|
...props
|
|
20
26
|
});
|
|
21
27
|
}
|
|
28
|
+
/**
|
|
29
|
+
* @since 0.3.16-canary.0
|
|
30
|
+
*/
|
|
22
31
|
function TableBody({ className, ...props }) {
|
|
23
32
|
return /* @__PURE__ */ jsx("tbody", {
|
|
24
33
|
className: cn("*:last-child:border-0", className),
|
|
@@ -26,6 +35,9 @@ function TableBody({ className, ...props }) {
|
|
|
26
35
|
...props
|
|
27
36
|
});
|
|
28
37
|
}
|
|
38
|
+
/**
|
|
39
|
+
* @since 0.3.16-canary.0
|
|
40
|
+
*/
|
|
29
41
|
function TableFooter({ className, ...props }) {
|
|
30
42
|
return /* @__PURE__ */ jsx("tfoot", {
|
|
31
43
|
className: cn("bg-muted/50 font-medium", "*:border-t *:border-b-0", "*:has-aria-expanded:bg-transparent", className),
|
|
@@ -33,6 +45,9 @@ function TableFooter({ className, ...props }) {
|
|
|
33
45
|
...props
|
|
34
46
|
});
|
|
35
47
|
}
|
|
48
|
+
/**
|
|
49
|
+
* @since 0.3.16-canary.0
|
|
50
|
+
*/
|
|
36
51
|
function TableRow({ className, ...props }) {
|
|
37
52
|
return /* @__PURE__ */ jsx("tr", {
|
|
38
53
|
className: cn("border-b", "transition-colors", "hover:bg-muted/50", "has-aria-expanded:bg-muted/50", "data-selected:bg-muted", className),
|
|
@@ -40,6 +55,9 @@ function TableRow({ className, ...props }) {
|
|
|
40
55
|
...props
|
|
41
56
|
});
|
|
42
57
|
}
|
|
58
|
+
/**
|
|
59
|
+
* @since 0.3.16-canary.0
|
|
60
|
+
*/
|
|
43
61
|
function TableHead({ className, ...props }) {
|
|
44
62
|
return /* @__PURE__ */ jsx("th", {
|
|
45
63
|
className: cn("p-2", "text-left align-middle font-medium", className),
|
|
@@ -47,6 +65,9 @@ function TableHead({ className, ...props }) {
|
|
|
47
65
|
...props
|
|
48
66
|
});
|
|
49
67
|
}
|
|
68
|
+
/**
|
|
69
|
+
* @since 0.3.16-canary.0
|
|
70
|
+
*/
|
|
50
71
|
function TableCell({ className, ...props }) {
|
|
51
72
|
return /* @__PURE__ */ jsx("td", {
|
|
52
73
|
className: cn("p-2", "align-middle", className),
|
|
@@ -54,6 +75,9 @@ function TableCell({ className, ...props }) {
|
|
|
54
75
|
...props
|
|
55
76
|
});
|
|
56
77
|
}
|
|
78
|
+
/**
|
|
79
|
+
* @since 0.3.16-canary.0
|
|
80
|
+
*/
|
|
57
81
|
function TableCaption({ className, ...props }) {
|
|
58
82
|
return /* @__PURE__ */ jsx("caption", {
|
|
59
83
|
className: cn("mt-4", "text-sm text-muted-foreground", className),
|
|
@@ -2,22 +2,46 @@ import { ComponentProps, JSX } from "react";
|
|
|
2
2
|
import * as TabsPrimitive from "@radix-ui/react-tabs";
|
|
3
3
|
|
|
4
4
|
//#region src/components/tabs.d.ts
|
|
5
|
+
/**
|
|
6
|
+
* @since 0.3.16-canary.0
|
|
7
|
+
*/
|
|
5
8
|
type TabsProps = ComponentProps<typeof TabsPrimitive.Root>;
|
|
9
|
+
/**
|
|
10
|
+
* @since 0.3.16-canary.0
|
|
11
|
+
*/
|
|
6
12
|
declare function Tabs({
|
|
7
13
|
className,
|
|
8
14
|
...props
|
|
9
15
|
}: TabsProps): JSX.Element;
|
|
16
|
+
/**
|
|
17
|
+
* @since 0.3.16-canary.0
|
|
18
|
+
*/
|
|
10
19
|
type TabsListProps = ComponentProps<typeof TabsPrimitive.List>;
|
|
20
|
+
/**
|
|
21
|
+
* @since 0.3.16-canary.0
|
|
22
|
+
*/
|
|
11
23
|
declare function TabsList({
|
|
12
24
|
className,
|
|
13
25
|
...props
|
|
14
26
|
}: TabsListProps): JSX.Element;
|
|
27
|
+
/**
|
|
28
|
+
* @since 0.3.16-canary.0
|
|
29
|
+
*/
|
|
15
30
|
type TabsTriggerProps = ComponentProps<typeof TabsPrimitive.Trigger>;
|
|
31
|
+
/**
|
|
32
|
+
* @since 0.3.16-canary.0
|
|
33
|
+
*/
|
|
16
34
|
declare function TabsTrigger({
|
|
17
35
|
className,
|
|
18
36
|
...props
|
|
19
37
|
}: TabsTriggerProps): JSX.Element;
|
|
38
|
+
/**
|
|
39
|
+
* @since 0.3.16-canary.0
|
|
40
|
+
*/
|
|
20
41
|
type TabsContentProps = ComponentProps<typeof TabsPrimitive.Content>;
|
|
42
|
+
/**
|
|
43
|
+
* @since 0.3.16-canary.0
|
|
44
|
+
*/
|
|
21
45
|
declare function TabsContent({
|
|
22
46
|
className,
|
|
23
47
|
...props
|
package/dist/components/tabs.mjs
CHANGED
|
@@ -3,6 +3,9 @@ import { cn } from "../lib/utils.mjs";
|
|
|
3
3
|
import { jsx } from "react/jsx-runtime";
|
|
4
4
|
import * as TabsPrimitive from "@radix-ui/react-tabs";
|
|
5
5
|
//#region src/components/tabs.tsx
|
|
6
|
+
/**
|
|
7
|
+
* @since 0.3.16-canary.0
|
|
8
|
+
*/
|
|
6
9
|
function Tabs({ className, ...props }) {
|
|
7
10
|
return /* @__PURE__ */ jsx(TabsPrimitive.Root, {
|
|
8
11
|
className: cn("flex flex-col gap-2", className),
|
|
@@ -10,6 +13,9 @@ function Tabs({ className, ...props }) {
|
|
|
10
13
|
...props
|
|
11
14
|
});
|
|
12
15
|
}
|
|
16
|
+
/**
|
|
17
|
+
* @since 0.3.16-canary.0
|
|
18
|
+
*/
|
|
13
19
|
function TabsList({ className, ...props }) {
|
|
14
20
|
return /* @__PURE__ */ jsx(TabsPrimitive.List, {
|
|
15
21
|
className: cn("inline-flex w-fit items-center justify-center gap-1 px-1 py-1", "rounded-xl", "bg-muted text-muted-foreground", className),
|
|
@@ -17,6 +23,9 @@ function TabsList({ className, ...props }) {
|
|
|
17
23
|
...props
|
|
18
24
|
});
|
|
19
25
|
}
|
|
26
|
+
/**
|
|
27
|
+
* @since 0.3.16-canary.0
|
|
28
|
+
*/
|
|
20
29
|
function TabsTrigger({ className, ...props }) {
|
|
21
30
|
return /* @__PURE__ */ jsx(TabsPrimitive.Trigger, {
|
|
22
31
|
className: cn("inline-flex items-center justify-center gap-1.5", "px-2 py-1.5", "rounded-lg", "text-sm font-medium whitespace-nowrap text-muted-foreground", "transition", "not-dark:outline-hidden", "hover:not-disabled:text-foreground", "focus-visible:ring-3 focus-visible:ring-ring/50", "disabled:opacity-50", "dark:focus-visible:-outline-offset-1 dark:focus-visible:outline-ring", "data-active:bg-background data-active:text-foreground data-active:shadow-sm", "dark:data-active:bg-input/50", "dark:focus-visible:data-active:outline-1", "[&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className),
|
|
@@ -24,6 +33,9 @@ function TabsTrigger({ className, ...props }) {
|
|
|
24
33
|
...props
|
|
25
34
|
});
|
|
26
35
|
}
|
|
36
|
+
/**
|
|
37
|
+
* @since 0.3.16-canary.0
|
|
38
|
+
*/
|
|
27
39
|
function TabsContent({ className, ...props }) {
|
|
28
40
|
return /* @__PURE__ */ jsx(TabsPrimitive.Content, {
|
|
29
41
|
className: cn("mt-2", "rounded-xl ring-ring/50 outline-ring", "focus-visible:ring-4 focus-visible:outline-1", className),
|
|
@@ -1,7 +1,13 @@
|
|
|
1
1
|
import { ComponentProps, JSX } from "react";
|
|
2
2
|
|
|
3
3
|
//#region src/components/textarea.d.ts
|
|
4
|
+
/**
|
|
5
|
+
* @since 0.3.16-canary.0
|
|
6
|
+
*/
|
|
4
7
|
type TextareaProps = ComponentProps<"textarea">;
|
|
8
|
+
/**
|
|
9
|
+
* @since 0.3.16-canary.0
|
|
10
|
+
*/
|
|
5
11
|
declare function Textarea({
|
|
6
12
|
className,
|
|
7
13
|
...props
|
|
@@ -1,6 +1,9 @@
|
|
|
1
1
|
import { cn } from "../lib/utils.mjs";
|
|
2
2
|
import { jsx } from "react/jsx-runtime";
|
|
3
3
|
//#region src/components/textarea.tsx
|
|
4
|
+
/**
|
|
5
|
+
* @since 0.3.16-canary.0
|
|
6
|
+
*/
|
|
4
7
|
function Textarea({ className, ...props }) {
|
|
5
8
|
return /* @__PURE__ */ jsx("textarea", {
|
|
6
9
|
className: cn("flex min-h-16 w-full grow px-3 py-2", "rounded-lg border border-input shadow-xs outline-hidden", "text-base", "transition", "placeholder:text-muted-foreground", "hover:not-disabled:not-focus-visible:border-ring/60", "focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50", "disabled:opacity-50", "aria-invalid:border-destructive", "focus-within:aria-invalid:ring-destructive/20", "hover:not-disabled:not-focus-within:aria-invalid:border-destructive/60", "md:text-sm", "dark:bg-input/30", "dark:focus-within:aria-invalid:ring-destructive/40", className),
|
|
@@ -7,9 +7,15 @@ import * as ToggleGroupPrimitive from "@radix-ui/react-toggle-group";
|
|
|
7
7
|
type ScopedProps<P> = P & {
|
|
8
8
|
__scopeToggleGroup?: Scope;
|
|
9
9
|
};
|
|
10
|
+
/**
|
|
11
|
+
* @since 0.3.16-canary.0
|
|
12
|
+
*/
|
|
10
13
|
type ToggleGroupProps = ComponentProps<typeof ToggleGroupPrimitive.Root> & ToggleVariants & {
|
|
11
14
|
spacing?: number;
|
|
12
15
|
};
|
|
16
|
+
/**
|
|
17
|
+
* @since 0.3.16-canary.0
|
|
18
|
+
*/
|
|
13
19
|
declare function ToggleGroup({
|
|
14
20
|
__scopeToggleGroup,
|
|
15
21
|
children,
|
|
@@ -19,7 +25,13 @@ declare function ToggleGroup({
|
|
|
19
25
|
variant,
|
|
20
26
|
...props
|
|
21
27
|
}: ScopedProps<ToggleGroupProps>): JSX.Element;
|
|
28
|
+
/**
|
|
29
|
+
* @since 0.3.16-canary.0
|
|
30
|
+
*/
|
|
22
31
|
type ToggleGroupItemProps = ScopedProps<ComponentProps<typeof ToggleGroupPrimitive.Item>>;
|
|
32
|
+
/**
|
|
33
|
+
* @since 0.3.16-canary.0
|
|
34
|
+
*/
|
|
23
35
|
declare function ToggleGroupItem({
|
|
24
36
|
__scopeToggleGroup,
|
|
25
37
|
children,
|
|
@@ -10,6 +10,9 @@ const TOGGLE_GROUP_NAME = "ToggleGroup";
|
|
|
10
10
|
const [createToggleGroupContext] = createContextScope(TOGGLE_GROUP_NAME, [createToggleGroupScope]);
|
|
11
11
|
const useToggleGroupScope = createToggleGroupScope();
|
|
12
12
|
const [ToggleGroupProvider, useToggleGroupContext] = createToggleGroupContext(TOGGLE_GROUP_NAME);
|
|
13
|
+
/**
|
|
14
|
+
* @since 0.3.16-canary.0
|
|
15
|
+
*/
|
|
13
16
|
function ToggleGroup({ __scopeToggleGroup, children, className, size, spacing = 0, variant, ...props }) {
|
|
14
17
|
const toggleGroupScope = useToggleGroupScope(__scopeToggleGroup);
|
|
15
18
|
return /* @__PURE__ */ jsx(ToggleGroupProvider, {
|
|
@@ -31,6 +34,9 @@ function ToggleGroup({ __scopeToggleGroup, children, className, size, spacing =
|
|
|
31
34
|
});
|
|
32
35
|
}
|
|
33
36
|
const TOGGLE_GROUP_ITEM_NAME = "ToggleGroupItem";
|
|
37
|
+
/**
|
|
38
|
+
* @since 0.3.16-canary.0
|
|
39
|
+
*/
|
|
34
40
|
function ToggleGroupItem({ __scopeToggleGroup, children, className, ...props }) {
|
|
35
41
|
const { size, spacing, variant } = useToggleGroupContext(TOGGLE_GROUP_ITEM_NAME, __scopeToggleGroup);
|
|
36
42
|
const toggleGroupScope = useToggleGroupScope(__scopeToggleGroup);
|
|
@@ -4,6 +4,9 @@ import { ComponentProps, JSX } from "react";
|
|
|
4
4
|
import * as TogglePrimitive from "@radix-ui/react-toggle";
|
|
5
5
|
|
|
6
6
|
//#region src/components/toggle.d.ts
|
|
7
|
+
/**
|
|
8
|
+
* @since 0.3.16-canary.0
|
|
9
|
+
*/
|
|
7
10
|
declare const toggleVariants: _$_codefast_tailwind_variants0.VariantFunctionType<{
|
|
8
11
|
size: {
|
|
9
12
|
default: string[];
|
|
@@ -15,8 +18,17 @@ declare const toggleVariants: _$_codefast_tailwind_variants0.VariantFunctionType
|
|
|
15
18
|
outline: string[];
|
|
16
19
|
};
|
|
17
20
|
}, Record<string, never>>;
|
|
21
|
+
/**
|
|
22
|
+
* @since 0.3.16-canary.0
|
|
23
|
+
*/
|
|
18
24
|
type ToggleVariants = VariantProps<typeof toggleVariants>;
|
|
25
|
+
/**
|
|
26
|
+
* @since 0.3.16-canary.0
|
|
27
|
+
*/
|
|
19
28
|
interface ToggleProps extends ComponentProps<typeof TogglePrimitive.Root>, ToggleVariants {}
|
|
29
|
+
/**
|
|
30
|
+
* @since 0.3.16-canary.0
|
|
31
|
+
*/
|
|
20
32
|
declare function Toggle({
|
|
21
33
|
children,
|
|
22
34
|
className,
|
|
@@ -3,6 +3,9 @@ import { tv } from "../lib/utils.mjs";
|
|
|
3
3
|
import { jsx } from "react/jsx-runtime";
|
|
4
4
|
import * as TogglePrimitive from "@radix-ui/react-toggle";
|
|
5
5
|
//#region src/components/toggle.tsx
|
|
6
|
+
/**
|
|
7
|
+
* @since 0.3.16-canary.0
|
|
8
|
+
*/
|
|
6
9
|
const toggleVariants = tv({
|
|
7
10
|
base: [
|
|
8
11
|
"inline-flex items-center justify-center gap-2",
|
|
@@ -37,6 +40,9 @@ const toggleVariants = tv({
|
|
|
37
40
|
variant: "default"
|
|
38
41
|
}
|
|
39
42
|
});
|
|
43
|
+
/**
|
|
44
|
+
* @since 0.3.16-canary.0
|
|
45
|
+
*/
|
|
40
46
|
function Toggle({ children, className, size, variant, ...props }) {
|
|
41
47
|
return /* @__PURE__ */ jsx(TogglePrimitive.Root, {
|
|
42
48
|
className: toggleVariants({
|
|
@@ -2,26 +2,56 @@ import { ComponentProps, JSX } from "react";
|
|
|
2
2
|
import * as TooltipPrimitive from "@radix-ui/react-tooltip";
|
|
3
3
|
|
|
4
4
|
//#region src/components/tooltip.d.ts
|
|
5
|
+
/**
|
|
6
|
+
* @since 0.3.16-canary.0
|
|
7
|
+
*/
|
|
5
8
|
type TooltipProviderProps = ComponentProps<typeof TooltipPrimitive.Provider>;
|
|
9
|
+
/**
|
|
10
|
+
* @since 0.3.16-canary.0
|
|
11
|
+
*/
|
|
6
12
|
declare function TooltipProvider({
|
|
7
13
|
...props
|
|
8
14
|
}: TooltipProviderProps): JSX.Element;
|
|
15
|
+
/**
|
|
16
|
+
* @since 0.3.16-canary.0
|
|
17
|
+
*/
|
|
9
18
|
type TooltipProps = ComponentProps<typeof TooltipPrimitive.Root>;
|
|
19
|
+
/**
|
|
20
|
+
* @since 0.3.16-canary.0
|
|
21
|
+
*/
|
|
10
22
|
declare function Tooltip({
|
|
11
23
|
...props
|
|
12
24
|
}: TooltipProps): JSX.Element;
|
|
25
|
+
/**
|
|
26
|
+
* @since 0.3.16-canary.0
|
|
27
|
+
*/
|
|
13
28
|
type TooltipTriggerProps = ComponentProps<typeof TooltipPrimitive.Trigger>;
|
|
29
|
+
/**
|
|
30
|
+
* @since 0.3.16-canary.0
|
|
31
|
+
*/
|
|
14
32
|
declare function TooltipTrigger({
|
|
15
33
|
...props
|
|
16
34
|
}: TooltipTriggerProps): JSX.Element;
|
|
35
|
+
/**
|
|
36
|
+
* @since 0.3.16-canary.0
|
|
37
|
+
*/
|
|
17
38
|
type TooltipContentProps = ComponentProps<typeof TooltipPrimitive.Content>;
|
|
39
|
+
/**
|
|
40
|
+
* @since 0.3.16-canary.0
|
|
41
|
+
*/
|
|
18
42
|
declare function TooltipContent({
|
|
19
43
|
children,
|
|
20
44
|
className,
|
|
21
45
|
sideOffset,
|
|
22
46
|
...props
|
|
23
47
|
}: TooltipContentProps): JSX.Element;
|
|
48
|
+
/**
|
|
49
|
+
* @since 0.3.16-canary.0
|
|
50
|
+
*/
|
|
24
51
|
type TooltipArrowProps = ComponentProps<typeof TooltipPrimitive.Arrow>;
|
|
52
|
+
/**
|
|
53
|
+
* @since 0.3.16-canary.0
|
|
54
|
+
*/
|
|
25
55
|
declare function TooltipArrow({
|
|
26
56
|
className,
|
|
27
57
|
...props
|
|
@@ -3,24 +3,36 @@ import { cn } from "../lib/utils.mjs";
|
|
|
3
3
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
4
4
|
import * as TooltipPrimitive from "@radix-ui/react-tooltip";
|
|
5
5
|
//#region src/components/tooltip.tsx
|
|
6
|
+
/**
|
|
7
|
+
* @since 0.3.16-canary.0
|
|
8
|
+
*/
|
|
6
9
|
function TooltipProvider({ ...props }) {
|
|
7
10
|
return /* @__PURE__ */ jsx(TooltipPrimitive.Provider, {
|
|
8
11
|
"data-slot": "tooltip-provider",
|
|
9
12
|
...props
|
|
10
13
|
});
|
|
11
14
|
}
|
|
15
|
+
/**
|
|
16
|
+
* @since 0.3.16-canary.0
|
|
17
|
+
*/
|
|
12
18
|
function Tooltip({ ...props }) {
|
|
13
19
|
return /* @__PURE__ */ jsx(TooltipPrimitive.Root, {
|
|
14
20
|
"data-slot": "tooltip",
|
|
15
21
|
...props
|
|
16
22
|
});
|
|
17
23
|
}
|
|
24
|
+
/**
|
|
25
|
+
* @since 0.3.16-canary.0
|
|
26
|
+
*/
|
|
18
27
|
function TooltipTrigger({ ...props }) {
|
|
19
28
|
return /* @__PURE__ */ jsx(TooltipPrimitive.Trigger, {
|
|
20
29
|
"data-slot": "tooltip-trigger",
|
|
21
30
|
...props
|
|
22
31
|
});
|
|
23
32
|
}
|
|
33
|
+
/**
|
|
34
|
+
* @since 0.3.16-canary.0
|
|
35
|
+
*/
|
|
24
36
|
function TooltipContent({ children, className, sideOffset = 4, ...props }) {
|
|
25
37
|
return /* @__PURE__ */ jsx(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsxs(TooltipPrimitive.Content, {
|
|
26
38
|
className: cn("z-50", "w-fit max-w-(--radix-tooltip-content-available-width) px-3 py-1.5", "rounded-md", "bg-primary text-xs text-balance text-primary-foreground", "ease-ui data-[state=delayed-open]:animate-in data-[state=delayed-open]:fade-in-0 data-[state=delayed-open]:zoom-in-95", "data-[state=delayed-open]:data-side-top:slide-in-from-bottom-2", "data-[state=delayed-open]:data-side-right:slide-in-from-left-2", "data-[state=delayed-open]:data-side-bottom:slide-in-from-top-2", "data-[state=delayed-open]:data-side-left:slide-in-from-right-2", "data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95", "data-closed:data-side-top:slide-out-to-bottom-2", "data-closed:data-side-right:slide-out-to-left-2", "data-closed:data-side-bottom:slide-out-to-top-2", "data-closed:data-side-left:slide-out-to-right-2", "origin-(--radix-tooltip-content-transform-origin)", className),
|
|
@@ -31,6 +43,9 @@ function TooltipContent({ children, className, sideOffset = 4, ...props }) {
|
|
|
31
43
|
children: [children, /* @__PURE__ */ jsx(TooltipArrow, {})]
|
|
32
44
|
}) });
|
|
33
45
|
}
|
|
46
|
+
/**
|
|
47
|
+
* @since 0.3.16-canary.0
|
|
48
|
+
*/
|
|
34
49
|
function TooltipArrow({ className, ...props }) {
|
|
35
50
|
return /* @__PURE__ */ jsx(TooltipPrimitive.Arrow, {
|
|
36
51
|
className: cn("fill-primary", className),
|
|
@@ -15,6 +15,8 @@
|
|
|
15
15
|
* const value = useAnimatedValue(75, 1000, true);
|
|
16
16
|
* return <div>{value}%</div>;
|
|
17
17
|
* ```
|
|
18
|
+
*
|
|
19
|
+
* @since 0.3.16-canary.0
|
|
18
20
|
*/
|
|
19
21
|
declare function useAnimatedValue(targetValue: null | number, duration: number, animate?: boolean): number;
|
|
20
22
|
//#endregion
|
|
@@ -17,6 +17,8 @@ import { useEffect, useRef, useState } from "react";
|
|
|
17
17
|
* const value = useAnimatedValue(75, 1000, true);
|
|
18
18
|
* return <div>{value}%</div>;
|
|
19
19
|
* ```
|
|
20
|
+
*
|
|
21
|
+
* @since 0.3.16-canary.0
|
|
20
22
|
*/
|
|
21
23
|
function useAnimatedValue(targetValue, duration, animate) {
|
|
22
24
|
const actualTargetValue = targetValue ?? 0;
|
|
@@ -15,6 +15,8 @@
|
|
|
15
15
|
* const { copyToClipboard, isCopied } = useCopyToClipboard({ timeout: 1500 });
|
|
16
16
|
* <button onClick={() => copyToClipboard("Hello")}>{isCopied ? "Copied" : "Copy"}</button>
|
|
17
17
|
* ```
|
|
18
|
+
*
|
|
19
|
+
* @since 0.3.16-canary.0
|
|
18
20
|
*/
|
|
19
21
|
declare function useCopyToClipboard({
|
|
20
22
|
onCopy,
|
|
@@ -17,6 +17,8 @@ import { useState } from "react";
|
|
|
17
17
|
* const { copyToClipboard, isCopied } = useCopyToClipboard({ timeout: 1500 });
|
|
18
18
|
* <button onClick={() => copyToClipboard("Hello")}>{isCopied ? "Copied" : "Copy"}</button>
|
|
19
19
|
* ```
|
|
20
|
+
*
|
|
21
|
+
* @since 0.3.16-canary.0
|
|
20
22
|
*/
|
|
21
23
|
function useCopyToClipboard({ onCopy, timeout = 2e3 } = {}) {
|
|
22
24
|
const [isCopied, setIsCopied] = useState(false);
|
|
@@ -18,6 +18,8 @@ import { useMediaQuery } from "./use-media-query.mjs";
|
|
|
18
18
|
* // Render compact layout
|
|
19
19
|
* }
|
|
20
20
|
* ```
|
|
21
|
+
*
|
|
22
|
+
* @since 0.3.16-canary.0
|
|
21
23
|
*/
|
|
22
24
|
function useIsMobile(mobileBreakpoint = 768) {
|
|
23
25
|
return useMediaQuery(`(max-width: ${(mobileBreakpoint - 1).toString()}px)`);
|
|
@@ -13,6 +13,8 @@ import { RefObject } from "react";
|
|
|
13
13
|
* @returns void
|
|
14
14
|
*
|
|
15
15
|
* @see [MutationObserver](https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver)
|
|
16
|
+
*
|
|
17
|
+
* @since 0.3.16-canary.0
|
|
16
18
|
*/
|
|
17
19
|
declare function useMutationObserver(ref: RefObject<HTMLElement | null>, callback: MutationCallback, options?: MutationObserverInit): void;
|
|
18
20
|
//#endregion
|
|
@@ -22,6 +22,8 @@ const defaultOptions = {
|
|
|
22
22
|
* @returns void
|
|
23
23
|
*
|
|
24
24
|
* @see [MutationObserver](https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver)
|
|
25
|
+
*
|
|
26
|
+
* @since 0.3.16-canary.0
|
|
25
27
|
*/
|
|
26
28
|
function useMutationObserver(ref, callback, options = defaultOptions) {
|
|
27
29
|
useEffect(() => {
|
|
@@ -1,4 +1,7 @@
|
|
|
1
1
|
//#region src/hooks/use-pagination.d.ts
|
|
2
|
+
/**
|
|
3
|
+
* @since 0.3.16-canary.0
|
|
4
|
+
*/
|
|
2
5
|
interface UsePaginationProps {
|
|
3
6
|
/**
|
|
4
7
|
* Current active page number.
|
|
@@ -20,6 +23,8 @@ interface UsePaginationProps {
|
|
|
20
23
|
}
|
|
21
24
|
/**
|
|
22
25
|
* Ellipsis marker used to collapse ranges in pagination output.
|
|
26
|
+
*
|
|
27
|
+
* @since 0.3.16-canary.0
|
|
23
28
|
*/
|
|
24
29
|
declare const ELLIPSIS = "\u2022\u2022\u2022";
|
|
25
30
|
/**
|
|
@@ -41,12 +46,14 @@ declare const ELLIPSIS = "\u2022\u2022\u2022";
|
|
|
41
46
|
* totalResults: 100
|
|
42
47
|
* });
|
|
43
48
|
* ```
|
|
49
|
+
*
|
|
50
|
+
* @since 0.3.16-canary.0
|
|
44
51
|
*/
|
|
45
52
|
declare function usePagination({
|
|
46
53
|
currentPage,
|
|
47
54
|
resultsPerPage,
|
|
48
55
|
siblingPagesCount,
|
|
49
56
|
totalResults
|
|
50
|
-
}: UsePaginationProps):
|
|
57
|
+
}: UsePaginationProps): Array<number | string>;
|
|
51
58
|
//#endregion
|
|
52
59
|
export { ELLIPSIS, UsePaginationProps, usePagination };
|
|
@@ -3,6 +3,8 @@ import { useMemo } from "react";
|
|
|
3
3
|
//#region src/hooks/use-pagination.ts
|
|
4
4
|
/**
|
|
5
5
|
* Ellipsis marker used to collapse ranges in pagination output.
|
|
6
|
+
*
|
|
7
|
+
* @since 0.3.16-canary.0
|
|
6
8
|
*/
|
|
7
9
|
const ELLIPSIS = "•••";
|
|
8
10
|
/**
|
|
@@ -35,6 +37,8 @@ const createRange = (start, end) => {
|
|
|
35
37
|
* totalResults: 100
|
|
36
38
|
* });
|
|
37
39
|
* ```
|
|
40
|
+
*
|
|
41
|
+
* @since 0.3.16-canary.0
|
|
38
42
|
*/
|
|
39
43
|
function usePagination({ currentPage, resultsPerPage, siblingPagesCount = 1, totalResults }) {
|
|
40
44
|
return useMemo(() => {
|
package/dist/lib/utils.d.mts
CHANGED
|
@@ -8,6 +8,6 @@ import { VariantProps } from "@codefast/tailwind-variants";
|
|
|
8
8
|
* Use these `cn` / `tv` helpers everywhere in this package so class merging stays consistent
|
|
9
9
|
* and optional `twMergeConfig` can be applied in one place later.
|
|
10
10
|
*/
|
|
11
|
-
declare const cn: (...classes: ClassValue
|
|
11
|
+
declare const cn: (...classes: Array<ClassValue>) => string, tv: _$_codefast_tailwind_variants0.TailwindVariantsFactory;
|
|
12
12
|
//#endregion
|
|
13
13
|
export { type VariantProps, cn, tv };
|