@mesob/ui 0.0.2
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/accordion.d.ts +10 -0
- package/dist/components/accordion.js +74 -0
- package/dist/components/accordion.js.map +1 -0
- package/dist/components/alert-dialog.d.ts +17 -0
- package/dist/components/alert-dialog.js +187 -0
- package/dist/components/alert-dialog.js.map +1 -0
- package/dist/components/alert.d.ts +13 -0
- package/dist/components/alert.js +74 -0
- package/dist/components/alert.js.map +1 -0
- package/dist/components/animated-tabs.d.ts +26 -0
- package/dist/components/animated-tabs.js +290 -0
- package/dist/components/animated-tabs.js.map +1 -0
- package/dist/components/aspect-ratio.d.ts +6 -0
- package/dist/components/aspect-ratio.js +14 -0
- package/dist/components/aspect-ratio.js.map +1 -0
- package/dist/components/avatar.d.ts +9 -0
- package/dist/components/avatar.js +63 -0
- package/dist/components/avatar.js.map +1 -0
- package/dist/components/badge.d.ts +13 -0
- package/dist/components/badge.js +48 -0
- package/dist/components/badge.js.map +1 -0
- package/dist/components/breadcrumb.d.ts +14 -0
- package/dist/components/breadcrumb.js +110 -0
- package/dist/components/breadcrumb.js.map +1 -0
- package/dist/components/button-group.d.ts +17 -0
- package/dist/components/button-group.js +106 -0
- package/dist/components/button-group.js.map +1 -0
- package/dist/components/button.d.ts +14 -0
- package/dist/components/button.js +60 -0
- package/dist/components/button.js.map +1 -0
- package/dist/components/calendar.d.ts +13 -0
- package/dist/components/calendar.js +254 -0
- package/dist/components/calendar.js.map +1 -0
- package/dist/components/card.d.ts +12 -0
- package/dist/components/card.js +98 -0
- package/dist/components/card.js.map +1 -0
- package/dist/components/carousel.d.ts +24 -0
- package/dist/components/carousel.js +260 -0
- package/dist/components/carousel.js.map +1 -0
- package/dist/components/chart.d.ts +43 -0
- package/dist/components/chart.js +261 -0
- package/dist/components/chart.js.map +1 -0
- package/dist/components/checkbox.d.ts +7 -0
- package/dist/components/checkbox.js +41 -0
- package/dist/components/checkbox.js.map +1 -0
- package/dist/components/collapsible.d.ts +8 -0
- package/dist/components/collapsible.js +38 -0
- package/dist/components/collapsible.js.map +1 -0
- package/dist/components/command.d.ts +22 -0
- package/dist/components/command.js +281 -0
- package/dist/components/command.js.map +1 -0
- package/dist/components/context-menu.d.ts +28 -0
- package/dist/components/context-menu.js +233 -0
- package/dist/components/context-menu.js.map +1 -0
- package/dist/components/data-table/index.d.ts +46 -0
- package/dist/components/data-table/index.js +639 -0
- package/dist/components/data-table/index.js.map +1 -0
- package/dist/components/dialog.d.ts +18 -0
- package/dist/components/dialog.js +146 -0
- package/dist/components/dialog.js.map +1 -0
- package/dist/components/drawer.d.ts +16 -0
- package/dist/components/drawer.js +138 -0
- package/dist/components/drawer.js.map +1 -0
- package/dist/components/dropdown-menu.d.ts +28 -0
- package/dist/components/dropdown-menu.js +241 -0
- package/dist/components/dropdown-menu.js.map +1 -0
- package/dist/components/empty.d.ts +15 -0
- package/dist/components/empty.js +110 -0
- package/dist/components/empty.js.map +1 -0
- package/dist/components/entity/index.d.ts +160 -0
- package/dist/components/entity/index.js +1671 -0
- package/dist/components/entity/index.js.map +1 -0
- package/dist/components/field.d.ts +30 -0
- package/dist/components/field.js +279 -0
- package/dist/components/field.js.map +1 -0
- package/dist/components/form.d.ts +28 -0
- package/dist/components/form.js +150 -0
- package/dist/components/form.js.map +1 -0
- package/dist/components/hover-card.d.ts +9 -0
- package/dist/components/hover-card.js +48 -0
- package/dist/components/hover-card.js.map +1 -0
- package/dist/components/input-group.d.ts +20 -0
- package/dist/components/input-group.js +257 -0
- package/dist/components/input-group.js.map +1 -0
- package/dist/components/input-otp.d.ts +14 -0
- package/dist/components/input-otp.js +76 -0
- package/dist/components/input-otp.js.map +1 -0
- package/dist/components/input.d.ts +6 -0
- package/dist/components/input.js +29 -0
- package/dist/components/input.js.map +1 -0
- package/dist/components/item.d.ts +28 -0
- package/dist/components/item.js +220 -0
- package/dist/components/item.js.map +1 -0
- package/dist/components/jiret-logo.d.ts +13 -0
- package/dist/components/jiret-logo.js +80 -0
- package/dist/components/jiret-logo.js.map +1 -0
- package/dist/components/kbd.d.ts +6 -0
- package/dist/components/kbd.js +39 -0
- package/dist/components/kbd.js.map +1 -0
- package/dist/components/label.d.ts +7 -0
- package/dist/components/label.js +32 -0
- package/dist/components/label.js.map +1 -0
- package/dist/components/menubar.d.ts +29 -0
- package/dist/components/menubar.js +261 -0
- package/dist/components/menubar.js.map +1 -0
- package/dist/components/navigation-menu.d.ts +18 -0
- package/dist/components/navigation-menu.js +178 -0
- package/dist/components/navigation-menu.js.map +1 -0
- package/dist/components/pagination.d.ts +18 -0
- package/dist/components/pagination.js +160 -0
- package/dist/components/pagination.js.map +1 -0
- package/dist/components/popover.d.ts +10 -0
- package/dist/components/popover.js +54 -0
- package/dist/components/popover.js.map +1 -0
- package/dist/components/powered-by.d.ts +5 -0
- package/dist/components/powered-by.js +98 -0
- package/dist/components/powered-by.js.map +1 -0
- package/dist/components/progress.d.ts +7 -0
- package/dist/components/progress.js +41 -0
- package/dist/components/progress.js.map +1 -0
- package/dist/components/radio-group.d.ts +8 -0
- package/dist/components/radio-group.js +55 -0
- package/dist/components/radio-group.js.map +1 -0
- package/dist/components/resizable.d.ts +11 -0
- package/dist/components/resizable.js +58 -0
- package/dist/components/resizable.js.map +1 -0
- package/dist/components/scroll-area.d.ts +8 -0
- package/dist/components/scroll-area.js +70 -0
- package/dist/components/scroll-area.js.map +1 -0
- package/dist/components/section/index.d.ts +14 -0
- package/dist/components/section/index.js +139 -0
- package/dist/components/section/index.js.map +1 -0
- package/dist/components/select.d.ts +18 -0
- package/dist/components/select.js +181 -0
- package/dist/components/select.js.map +1 -0
- package/dist/components/separator.d.ts +7 -0
- package/dist/components/separator.js +36 -0
- package/dist/components/separator.js.map +1 -0
- package/dist/components/sheet.d.ts +16 -0
- package/dist/components/sheet.js +136 -0
- package/dist/components/sheet.js.map +1 -0
- package/dist/components/sidebar.d.ts +75 -0
- package/dist/components/sidebar.js +909 -0
- package/dist/components/sidebar.js.map +1 -0
- package/dist/components/skeleton.d.ts +5 -0
- package/dist/components/skeleton.js +23 -0
- package/dist/components/skeleton.js.map +1 -0
- package/dist/components/slider.d.ts +7 -0
- package/dist/components/slider.js +76 -0
- package/dist/components/slider.js.map +1 -0
- package/dist/components/sonner.d.ts +6 -0
- package/dist/components/sonner.js +41 -0
- package/dist/components/sonner.js.map +1 -0
- package/dist/components/spinner.d.ts +6 -0
- package/dist/components/spinner.js +28 -0
- package/dist/components/spinner.js.map +1 -0
- package/dist/components/spotlight-search.d.ts +25 -0
- package/dist/components/spotlight-search.js +387 -0
- package/dist/components/spotlight-search.js.map +1 -0
- package/dist/components/switch.d.ts +7 -0
- package/dist/components/switch.js +41 -0
- package/dist/components/switch.js.map +1 -0
- package/dist/components/table.d.ts +13 -0
- package/dist/components/table.js +124 -0
- package/dist/components/table.js.map +1 -0
- package/dist/components/tabs.d.ts +10 -0
- package/dist/components/tabs.js +77 -0
- package/dist/components/tabs.js.map +1 -0
- package/dist/components/textarea.d.ts +6 -0
- package/dist/components/textarea.js +26 -0
- package/dist/components/textarea.js.map +1 -0
- package/dist/components/theme-toggle.d.ts +8 -0
- package/dist/components/theme-toggle.js +86 -0
- package/dist/components/theme-toggle.js.map +1 -0
- package/dist/components/toggle-group.d.ts +14 -0
- package/dist/components/toggle-group.js +102 -0
- package/dist/components/toggle-group.js.map +1 -0
- package/dist/components/toggle.d.ts +13 -0
- package/dist/components/toggle.js +53 -0
- package/dist/components/toggle.js.map +1 -0
- package/dist/components/tooltip.d.ts +10 -0
- package/dist/components/tooltip.js +65 -0
- package/dist/components/tooltip.js.map +1 -0
- package/dist/hooks/use-mobile.d.ts +3 -0
- package/dist/hooks/use-mobile.js +22 -0
- package/dist/hooks/use-mobile.js.map +1 -0
- package/dist/index.d.ts +2 -0
- package/dist/index.js +10 -0
- package/dist/index.js.map +1 -0
- package/dist/lib/utils.d.ts +5 -0
- package/dist/lib/utils.js +10 -0
- package/dist/lib/utils.js.map +1 -0
- package/package.json +123 -0
- package/src/styles/globals.css +125 -0
|
@@ -0,0 +1,70 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
|
|
3
|
+
// src/lib/utils.ts
|
|
4
|
+
import { clsx } from "clsx";
|
|
5
|
+
import { twMerge } from "tailwind-merge";
|
|
6
|
+
function cn(...inputs) {
|
|
7
|
+
return twMerge(clsx(inputs));
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
// src/components/scroll-area.tsx
|
|
11
|
+
import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area";
|
|
12
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
13
|
+
function ScrollArea({
|
|
14
|
+
className,
|
|
15
|
+
children,
|
|
16
|
+
...props
|
|
17
|
+
}) {
|
|
18
|
+
return /* @__PURE__ */ jsxs(
|
|
19
|
+
ScrollAreaPrimitive.Root,
|
|
20
|
+
{
|
|
21
|
+
"data-slot": "scroll-area",
|
|
22
|
+
className: cn("relative", className),
|
|
23
|
+
...props,
|
|
24
|
+
children: [
|
|
25
|
+
/* @__PURE__ */ jsx(
|
|
26
|
+
ScrollAreaPrimitive.Viewport,
|
|
27
|
+
{
|
|
28
|
+
"data-slot": "scroll-area-viewport",
|
|
29
|
+
className: "focus-visible:ring-ring/50 size-full rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-[3px] focus-visible:outline-1",
|
|
30
|
+
children
|
|
31
|
+
}
|
|
32
|
+
),
|
|
33
|
+
/* @__PURE__ */ jsx(ScrollBar, {}),
|
|
34
|
+
/* @__PURE__ */ jsx(ScrollAreaPrimitive.Corner, {})
|
|
35
|
+
]
|
|
36
|
+
}
|
|
37
|
+
);
|
|
38
|
+
}
|
|
39
|
+
function ScrollBar({
|
|
40
|
+
className,
|
|
41
|
+
orientation = "vertical",
|
|
42
|
+
...props
|
|
43
|
+
}) {
|
|
44
|
+
return /* @__PURE__ */ jsx(
|
|
45
|
+
ScrollAreaPrimitive.ScrollAreaScrollbar,
|
|
46
|
+
{
|
|
47
|
+
"data-slot": "scroll-area-scrollbar",
|
|
48
|
+
orientation,
|
|
49
|
+
className: cn(
|
|
50
|
+
"flex touch-none p-px transition-colors select-none",
|
|
51
|
+
orientation === "vertical" && "h-full w-2.5 border-l border-l-transparent",
|
|
52
|
+
orientation === "horizontal" && "h-2.5 flex-col border-t border-t-transparent",
|
|
53
|
+
className
|
|
54
|
+
),
|
|
55
|
+
...props,
|
|
56
|
+
children: /* @__PURE__ */ jsx(
|
|
57
|
+
ScrollAreaPrimitive.ScrollAreaThumb,
|
|
58
|
+
{
|
|
59
|
+
"data-slot": "scroll-area-thumb",
|
|
60
|
+
className: "bg-border relative flex-1 rounded-full"
|
|
61
|
+
}
|
|
62
|
+
)
|
|
63
|
+
}
|
|
64
|
+
);
|
|
65
|
+
}
|
|
66
|
+
export {
|
|
67
|
+
ScrollArea,
|
|
68
|
+
ScrollBar
|
|
69
|
+
};
|
|
70
|
+
//# sourceMappingURL=scroll-area.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/lib/utils.ts","../../src/components/scroll-area.tsx"],"sourcesContent":["import { type ClassValue, clsx } from 'clsx';\nimport { twMerge } from 'tailwind-merge';\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n","'use client';\n\nimport { cn } from '@mesob/ui/lib/utils';\nimport * as ScrollAreaPrimitive from '@radix-ui/react-scroll-area';\nimport type * as React from 'react';\n\nfunction ScrollArea({\n className,\n children,\n ...props\n}: React.ComponentProps<typeof ScrollAreaPrimitive.Root>) {\n return (\n <ScrollAreaPrimitive.Root\n data-slot=\"scroll-area\"\n className={cn('relative', className)}\n {...props}\n >\n <ScrollAreaPrimitive.Viewport\n data-slot=\"scroll-area-viewport\"\n className=\"focus-visible:ring-ring/50 size-full rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-[3px] focus-visible:outline-1\"\n >\n {children}\n </ScrollAreaPrimitive.Viewport>\n <ScrollBar />\n <ScrollAreaPrimitive.Corner />\n </ScrollAreaPrimitive.Root>\n );\n}\n\nfunction ScrollBar({\n className,\n orientation = 'vertical',\n ...props\n}: React.ComponentProps<typeof ScrollAreaPrimitive.ScrollAreaScrollbar>) {\n return (\n <ScrollAreaPrimitive.ScrollAreaScrollbar\n data-slot=\"scroll-area-scrollbar\"\n orientation={orientation}\n className={cn(\n 'flex touch-none p-px transition-colors select-none',\n orientation === 'vertical' &&\n 'h-full w-2.5 border-l border-l-transparent',\n orientation === 'horizontal' &&\n 'h-2.5 flex-col border-t border-t-transparent',\n className,\n )}\n {...props}\n >\n <ScrollAreaPrimitive.ScrollAreaThumb\n data-slot=\"scroll-area-thumb\"\n className=\"bg-border relative flex-1 rounded-full\"\n />\n </ScrollAreaPrimitive.ScrollAreaScrollbar>\n );\n}\n\nexport { ScrollArea, ScrollBar };\n"],"mappings":";;;AAAA,SAA0B,YAAY;AACtC,SAAS,eAAe;AAEjB,SAAS,MAAM,QAAsB;AAC1C,SAAO,QAAQ,KAAK,MAAM,CAAC;AAC7B;;;ACFA,YAAY,yBAAyB;AASjC,SAKE,KALF;AANJ,SAAS,WAAW;AAAA,EAClB;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAA0D;AACxD,SACE;AAAA,IAAqB;AAAA,IAApB;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,YAAY,SAAS;AAAA,MAClC,GAAG;AAAA,MAEJ;AAAA;AAAA,UAAqB;AAAA,UAApB;AAAA,YACC,aAAU;AAAA,YACV,WAAU;AAAA,YAET;AAAA;AAAA,QACH;AAAA,QACA,oBAAC,aAAU;AAAA,QACX,oBAAqB,4BAApB,EAA2B;AAAA;AAAA;AAAA,EAC9B;AAEJ;AAEA,SAAS,UAAU;AAAA,EACjB;AAAA,EACA,cAAc;AAAA,EACd,GAAG;AACL,GAAyE;AACvE,SACE;AAAA,IAAqB;AAAA,IAApB;AAAA,MACC,aAAU;AAAA,MACV;AAAA,MACA,WAAW;AAAA,QACT;AAAA,QACA,gBAAgB,cACd;AAAA,QACF,gBAAgB,gBACd;AAAA,QACF;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEJ;AAAA,QAAqB;AAAA,QAApB;AAAA,UACC,aAAU;AAAA,UACV,WAAU;AAAA;AAAA,MACZ;AAAA;AAAA,EACF;AAEJ;","names":[]}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import { ReactNode } from 'react';
|
|
3
|
+
|
|
4
|
+
type SectionProps = {
|
|
5
|
+
title: ReactNode;
|
|
6
|
+
children: ReactNode;
|
|
7
|
+
defaultOpen?: boolean;
|
|
8
|
+
className?: string;
|
|
9
|
+
headerClassName?: string;
|
|
10
|
+
contentClassName?: string;
|
|
11
|
+
};
|
|
12
|
+
declare function Section({ title, children, defaultOpen, className, headerClassName, contentClassName, }: SectionProps): react_jsx_runtime.JSX.Element;
|
|
13
|
+
|
|
14
|
+
export { Section };
|
|
@@ -0,0 +1,139 @@
|
|
|
1
|
+
// src/lib/utils.ts
|
|
2
|
+
import { clsx } from "clsx";
|
|
3
|
+
import { twMerge } from "tailwind-merge";
|
|
4
|
+
function cn(...inputs) {
|
|
5
|
+
return twMerge(clsx(inputs));
|
|
6
|
+
}
|
|
7
|
+
|
|
8
|
+
// src/components/section/section.tsx
|
|
9
|
+
import { useState } from "react";
|
|
10
|
+
|
|
11
|
+
// src/components/button.tsx
|
|
12
|
+
import { Slot } from "@radix-ui/react-slot";
|
|
13
|
+
import { cva } from "class-variance-authority";
|
|
14
|
+
import { jsx } from "react/jsx-runtime";
|
|
15
|
+
var buttonVariants = cva(
|
|
16
|
+
"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
|
|
17
|
+
{
|
|
18
|
+
variants: {
|
|
19
|
+
variant: {
|
|
20
|
+
default: "bg-primary text-primary-foreground hover:bg-primary/90",
|
|
21
|
+
destructive: "bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
|
|
22
|
+
outline: "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
|
|
23
|
+
secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
|
|
24
|
+
ghost: "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
|
|
25
|
+
link: "text-primary underline-offset-4 hover:underline"
|
|
26
|
+
},
|
|
27
|
+
size: {
|
|
28
|
+
default: "h-9 px-4 py-2 has-[>svg]:px-3",
|
|
29
|
+
sm: "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",
|
|
30
|
+
lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
|
|
31
|
+
icon: "size-9",
|
|
32
|
+
"icon-sm": "size-8",
|
|
33
|
+
"icon-lg": "size-10"
|
|
34
|
+
}
|
|
35
|
+
},
|
|
36
|
+
defaultVariants: {
|
|
37
|
+
variant: "default",
|
|
38
|
+
size: "default"
|
|
39
|
+
}
|
|
40
|
+
}
|
|
41
|
+
);
|
|
42
|
+
function Button({
|
|
43
|
+
className,
|
|
44
|
+
variant,
|
|
45
|
+
size,
|
|
46
|
+
asChild = false,
|
|
47
|
+
...props
|
|
48
|
+
}) {
|
|
49
|
+
const Comp = asChild ? Slot : "button";
|
|
50
|
+
return /* @__PURE__ */ jsx(
|
|
51
|
+
Comp,
|
|
52
|
+
{
|
|
53
|
+
"data-slot": "button",
|
|
54
|
+
className: cn(buttonVariants({ variant, size, className })),
|
|
55
|
+
...props
|
|
56
|
+
}
|
|
57
|
+
);
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
// src/components/card.tsx
|
|
61
|
+
import { jsx as jsx2 } from "react/jsx-runtime";
|
|
62
|
+
function Card({ className, ...props }) {
|
|
63
|
+
return /* @__PURE__ */ jsx2(
|
|
64
|
+
"div",
|
|
65
|
+
{
|
|
66
|
+
"data-slot": "card",
|
|
67
|
+
className: cn(
|
|
68
|
+
"bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 ",
|
|
69
|
+
className
|
|
70
|
+
),
|
|
71
|
+
...props
|
|
72
|
+
}
|
|
73
|
+
);
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
// src/components/collapsible.tsx
|
|
77
|
+
import * as CollapsiblePrimitive from "@radix-ui/react-collapsible";
|
|
78
|
+
import { jsx as jsx3 } from "react/jsx-runtime";
|
|
79
|
+
function Collapsible({
|
|
80
|
+
...props
|
|
81
|
+
}) {
|
|
82
|
+
return /* @__PURE__ */ jsx3(CollapsiblePrimitive.Root, { "data-slot": "collapsible", ...props });
|
|
83
|
+
}
|
|
84
|
+
function CollapsibleTrigger2({
|
|
85
|
+
...props
|
|
86
|
+
}) {
|
|
87
|
+
return /* @__PURE__ */ jsx3(
|
|
88
|
+
CollapsiblePrimitive.CollapsibleTrigger,
|
|
89
|
+
{
|
|
90
|
+
"data-slot": "collapsible-trigger",
|
|
91
|
+
...props
|
|
92
|
+
}
|
|
93
|
+
);
|
|
94
|
+
}
|
|
95
|
+
function CollapsibleContent2({
|
|
96
|
+
...props
|
|
97
|
+
}) {
|
|
98
|
+
return /* @__PURE__ */ jsx3(
|
|
99
|
+
CollapsiblePrimitive.CollapsibleContent,
|
|
100
|
+
{
|
|
101
|
+
"data-slot": "collapsible-content",
|
|
102
|
+
...props
|
|
103
|
+
}
|
|
104
|
+
);
|
|
105
|
+
}
|
|
106
|
+
|
|
107
|
+
// src/components/section/section.tsx
|
|
108
|
+
import { jsx as jsx4, jsxs } from "react/jsx-runtime";
|
|
109
|
+
function Section({
|
|
110
|
+
title,
|
|
111
|
+
children,
|
|
112
|
+
defaultOpen = false,
|
|
113
|
+
className,
|
|
114
|
+
headerClassName,
|
|
115
|
+
contentClassName
|
|
116
|
+
}) {
|
|
117
|
+
const [open, setOpen] = useState(defaultOpen);
|
|
118
|
+
return /* @__PURE__ */ jsx4(Collapsible, { open, onOpenChange: setOpen, children: /* @__PURE__ */ jsxs(Card, { className: cn("gap-0 p-0", className), children: [
|
|
119
|
+
/* @__PURE__ */ jsxs(
|
|
120
|
+
"div",
|
|
121
|
+
{
|
|
122
|
+
className: cn(
|
|
123
|
+
"flex items-center justify-between gap-2 p-4",
|
|
124
|
+
open && "border-b",
|
|
125
|
+
headerClassName
|
|
126
|
+
),
|
|
127
|
+
children: [
|
|
128
|
+
/* @__PURE__ */ jsx4("div", { className: "text-lg font-semibold", children: title }),
|
|
129
|
+
/* @__PURE__ */ jsx4(CollapsibleTrigger2, { asChild: true, children: /* @__PURE__ */ jsx4(Button, { variant: "outline", size: "sm", children: open ? "Collapse" : "Expand" }) })
|
|
130
|
+
]
|
|
131
|
+
}
|
|
132
|
+
),
|
|
133
|
+
open && /* @__PURE__ */ jsx4(CollapsibleContent2, { className: "overflow-hidden", children: /* @__PURE__ */ jsx4("div", { className: cn("p-4", contentClassName), children }) })
|
|
134
|
+
] }) });
|
|
135
|
+
}
|
|
136
|
+
export {
|
|
137
|
+
Section
|
|
138
|
+
};
|
|
139
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/lib/utils.ts","../../../src/components/section/section.tsx","../../../src/components/button.tsx","../../../src/components/card.tsx","../../../src/components/collapsible.tsx"],"sourcesContent":["import { type ClassValue, clsx } from 'clsx';\nimport { twMerge } from 'tailwind-merge';\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n","'use client';\n\nimport { cn } from '@mesob/ui/lib/utils';\nimport type { ReactNode } from 'react';\nimport { useState } from 'react';\nimport { Button } from '../button';\nimport { Card } from '../card';\nimport {\n Collapsible,\n CollapsibleContent,\n CollapsibleTrigger,\n} from '../collapsible';\n\ntype SectionProps = {\n title: ReactNode;\n children: ReactNode;\n defaultOpen?: boolean;\n className?: string;\n headerClassName?: string;\n contentClassName?: string;\n};\n\nexport function Section({\n title,\n children,\n defaultOpen = false,\n className,\n headerClassName,\n contentClassName,\n}: SectionProps) {\n const [open, setOpen] = useState(defaultOpen);\n\n return (\n <Collapsible open={open} onOpenChange={setOpen}>\n <Card className={cn('gap-0 p-0', className)}>\n <div\n className={cn(\n 'flex items-center justify-between gap-2 p-4',\n open && 'border-b',\n\n headerClassName,\n )}\n >\n <div className=\"text-lg font-semibold\">{title}</div>\n <CollapsibleTrigger asChild>\n <Button variant=\"outline\" size=\"sm\">\n {open ? 'Collapse' : 'Expand'}\n </Button>\n </CollapsibleTrigger>\n </div>\n {open && (\n <CollapsibleContent className=\"overflow-hidden\">\n <div className={cn('p-4', contentClassName)}>{children}</div>\n </CollapsibleContent>\n )}\n </Card>\n </Collapsible>\n );\n}\n","import { cn } from '@mesob/ui/lib/utils';\nimport { Slot } from '@radix-ui/react-slot';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport type * as React from 'react';\n\nconst buttonVariants = cva(\n \"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive\",\n {\n variants: {\n variant: {\n default: 'bg-primary text-primary-foreground hover:bg-primary/90',\n destructive:\n 'bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60',\n outline:\n 'border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50',\n secondary:\n 'bg-secondary text-secondary-foreground hover:bg-secondary/80',\n ghost:\n 'hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50',\n link: 'text-primary underline-offset-4 hover:underline',\n },\n size: {\n default: 'h-9 px-4 py-2 has-[>svg]:px-3',\n sm: 'h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5',\n lg: 'h-10 rounded-md px-6 has-[>svg]:px-4',\n icon: 'size-9',\n 'icon-sm': 'size-8',\n 'icon-lg': 'size-10',\n },\n },\n defaultVariants: {\n variant: 'default',\n size: 'default',\n },\n },\n);\n\nfunction Button({\n className,\n variant,\n size,\n asChild = false,\n ...props\n}: React.ComponentProps<'button'> &\n VariantProps<typeof buttonVariants> & {\n asChild?: boolean;\n }) {\n const Comp = asChild ? Slot : 'button';\n\n return (\n <Comp\n data-slot=\"button\"\n className={cn(buttonVariants({ variant, size, className }))}\n {...props}\n />\n );\n}\n\nexport { Button, buttonVariants };\n","import { cn } from '@mesob/ui/lib/utils';\nimport type * as React from 'react';\n\nfunction Card({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"card\"\n className={cn(\n 'bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 ',\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction CardHeader({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"card-header\"\n className={cn(\n '@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-2 px-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6',\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction CardTitle({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"card-title\"\n className={cn('leading-none font-semibold', className)}\n {...props}\n />\n );\n}\n\nfunction CardDescription({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"card-description\"\n className={cn('text-muted-foreground text-sm', className)}\n {...props}\n />\n );\n}\n\nfunction CardAction({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"card-action\"\n className={cn(\n 'col-start-2 row-span-2 row-start-1 self-start justify-self-end',\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction CardContent({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"card-content\"\n className={cn('px-6', className)}\n {...props}\n />\n );\n}\n\nfunction CardFooter({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"card-footer\"\n className={cn('flex items-center px-6 [.border-t]:pt-6', className)}\n {...props}\n />\n );\n}\n\nexport {\n Card,\n CardHeader,\n CardFooter,\n CardTitle,\n CardAction,\n CardDescription,\n CardContent,\n};\n","'use client';\n\nimport * as CollapsiblePrimitive from '@radix-ui/react-collapsible';\n\nfunction Collapsible({\n ...props\n}: React.ComponentProps<typeof CollapsiblePrimitive.Root>) {\n return <CollapsiblePrimitive.Root data-slot=\"collapsible\" {...props} />;\n}\n\nfunction CollapsibleTrigger({\n ...props\n}: React.ComponentProps<typeof CollapsiblePrimitive.CollapsibleTrigger>) {\n return (\n <CollapsiblePrimitive.CollapsibleTrigger\n data-slot=\"collapsible-trigger\"\n {...props}\n />\n );\n}\n\nfunction CollapsibleContent({\n ...props\n}: React.ComponentProps<typeof CollapsiblePrimitive.CollapsibleContent>) {\n return (\n <CollapsiblePrimitive.CollapsibleContent\n data-slot=\"collapsible-content\"\n {...props}\n />\n );\n}\n\nexport { Collapsible, CollapsibleTrigger, CollapsibleContent };\n"],"mappings":";AAAA,SAA0B,YAAY;AACtC,SAAS,eAAe;AAEjB,SAAS,MAAM,QAAsB;AAC1C,SAAO,QAAQ,KAAK,MAAM,CAAC;AAC7B;;;ACDA,SAAS,gBAAgB;;;ACHzB,SAAS,YAAY;AACrB,SAAS,WAA8B;AAgDnC;AA7CJ,IAAM,iBAAiB;AAAA,EACrB;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,SAAS;AAAA,QACP,SAAS;AAAA,QACT,aACE;AAAA,QACF,SACE;AAAA,QACF,WACE;AAAA,QACF,OACE;AAAA,QACF,MAAM;AAAA,MACR;AAAA,MACA,MAAM;AAAA,QACJ,SAAS;AAAA,QACT,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,MAAM;AAAA,QACN,WAAW;AAAA,QACX,WAAW;AAAA,MACb;AAAA,IACF;AAAA,IACA,iBAAiB;AAAA,MACf,SAAS;AAAA,MACT,MAAM;AAAA,IACR;AAAA,EACF;AACF;AAEA,SAAS,OAAO;AAAA,EACd;AAAA,EACA;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV,GAAG;AACL,GAGK;AACH,QAAM,OAAO,UAAU,OAAO;AAE9B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,eAAe,EAAE,SAAS,MAAM,UAAU,CAAC,CAAC;AAAA,MACzD,GAAG;AAAA;AAAA,EACN;AAEJ;;;ACnDI,gBAAAA,YAAA;AAFJ,SAAS,KAAK,EAAE,WAAW,GAAG,MAAM,GAAgC;AAClE,SACE,gBAAAA;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA;AAAA,EACN;AAEJ;;;ACZA,YAAY,0BAA0B;AAK7B,gBAAAC,YAAA;AAHT,SAAS,YAAY;AAAA,EACnB,GAAG;AACL,GAA2D;AACzD,SAAO,gBAAAA,KAAsB,2BAArB,EAA0B,aAAU,eAAe,GAAG,OAAO;AACvE;AAEA,SAASC,oBAAmB;AAAA,EAC1B,GAAG;AACL,GAAyE;AACvE,SACE,gBAAAD;AAAA,IAAsB;AAAA,IAArB;AAAA,MACC,aAAU;AAAA,MACT,GAAG;AAAA;AAAA,EACN;AAEJ;AAEA,SAASE,oBAAmB;AAAA,EAC1B,GAAG;AACL,GAAyE;AACvE,SACE,gBAAAF;AAAA,IAAsB;AAAA,IAArB;AAAA,MACC,aAAU;AAAA,MACT,GAAG;AAAA;AAAA,EACN;AAEJ;;;AHKQ,SAQE,OAAAG,MARF;AAbD,SAAS,QAAQ;AAAA,EACtB;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd;AAAA,EACA;AAAA,EACA;AACF,GAAiB;AACf,QAAM,CAAC,MAAM,OAAO,IAAI,SAAS,WAAW;AAE5C,SACE,gBAAAA,KAAC,eAAY,MAAY,cAAc,SACrC,+BAAC,QAAK,WAAW,GAAG,aAAa,SAAS,GACxC;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,WAAW;AAAA,UACT;AAAA,UACA,QAAQ;AAAA,UAER;AAAA,QACF;AAAA,QAEA;AAAA,0BAAAA,KAAC,SAAI,WAAU,yBAAyB,iBAAM;AAAA,UAC9C,gBAAAA,KAACC,qBAAA,EAAmB,SAAO,MACzB,0BAAAD,KAAC,UAAO,SAAQ,WAAU,MAAK,MAC5B,iBAAO,aAAa,UACvB,GACF;AAAA;AAAA;AAAA,IACF;AAAA,IACC,QACC,gBAAAA,KAACE,qBAAA,EAAmB,WAAU,mBAC5B,0BAAAF,KAAC,SAAI,WAAW,GAAG,OAAO,gBAAgB,GAAI,UAAS,GACzD;AAAA,KAEJ,GACF;AAEJ;","names":["jsx","jsx","CollapsibleTrigger","CollapsibleContent","jsx","CollapsibleTrigger","CollapsibleContent"]}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import * as SelectPrimitive from '@radix-ui/react-select';
|
|
3
|
+
import * as React from 'react';
|
|
4
|
+
|
|
5
|
+
declare function Select({ ...props }: React.ComponentProps<typeof SelectPrimitive.Root>): react_jsx_runtime.JSX.Element;
|
|
6
|
+
declare function SelectGroup({ ...props }: React.ComponentProps<typeof SelectPrimitive.Group>): react_jsx_runtime.JSX.Element;
|
|
7
|
+
declare function SelectValue({ ...props }: React.ComponentProps<typeof SelectPrimitive.Value>): react_jsx_runtime.JSX.Element;
|
|
8
|
+
declare function SelectTrigger({ className, size, children, ...props }: React.ComponentProps<typeof SelectPrimitive.Trigger> & {
|
|
9
|
+
size?: 'sm' | 'default';
|
|
10
|
+
}): react_jsx_runtime.JSX.Element;
|
|
11
|
+
declare function SelectContent({ className, children, position, align, ...props }: React.ComponentProps<typeof SelectPrimitive.Content>): react_jsx_runtime.JSX.Element;
|
|
12
|
+
declare function SelectLabel({ className, ...props }: React.ComponentProps<typeof SelectPrimitive.Label>): react_jsx_runtime.JSX.Element;
|
|
13
|
+
declare function SelectItem({ className, children, ...props }: React.ComponentProps<typeof SelectPrimitive.Item>): react_jsx_runtime.JSX.Element;
|
|
14
|
+
declare function SelectSeparator({ className, ...props }: React.ComponentProps<typeof SelectPrimitive.Separator>): react_jsx_runtime.JSX.Element;
|
|
15
|
+
declare function SelectScrollUpButton({ className, ...props }: React.ComponentProps<typeof SelectPrimitive.ScrollUpButton>): react_jsx_runtime.JSX.Element;
|
|
16
|
+
declare function SelectScrollDownButton({ className, ...props }: React.ComponentProps<typeof SelectPrimitive.ScrollDownButton>): react_jsx_runtime.JSX.Element;
|
|
17
|
+
|
|
18
|
+
export { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue };
|
|
@@ -0,0 +1,181 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
|
|
3
|
+
// src/lib/utils.ts
|
|
4
|
+
import { clsx } from "clsx";
|
|
5
|
+
import { twMerge } from "tailwind-merge";
|
|
6
|
+
function cn(...inputs) {
|
|
7
|
+
return twMerge(clsx(inputs));
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
// src/components/select.tsx
|
|
11
|
+
import * as SelectPrimitive from "@radix-ui/react-select";
|
|
12
|
+
import { IconCheck, IconChevronDown, IconChevronUp } from "@tabler/icons-react";
|
|
13
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
14
|
+
function Select({
|
|
15
|
+
...props
|
|
16
|
+
}) {
|
|
17
|
+
return /* @__PURE__ */ jsx(SelectPrimitive.Root, { "data-slot": "select", ...props });
|
|
18
|
+
}
|
|
19
|
+
function SelectGroup({
|
|
20
|
+
...props
|
|
21
|
+
}) {
|
|
22
|
+
return /* @__PURE__ */ jsx(SelectPrimitive.Group, { "data-slot": "select-group", ...props });
|
|
23
|
+
}
|
|
24
|
+
function SelectValue({
|
|
25
|
+
...props
|
|
26
|
+
}) {
|
|
27
|
+
return /* @__PURE__ */ jsx(SelectPrimitive.Value, { "data-slot": "select-value", ...props });
|
|
28
|
+
}
|
|
29
|
+
function SelectTrigger({
|
|
30
|
+
className,
|
|
31
|
+
size = "default",
|
|
32
|
+
children,
|
|
33
|
+
...props
|
|
34
|
+
}) {
|
|
35
|
+
return /* @__PURE__ */ jsxs(
|
|
36
|
+
SelectPrimitive.Trigger,
|
|
37
|
+
{
|
|
38
|
+
"data-slot": "select-trigger",
|
|
39
|
+
"data-size": size,
|
|
40
|
+
className: cn(
|
|
41
|
+
"border-input data-[placeholder]:text-muted-foreground [&_svg:not([class*='text-'])]:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 dark:hover:bg-input/50 flex w-fit items-center justify-between gap-2 rounded-md border bg-transparent px-3 py-2 text-sm whitespace-nowrap shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 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-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
|
|
42
|
+
className
|
|
43
|
+
),
|
|
44
|
+
...props,
|
|
45
|
+
children: [
|
|
46
|
+
children,
|
|
47
|
+
/* @__PURE__ */ jsx(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ jsx(IconChevronDown, { className: "size-4 opacity-50" }) })
|
|
48
|
+
]
|
|
49
|
+
}
|
|
50
|
+
);
|
|
51
|
+
}
|
|
52
|
+
function SelectContent({
|
|
53
|
+
className,
|
|
54
|
+
children,
|
|
55
|
+
position = "popper",
|
|
56
|
+
align = "center",
|
|
57
|
+
...props
|
|
58
|
+
}) {
|
|
59
|
+
return /* @__PURE__ */ jsx(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsxs(
|
|
60
|
+
SelectPrimitive.Content,
|
|
61
|
+
{
|
|
62
|
+
"data-slot": "select-content",
|
|
63
|
+
className: cn(
|
|
64
|
+
"bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-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 relative z-50 max-h-(--radix-select-content-available-height) min-w-[8rem] origin-(--radix-select-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border shadow-md",
|
|
65
|
+
position === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
|
|
66
|
+
className
|
|
67
|
+
),
|
|
68
|
+
position,
|
|
69
|
+
align,
|
|
70
|
+
...props,
|
|
71
|
+
children: [
|
|
72
|
+
/* @__PURE__ */ jsx(SelectScrollUpButton, {}),
|
|
73
|
+
/* @__PURE__ */ jsx(
|
|
74
|
+
SelectPrimitive.Viewport,
|
|
75
|
+
{
|
|
76
|
+
className: cn(
|
|
77
|
+
"p-1",
|
|
78
|
+
position === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)] scroll-my-1"
|
|
79
|
+
),
|
|
80
|
+
children
|
|
81
|
+
}
|
|
82
|
+
),
|
|
83
|
+
/* @__PURE__ */ jsx(SelectScrollDownButton, {})
|
|
84
|
+
]
|
|
85
|
+
}
|
|
86
|
+
) });
|
|
87
|
+
}
|
|
88
|
+
function SelectLabel({
|
|
89
|
+
className,
|
|
90
|
+
...props
|
|
91
|
+
}) {
|
|
92
|
+
return /* @__PURE__ */ jsx(
|
|
93
|
+
SelectPrimitive.Label,
|
|
94
|
+
{
|
|
95
|
+
"data-slot": "select-label",
|
|
96
|
+
className: cn("text-muted-foreground px-2 py-1.5 text-xs", className),
|
|
97
|
+
...props
|
|
98
|
+
}
|
|
99
|
+
);
|
|
100
|
+
}
|
|
101
|
+
function SelectItem({
|
|
102
|
+
className,
|
|
103
|
+
children,
|
|
104
|
+
...props
|
|
105
|
+
}) {
|
|
106
|
+
return /* @__PURE__ */ jsxs(
|
|
107
|
+
SelectPrimitive.Item,
|
|
108
|
+
{
|
|
109
|
+
"data-slot": "select-item",
|
|
110
|
+
className: cn(
|
|
111
|
+
"focus:bg-accent focus:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground 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 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",
|
|
112
|
+
className
|
|
113
|
+
),
|
|
114
|
+
...props,
|
|
115
|
+
children: [
|
|
116
|
+
/* @__PURE__ */ jsx("span", { className: "absolute right-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ jsx(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx(IconCheck, { className: "size-4" }) }) }),
|
|
117
|
+
/* @__PURE__ */ jsx(SelectPrimitive.ItemText, { children })
|
|
118
|
+
]
|
|
119
|
+
}
|
|
120
|
+
);
|
|
121
|
+
}
|
|
122
|
+
function SelectSeparator({
|
|
123
|
+
className,
|
|
124
|
+
...props
|
|
125
|
+
}) {
|
|
126
|
+
return /* @__PURE__ */ jsx(
|
|
127
|
+
SelectPrimitive.Separator,
|
|
128
|
+
{
|
|
129
|
+
"data-slot": "select-separator",
|
|
130
|
+
className: cn("bg-border pointer-events-none -mx-1 my-1 h-px", className),
|
|
131
|
+
...props
|
|
132
|
+
}
|
|
133
|
+
);
|
|
134
|
+
}
|
|
135
|
+
function SelectScrollUpButton({
|
|
136
|
+
className,
|
|
137
|
+
...props
|
|
138
|
+
}) {
|
|
139
|
+
return /* @__PURE__ */ jsx(
|
|
140
|
+
SelectPrimitive.ScrollUpButton,
|
|
141
|
+
{
|
|
142
|
+
"data-slot": "select-scroll-up-button",
|
|
143
|
+
className: cn(
|
|
144
|
+
"flex cursor-default items-center justify-center py-1",
|
|
145
|
+
className
|
|
146
|
+
),
|
|
147
|
+
...props,
|
|
148
|
+
children: /* @__PURE__ */ jsx(IconChevronUp, { className: "size-4" })
|
|
149
|
+
}
|
|
150
|
+
);
|
|
151
|
+
}
|
|
152
|
+
function SelectScrollDownButton({
|
|
153
|
+
className,
|
|
154
|
+
...props
|
|
155
|
+
}) {
|
|
156
|
+
return /* @__PURE__ */ jsx(
|
|
157
|
+
SelectPrimitive.ScrollDownButton,
|
|
158
|
+
{
|
|
159
|
+
"data-slot": "select-scroll-down-button",
|
|
160
|
+
className: cn(
|
|
161
|
+
"flex cursor-default items-center justify-center py-1",
|
|
162
|
+
className
|
|
163
|
+
),
|
|
164
|
+
...props,
|
|
165
|
+
children: /* @__PURE__ */ jsx(IconChevronDown, { className: "size-4" })
|
|
166
|
+
}
|
|
167
|
+
);
|
|
168
|
+
}
|
|
169
|
+
export {
|
|
170
|
+
Select,
|
|
171
|
+
SelectContent,
|
|
172
|
+
SelectGroup,
|
|
173
|
+
SelectItem,
|
|
174
|
+
SelectLabel,
|
|
175
|
+
SelectScrollDownButton,
|
|
176
|
+
SelectScrollUpButton,
|
|
177
|
+
SelectSeparator,
|
|
178
|
+
SelectTrigger,
|
|
179
|
+
SelectValue
|
|
180
|
+
};
|
|
181
|
+
//# sourceMappingURL=select.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/lib/utils.ts","../../src/components/select.tsx"],"sourcesContent":["import { type ClassValue, clsx } from 'clsx';\nimport { twMerge } from 'tailwind-merge';\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n","'use client';\n\nimport { cn } from '@mesob/ui/lib/utils';\nimport * as SelectPrimitive from '@radix-ui/react-select';\nimport { IconCheck, IconChevronDown, IconChevronUp } from '@tabler/icons-react';\nimport type * as React from 'react';\n\nfunction Select({\n ...props\n}: React.ComponentProps<typeof SelectPrimitive.Root>) {\n return <SelectPrimitive.Root data-slot=\"select\" {...props} />;\n}\n\nfunction SelectGroup({\n ...props\n}: React.ComponentProps<typeof SelectPrimitive.Group>) {\n return <SelectPrimitive.Group data-slot=\"select-group\" {...props} />;\n}\n\nfunction SelectValue({\n ...props\n}: React.ComponentProps<typeof SelectPrimitive.Value>) {\n return <SelectPrimitive.Value data-slot=\"select-value\" {...props} />;\n}\n\nfunction SelectTrigger({\n className,\n size = 'default',\n children,\n ...props\n}: React.ComponentProps<typeof SelectPrimitive.Trigger> & {\n size?: 'sm' | 'default';\n}) {\n return (\n <SelectPrimitive.Trigger\n data-slot=\"select-trigger\"\n data-size={size}\n className={cn(\n \"border-input data-[placeholder]:text-muted-foreground [&_svg:not([class*='text-'])]:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 dark:hover:bg-input/50 flex w-fit items-center justify-between gap-2 rounded-md border bg-transparent px-3 py-2 text-sm whitespace-nowrap shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 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-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className,\n )}\n {...props}\n >\n {children}\n <SelectPrimitive.Icon asChild>\n <IconChevronDown className=\"size-4 opacity-50\" />\n </SelectPrimitive.Icon>\n </SelectPrimitive.Trigger>\n );\n}\n\nfunction SelectContent({\n className,\n children,\n position = 'popper',\n align = 'center',\n ...props\n}: React.ComponentProps<typeof SelectPrimitive.Content>) {\n return (\n <SelectPrimitive.Portal>\n <SelectPrimitive.Content\n data-slot=\"select-content\"\n className={cn(\n 'bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-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 relative z-50 max-h-(--radix-select-content-available-height) min-w-[8rem] origin-(--radix-select-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border shadow-md',\n position === 'popper' &&\n 'data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1',\n className,\n )}\n position={position}\n align={align}\n {...props}\n >\n <SelectScrollUpButton />\n <SelectPrimitive.Viewport\n className={cn(\n 'p-1',\n position === 'popper' &&\n 'h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)] scroll-my-1',\n )}\n >\n {children}\n </SelectPrimitive.Viewport>\n <SelectScrollDownButton />\n </SelectPrimitive.Content>\n </SelectPrimitive.Portal>\n );\n}\n\nfunction SelectLabel({\n className,\n ...props\n}: React.ComponentProps<typeof SelectPrimitive.Label>) {\n return (\n <SelectPrimitive.Label\n data-slot=\"select-label\"\n className={cn('text-muted-foreground px-2 py-1.5 text-xs', className)}\n {...props}\n />\n );\n}\n\nfunction SelectItem({\n className,\n children,\n ...props\n}: React.ComponentProps<typeof SelectPrimitive.Item>) {\n return (\n <SelectPrimitive.Item\n data-slot=\"select-item\"\n className={cn(\n \"focus:bg-accent focus:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground 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 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\",\n className,\n )}\n {...props}\n >\n <span className=\"absolute right-2 flex size-3.5 items-center justify-center\">\n <SelectPrimitive.ItemIndicator>\n <IconCheck className=\"size-4\" />\n </SelectPrimitive.ItemIndicator>\n </span>\n <SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>\n </SelectPrimitive.Item>\n );\n}\n\nfunction SelectSeparator({\n className,\n ...props\n}: React.ComponentProps<typeof SelectPrimitive.Separator>) {\n return (\n <SelectPrimitive.Separator\n data-slot=\"select-separator\"\n className={cn('bg-border pointer-events-none -mx-1 my-1 h-px', className)}\n {...props}\n />\n );\n}\n\nfunction SelectScrollUpButton({\n className,\n ...props\n}: React.ComponentProps<typeof SelectPrimitive.ScrollUpButton>) {\n return (\n <SelectPrimitive.ScrollUpButton\n data-slot=\"select-scroll-up-button\"\n className={cn(\n 'flex cursor-default items-center justify-center py-1',\n className,\n )}\n {...props}\n >\n <IconChevronUp className=\"size-4\" />\n </SelectPrimitive.ScrollUpButton>\n );\n}\n\nfunction SelectScrollDownButton({\n className,\n ...props\n}: React.ComponentProps<typeof SelectPrimitive.ScrollDownButton>) {\n return (\n <SelectPrimitive.ScrollDownButton\n data-slot=\"select-scroll-down-button\"\n className={cn(\n 'flex cursor-default items-center justify-center py-1',\n className,\n )}\n {...props}\n >\n <IconChevronDown className=\"size-4\" />\n </SelectPrimitive.ScrollDownButton>\n );\n}\n\nexport {\n Select,\n SelectContent,\n SelectGroup,\n SelectItem,\n SelectLabel,\n SelectScrollDownButton,\n SelectScrollUpButton,\n SelectSeparator,\n SelectTrigger,\n SelectValue,\n};\n"],"mappings":"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","names":[]}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import * as SeparatorPrimitive from '@radix-ui/react-separator';
|
|
3
|
+
import * as React from 'react';
|
|
4
|
+
|
|
5
|
+
declare function Separator({ className, orientation, decorative, ...props }: React.ComponentProps<typeof SeparatorPrimitive.Root>): react_jsx_runtime.JSX.Element;
|
|
6
|
+
|
|
7
|
+
export { Separator };
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
|
|
3
|
+
// src/lib/utils.ts
|
|
4
|
+
import { clsx } from "clsx";
|
|
5
|
+
import { twMerge } from "tailwind-merge";
|
|
6
|
+
function cn(...inputs) {
|
|
7
|
+
return twMerge(clsx(inputs));
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
// src/components/separator.tsx
|
|
11
|
+
import * as SeparatorPrimitive from "@radix-ui/react-separator";
|
|
12
|
+
import { jsx } from "react/jsx-runtime";
|
|
13
|
+
function Separator({
|
|
14
|
+
className,
|
|
15
|
+
orientation = "horizontal",
|
|
16
|
+
decorative = true,
|
|
17
|
+
...props
|
|
18
|
+
}) {
|
|
19
|
+
return /* @__PURE__ */ jsx(
|
|
20
|
+
SeparatorPrimitive.Root,
|
|
21
|
+
{
|
|
22
|
+
"data-slot": "separator",
|
|
23
|
+
decorative,
|
|
24
|
+
orientation,
|
|
25
|
+
className: cn(
|
|
26
|
+
"bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px",
|
|
27
|
+
className
|
|
28
|
+
),
|
|
29
|
+
...props
|
|
30
|
+
}
|
|
31
|
+
);
|
|
32
|
+
}
|
|
33
|
+
export {
|
|
34
|
+
Separator
|
|
35
|
+
};
|
|
36
|
+
//# sourceMappingURL=separator.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/lib/utils.ts","../../src/components/separator.tsx"],"sourcesContent":["import { type ClassValue, clsx } from 'clsx';\nimport { twMerge } from 'tailwind-merge';\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n","'use client';\n\nimport { cn } from '@mesob/ui/lib/utils';\nimport * as SeparatorPrimitive from '@radix-ui/react-separator';\nimport type * as React from 'react';\n\nfunction Separator({\n className,\n orientation = 'horizontal',\n decorative = true,\n ...props\n}: React.ComponentProps<typeof SeparatorPrimitive.Root>) {\n return (\n <SeparatorPrimitive.Root\n data-slot=\"separator\"\n decorative={decorative}\n orientation={orientation}\n className={cn(\n 'bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px',\n className,\n )}\n {...props}\n />\n );\n}\n\nexport { Separator };\n"],"mappings":";;;AAAA,SAA0B,YAAY;AACtC,SAAS,eAAe;AAEjB,SAAS,MAAM,QAAsB;AAC1C,SAAO,QAAQ,KAAK,MAAM,CAAC;AAC7B;;;ACFA,YAAY,wBAAwB;AAUhC;AAPJ,SAAS,UAAU;AAAA,EACjB;AAAA,EACA,cAAc;AAAA,EACd,aAAa;AAAA,EACb,GAAG;AACL,GAAyD;AACvD,SACE;AAAA,IAAoB;AAAA,IAAnB;AAAA,MACC,aAAU;AAAA,MACV;AAAA,MACA;AAAA,MACA,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA;AAAA,EACN;AAEJ;","names":[]}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import * as DialogPrimitive from '@radix-ui/react-dialog';
|
|
3
|
+
import * as React from 'react';
|
|
4
|
+
|
|
5
|
+
declare function Sheet({ ...props }: React.ComponentProps<typeof DialogPrimitive.Root>): react_jsx_runtime.JSX.Element;
|
|
6
|
+
declare function SheetTrigger({ ...props }: React.ComponentProps<typeof DialogPrimitive.Trigger>): react_jsx_runtime.JSX.Element;
|
|
7
|
+
declare function SheetClose({ ...props }: React.ComponentProps<typeof DialogPrimitive.Close>): react_jsx_runtime.JSX.Element;
|
|
8
|
+
declare function SheetContent({ className, children, side, ...props }: React.ComponentProps<typeof DialogPrimitive.Content> & {
|
|
9
|
+
side?: 'top' | 'right' | 'bottom' | 'left';
|
|
10
|
+
}): react_jsx_runtime.JSX.Element;
|
|
11
|
+
declare function SheetHeader({ className, ...props }: React.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
12
|
+
declare function SheetFooter({ className, ...props }: React.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
13
|
+
declare function SheetTitle({ className, ...props }: React.ComponentProps<typeof DialogPrimitive.Title>): react_jsx_runtime.JSX.Element;
|
|
14
|
+
declare function SheetDescription({ className, ...props }: React.ComponentProps<typeof DialogPrimitive.Description>): react_jsx_runtime.JSX.Element;
|
|
15
|
+
|
|
16
|
+
export { Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger };
|