@moontra/moonui 2.4.6 → 2.4.8
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 +3 -0
- package/dist/index.d.ts +3 -0
- package/dist/index.global.js +37 -29
- package/dist/index.global.js.map +1 -1
- package/dist/index.js +10 -5
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +10 -5
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
- package/src/components/ui/tabs.tsx +13 -6
- package/src/components/ui/tags-input.tsx +1 -1
- package/src/styles/tailwind.css +20 -1
package/package.json
CHANGED
|
@@ -37,7 +37,7 @@ const tabsListVariants = cva(
|
|
|
37
37
|
variants: {
|
|
38
38
|
variant: {
|
|
39
39
|
default: "bg-muted rounded-md p-1 text-muted-foreground dark:bg-gray-800/80 dark:text-gray-400",
|
|
40
|
-
pills: "bg-transparent gap-2 p-0 dark:text-gray-400",
|
|
40
|
+
pills: "bg-transparent gap-2 p-0 dark:text-gray-400",
|
|
41
41
|
underline: "bg-transparent border-b border-border dark:border-gray-700 gap-4 dark:text-gray-400",
|
|
42
42
|
cards: "bg-transparent gap-2 p-0 dark:text-gray-400",
|
|
43
43
|
minimal: "bg-transparent gap-1 p-0 dark:text-gray-400",
|
|
@@ -48,30 +48,37 @@ const tabsListVariants = cva(
|
|
|
48
48
|
},
|
|
49
49
|
fullWidth: {
|
|
50
50
|
true: "w-full"
|
|
51
|
+
},
|
|
52
|
+
scrollable: {
|
|
53
|
+
true: "overflow-x-auto overflow-y-hidden flex-nowrap hide-scrollbar snap-x snap-mandatory",
|
|
54
|
+
false: "flex-wrap"
|
|
51
55
|
}
|
|
52
56
|
},
|
|
53
57
|
defaultVariants: {
|
|
54
58
|
variant: "default",
|
|
55
59
|
orientation: "horizontal",
|
|
56
|
-
fullWidth: false
|
|
60
|
+
fullWidth: false,
|
|
61
|
+
scrollable: false
|
|
57
62
|
}
|
|
58
63
|
}
|
|
59
64
|
);
|
|
60
65
|
|
|
61
|
-
interface TabsListProps
|
|
66
|
+
interface TabsListProps
|
|
62
67
|
extends React.ComponentPropsWithoutRef<typeof TabsPrimitive.List>,
|
|
63
68
|
VariantProps<typeof tabsListVariants> {
|
|
64
69
|
/** Dikey düzende göster */
|
|
65
70
|
orientation?: "horizontal" | "vertical";
|
|
71
|
+
/** Mobil için yatay scroll */
|
|
72
|
+
scrollable?: boolean;
|
|
66
73
|
}
|
|
67
74
|
|
|
68
75
|
const TabsList = React.forwardRef<
|
|
69
76
|
React.ElementRef<typeof TabsPrimitive.List>,
|
|
70
77
|
TabsListProps
|
|
71
|
-
>(({ className, variant, orientation, fullWidth, ...props }, ref) => (
|
|
78
|
+
>(({ className, variant, orientation, fullWidth, scrollable, ...props }, ref) => (
|
|
72
79
|
<TabsPrimitive.List
|
|
73
80
|
ref={ref}
|
|
74
|
-
className={cn("moonui-theme", tabsListVariants({ variant, orientation, fullWidth, className }))}
|
|
81
|
+
className={cn("moonui-theme", tabsListVariants({ variant, orientation, fullWidth, scrollable, className }))}
|
|
75
82
|
{...props}
|
|
76
83
|
/>
|
|
77
84
|
));
|
|
@@ -82,7 +89,7 @@ TabsList.displayName = TabsPrimitive.List.displayName;
|
|
|
82
89
|
* TabsTrigger
|
|
83
90
|
* -----------------------------------------------------------------------------------------------*/
|
|
84
91
|
const tabsTriggerVariants = cva(
|
|
85
|
-
"inline-flex items-center justify-center whitespace-nowrap font-medium ring-offset-background transition-all duration-200 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",
|
|
92
|
+
"inline-flex items-center justify-center whitespace-nowrap flex-shrink-0 font-medium ring-offset-background transition-all duration-200 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",
|
|
86
93
|
{
|
|
87
94
|
variants: {
|
|
88
95
|
variant: {
|
|
@@ -74,7 +74,7 @@ const TagsInput = React.forwardRef<HTMLInputElement, TagsInputProps>(
|
|
|
74
74
|
<div className="relative">
|
|
75
75
|
<div
|
|
76
76
|
className={cn(
|
|
77
|
-
"flex min-h-[2.5rem] w-full flex-wrap gap-2 rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background",
|
|
77
|
+
"flex items-center min-h-[2.5rem] w-full flex-wrap gap-2 rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background",
|
|
78
78
|
"dark:bg-zinc-950/50 dark:border-zinc-800",
|
|
79
79
|
"focus-within:outline-none focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2",
|
|
80
80
|
disabled && "cursor-not-allowed opacity-50",
|
package/src/styles/tailwind.css
CHANGED
|
@@ -1,7 +1,26 @@
|
|
|
1
|
-
/*
|
|
1
|
+
/*
|
|
2
2
|
* MoonUI Tailwind CSS
|
|
3
3
|
* NOT: Bu dosya artık tailwind direktiflerini içermiyor
|
|
4
4
|
* Ana proje zaten Tailwind kullandığı için çakışmayı önlemek amacıyla kaldırıldı
|
|
5
5
|
*/
|
|
6
6
|
|
|
7
7
|
/* Component-specific utility classes buraya eklenebilir */
|
|
8
|
+
|
|
9
|
+
/* Hide scrollbar utility - For scrollable tabs */
|
|
10
|
+
.hide-scrollbar::-webkit-scrollbar {
|
|
11
|
+
display: none;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
.hide-scrollbar {
|
|
15
|
+
-ms-overflow-style: none; /* IE and Edge */
|
|
16
|
+
scrollbar-width: none; /* Firefox */
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
/* Snap scroll utilities - For smooth tab scrolling */
|
|
20
|
+
.snap-x {
|
|
21
|
+
scroll-snap-type: x mandatory;
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
.snap-mandatory {
|
|
25
|
+
scroll-snap-align: start;
|
|
26
|
+
}
|