@starwind-ui/core 1.6.2 → 1.7.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.js +8 -4
- package/dist/index.js.map +1 -1
- package/dist/src/components/accordion/Accordion.astro +224 -224
- package/dist/src/components/accordion/AccordionContent.astro +13 -13
- package/dist/src/components/accordion/AccordionItem.astro +6 -6
- package/dist/src/components/accordion/AccordionTrigger.astro +13 -13
- package/dist/src/components/accordion/index.ts +4 -4
- package/dist/src/components/alert/Alert.astro +15 -15
- package/dist/src/components/alert/AlertDescription.astro +1 -1
- package/dist/src/components/alert/AlertTitle.astro +2 -2
- package/dist/src/components/alert/index.ts +3 -3
- package/dist/src/components/avatar/Avatar.astro +16 -16
- package/dist/src/components/avatar/AvatarFallback.astro +3 -3
- package/dist/src/components/avatar/AvatarImage.astro +12 -12
- package/dist/src/components/avatar/index.ts +4 -4
- package/dist/src/components/badge/Badge.astro +33 -33
- package/dist/src/components/breadcrumb/Breadcrumb.astro +1 -1
- package/dist/src/components/breadcrumb/BreadcrumbEllipsis.astro +6 -6
- package/dist/src/components/breadcrumb/BreadcrumbItem.astro +1 -1
- package/dist/src/components/breadcrumb/BreadcrumbLink.astro +8 -8
- package/dist/src/components/breadcrumb/BreadcrumbList.astro +2 -2
- package/dist/src/components/breadcrumb/BreadcrumbPage.astro +6 -6
- package/dist/src/components/breadcrumb/BreadcrumbSeparator.astro +7 -7
- package/dist/src/components/breadcrumb/index.ts +14 -14
- package/dist/src/components/button/Button.astro +38 -38
- package/dist/src/components/card/Card.astro +1 -1
- package/dist/src/components/card/CardContent.astro +1 -1
- package/dist/src/components/card/CardDescription.astro +1 -1
- package/dist/src/components/card/CardFooter.astro +1 -1
- package/dist/src/components/card/CardHeader.astro +1 -1
- package/dist/src/components/card/CardTitle.astro +1 -1
- package/dist/src/components/card/index.ts +7 -7
- package/dist/src/components/checkbox/Checkbox.astro +89 -89
- package/dist/src/components/dialog/Dialog.astro +237 -178
- package/dist/src/components/dialog/DialogClose.astro +14 -14
- package/dist/src/components/dialog/DialogContent.astro +32 -32
- package/dist/src/components/dialog/DialogDescription.astro +1 -1
- package/dist/src/components/dialog/DialogFooter.astro +1 -1
- package/dist/src/components/dialog/DialogHeader.astro +1 -1
- package/dist/src/components/dialog/DialogTitle.astro +6 -6
- package/dist/src/components/dialog/DialogTrigger.astro +26 -20
- package/dist/src/components/dialog/index.ts +16 -16
- package/dist/src/components/dropdown/Dropdown.astro +359 -359
- package/dist/src/components/dropdown/DropdownContent.astro +63 -63
- package/dist/src/components/dropdown/DropdownItem.astro +31 -31
- package/dist/src/components/dropdown/DropdownLabel.astro +14 -14
- package/dist/src/components/dropdown/DropdownSeparator.astro +5 -5
- package/dist/src/components/dropdown/DropdownTrigger.astro +26 -26
- package/dist/src/components/dropdown/index.ts +12 -12
- package/dist/src/components/dropzone/Dropzone.astro +232 -0
- package/dist/src/components/dropzone/DropzoneFilesList.astro +25 -0
- package/dist/src/components/dropzone/DropzoneLoadingIndicator.astro +10 -0
- package/dist/src/components/dropzone/DropzoneUploadIndicator.astro +10 -0
- package/dist/src/components/dropzone/index.ts +13 -0
- package/dist/src/components/input/Input.astro +12 -12
- package/dist/src/components/label/Label.astro +8 -8
- package/dist/src/components/pagination/Pagination.astro +1 -1
- package/dist/src/components/pagination/PaginationContent.astro +3 -3
- package/dist/src/components/pagination/PaginationEllipsis.astro +2 -2
- package/dist/src/components/pagination/PaginationItem.astro +3 -3
- package/dist/src/components/pagination/PaginationLink.astro +27 -27
- package/dist/src/components/pagination/PaginationNext.astro +7 -6
- package/dist/src/components/pagination/PaginationPrevious.astro +7 -6
- package/dist/src/components/pagination/index.ts +14 -14
- package/dist/src/components/progress/Progress.astro +151 -0
- package/dist/src/components/progress/index.ts +5 -0
- package/dist/src/components/radio-group/RadioGroup.astro +156 -0
- package/dist/src/components/radio-group/RadioGroupItem.astro +125 -0
- package/dist/src/components/radio-group/RadioGroupTypes.ts +6 -0
- package/dist/src/components/radio-group/index.ts +10 -0
- package/dist/src/components/select/Select.astro +515 -475
- package/dist/src/components/select/SelectContent.astro +62 -62
- package/dist/src/components/select/SelectItem.astro +27 -27
- package/dist/src/components/select/SelectLabel.astro +1 -1
- package/dist/src/components/select/SelectTrigger.astro +28 -28
- package/dist/src/components/select/SelectTypes.ts +11 -5
- package/dist/src/components/select/SelectValue.astro +5 -5
- package/dist/src/components/select/index.ts +16 -16
- package/dist/src/components/skeleton/Skeleton.astro +14 -0
- package/dist/src/components/skeleton/index.ts +5 -0
- package/dist/src/components/switch/Switch.astro +150 -150
- package/dist/src/components/switch/SwitchTypes.ts +4 -4
- package/dist/src/components/table/Table.astro +5 -5
- package/dist/src/components/table/TableBody.astro +3 -3
- package/dist/src/components/table/TableCaption.astro +3 -3
- package/dist/src/components/table/TableCell.astro +3 -3
- package/dist/src/components/table/TableFoot.astro +3 -3
- package/dist/src/components/table/TableHead.astro +3 -3
- package/dist/src/components/table/TableHeader.astro +3 -3
- package/dist/src/components/table/TableRow.astro +3 -3
- package/dist/src/components/table/index.ts +8 -8
- package/dist/src/components/tabs/Tabs.astro +250 -250
- package/dist/src/components/tabs/TabsContent.astro +10 -10
- package/dist/src/components/tabs/TabsList.astro +2 -2
- package/dist/src/components/tabs/TabsTrigger.astro +15 -15
- package/dist/src/components/tabs/index.ts +4 -4
- package/dist/src/components/textarea/Textarea.astro +16 -16
- package/dist/src/components/tooltip/Tooltip.astro +217 -217
- package/dist/src/components/tooltip/TooltipContent.astro +81 -81
- package/dist/src/components/tooltip/index.ts +3 -3
- package/package.json +6 -6
|
@@ -1,28 +1,28 @@
|
|
|
1
1
|
---
|
|
2
2
|
import type { HTMLAttributes } from "astro/types";
|
|
3
|
-
import { type VariantProps
|
|
3
|
+
import { tv, type VariantProps } from "tailwind-variants";
|
|
4
4
|
|
|
5
5
|
type Props = HTMLAttributes<"div"> & VariantProps<typeof alert>;
|
|
6
6
|
|
|
7
7
|
const alert = tv({
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
8
|
+
base: "text-foreground relative w-full rounded-lg border p-4",
|
|
9
|
+
variants: {
|
|
10
|
+
variant: {
|
|
11
|
+
default: "bg-background [&>h5>svg]:text-foreground",
|
|
12
|
+
primary: "border-primary bg-primary/7 [&>h5>svg]:text-primary",
|
|
13
|
+
secondary: "border-secondary bg-secondary/7 [&>h5>svg]:text-secondary",
|
|
14
|
+
info: "border-info bg-info/7 [&>h5>svg]:text-info",
|
|
15
|
+
success: "border-success bg-success/7 [&>h5>svg]:text-success",
|
|
16
|
+
warning: "border-warning bg-warning/7 [&>h5>svg]:text-warning",
|
|
17
|
+
error: "border-error bg-error/7 [&>h5>svg]:text-error",
|
|
18
|
+
},
|
|
19
|
+
},
|
|
20
|
+
defaultVariants: { variant: "default" },
|
|
21
21
|
});
|
|
22
22
|
|
|
23
23
|
const { variant, class: className, ...rest } = Astro.props;
|
|
24
24
|
---
|
|
25
25
|
|
|
26
26
|
<div class={alert({ variant, class: className })} {...rest}>
|
|
27
|
-
|
|
27
|
+
<slot />
|
|
28
28
|
</div>
|
|
@@ -3,7 +3,7 @@ import type { HTMLAttributes } from "astro/types";
|
|
|
3
3
|
import { tv } from "tailwind-variants";
|
|
4
4
|
|
|
5
5
|
const alertTitle = tv({
|
|
6
|
-
|
|
6
|
+
base: "mb-2 flex items-center gap-2 text-lg leading-none font-medium tracking-tight",
|
|
7
7
|
});
|
|
8
8
|
|
|
9
9
|
type Props = HTMLAttributes<"div">;
|
|
@@ -12,5 +12,5 @@ const { class: className, ...rest } = Astro.props;
|
|
|
12
12
|
---
|
|
13
13
|
|
|
14
14
|
<h5 class={alertTitle({ class: className })} {...rest}>
|
|
15
|
-
|
|
15
|
+
<slot />
|
|
16
16
|
</h5>
|
|
@@ -1,29 +1,29 @@
|
|
|
1
1
|
---
|
|
2
2
|
import type { HTMLAttributes } from "astro/types";
|
|
3
|
-
import { type VariantProps
|
|
3
|
+
import { tv, type VariantProps } from "tailwind-variants";
|
|
4
4
|
|
|
5
5
|
interface Props extends HTMLAttributes<"div">, VariantProps<typeof avatar> {}
|
|
6
6
|
|
|
7
7
|
const avatar = tv({
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
8
|
+
base: "text-foreground bg-muted relative overflow-hidden rounded-full border-2",
|
|
9
|
+
variants: {
|
|
10
|
+
variant: {
|
|
11
|
+
default: "border-border",
|
|
12
|
+
primary: "border-primary",
|
|
13
|
+
secondary: "border-secondary",
|
|
14
|
+
info: "border-info",
|
|
15
|
+
success: "border-success",
|
|
16
|
+
warning: "border-warning",
|
|
17
|
+
error: "border-error",
|
|
18
|
+
},
|
|
19
|
+
size: { sm: "h-8 w-8 text-xs", md: "h-10 w-10 text-sm", lg: "h-12 w-12 text-base" },
|
|
20
|
+
},
|
|
21
|
+
defaultVariants: { variant: "default", size: "md" },
|
|
22
22
|
});
|
|
23
23
|
|
|
24
24
|
const { variant, size, class: className, ...rest } = Astro.props;
|
|
25
25
|
---
|
|
26
26
|
|
|
27
27
|
<figure class={avatar({ variant, size, class: className })} {...rest}>
|
|
28
|
-
|
|
28
|
+
<slot />
|
|
29
29
|
</figure>
|
|
@@ -2,16 +2,16 @@
|
|
|
2
2
|
import { tv } from "tailwind-variants";
|
|
3
3
|
|
|
4
4
|
const avatarFallback = tv({
|
|
5
|
-
|
|
5
|
+
base: "absolute inset-0.5 flex items-center justify-center rounded-full font-medium",
|
|
6
6
|
});
|
|
7
7
|
|
|
8
8
|
interface Props {
|
|
9
|
-
|
|
9
|
+
class?: string;
|
|
10
10
|
}
|
|
11
11
|
|
|
12
12
|
const { class: className } = Astro.props;
|
|
13
13
|
---
|
|
14
14
|
|
|
15
15
|
<div class={avatarFallback({ class: className })}>
|
|
16
|
-
|
|
16
|
+
<slot />
|
|
17
17
|
</div>
|
|
@@ -15,21 +15,21 @@ type Props = WithSrc | WithImage;
|
|
|
15
15
|
const { src, image, alt, class: className } = Astro.props;
|
|
16
16
|
|
|
17
17
|
if (!src && !image) {
|
|
18
|
-
|
|
18
|
+
throw new Error("Either 'src' or 'image' is required for an avatar image.");
|
|
19
19
|
}
|
|
20
20
|
---
|
|
21
21
|
|
|
22
22
|
{
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
23
|
+
src && (
|
|
24
|
+
// eslint-disable-next-line astro/jsx-a11y/no-noninteractive-element-interactions
|
|
25
|
+
<img
|
|
26
|
+
src={src}
|
|
27
|
+
alt={alt}
|
|
28
|
+
class={avatarImage({ class: className })}
|
|
29
|
+
width={64}
|
|
30
|
+
height={64}
|
|
31
|
+
onerror="this.style.display='none'"
|
|
32
|
+
/>
|
|
33
|
+
)
|
|
34
34
|
}
|
|
35
35
|
{image && <Image src={image} alt={alt} class={avatarImage({ class: className })} width={64} />}
|
|
@@ -2,10 +2,10 @@ import Avatar from "./Avatar.astro";
|
|
|
2
2
|
import AvatarFallback from "./AvatarFallback.astro";
|
|
3
3
|
import AvatarImage from "./AvatarImage.astro";
|
|
4
4
|
|
|
5
|
-
export { Avatar,
|
|
5
|
+
export { Avatar, AvatarFallback, AvatarImage };
|
|
6
6
|
|
|
7
7
|
export default {
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
8
|
+
Root: Avatar,
|
|
9
|
+
Image: AvatarImage,
|
|
10
|
+
Fallback: AvatarFallback,
|
|
11
11
|
};
|
|
@@ -1,41 +1,41 @@
|
|
|
1
1
|
---
|
|
2
2
|
import type { HTMLAttributes } from "astro/types";
|
|
3
|
-
import { type VariantProps
|
|
3
|
+
import { tv, type VariantProps } from "tailwind-variants";
|
|
4
4
|
|
|
5
5
|
interface Props
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
6
|
+
extends HTMLAttributes<"div">,
|
|
7
|
+
Omit<HTMLAttributes<"a">, "type">,
|
|
8
|
+
VariantProps<typeof badge> {}
|
|
9
9
|
|
|
10
10
|
const badge = tv({
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
11
|
+
base: "starwind-badge starwind-transition-colors inline-flex items-center rounded-full font-semibold focus-visible:outline-2 focus-visible:outline-offset-2",
|
|
12
|
+
variants: {
|
|
13
|
+
variant: {
|
|
14
|
+
default: "bg-foreground text-background",
|
|
15
|
+
primary: "bg-primary text-primary-foreground focus-visible:outline-primary",
|
|
16
|
+
secondary: "bg-secondary text-secondary-foreground focus-visible:outline-secondary",
|
|
17
|
+
outline: "border-border focus-visible:outline-outline border",
|
|
18
|
+
ghost: "bg-foreground/10 text-foreground focus-visible:outline-outline",
|
|
19
|
+
info: "bg-info text-info-foreground focus-visible:outline-info",
|
|
20
|
+
success: "bg-success text-success-foreground focus-visible:outline-success",
|
|
21
|
+
warning: "bg-warning text-warning-foreground focus-visible:outline-warning",
|
|
22
|
+
error: "bg-error text-error-foreground focus-visible:outline-error",
|
|
23
|
+
},
|
|
24
|
+
size: { sm: "px-2.5 py-0.5 text-xs", md: "px-3 py-0.5 text-sm", lg: "px-4 py-1 text-base" },
|
|
25
|
+
isLink: { true: "cursor-pointer", false: "" },
|
|
26
|
+
},
|
|
27
|
+
compoundVariants: [
|
|
28
|
+
{ isLink: true, variant: "default", className: "hover:bg-foreground/80" },
|
|
29
|
+
{ isLink: true, variant: "primary", className: "hover:bg-primary/80" },
|
|
30
|
+
{ isLink: true, variant: "secondary", className: "hover:bg-secondary/80" },
|
|
31
|
+
{ isLink: true, variant: "outline", className: "hover:border-border/80" },
|
|
32
|
+
{ isLink: true, variant: "ghost", className: "hover:bg-foreground/7" },
|
|
33
|
+
{ isLink: true, variant: "info", className: "hover:bg-info/80" },
|
|
34
|
+
{ isLink: true, variant: "success", className: "hover:bg-success/80" },
|
|
35
|
+
{ isLink: true, variant: "warning", className: "hover:bg-warning/80" },
|
|
36
|
+
{ isLink: true, variant: "error", className: "hover:bg-error/80" },
|
|
37
|
+
],
|
|
38
|
+
defaultVariants: { variant: "default", size: "md", isLink: false },
|
|
39
39
|
});
|
|
40
40
|
|
|
41
41
|
const { variant, size, class: className, ...rest } = Astro.props;
|
|
@@ -44,5 +44,5 @@ const Tag = Astro.props.href ? "a" : "div";
|
|
|
44
44
|
---
|
|
45
45
|
|
|
46
46
|
<Tag class={badge({ variant, size, isLink, class: className })} {...rest}>
|
|
47
|
-
|
|
47
|
+
<slot />
|
|
48
48
|
</Tag>
|
|
@@ -11,11 +11,11 @@ const { class: className, ...rest } = Astro.props;
|
|
|
11
11
|
---
|
|
12
12
|
|
|
13
13
|
<span
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
14
|
+
role="presentation"
|
|
15
|
+
aria-hidden="true"
|
|
16
|
+
class={breadcrumbEllipsis({ class: className })}
|
|
17
|
+
{...rest}
|
|
18
18
|
>
|
|
19
|
-
|
|
20
|
-
|
|
19
|
+
<Dots />
|
|
20
|
+
<span class="sr-only">More</span>
|
|
21
21
|
</span>
|
|
@@ -3,7 +3,7 @@ import type { HTMLAttributes } from "astro/types";
|
|
|
3
3
|
import { tv } from "tailwind-variants";
|
|
4
4
|
|
|
5
5
|
type Props = HTMLAttributes<"a"> & {
|
|
6
|
-
|
|
6
|
+
asChild?: boolean;
|
|
7
7
|
};
|
|
8
8
|
|
|
9
9
|
const breadcrumbLink = tv({ base: "hover:text-foreground transition-colors" });
|
|
@@ -12,11 +12,11 @@ const { class: className, asChild = false, ...rest } = Astro.props;
|
|
|
12
12
|
---
|
|
13
13
|
|
|
14
14
|
{
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
15
|
+
asChild ? (
|
|
16
|
+
<slot />
|
|
17
|
+
) : (
|
|
18
|
+
<a class={breadcrumbLink({ class: className })} {...rest}>
|
|
19
|
+
<slot />
|
|
20
|
+
</a>
|
|
21
|
+
)
|
|
22
22
|
}
|
|
@@ -5,12 +5,12 @@ import { tv } from "tailwind-variants";
|
|
|
5
5
|
type Props = HTMLAttributes<"ol">;
|
|
6
6
|
|
|
7
7
|
const breadcrumbList = tv({
|
|
8
|
-
|
|
8
|
+
base: "text-muted-foreground flex flex-wrap items-center gap-1.5 break-words sm:gap-2",
|
|
9
9
|
});
|
|
10
10
|
|
|
11
11
|
const { class: className, ...rest } = Astro.props;
|
|
12
12
|
---
|
|
13
13
|
|
|
14
14
|
<ol class={breadcrumbList({ class: className })} {...rest}>
|
|
15
|
-
|
|
15
|
+
<slot />
|
|
16
16
|
</ol>
|
|
@@ -10,11 +10,11 @@ const { class: className, ...rest } = Astro.props;
|
|
|
10
10
|
---
|
|
11
11
|
|
|
12
12
|
<span
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
13
|
+
role="link"
|
|
14
|
+
aria-disabled="true"
|
|
15
|
+
aria-current="page"
|
|
16
|
+
class={breadcrumbPage({ class: className })}
|
|
17
|
+
{...rest}
|
|
18
18
|
>
|
|
19
|
-
|
|
19
|
+
<slot />
|
|
20
20
|
</span>
|
|
@@ -11,12 +11,12 @@ const { class: className, ...rest } = Astro.props;
|
|
|
11
11
|
---
|
|
12
12
|
|
|
13
13
|
<li
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
14
|
+
role="presentation"
|
|
15
|
+
aria-hidden="true"
|
|
16
|
+
class={breadcrumbSeparator({ class: className })}
|
|
17
|
+
{...rest}
|
|
18
18
|
>
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
19
|
+
<slot>
|
|
20
|
+
<ChevronRight />
|
|
21
|
+
</slot>
|
|
22
22
|
</li>
|
|
@@ -7,21 +7,21 @@ import BreadcrumbPage from "./BreadcrumbPage.astro";
|
|
|
7
7
|
import BreadcrumbSeparator from "./BreadcrumbSeparator.astro";
|
|
8
8
|
|
|
9
9
|
export {
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
10
|
+
Breadcrumb,
|
|
11
|
+
BreadcrumbEllipsis,
|
|
12
|
+
BreadcrumbItem,
|
|
13
|
+
BreadcrumbLink,
|
|
14
|
+
BreadcrumbList,
|
|
15
|
+
BreadcrumbPage,
|
|
16
|
+
BreadcrumbSeparator,
|
|
17
17
|
};
|
|
18
18
|
|
|
19
19
|
export default {
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
20
|
+
Root: Breadcrumb,
|
|
21
|
+
List: BreadcrumbList,
|
|
22
|
+
Ellipsis: BreadcrumbEllipsis,
|
|
23
|
+
Item: BreadcrumbItem,
|
|
24
|
+
Link: BreadcrumbLink,
|
|
25
|
+
Separator: BreadcrumbSeparator,
|
|
26
|
+
Page: BreadcrumbPage,
|
|
27
27
|
};
|
|
@@ -1,53 +1,53 @@
|
|
|
1
1
|
---
|
|
2
2
|
import type { HTMLAttributes } from "astro/types";
|
|
3
|
-
import { type VariantProps
|
|
3
|
+
import { tv, type VariantProps } from "tailwind-variants";
|
|
4
4
|
|
|
5
5
|
interface Props
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
6
|
+
extends HTMLAttributes<"button">,
|
|
7
|
+
Omit<HTMLAttributes<"a">, "type">,
|
|
8
|
+
VariantProps<typeof button> {}
|
|
9
9
|
|
|
10
10
|
const { variant, size, class: className, ...rest } = Astro.props;
|
|
11
11
|
|
|
12
12
|
const button = tv({
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
13
|
+
base: [
|
|
14
|
+
"inline-flex items-center justify-center gap-1.5 rounded-md font-medium whitespace-nowrap",
|
|
15
|
+
"[&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
|
|
16
|
+
"starwind-transition-colors",
|
|
17
|
+
"focus-visible:outline-2 focus-visible:outline-offset-2",
|
|
18
|
+
"disabled:pointer-events-none disabled:opacity-50",
|
|
19
|
+
],
|
|
20
|
+
variants: {
|
|
21
|
+
variant: {
|
|
22
|
+
default: "bg-foreground text-background hover:bg-foreground/90 focus-visible:outline-outline",
|
|
23
|
+
primary:
|
|
24
|
+
"bg-primary text-primary-foreground hover:bg-primary/90 focus-visible:outline-primary",
|
|
25
|
+
secondary:
|
|
26
|
+
"bg-secondary text-secondary-foreground hover:bg-secondary/90 focus-visible:outline-secondary",
|
|
27
|
+
outline:
|
|
28
|
+
"border-border hover:bg-border hover:text-foreground focus-visible:outline-outline border",
|
|
29
|
+
ghost:
|
|
30
|
+
"hover:bg-foreground/10 hover:text-foreground focus-visible:outline-outline bg-transparent",
|
|
31
|
+
info: "bg-info text-info-foreground hover:bg-info/90 focus-visible:outline-info",
|
|
32
|
+
success:
|
|
33
|
+
"bg-success text-success-foreground hover:bg-success/90 focus-visible:outline-success",
|
|
34
|
+
warning:
|
|
35
|
+
"bg-warning text-warning-foreground hover:bg-warning/90 focus-visible:outline-warning",
|
|
36
|
+
error: "bg-error text-error-foreground hover:bg-error/90 focus-visible:outline-error",
|
|
37
|
+
},
|
|
38
|
+
size: {
|
|
39
|
+
sm: "h-9 px-3 py-2 text-sm",
|
|
40
|
+
md: "h-11 px-4 py-2 text-base",
|
|
41
|
+
lg: "h-12 px-8 py-2 text-lg",
|
|
42
|
+
icon: "h-11 w-11",
|
|
43
|
+
},
|
|
44
|
+
},
|
|
45
|
+
defaultVariants: { variant: "default", size: "md" },
|
|
46
46
|
});
|
|
47
47
|
|
|
48
48
|
const Tag = Astro.props.href ? "a" : "button";
|
|
49
49
|
---
|
|
50
50
|
|
|
51
51
|
<Tag class={button({ variant, size, class: className })} {...rest}>
|
|
52
|
-
|
|
52
|
+
<slot />
|
|
53
53
|
</Tag>
|
|
@@ -5,13 +5,13 @@ import CardFooter from "./CardFooter.astro";
|
|
|
5
5
|
import CardHeader from "./CardHeader.astro";
|
|
6
6
|
import CardTitle from "./CardTitle.astro";
|
|
7
7
|
|
|
8
|
-
export { Card,
|
|
8
|
+
export { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle };
|
|
9
9
|
|
|
10
10
|
export default {
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
11
|
+
Root: Card,
|
|
12
|
+
Header: CardHeader,
|
|
13
|
+
Footer: CardFooter,
|
|
14
|
+
Title: CardTitle,
|
|
15
|
+
Description: CardDescription,
|
|
16
|
+
Content: CardContent,
|
|
17
17
|
};
|