@deftui/react 0.0.0-stage → 0.0.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/dist/index.d.mts +24 -0
- package/dist/index.mjs +24 -0
- package/dist/styles.css +88 -0
- package/dist/styles.shadcn.css +537 -0
- package/dist/styles.tokens.css +87 -0
- package/dist/vendor/coss/form.d.mts +4 -0
- package/dist/vendor/coss/form.mjs +12 -0
- package/dist/vendor/coss/hooks/use-copy-to-clipboard.d.mts +7 -0
- package/dist/vendor/coss/hooks/use-copy-to-clipboard.mjs +30 -0
- package/dist/vendor/coss/hooks/use-media-query.d.mts +20 -0
- package/dist/vendor/coss/hooks/use-media-query.mjs +57 -0
- package/dist/vendor/coss/scroll-area.d.mts +10 -0
- package/dist/vendor/coss/scroll-area.mjs +39 -0
- package/dist/vendor/shadcn/alert-dialog.d.mts +14 -0
- package/dist/vendor/shadcn/alert-dialog.mjs +80 -0
- package/dist/vendor/shadcn/badge.d.mts +7 -0
- package/dist/vendor/shadcn/badge.mjs +28 -0
- package/dist/vendor/shadcn/breadcrumb.d.mts +10 -0
- package/dist/vendor/shadcn/breadcrumb.mjs +71 -0
- package/dist/vendor/shadcn/button.d.mts +8 -0
- package/dist/vendor/shadcn/button.mjs +43 -0
- package/dist/vendor/shadcn/calendar.d.mts +7 -0
- package/dist/vendor/shadcn/calendar.mjs +107 -0
- package/dist/vendor/shadcn/card.d.mts +11 -0
- package/dist/vendor/shadcn/card.mjs +55 -0
- package/dist/vendor/shadcn/carousel.d.mts +19 -0
- package/dist/vendor/shadcn/carousel.mjs +131 -0
- package/dist/vendor/shadcn/combobox.d.mts +20 -0
- package/dist/vendor/shadcn/combobox.mjs +151 -0
- package/dist/vendor/shadcn/dialog.d.mts +15 -0
- package/dist/vendor/shadcn/dialog.mjs +91 -0
- package/dist/vendor/shadcn/drawer.d.mts +13 -0
- package/dist/vendor/shadcn/drawer.mjs +122 -0
- package/dist/vendor/shadcn/dropdown-menu.d.mts +28 -0
- package/dist/vendor/shadcn/dropdown-menu.mjs +130 -0
- package/dist/vendor/shadcn/empty.d.mts +11 -0
- package/dist/vendor/shadcn/empty.mjs +58 -0
- package/dist/vendor/shadcn/field.d.mts +14 -0
- package/dist/vendor/shadcn/field.mjs +60 -0
- package/dist/vendor/shadcn/input-group.d.mts +12 -0
- package/dist/vendor/shadcn/input-group.mjs +78 -0
- package/dist/vendor/shadcn/input.d.mts +3 -0
- package/dist/vendor/shadcn/input.mjs +14 -0
- package/dist/vendor/shadcn/kbd.d.mts +3 -0
- package/dist/vendor/shadcn/kbd.mjs +18 -0
- package/dist/vendor/shadcn/label.d.mts +3 -0
- package/dist/vendor/shadcn/label.mjs +13 -0
- package/dist/vendor/shadcn/lib/utils.mjs +1 -0
- package/dist/vendor/shadcn/pagination.d.mts +17 -0
- package/dist/vendor/shadcn/pagination.mjs +79 -0
- package/dist/vendor/shadcn/popover.d.mts +8 -0
- package/dist/vendor/shadcn/popover.mjs +47 -0
- package/dist/vendor/shadcn/progress.d.mts +7 -0
- package/dist/vendor/shadcn/progress.mjs +43 -0
- package/dist/vendor/shadcn/radio-group.d.mts +5 -0
- package/dist/vendor/shadcn/radio-group.mjs +26 -0
- package/dist/vendor/shadcn/select.d.mts +12 -0
- package/dist/vendor/shadcn/select.mjs +97 -0
- package/dist/vendor/shadcn/separator.d.mts +3 -0
- package/dist/vendor/shadcn/separator.mjs +14 -0
- package/dist/vendor/shadcn/sheet.mjs +69 -0
- package/dist/vendor/shadcn/sidebar.d.mts +60 -0
- package/dist/vendor/shadcn/sidebar.mjs +366 -0
- package/dist/vendor/shadcn/skeleton.mjs +3 -0
- package/dist/vendor/shadcn/spinner.d.mts +2 -0
- package/dist/vendor/shadcn/spinner.mjs +14 -0
- package/dist/vendor/shadcn/switch.d.mts +5 -0
- package/dist/vendor/shadcn/switch.mjs +18 -0
- package/dist/vendor/shadcn/table.d.mts +9 -0
- package/dist/vendor/shadcn/table.mjs +59 -0
- package/dist/vendor/shadcn/tabs.d.mts +10 -0
- package/dist/vendor/shadcn/tabs.mjs +44 -0
- package/dist/vendor/shadcn/textarea.d.mts +3 -0
- package/dist/vendor/shadcn/textarea.mjs +12 -0
- package/dist/vendor/shadcn/toast.d.mts +5 -0
- package/dist/vendor/shadcn/toast.mjs +122 -0
- package/dist/vendor/shadcn/tooltip.d.mts +5 -0
- package/dist/vendor/shadcn/tooltip.mjs +33 -0
- package/dist/vendor.css +1 -0
- package/dist/widgets/breadcrumb.d.mts +17 -0
- package/dist/widgets/breadcrumb.mjs +22 -0
- package/dist/widgets/datetime-picker.d.mts +25 -0
- package/dist/widgets/datetime-picker.mjs +75 -0
- package/dist/widgets/image-display.d.mts +12 -0
- package/dist/widgets/image-display.mjs +29 -0
- package/dist/widgets/index.d.mts +186 -0
- package/dist/widgets/index.mjs +187 -0
- package/dist/widgets/pagination.d.mts +10 -0
- package/dist/widgets/pagination.mjs +12 -0
- package/dist/widgets/sidebar.d.mts +26 -0
- package/dist/widgets/sidebar.mjs +27 -0
- package/dist/widgets/toast.d.mts +2 -0
- package/dist/widgets/toast.mjs +1 -0
- package/package.json +53 -4
- package/README.md +0 -3
|
@@ -0,0 +1,79 @@
|
|
|
1
|
+
import { Button } from "./button.mjs";
|
|
2
|
+
import { cn } from "cn";
|
|
3
|
+
import "react";
|
|
4
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
5
|
+
import { ChevronLeftIcon, ChevronRightIcon, MoreHorizontalIcon } from "lucide-react";
|
|
6
|
+
// src/vendor/shadcn/pagination.tsx
|
|
7
|
+
function Pagination({ className, ...props }) {
|
|
8
|
+
return /* @__PURE__ */ jsx("nav", {
|
|
9
|
+
role: "navigation",
|
|
10
|
+
"aria-label": "pagination",
|
|
11
|
+
"data-slot": "pagination",
|
|
12
|
+
className: cn("mx-auto flex w-full justify-center", className),
|
|
13
|
+
...props
|
|
14
|
+
});
|
|
15
|
+
}
|
|
16
|
+
function PaginationContent({ className, ...props }) {
|
|
17
|
+
return /* @__PURE__ */ jsx("ul", {
|
|
18
|
+
"data-slot": "pagination-content",
|
|
19
|
+
className: cn("flex items-center gap-1", className),
|
|
20
|
+
...props
|
|
21
|
+
});
|
|
22
|
+
}
|
|
23
|
+
function PaginationItem({ ...props }) {
|
|
24
|
+
return /* @__PURE__ */ jsx("li", {
|
|
25
|
+
"data-slot": "pagination-item",
|
|
26
|
+
...props
|
|
27
|
+
});
|
|
28
|
+
}
|
|
29
|
+
function PaginationLink({ className, isActive, size = "icon", ...props }) {
|
|
30
|
+
return /* @__PURE__ */ jsx(Button, {
|
|
31
|
+
variant: isActive ? "outline" : "ghost",
|
|
32
|
+
size,
|
|
33
|
+
className: cn(className),
|
|
34
|
+
nativeButton: false,
|
|
35
|
+
render: /* @__PURE__ */ jsx("a", {
|
|
36
|
+
"aria-current": isActive ? "page" : void 0,
|
|
37
|
+
"data-slot": "pagination-link",
|
|
38
|
+
"data-active": isActive,
|
|
39
|
+
...props
|
|
40
|
+
})
|
|
41
|
+
});
|
|
42
|
+
}
|
|
43
|
+
function PaginationPrevious({ className, text = "Previous", ...props }) {
|
|
44
|
+
return /* @__PURE__ */ jsxs(PaginationLink, {
|
|
45
|
+
"aria-label": "Go to previous page",
|
|
46
|
+
size: "default",
|
|
47
|
+
className: cn("pl-2!", className),
|
|
48
|
+
...props,
|
|
49
|
+
children: [/* @__PURE__ */ jsx(ChevronLeftIcon, { "data-icon": "inline-start" }), /* @__PURE__ */ jsx("span", {
|
|
50
|
+
className: "hidden sm:block",
|
|
51
|
+
children: text
|
|
52
|
+
})]
|
|
53
|
+
});
|
|
54
|
+
}
|
|
55
|
+
function PaginationNext({ className, text = "Next", ...props }) {
|
|
56
|
+
return /* @__PURE__ */ jsxs(PaginationLink, {
|
|
57
|
+
"aria-label": "Go to next page",
|
|
58
|
+
size: "default",
|
|
59
|
+
className: cn("pr-2!", className),
|
|
60
|
+
...props,
|
|
61
|
+
children: [/* @__PURE__ */ jsx("span", {
|
|
62
|
+
className: "hidden sm:block",
|
|
63
|
+
children: text
|
|
64
|
+
}), /* @__PURE__ */ jsx(ChevronRightIcon, { "data-icon": "inline-end" })]
|
|
65
|
+
});
|
|
66
|
+
}
|
|
67
|
+
function PaginationEllipsis({ className, ...props }) {
|
|
68
|
+
return /* @__PURE__ */ jsxs("span", {
|
|
69
|
+
"aria-hidden": true,
|
|
70
|
+
"data-slot": "pagination-ellipsis",
|
|
71
|
+
className: cn("flex size-9 items-center justify-center [&_svg:not([class*='size-'])]:size-4", className),
|
|
72
|
+
...props,
|
|
73
|
+
children: [/* @__PURE__ */ jsx(MoreHorizontalIcon, {}), /* @__PURE__ */ jsx("span", {
|
|
74
|
+
className: "sr-only",
|
|
75
|
+
children: "More pages"
|
|
76
|
+
})]
|
|
77
|
+
});
|
|
78
|
+
}
|
|
79
|
+
export { Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious };
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import * as React$1 from "react";
|
|
2
|
+
import { Popover } from "@base-ui/react/popover";
|
|
3
|
+
declare function Popover$1({ ...props }: Popover.Root.Props): React$1.JSX.Element;
|
|
4
|
+
declare function PopoverTrigger({ ...props }: Popover.Trigger.Props): React$1.JSX.Element;
|
|
5
|
+
declare function PopoverContent({ className, align, alignOffset, side, sideOffset, ...props }: Popover.Popup.Props & Pick<Popover.Positioner.Props, "align" | "alignOffset" | "side" | "sideOffset">): React$1.JSX.Element;
|
|
6
|
+
declare function PopoverTitle({ className, ...props }: Popover.Title.Props): React$1.JSX.Element;
|
|
7
|
+
declare function PopoverDescription({ className, ...props }: Popover.Description.Props): React$1.JSX.Element;
|
|
8
|
+
export { Popover$1 as Popover, PopoverContent, PopoverDescription, PopoverTitle, PopoverTrigger };
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { cn } from "cn";
|
|
3
|
+
import "react";
|
|
4
|
+
import { jsx } from "react/jsx-runtime";
|
|
5
|
+
import { Popover } from "@base-ui/react/popover";
|
|
6
|
+
// src/vendor/shadcn/popover.tsx
|
|
7
|
+
function Popover$1({ ...props }) {
|
|
8
|
+
return /* @__PURE__ */ jsx(Popover.Root, {
|
|
9
|
+
"data-slot": "popover",
|
|
10
|
+
...props
|
|
11
|
+
});
|
|
12
|
+
}
|
|
13
|
+
function PopoverTrigger({ ...props }) {
|
|
14
|
+
return /* @__PURE__ */ jsx(Popover.Trigger, {
|
|
15
|
+
"data-slot": "popover-trigger",
|
|
16
|
+
...props
|
|
17
|
+
});
|
|
18
|
+
}
|
|
19
|
+
function PopoverContent({ className, align = "center", alignOffset = 0, side = "bottom", sideOffset = 4, ...props }) {
|
|
20
|
+
return /* @__PURE__ */ jsx(Popover.Portal, { children: /* @__PURE__ */ jsx(Popover.Positioner, {
|
|
21
|
+
align,
|
|
22
|
+
alignOffset,
|
|
23
|
+
side,
|
|
24
|
+
sideOffset,
|
|
25
|
+
className: "isolate z-50",
|
|
26
|
+
children: /* @__PURE__ */ jsx(Popover.Popup, {
|
|
27
|
+
"data-slot": "popover-content",
|
|
28
|
+
className: cn("z-50 flex w-72 origin-(--transform-origin) flex-col gap-4 rounded-md bg-popover p-4 text-sm text-popover-foreground shadow-md ring-1 ring-foreground/10 outline-hidden duration-100 data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-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-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95", className),
|
|
29
|
+
...props
|
|
30
|
+
})
|
|
31
|
+
}) });
|
|
32
|
+
}
|
|
33
|
+
function PopoverTitle({ className, ...props }) {
|
|
34
|
+
return /* @__PURE__ */ jsx(Popover.Title, {
|
|
35
|
+
"data-slot": "popover-title",
|
|
36
|
+
className: cn("font-medium", className),
|
|
37
|
+
...props
|
|
38
|
+
});
|
|
39
|
+
}
|
|
40
|
+
function PopoverDescription({ className, ...props }) {
|
|
41
|
+
return /* @__PURE__ */ jsx(Popover.Description, {
|
|
42
|
+
"data-slot": "popover-description",
|
|
43
|
+
className: cn("text-muted-foreground", className),
|
|
44
|
+
...props
|
|
45
|
+
});
|
|
46
|
+
}
|
|
47
|
+
export { Popover$1 as Popover, PopoverContent, PopoverDescription, PopoverTitle, PopoverTrigger };
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { Progress } from "@base-ui/react/progress";
|
|
2
|
+
declare function Progress$1({ className, children, value, ...props }: Progress.Root.Props): import("react").JSX.Element;
|
|
3
|
+
declare function ProgressTrack({ className, ...props }: Progress.Track.Props): import("react").JSX.Element;
|
|
4
|
+
declare function ProgressIndicator({ className, ...props }: Progress.Indicator.Props): import("react").JSX.Element;
|
|
5
|
+
declare function ProgressLabel({ className, ...props }: Progress.Label.Props): import("react").JSX.Element;
|
|
6
|
+
declare function ProgressValue({ className, ...props }: Progress.Value.Props): import("react").JSX.Element;
|
|
7
|
+
export { Progress$1 as Progress, ProgressIndicator, ProgressLabel, ProgressTrack, ProgressValue };
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { cn } from "cn";
|
|
3
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
4
|
+
import { Progress } from "@base-ui/react/progress";
|
|
5
|
+
// src/vendor/shadcn/progress.tsx
|
|
6
|
+
function Progress$1({ className, children, value, ...props }) {
|
|
7
|
+
return /* @__PURE__ */ jsxs(Progress.Root, {
|
|
8
|
+
value,
|
|
9
|
+
"data-slot": "progress",
|
|
10
|
+
className: cn("flex flex-wrap gap-3", className),
|
|
11
|
+
...props,
|
|
12
|
+
children: [children, /* @__PURE__ */ jsx(ProgressTrack, { children: /* @__PURE__ */ jsx(ProgressIndicator, {}) })]
|
|
13
|
+
});
|
|
14
|
+
}
|
|
15
|
+
function ProgressTrack({ className, ...props }) {
|
|
16
|
+
return /* @__PURE__ */ jsx(Progress.Track, {
|
|
17
|
+
className: cn("relative flex h-1.5 w-full items-center overflow-x-hidden rounded-full bg-muted", className),
|
|
18
|
+
"data-slot": "progress-track",
|
|
19
|
+
...props
|
|
20
|
+
});
|
|
21
|
+
}
|
|
22
|
+
function ProgressIndicator({ className, ...props }) {
|
|
23
|
+
return /* @__PURE__ */ jsx(Progress.Indicator, {
|
|
24
|
+
"data-slot": "progress-indicator",
|
|
25
|
+
className: cn("h-full bg-primary transition-all", className),
|
|
26
|
+
...props
|
|
27
|
+
});
|
|
28
|
+
}
|
|
29
|
+
function ProgressLabel({ className, ...props }) {
|
|
30
|
+
return /* @__PURE__ */ jsx(Progress.Label, {
|
|
31
|
+
className: cn("text-sm font-medium", className),
|
|
32
|
+
"data-slot": "progress-label",
|
|
33
|
+
...props
|
|
34
|
+
});
|
|
35
|
+
}
|
|
36
|
+
function ProgressValue({ className, ...props }) {
|
|
37
|
+
return /* @__PURE__ */ jsx(Progress.Value, {
|
|
38
|
+
className: cn("ml-auto text-sm text-muted-foreground tabular-nums", className),
|
|
39
|
+
"data-slot": "progress-value",
|
|
40
|
+
...props
|
|
41
|
+
});
|
|
42
|
+
}
|
|
43
|
+
export { Progress$1 as Progress, ProgressIndicator, ProgressLabel, ProgressTrack, ProgressValue };
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import { Radio } from "@base-ui/react/radio";
|
|
2
|
+
import { RadioGroup } from "@base-ui/react/radio-group";
|
|
3
|
+
declare function RadioGroup$1({ className, ...props }: RadioGroup.Props): import("react").JSX.Element;
|
|
4
|
+
declare function RadioGroupItem({ className, ...props }: Radio.Root.Props): import("react").JSX.Element;
|
|
5
|
+
export { RadioGroup$1 as RadioGroup, RadioGroupItem };
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { cn } from "cn";
|
|
3
|
+
import { jsx } from "react/jsx-runtime";
|
|
4
|
+
import { Radio } from "@base-ui/react/radio";
|
|
5
|
+
import { RadioGroup } from "@base-ui/react/radio-group";
|
|
6
|
+
// src/vendor/shadcn/radio-group.tsx
|
|
7
|
+
function RadioGroup$1({ className, ...props }) {
|
|
8
|
+
return /* @__PURE__ */ jsx(RadioGroup, {
|
|
9
|
+
"data-slot": "radio-group",
|
|
10
|
+
className: cn("grid w-full gap-3", className),
|
|
11
|
+
...props
|
|
12
|
+
});
|
|
13
|
+
}
|
|
14
|
+
function RadioGroupItem({ className, ...props }) {
|
|
15
|
+
return /* @__PURE__ */ jsx(Radio.Root, {
|
|
16
|
+
"data-slot": "radio-group-item",
|
|
17
|
+
className: cn("group/radio-group-item peer relative flex aspect-square size-4 shrink-0 rounded-full border border-input outline-none group-has-[:focus-visible]/field-label:ring-0 group-has-[:focus-visible]/field-label:not-data-checked:border-input after:absolute after:-inset-x-3 after:-inset-y-2 focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 aria-invalid:aria-checked:border-primary dark:bg-input/30 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 data-checked:border-primary data-checked:bg-primary data-checked:text-primary-foreground group-has-[:focus-visible]/field-label:data-checked:border-primary dark:data-checked:bg-primary", className),
|
|
18
|
+
...props,
|
|
19
|
+
children: /* @__PURE__ */ jsx(Radio.Indicator, {
|
|
20
|
+
"data-slot": "radio-group-indicator",
|
|
21
|
+
className: "flex size-4 items-center justify-center",
|
|
22
|
+
children: /* @__PURE__ */ jsx("span", { className: "absolute top-1/2 left-1/2 size-2 -translate-x-1/2 -translate-y-1/2 rounded-full bg-primary-foreground" })
|
|
23
|
+
})
|
|
24
|
+
});
|
|
25
|
+
}
|
|
26
|
+
export { RadioGroup$1 as RadioGroup, RadioGroupItem };
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import * as React$1 from "react";
|
|
2
|
+
import { Select } from "@base-ui/react/select";
|
|
3
|
+
declare function SelectGroup({ className, ...props }: Select.Group.Props): React$1.JSX.Element;
|
|
4
|
+
declare function SelectValue({ className, ...props }: Select.Value.Props): React$1.JSX.Element;
|
|
5
|
+
declare function SelectTrigger({ className, size, children, ...props }: Select.Trigger.Props & {
|
|
6
|
+
size?: "sm" | "default";
|
|
7
|
+
}): React$1.JSX.Element;
|
|
8
|
+
declare function SelectContent({ className, children, side, sideOffset, align, alignOffset, alignItemWithTrigger, ...props }: Select.Popup.Props & Pick<Select.Positioner.Props, "align" | "alignOffset" | "side" | "sideOffset" | "alignItemWithTrigger">): React$1.JSX.Element;
|
|
9
|
+
declare function SelectLabel({ className, ...props }: Select.GroupLabel.Props): React$1.JSX.Element;
|
|
10
|
+
declare function SelectItem({ className, children, ...props }: Select.Item.Props): React$1.JSX.Element;
|
|
11
|
+
declare function SelectSeparator({ className, ...props }: Select.Separator.Props): React$1.JSX.Element;
|
|
12
|
+
export { SelectContent, SelectGroup, SelectItem, SelectLabel, SelectSeparator, SelectTrigger, SelectValue };
|
|
@@ -0,0 +1,97 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { cn } from "cn";
|
|
3
|
+
import "react";
|
|
4
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
5
|
+
import { CheckIcon, ChevronDownIcon, ChevronUpIcon } from "lucide-react";
|
|
6
|
+
import { Select } from "@base-ui/react/select";
|
|
7
|
+
// src/vendor/shadcn/select.tsx
|
|
8
|
+
const Select$1 = Select.Root;
|
|
9
|
+
function SelectGroup({ className, ...props }) {
|
|
10
|
+
return /* @__PURE__ */ jsx(Select.Group, {
|
|
11
|
+
"data-slot": "select-group",
|
|
12
|
+
className: cn("scroll-my-1 p-1", className),
|
|
13
|
+
...props
|
|
14
|
+
});
|
|
15
|
+
}
|
|
16
|
+
function SelectValue({ className, ...props }) {
|
|
17
|
+
return /* @__PURE__ */ jsx(Select.Value, {
|
|
18
|
+
"data-slot": "select-value",
|
|
19
|
+
className: cn("flex flex-1 text-left", className),
|
|
20
|
+
...props
|
|
21
|
+
});
|
|
22
|
+
}
|
|
23
|
+
function SelectTrigger({ className, size = "default", children, ...props }) {
|
|
24
|
+
return /* @__PURE__ */ jsxs(Select.Trigger, {
|
|
25
|
+
"data-slot": "select-trigger",
|
|
26
|
+
"data-size": size,
|
|
27
|
+
className: cn("flex w-fit items-center justify-between gap-1.5 rounded-md border border-input bg-transparent py-2 pr-2 pl-2.5 text-sm whitespace-nowrap shadow-xs transition-[color,box-shadow] outline-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 data-placeholder:text-muted-foreground data-[size=default]:h-9 data-[size=sm]:h-8 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-1.5 dark:bg-input/30 dark:hover:bg-input/50 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className),
|
|
28
|
+
...props,
|
|
29
|
+
children: [children, /* @__PURE__ */ jsx(Select.Icon, { render: /* @__PURE__ */ jsx(ChevronDownIcon, { className: "pointer-events-none size-4 text-muted-foreground" }) })]
|
|
30
|
+
});
|
|
31
|
+
}
|
|
32
|
+
function SelectContent({ className, children, side = "bottom", sideOffset = 4, align = "center", alignOffset = 0, alignItemWithTrigger = false, ...props }) {
|
|
33
|
+
return /* @__PURE__ */ jsx(Select.Portal, { children: /* @__PURE__ */ jsx(Select.Positioner, {
|
|
34
|
+
side,
|
|
35
|
+
sideOffset,
|
|
36
|
+
align,
|
|
37
|
+
alignOffset,
|
|
38
|
+
alignItemWithTrigger,
|
|
39
|
+
className: "isolate z-50",
|
|
40
|
+
children: /* @__PURE__ */ jsxs(Select.Popup, {
|
|
41
|
+
"data-slot": "select-content",
|
|
42
|
+
"data-align-trigger": alignItemWithTrigger,
|
|
43
|
+
className: cn("relative isolate z-50 max-h-(--available-height) w-(--anchor-width) min-w-36 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-md bg-popover text-popover-foreground shadow-md ring-1 ring-foreground/10 duration-100 data-[align-trigger=true]:animate-none data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-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-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95", className),
|
|
44
|
+
...props,
|
|
45
|
+
children: [
|
|
46
|
+
/* @__PURE__ */ jsx(SelectScrollUpButton, {}),
|
|
47
|
+
/* @__PURE__ */ jsx(Select.List, { children }),
|
|
48
|
+
/* @__PURE__ */ jsx(SelectScrollDownButton, {})
|
|
49
|
+
]
|
|
50
|
+
})
|
|
51
|
+
}) });
|
|
52
|
+
}
|
|
53
|
+
function SelectLabel({ className, ...props }) {
|
|
54
|
+
return /* @__PURE__ */ jsx(Select.GroupLabel, {
|
|
55
|
+
"data-slot": "select-label",
|
|
56
|
+
className: cn("px-2 py-1.5 text-xs text-muted-foreground", className),
|
|
57
|
+
...props
|
|
58
|
+
});
|
|
59
|
+
}
|
|
60
|
+
function SelectItem({ className, children, ...props }) {
|
|
61
|
+
return /* @__PURE__ */ jsxs(Select.Item, {
|
|
62
|
+
"data-slot": "select-item",
|
|
63
|
+
className: cn("relative flex w-full cursor-default items-center gap-2 rounded-sm py-1.5 pr-8 pl-2 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2", className),
|
|
64
|
+
...props,
|
|
65
|
+
children: [/* @__PURE__ */ jsx(Select.ItemText, {
|
|
66
|
+
className: "flex flex-1 shrink-0 gap-2 whitespace-nowrap",
|
|
67
|
+
children
|
|
68
|
+
}), /* @__PURE__ */ jsx(Select.ItemIndicator, {
|
|
69
|
+
render: /* @__PURE__ */ jsx("span", { className: "pointer-events-none absolute right-2 flex size-4 items-center justify-center" }),
|
|
70
|
+
children: /* @__PURE__ */ jsx(CheckIcon, { className: "pointer-events-none" })
|
|
71
|
+
})]
|
|
72
|
+
});
|
|
73
|
+
}
|
|
74
|
+
function SelectSeparator({ className, ...props }) {
|
|
75
|
+
return /* @__PURE__ */ jsx(Select.Separator, {
|
|
76
|
+
"data-slot": "select-separator",
|
|
77
|
+
className: cn("pointer-events-none -mx-1 my-1 h-px bg-border", className),
|
|
78
|
+
...props
|
|
79
|
+
});
|
|
80
|
+
}
|
|
81
|
+
function SelectScrollUpButton({ className, ...props }) {
|
|
82
|
+
return /* @__PURE__ */ jsx(Select.ScrollUpArrow, {
|
|
83
|
+
"data-slot": "select-scroll-up-button",
|
|
84
|
+
className: cn("top-0 z-10 flex w-full cursor-default items-center justify-center bg-popover py-1 [&_svg:not([class*='size-'])]:size-4", className),
|
|
85
|
+
...props,
|
|
86
|
+
children: /* @__PURE__ */ jsx(ChevronUpIcon, {})
|
|
87
|
+
});
|
|
88
|
+
}
|
|
89
|
+
function SelectScrollDownButton({ className, ...props }) {
|
|
90
|
+
return /* @__PURE__ */ jsx(Select.ScrollDownArrow, {
|
|
91
|
+
"data-slot": "select-scroll-down-button",
|
|
92
|
+
className: cn("bottom-0 z-10 flex w-full cursor-default items-center justify-center bg-popover py-1 [&_svg:not([class*='size-'])]:size-4", className),
|
|
93
|
+
...props,
|
|
94
|
+
children: /* @__PURE__ */ jsx(ChevronDownIcon, {})
|
|
95
|
+
});
|
|
96
|
+
}
|
|
97
|
+
export { Select$1 as Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue };
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { cn } from "cn";
|
|
3
|
+
import { jsx } from "react/jsx-runtime";
|
|
4
|
+
import { Separator } from "@base-ui/react/separator";
|
|
5
|
+
// src/vendor/shadcn/separator.tsx
|
|
6
|
+
function Separator$1({ className, orientation = "horizontal", ...props }) {
|
|
7
|
+
return /* @__PURE__ */ jsx(Separator, {
|
|
8
|
+
"data-slot": "separator",
|
|
9
|
+
orientation,
|
|
10
|
+
className: cn("shrink-0 bg-border data-horizontal:h-px data-horizontal:w-full data-vertical:w-px data-vertical:self-stretch", className),
|
|
11
|
+
...props
|
|
12
|
+
});
|
|
13
|
+
}
|
|
14
|
+
export { Separator$1 as Separator };
|
|
@@ -0,0 +1,69 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { Button } from "./button.mjs";
|
|
3
|
+
import { cn } from "cn";
|
|
4
|
+
import "react";
|
|
5
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
6
|
+
import { XIcon } from "lucide-react";
|
|
7
|
+
import { Dialog } from "@base-ui/react/dialog";
|
|
8
|
+
// src/vendor/shadcn/sheet.tsx
|
|
9
|
+
function Sheet({ ...props }) {
|
|
10
|
+
return /* @__PURE__ */ jsx(Dialog.Root, {
|
|
11
|
+
"data-slot": "sheet",
|
|
12
|
+
...props
|
|
13
|
+
});
|
|
14
|
+
}
|
|
15
|
+
function SheetPortal({ ...props }) {
|
|
16
|
+
return /* @__PURE__ */ jsx(Dialog.Portal, {
|
|
17
|
+
"data-slot": "sheet-portal",
|
|
18
|
+
...props
|
|
19
|
+
});
|
|
20
|
+
}
|
|
21
|
+
function SheetOverlay({ className, ...props }) {
|
|
22
|
+
return /* @__PURE__ */ jsx(Dialog.Backdrop, {
|
|
23
|
+
"data-slot": "sheet-overlay",
|
|
24
|
+
className: cn("fixed inset-0 z-50 bg-black/10 transition-opacity duration-150 data-ending-style:opacity-0 data-starting-style:opacity-0 supports-backdrop-filter:backdrop-blur-xs", className),
|
|
25
|
+
...props
|
|
26
|
+
});
|
|
27
|
+
}
|
|
28
|
+
function SheetContent({ className, children, side = "right", showCloseButton = true, ...props }) {
|
|
29
|
+
return /* @__PURE__ */ jsxs(SheetPortal, { children: [/* @__PURE__ */ jsx(SheetOverlay, {}), /* @__PURE__ */ jsxs(Dialog.Popup, {
|
|
30
|
+
"data-slot": "sheet-content",
|
|
31
|
+
"data-side": side,
|
|
32
|
+
className: cn("fixed z-50 flex flex-col gap-4 bg-popover bg-clip-padding text-sm text-popover-foreground shadow-lg transition duration-200 ease-in-out data-ending-style:opacity-0 data-starting-style:opacity-0 data-[side=bottom]:inset-x-0 data-[side=bottom]:bottom-0 data-[side=bottom]:h-auto data-[side=bottom]:border-t data-[side=bottom]:data-ending-style:translate-y-[2.5rem] data-[side=bottom]:data-starting-style:translate-y-[2.5rem] data-[side=left]:inset-y-0 data-[side=left]:left-0 data-[side=left]:h-full data-[side=left]:w-3/4 data-[side=left]:border-r data-[side=left]:data-ending-style:translate-x-[-2.5rem] data-[side=left]:data-starting-style:translate-x-[-2.5rem] data-[side=right]:inset-y-0 data-[side=right]:right-0 data-[side=right]:h-full data-[side=right]:w-3/4 data-[side=right]:border-l data-[side=right]:data-ending-style:translate-x-[2.5rem] data-[side=right]:data-starting-style:translate-x-[2.5rem] data-[side=top]:inset-x-0 data-[side=top]:top-0 data-[side=top]:h-auto data-[side=top]:border-b data-[side=top]:data-ending-style:translate-y-[-2.5rem] data-[side=top]:data-starting-style:translate-y-[-2.5rem] data-[side=left]:sm:max-w-sm data-[side=right]:sm:max-w-sm", className),
|
|
33
|
+
...props,
|
|
34
|
+
children: [children, showCloseButton && /* @__PURE__ */ jsxs(Dialog.Close, {
|
|
35
|
+
"data-slot": "sheet-close",
|
|
36
|
+
render: /* @__PURE__ */ jsx(Button, {
|
|
37
|
+
variant: "ghost",
|
|
38
|
+
className: "absolute top-4 right-4",
|
|
39
|
+
size: "icon-sm"
|
|
40
|
+
}),
|
|
41
|
+
children: [/* @__PURE__ */ jsx(XIcon, {}), /* @__PURE__ */ jsx("span", {
|
|
42
|
+
className: "sr-only",
|
|
43
|
+
children: "Close"
|
|
44
|
+
})]
|
|
45
|
+
})]
|
|
46
|
+
})] });
|
|
47
|
+
}
|
|
48
|
+
function SheetHeader({ className, ...props }) {
|
|
49
|
+
return /* @__PURE__ */ jsx("div", {
|
|
50
|
+
"data-slot": "sheet-header",
|
|
51
|
+
className: cn("flex flex-col gap-1.5 p-4", className),
|
|
52
|
+
...props
|
|
53
|
+
});
|
|
54
|
+
}
|
|
55
|
+
function SheetTitle({ className, ...props }) {
|
|
56
|
+
return /* @__PURE__ */ jsx(Dialog.Title, {
|
|
57
|
+
"data-slot": "sheet-title",
|
|
58
|
+
className: cn("font-medium text-foreground", className),
|
|
59
|
+
...props
|
|
60
|
+
});
|
|
61
|
+
}
|
|
62
|
+
function SheetDescription({ className, ...props }) {
|
|
63
|
+
return /* @__PURE__ */ jsx(Dialog.Description, {
|
|
64
|
+
"data-slot": "sheet-description",
|
|
65
|
+
className: cn("text-sm text-muted-foreground", className),
|
|
66
|
+
...props
|
|
67
|
+
});
|
|
68
|
+
}
|
|
69
|
+
export { Sheet, SheetContent, SheetDescription, SheetHeader, SheetTitle };
|
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
import { Button } from "./button.mjs";
|
|
2
|
+
import { TooltipContent } from "./tooltip.mjs";
|
|
3
|
+
import { Input } from "./input.mjs";
|
|
4
|
+
import { Separator } from "./separator.mjs";
|
|
5
|
+
import { VariantProps } from "class-variance-authority";
|
|
6
|
+
import * as React$1 from "react";
|
|
7
|
+
import { useRender } from "@base-ui/react/use-render";
|
|
8
|
+
type SidebarContextProps = {
|
|
9
|
+
state: "expanded" | "collapsed";
|
|
10
|
+
open: boolean;
|
|
11
|
+
setOpen: (open: boolean) => void;
|
|
12
|
+
openMobile: boolean;
|
|
13
|
+
setOpenMobile: (open: boolean) => void;
|
|
14
|
+
isMobile: boolean;
|
|
15
|
+
toggleSidebar: () => void;
|
|
16
|
+
};
|
|
17
|
+
declare function useSidebar(): SidebarContextProps;
|
|
18
|
+
declare function SidebarProvider({ defaultOpen, open: openProp, onOpenChange: setOpenProp, className, style, children, ...props }: React$1.ComponentProps<"div"> & {
|
|
19
|
+
defaultOpen?: boolean;
|
|
20
|
+
open?: boolean;
|
|
21
|
+
onOpenChange?: (open: boolean) => void;
|
|
22
|
+
}): React$1.JSX.Element;
|
|
23
|
+
declare function Sidebar({ side, variant, collapsible, className, children, dir, ...props }: React$1.ComponentProps<"div"> & {
|
|
24
|
+
side?: "left" | "right";
|
|
25
|
+
variant?: "sidebar" | "floating" | "inset";
|
|
26
|
+
collapsible?: "offcanvas" | "icon" | "none";
|
|
27
|
+
}): React$1.JSX.Element;
|
|
28
|
+
declare function SidebarTrigger({ className, onClick, ...props }: React$1.ComponentProps<typeof Button>): React$1.JSX.Element;
|
|
29
|
+
declare function SidebarRail({ className, ...props }: React$1.ComponentProps<"button">): React$1.JSX.Element;
|
|
30
|
+
declare function SidebarInset({ className, ...props }: React$1.ComponentProps<"main">): React$1.JSX.Element;
|
|
31
|
+
declare function SidebarInput({ className, ...props }: React$1.ComponentProps<typeof Input>): React$1.JSX.Element;
|
|
32
|
+
declare function SidebarHeader({ className, ...props }: React$1.ComponentProps<"div">): React$1.JSX.Element;
|
|
33
|
+
declare function SidebarFooter({ className, ...props }: React$1.ComponentProps<"div">): React$1.JSX.Element;
|
|
34
|
+
declare function SidebarSeparator({ className, ...props }: React$1.ComponentProps<typeof Separator>): React$1.JSX.Element;
|
|
35
|
+
declare function SidebarContent({ className, ...props }: React$1.ComponentProps<"div">): React$1.JSX.Element;
|
|
36
|
+
declare function SidebarGroup({ className, ...props }: React$1.ComponentProps<"div">): React$1.JSX.Element;
|
|
37
|
+
declare function SidebarGroupLabel({ className, render, ...props }: useRender.ComponentProps<"div"> & React$1.ComponentProps<"div">): React$1.ReactElement<unknown, string | React$1.JSXElementConstructor<any>>;
|
|
38
|
+
declare function SidebarGroupAction({ className, render, ...props }: useRender.ComponentProps<"button"> & React$1.ComponentProps<"button">): React$1.ReactElement<unknown, string | React$1.JSXElementConstructor<any>>;
|
|
39
|
+
declare function SidebarGroupContent({ className, ...props }: React$1.ComponentProps<"div">): React$1.JSX.Element;
|
|
40
|
+
declare function SidebarMenu({ className, ...props }: React$1.ComponentProps<"ul">): React$1.JSX.Element;
|
|
41
|
+
declare function SidebarMenuItem({ className, ...props }: React$1.ComponentProps<"li">): React$1.JSX.Element;
|
|
42
|
+
declare const sidebarMenuButtonVariants: (props?: ({
|
|
43
|
+
variant?: "default" | "outline" | null | undefined;
|
|
44
|
+
size?: "default" | "lg" | "sm" | null | undefined;
|
|
45
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
46
|
+
declare function SidebarMenuButton({ render, isActive, variant, size, tooltip, className, ...props }: useRender.ComponentProps<"button"> & React$1.ComponentProps<"button"> & {
|
|
47
|
+
isActive?: boolean;
|
|
48
|
+
tooltip?: string | React$1.ComponentProps<typeof TooltipContent>;
|
|
49
|
+
} & VariantProps<typeof sidebarMenuButtonVariants>): React$1.JSX.Element;
|
|
50
|
+
declare function SidebarMenuAction({ className, render, showOnHover, ...props }: useRender.ComponentProps<"button"> & React$1.ComponentProps<"button"> & {
|
|
51
|
+
showOnHover?: boolean;
|
|
52
|
+
}): React$1.ReactElement<unknown, string | React$1.JSXElementConstructor<any>>;
|
|
53
|
+
declare function SidebarMenuBadge({ className, ...props }: React$1.ComponentProps<"div">): React$1.JSX.Element;
|
|
54
|
+
declare function SidebarMenuSub({ className, ...props }: React$1.ComponentProps<"ul">): React$1.JSX.Element;
|
|
55
|
+
declare function SidebarMenuSubItem({ className, ...props }: React$1.ComponentProps<"li">): React$1.JSX.Element;
|
|
56
|
+
declare function SidebarMenuSubButton({ render, size, isActive, className, ...props }: useRender.ComponentProps<"a"> & React$1.ComponentProps<"a"> & {
|
|
57
|
+
size?: "sm" | "md";
|
|
58
|
+
isActive?: boolean;
|
|
59
|
+
}): React$1.ReactElement<unknown, string | React$1.JSXElementConstructor<any>>;
|
|
60
|
+
export { Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, useSidebar };
|