@uselets/ui 0.1.0
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/alert.d.ts +33 -0
- package/dist/components/alert.js +2 -0
- package/dist/components/alert.js.map +1 -0
- package/dist/components/avatar.d.ts +41 -0
- package/dist/components/avatar.js +2 -0
- package/dist/components/avatar.js.map +1 -0
- package/dist/components/button.d.ts +20 -0
- package/dist/components/button.js +2 -0
- package/dist/components/button.js.map +1 -0
- package/dist/components/card.d.ts +45 -0
- package/dist/components/card.js +2 -0
- package/dist/components/card.js.map +1 -0
- package/dist/components/dialog.d.ts +71 -0
- package/dist/components/dialog.js +2 -0
- package/dist/components/dialog.js.map +1 -0
- package/dist/components/drawer.d.ts +64 -0
- package/dist/components/drawer.js +2 -0
- package/dist/components/drawer.js.map +1 -0
- package/dist/components/empty.d.ts +42 -0
- package/dist/components/empty.js +2 -0
- package/dist/components/empty.js.map +1 -0
- package/dist/components/field.d.ts +75 -0
- package/dist/components/field.js +2 -0
- package/dist/components/field.js.map +1 -0
- package/dist/components/input-otp.d.ts +33 -0
- package/dist/components/input-otp.js +2 -0
- package/dist/components/input-otp.js.map +1 -0
- package/dist/components/input.d.ts +13 -0
- package/dist/components/input.js +2 -0
- package/dist/components/input.js.map +1 -0
- package/dist/components/kbd.d.ts +14 -0
- package/dist/components/kbd.js +2 -0
- package/dist/components/kbd.js.map +1 -0
- package/dist/components/label.d.ts +12 -0
- package/dist/components/label.js +2 -0
- package/dist/components/label.js.map +1 -0
- package/dist/components/native-select.d.ts +24 -0
- package/dist/components/native-select.js +2 -0
- package/dist/components/native-select.js.map +1 -0
- package/dist/components/select.d.ts +66 -0
- package/dist/components/select.js +2 -0
- package/dist/components/select.js.map +1 -0
- package/dist/components/separator.d.ts +13 -0
- package/dist/components/separator.js +2 -0
- package/dist/components/separator.js.map +1 -0
- package/dist/components/skeleton.d.ts +12 -0
- package/dist/components/skeleton.js +2 -0
- package/dist/components/skeleton.js.map +1 -0
- package/dist/components/sonner.d.ts +9 -0
- package/dist/components/sonner.js +2 -0
- package/dist/components/sonner.js.map +1 -0
- package/dist/components/spinner.d.ts +10 -0
- package/dist/components/spinner.js +2 -0
- package/dist/components/spinner.js.map +1 -0
- package/dist/lib/utils.d.ts +7 -0
- package/dist/lib/utils.js +2 -0
- package/dist/lib/utils.js.map +1 -0
- package/dist/postcss.config.js +2 -0
- package/dist/postcss.config.js.map +1 -0
- package/dist/styles.css +4 -0
- package/dist/styles.css.map +1 -0
- package/dist/styles.js +0 -0
- package/package.json +64 -0
- package/postcss.config.mjs +6 -0
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import { VariantProps } from "class-variance-authority";
|
|
2
|
+
import * as react_jsx_runtime0 from "react/jsx-runtime";
|
|
3
|
+
import * as React from "react";
|
|
4
|
+
import * as class_variance_authority_types0 from "class-variance-authority/types";
|
|
5
|
+
|
|
6
|
+
//#region src/components/alert.d.ts
|
|
7
|
+
declare const alertVariants: (props?: ({
|
|
8
|
+
variant?: "default" | "destructive" | null | undefined;
|
|
9
|
+
} & class_variance_authority_types0.ClassProp) | undefined) => string;
|
|
10
|
+
type AlertProps = React.ComponentProps<'div'> & VariantProps<typeof alertVariants>;
|
|
11
|
+
type AlertTitleProps = React.ComponentProps<'div'>;
|
|
12
|
+
type AlertDescriptionProps = React.ComponentProps<'div'>;
|
|
13
|
+
type AlertActionProps = React.ComponentProps<'div'>;
|
|
14
|
+
declare function Alert({
|
|
15
|
+
className,
|
|
16
|
+
variant,
|
|
17
|
+
...props
|
|
18
|
+
}: AlertProps): react_jsx_runtime0.JSX.Element;
|
|
19
|
+
declare function AlertTitle({
|
|
20
|
+
className,
|
|
21
|
+
...props
|
|
22
|
+
}: AlertTitleProps): react_jsx_runtime0.JSX.Element;
|
|
23
|
+
declare function AlertDescription({
|
|
24
|
+
className,
|
|
25
|
+
...props
|
|
26
|
+
}: AlertDescriptionProps): react_jsx_runtime0.JSX.Element;
|
|
27
|
+
declare function AlertAction({
|
|
28
|
+
className,
|
|
29
|
+
...props
|
|
30
|
+
}: AlertActionProps): react_jsx_runtime0.JSX.Element;
|
|
31
|
+
//#endregion
|
|
32
|
+
export { Alert, AlertAction, AlertActionProps, AlertDescription, AlertDescriptionProps, AlertProps, AlertTitle, AlertTitleProps };
|
|
33
|
+
//# sourceMappingURL=alert.d.ts.map
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{cn as e}from"../lib/utils.js";import{cva as t}from"class-variance-authority";import{jsx as n}from"react/jsx-runtime";const r=t(`grid gap-0.5 rounded-lg border px-2.5 py-2 text-left text-sm has-data-[slot=alert-action]:relative has-data-[slot=alert-action]:pr-18 has-[>svg]:grid-cols-[auto_1fr] has-[>svg]:gap-x-2 *:[svg]:row-span-2 *:[svg]:translate-y-0.5 *:[svg]:text-current *:[svg:not([class*='size-'])]:size-4 w-full relative group/alert`,{variants:{variant:{default:`bg-card text-card-foreground`,destructive:`text-destructive bg-card *:data-[slot=alert-description]:text-destructive/90 *:[svg]:text-current`}},defaultVariants:{variant:`default`}});function i({className:t,variant:i,...a}){return n(`div`,{"data-slot":`alert`,role:`alert`,className:e(r({variant:i}),t),...a})}function a({className:t,...r}){return n(`div`,{"data-slot":`alert-title`,className:e(`font-medium group-has-[>svg]/alert:col-start-2 [&_a]:hover:text-foreground [&_a]:underline [&_a]:underline-offset-3`,t),...r})}function o({className:t,...r}){return n(`div`,{"data-slot":`alert-description`,className:e(`text-muted-foreground text-sm text-balance md:text-pretty [&_p:not(:last-child)]:mb-4 [&_a]:hover:text-foreground [&_a]:underline [&_a]:underline-offset-3`,t),...r})}function s({className:t,...r}){return n(`div`,{"data-slot":`alert-action`,className:e(`absolute top-2 right-2`,t),...r})}export{i as Alert,s as AlertAction,o as AlertDescription,a as AlertTitle};
|
|
2
|
+
//# sourceMappingURL=alert.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"alert.js","names":[],"sources":["../../src/components/alert.tsx"],"sourcesContent":["import type * as React from 'react'\n\nimport { cva, type VariantProps } from 'class-variance-authority'\n\nimport { cn } from '../lib/utils'\n\nconst alertVariants = cva(\n \"grid gap-0.5 rounded-lg border px-2.5 py-2 text-left text-sm has-data-[slot=alert-action]:relative has-data-[slot=alert-action]:pr-18 has-[>svg]:grid-cols-[auto_1fr] has-[>svg]:gap-x-2 *:[svg]:row-span-2 *:[svg]:translate-y-0.5 *:[svg]:text-current *:[svg:not([class*='size-'])]:size-4 w-full relative group/alert\",\n {\n variants: {\n variant: {\n default: 'bg-card text-card-foreground',\n destructive: 'text-destructive bg-card *:data-[slot=alert-description]:text-destructive/90 *:[svg]:text-current'\n }\n },\n defaultVariants: {\n variant: 'default'\n }\n }\n)\n\nexport type AlertProps = React.ComponentProps<'div'> & VariantProps<typeof alertVariants>\n\nexport type AlertTitleProps = React.ComponentProps<'div'>\n\nexport type AlertDescriptionProps = React.ComponentProps<'div'>\n\nexport type AlertActionProps = React.ComponentProps<'div'>\n\nfunction Alert({ className, variant, ...props }: AlertProps) {\n return <div data-slot=\"alert\" role=\"alert\" className={cn(alertVariants({ variant }), className)} {...props} />\n}\n\nfunction AlertTitle({ className, ...props }: AlertTitleProps) {\n return (\n <div\n data-slot=\"alert-title\"\n className={cn(\n 'font-medium group-has-[>svg]/alert:col-start-2 [&_a]:hover:text-foreground [&_a]:underline [&_a]:underline-offset-3',\n className\n )}\n {...props}\n />\n )\n}\n\nfunction AlertDescription({ className, ...props }: AlertDescriptionProps) {\n return (\n <div\n data-slot=\"alert-description\"\n className={cn(\n 'text-muted-foreground text-sm text-balance md:text-pretty [&_p:not(:last-child)]:mb-4 [&_a]:hover:text-foreground [&_a]:underline [&_a]:underline-offset-3',\n className\n )}\n {...props}\n />\n )\n}\n\nfunction AlertAction({ className, ...props }: AlertActionProps) {\n return <div data-slot=\"alert-action\" className={cn('absolute top-2 right-2', className)} {...props} />\n}\n\nexport { Alert, AlertAction, AlertDescription, AlertTitle }\n"],"mappings":"4HAMA,MAAM,EAAgB,EACpB,4TACA,CACE,SAAU,CACR,QAAS,CACP,QAAS,+BACT,YAAa,oGACd,CACF,CACD,gBAAiB,CACf,QAAS,UACV,CACF,CACF,CAUD,SAAS,EAAM,CAAE,YAAW,UAAS,GAAG,GAAqB,CAC3D,OAAO,EAAC,MAAA,CAAI,YAAU,QAAQ,KAAK,QAAQ,UAAW,EAAG,EAAc,CAAE,UAAS,CAAC,CAAE,EAAU,CAAE,GAAI,GAAS,CAGhH,SAAS,EAAW,CAAE,YAAW,GAAG,GAA0B,CAC5D,OACE,EAAC,MAAA,CACC,YAAU,cACV,UAAW,EACT,sHACA,EACD,CACD,GAAI,GACJ,CAIN,SAAS,EAAiB,CAAE,YAAW,GAAG,GAAgC,CACxE,OACE,EAAC,MAAA,CACC,YAAU,oBACV,UAAW,EACT,6JACA,EACD,CACD,GAAI,GACJ,CAIN,SAAS,EAAY,CAAE,YAAW,GAAG,GAA2B,CAC9D,OAAO,EAAC,MAAA,CAAI,YAAU,eAAe,UAAW,EAAG,yBAA0B,EAAU,CAAE,GAAI,GAAS"}
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
import * as react_jsx_runtime0 from "react/jsx-runtime";
|
|
2
|
+
import { Avatar as Avatar$1 } from "@base-ui/react/avatar";
|
|
3
|
+
import * as React from "react";
|
|
4
|
+
|
|
5
|
+
//#region src/components/avatar.d.ts
|
|
6
|
+
type AvatarProps = Avatar$1.Root.Props & {
|
|
7
|
+
size?: 'default' | 'sm' | 'lg';
|
|
8
|
+
};
|
|
9
|
+
type AvatarImageProps = Avatar$1.Image.Props;
|
|
10
|
+
type AvatarFallbackProps = Avatar$1.Fallback.Props;
|
|
11
|
+
type AvatarBadgeProps = React.ComponentProps<'span'>;
|
|
12
|
+
type AvatarGroupProps = React.ComponentProps<'div'>;
|
|
13
|
+
type AvatarGroupCountProps = React.ComponentProps<'div'>;
|
|
14
|
+
declare function Avatar({
|
|
15
|
+
className,
|
|
16
|
+
size,
|
|
17
|
+
...props
|
|
18
|
+
}: AvatarProps): react_jsx_runtime0.JSX.Element;
|
|
19
|
+
declare function AvatarImage({
|
|
20
|
+
className,
|
|
21
|
+
...props
|
|
22
|
+
}: AvatarImageProps): react_jsx_runtime0.JSX.Element;
|
|
23
|
+
declare function AvatarFallback({
|
|
24
|
+
className,
|
|
25
|
+
...props
|
|
26
|
+
}: AvatarFallbackProps): react_jsx_runtime0.JSX.Element;
|
|
27
|
+
declare function AvatarBadge({
|
|
28
|
+
className,
|
|
29
|
+
...props
|
|
30
|
+
}: AvatarBadgeProps): react_jsx_runtime0.JSX.Element;
|
|
31
|
+
declare function AvatarGroup({
|
|
32
|
+
className,
|
|
33
|
+
...props
|
|
34
|
+
}: AvatarGroupProps): react_jsx_runtime0.JSX.Element;
|
|
35
|
+
declare function AvatarGroupCount({
|
|
36
|
+
className,
|
|
37
|
+
...props
|
|
38
|
+
}: AvatarGroupCountProps): react_jsx_runtime0.JSX.Element;
|
|
39
|
+
//#endregion
|
|
40
|
+
export { Avatar, AvatarBadge, AvatarBadgeProps, AvatarFallback, AvatarFallbackProps, AvatarGroup, AvatarGroupCount, AvatarGroupCountProps, AvatarGroupProps, AvatarImage, AvatarImageProps, AvatarProps };
|
|
41
|
+
//# sourceMappingURL=avatar.d.ts.map
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{cn as e}from"../lib/utils.js";import{jsx as t}from"react/jsx-runtime";import{Avatar as n}from"@base-ui/react/avatar";function r({className:r,size:i=`default`,...a}){return t(n.Root,{"data-slot":`avatar`,"data-size":i,className:e(`size-8 rounded-full after:rounded-full data-[size=lg]:size-10 data-[size=sm]:size-6 after:border-border group/avatar relative flex shrink-0 select-none after:absolute after:inset-0 after:border after:mix-blend-darken dark:after:mix-blend-lighten`,r),...a})}function i({className:r,...i}){return t(n.Image,{"data-slot":`avatar-image`,className:e(`rounded-full aspect-square size-full object-cover`,r),...i})}function a({className:r,...i}){return t(n.Fallback,{"data-slot":`avatar-fallback`,className:e(`bg-muted text-muted-foreground rounded-full flex size-full items-center justify-center text-sm group-data-[size=sm]/avatar:text-xs`,r),...i})}function o({className:n,...r}){return t(`span`,{"data-slot":`avatar-badge`,className:e(`bg-primary text-primary-foreground ring-background absolute right-0 bottom-0 z-10 inline-flex items-center justify-center rounded-full bg-blend-color ring-2 select-none`,`group-data-[size=sm]/avatar:size-2 group-data-[size=sm]/avatar:[&>svg]:hidden`,`group-data-[size=default]/avatar:size-2.5 group-data-[size=default]/avatar:[&>svg]:size-2`,`group-data-[size=lg]/avatar:size-3 group-data-[size=lg]/avatar:[&>svg]:size-2`,n),...r})}function s({className:n,...r}){return t(`div`,{"data-slot":`avatar-group`,className:e(`*:data-[slot=avatar]:ring-background group/avatar-group flex -space-x-2 *:data-[slot=avatar]:ring-2`,n),...r})}function c({className:n,...r}){return t(`div`,{"data-slot":`avatar-group-count`,className:e(`bg-muted text-muted-foreground size-8 rounded-full text-sm group-has-data-[size=lg]/avatar-group:size-10 group-has-data-[size=sm]/avatar-group:size-6 [&>svg]:size-4 group-has-data-[size=lg]/avatar-group:[&>svg]:size-5 group-has-data-[size=sm]/avatar-group:[&>svg]:size-3 ring-background relative flex shrink-0 items-center justify-center ring-2`,n),...r})}export{r as Avatar,o as AvatarBadge,a as AvatarFallback,s as AvatarGroup,c as AvatarGroupCount,i as AvatarImage};
|
|
2
|
+
//# sourceMappingURL=avatar.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"avatar.js","names":["AvatarPrimitive"],"sources":["../../src/components/avatar.tsx"],"sourcesContent":["import type * as React from 'react'\n\nimport { Avatar as AvatarPrimitive } from '@base-ui/react/avatar'\n\nimport { cn } from '../lib/utils'\n\nexport type AvatarProps = AvatarPrimitive.Root.Props & {\n size?: 'default' | 'sm' | 'lg'\n}\n\nexport type AvatarImageProps = AvatarPrimitive.Image.Props\n\nexport type AvatarFallbackProps = AvatarPrimitive.Fallback.Props\n\nexport type AvatarBadgeProps = React.ComponentProps<'span'>\n\nexport type AvatarGroupProps = React.ComponentProps<'div'>\n\nexport type AvatarGroupCountProps = React.ComponentProps<'div'>\n\nfunction Avatar({ className, size = 'default', ...props }: AvatarProps) {\n return (\n <AvatarPrimitive.Root\n data-slot=\"avatar\"\n data-size={size}\n className={cn(\n 'size-8 rounded-full after:rounded-full data-[size=lg]:size-10 data-[size=sm]:size-6 after:border-border group/avatar relative flex shrink-0 select-none after:absolute after:inset-0 after:border after:mix-blend-darken dark:after:mix-blend-lighten',\n className\n )}\n {...props}\n />\n )\n}\n\nfunction AvatarImage({ className, ...props }: AvatarImageProps) {\n return (\n <AvatarPrimitive.Image\n data-slot=\"avatar-image\"\n className={cn('rounded-full aspect-square size-full object-cover', className)}\n {...props}\n />\n )\n}\n\nfunction AvatarFallback({ className, ...props }: AvatarFallbackProps) {\n return (\n <AvatarPrimitive.Fallback\n data-slot=\"avatar-fallback\"\n className={cn(\n 'bg-muted text-muted-foreground rounded-full flex size-full items-center justify-center text-sm group-data-[size=sm]/avatar:text-xs',\n className\n )}\n {...props}\n />\n )\n}\n\nfunction AvatarBadge({ className, ...props }: AvatarBadgeProps) {\n return (\n <span\n data-slot=\"avatar-badge\"\n className={cn(\n 'bg-primary text-primary-foreground ring-background absolute right-0 bottom-0 z-10 inline-flex items-center justify-center rounded-full bg-blend-color ring-2 select-none',\n 'group-data-[size=sm]/avatar:size-2 group-data-[size=sm]/avatar:[&>svg]:hidden',\n 'group-data-[size=default]/avatar:size-2.5 group-data-[size=default]/avatar:[&>svg]:size-2',\n 'group-data-[size=lg]/avatar:size-3 group-data-[size=lg]/avatar:[&>svg]:size-2',\n className\n )}\n {...props}\n />\n )\n}\n\nfunction AvatarGroup({ className, ...props }: AvatarGroupProps) {\n return (\n <div\n data-slot=\"avatar-group\"\n className={cn(\n '*:data-[slot=avatar]:ring-background group/avatar-group flex -space-x-2 *:data-[slot=avatar]:ring-2',\n className\n )}\n {...props}\n />\n )\n}\n\nfunction AvatarGroupCount({ className, ...props }: AvatarGroupCountProps) {\n return (\n <div\n data-slot=\"avatar-group-count\"\n className={cn(\n 'bg-muted text-muted-foreground size-8 rounded-full text-sm group-has-data-[size=lg]/avatar-group:size-10 group-has-data-[size=sm]/avatar-group:size-6 [&>svg]:size-4 group-has-data-[size=lg]/avatar-group:[&>svg]:size-5 group-has-data-[size=sm]/avatar-group:[&>svg]:size-3 ring-background relative flex shrink-0 items-center justify-center ring-2',\n className\n )}\n {...props}\n />\n )\n}\n\nexport { Avatar, AvatarBadge, AvatarFallback, AvatarGroup, AvatarGroupCount, AvatarImage }\n"],"mappings":"4HAoBA,SAAS,EAAO,CAAE,YAAW,OAAO,UAAW,GAAG,GAAsB,CACtE,OACE,EAACA,EAAgB,KAAA,CACf,YAAU,SACV,YAAW,EACX,UAAW,EACT,wPACA,EACD,CACD,GAAI,GACJ,CAIN,SAAS,EAAY,CAAE,YAAW,GAAG,GAA2B,CAC9D,OACE,EAACA,EAAgB,MAAA,CACf,YAAU,eACV,UAAW,EAAG,oDAAqD,EAAU,CAC7E,GAAI,GACJ,CAIN,SAAS,EAAe,CAAE,YAAW,GAAG,GAA8B,CACpE,OACE,EAACA,EAAgB,SAAA,CACf,YAAU,kBACV,UAAW,EACT,qIACA,EACD,CACD,GAAI,GACJ,CAIN,SAAS,EAAY,CAAE,YAAW,GAAG,GAA2B,CAC9D,OACE,EAAC,OAAA,CACC,YAAU,eACV,UAAW,EACT,2KACA,gFACA,4FACA,gFACA,EACD,CACD,GAAI,GACJ,CAIN,SAAS,EAAY,CAAE,YAAW,GAAG,GAA2B,CAC9D,OACE,EAAC,MAAA,CACC,YAAU,eACV,UAAW,EACT,sGACA,EACD,CACD,GAAI,GACJ,CAIN,SAAS,EAAiB,CAAE,YAAW,GAAG,GAAgC,CACxE,OACE,EAAC,MAAA,CACC,YAAU,qBACV,UAAW,EACT,2VACA,EACD,CACD,GAAI,GACJ"}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { VariantProps } from "class-variance-authority";
|
|
2
|
+
import * as react_jsx_runtime0 from "react/jsx-runtime";
|
|
3
|
+
import { Button as Button$1 } from "@base-ui/react/button";
|
|
4
|
+
import * as class_variance_authority_types0 from "class-variance-authority/types";
|
|
5
|
+
|
|
6
|
+
//#region src/components/button.d.ts
|
|
7
|
+
declare const buttonVariants: (props?: ({
|
|
8
|
+
variant?: "default" | "outline" | "secondary" | "ghost" | "destructive" | "link" | null | undefined;
|
|
9
|
+
size?: "default" | "xs" | "sm" | "lg" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined;
|
|
10
|
+
} & class_variance_authority_types0.ClassProp) | undefined) => string;
|
|
11
|
+
type ButtonProps = Button$1.Props & VariantProps<typeof buttonVariants>;
|
|
12
|
+
declare function Button({
|
|
13
|
+
className,
|
|
14
|
+
variant,
|
|
15
|
+
size,
|
|
16
|
+
...props
|
|
17
|
+
}: ButtonProps): react_jsx_runtime0.JSX.Element;
|
|
18
|
+
//#endregion
|
|
19
|
+
export { Button, ButtonProps, buttonVariants };
|
|
20
|
+
//# sourceMappingURL=button.d.ts.map
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{cn as e}from"../lib/utils.js";import{cva as t}from"class-variance-authority";import{jsx as n}from"react/jsx-runtime";import{Button as r}from"@base-ui/react/button";const i=t(`focus-visible:border-ring cursor-pointer focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 rounded-lg border border-transparent bg-clip-padding text-sm font-medium focus-visible:ring-3 aria-invalid:ring-3 [&_svg:not([class*='size-'])]:size-4 inline-flex items-center justify-center whitespace-nowrap transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none shrink-0 [&_svg]:shrink-0 outline-none group/button select-none`,{variants:{variant:{default:`bg-primary text-primary-foreground hover:bg-primary/80`,outline:`border-border bg-background hover:bg-muted hover:text-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 aria-expanded:bg-muted aria-expanded:text-foreground`,secondary:`bg-secondary text-secondary-foreground hover:bg-secondary/80 aria-expanded:bg-secondary aria-expanded:text-secondary-foreground`,ghost:`hover:bg-muted hover:text-foreground dark:hover:bg-muted/50 aria-expanded:bg-muted aria-expanded:text-foreground`,destructive:`bg-destructive/10 hover:bg-destructive/20 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/20 text-destructive focus-visible:border-destructive/40 dark:hover:bg-destructive/30`,link:`text-primary underline-offset-4 hover:underline`},size:{default:`h-8 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2`,xs:`h-6 gap-1 rounded-[min(var(--radius-md),10px)] px-2 text-xs in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3`,sm:`h-7 gap-1 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5`,lg:`h-9 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-3 has-data-[icon=inline-start]:pl-3`,icon:`size-8`,"icon-xs":`size-6 rounded-[min(var(--radius-md),10px)] in-data-[slot=button-group]:rounded-lg [&_svg:not([class*='size-'])]:size-3`,"icon-sm":`size-7 rounded-[min(var(--radius-md),12px)] in-data-[slot=button-group]:rounded-lg`,"icon-lg":`size-9`}},defaultVariants:{variant:`default`,size:`default`}});function a({className:t,variant:a=`default`,size:o=`default`,...s}){return n(r,{"data-slot":`button`,className:e(i({variant:a,size:o,className:t})),...s})}export{a as Button,i as buttonVariants};
|
|
2
|
+
//# sourceMappingURL=button.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"button.js","names":["ButtonPrimitive"],"sources":["../../src/components/button.tsx"],"sourcesContent":["import { Button as ButtonPrimitive } from '@base-ui/react/button'\nimport { cva, type VariantProps } from 'class-variance-authority'\n\nimport { cn } from '../lib/utils'\n\nconst buttonVariants = cva(\n \"focus-visible:border-ring cursor-pointer focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 rounded-lg border border-transparent bg-clip-padding text-sm font-medium focus-visible:ring-3 aria-invalid:ring-3 [&_svg:not([class*='size-'])]:size-4 inline-flex items-center justify-center whitespace-nowrap transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none shrink-0 [&_svg]:shrink-0 outline-none group/button select-none\",\n {\n variants: {\n variant: {\n default: 'bg-primary text-primary-foreground hover:bg-primary/80',\n outline:\n 'border-border bg-background hover:bg-muted hover:text-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 aria-expanded:bg-muted aria-expanded:text-foreground',\n secondary:\n 'bg-secondary text-secondary-foreground hover:bg-secondary/80 aria-expanded:bg-secondary aria-expanded:text-secondary-foreground',\n ghost:\n 'hover:bg-muted hover:text-foreground dark:hover:bg-muted/50 aria-expanded:bg-muted aria-expanded:text-foreground',\n destructive:\n 'bg-destructive/10 hover:bg-destructive/20 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/20 text-destructive focus-visible:border-destructive/40 dark:hover:bg-destructive/30',\n link: 'text-primary underline-offset-4 hover:underline'\n },\n size: {\n default: 'h-8 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2',\n xs: \"h-6 gap-1 rounded-[min(var(--radius-md),10px)] px-2 text-xs in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3\",\n sm: \"h-7 gap-1 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5\",\n lg: 'h-9 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-3 has-data-[icon=inline-start]:pl-3',\n icon: 'size-8',\n 'icon-xs':\n \"size-6 rounded-[min(var(--radius-md),10px)] in-data-[slot=button-group]:rounded-lg [&_svg:not([class*='size-'])]:size-3\",\n 'icon-sm': 'size-7 rounded-[min(var(--radius-md),12px)] in-data-[slot=button-group]:rounded-lg',\n 'icon-lg': 'size-9'\n }\n },\n defaultVariants: {\n variant: 'default',\n size: 'default'\n }\n }\n)\n\nexport type ButtonProps = ButtonPrimitive.Props & VariantProps<typeof buttonVariants>\n\nfunction Button({ className, variant = 'default', size = 'default', ...props }: ButtonProps) {\n return <ButtonPrimitive data-slot=\"button\" className={cn(buttonVariants({ variant, size, className }))} {...props} />\n}\n\nexport { Button, buttonVariants }\n"],"mappings":"2KAKA,MAAM,EAAiB,EACrB,kkBACA,CACE,SAAU,CACR,QAAS,CACP,QAAS,yDACT,QACE,kLACF,UACE,kIACF,MACE,mHACF,YACE,8NACF,KAAM,kDACP,CACD,KAAM,CACJ,QAAS,uFACT,GAAI,gNACJ,GAAI,0NACJ,GAAI,uFACJ,KAAM,SACN,UACE,0HACF,UAAW,qFACX,UAAW,SACZ,CACF,CACD,gBAAiB,CACf,QAAS,UACT,KAAM,UACP,CACF,CACF,CAID,SAAS,EAAO,CAAE,YAAW,UAAU,UAAW,OAAO,UAAW,GAAG,GAAsB,CAC3F,OAAO,EAACA,EAAAA,CAAgB,YAAU,SAAS,UAAW,EAAG,EAAe,CAAE,UAAS,OAAM,YAAW,CAAC,CAAC,CAAE,GAAI,GAAS"}
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
import * as react_jsx_runtime0 from "react/jsx-runtime";
|
|
2
|
+
import * as React from "react";
|
|
3
|
+
|
|
4
|
+
//#region src/components/card.d.ts
|
|
5
|
+
type CardProps = React.ComponentProps<'div'> & {
|
|
6
|
+
size?: 'default' | 'sm';
|
|
7
|
+
};
|
|
8
|
+
type CardHeaderProps = React.ComponentProps<'div'>;
|
|
9
|
+
type CardTitleProps = React.ComponentProps<'div'>;
|
|
10
|
+
type CardDescriptionProps = React.ComponentProps<'div'>;
|
|
11
|
+
type CardActionProps = React.ComponentProps<'div'>;
|
|
12
|
+
type CardContentProps = React.ComponentProps<'div'>;
|
|
13
|
+
type CardFooterProps = React.ComponentProps<'div'>;
|
|
14
|
+
declare function Card({
|
|
15
|
+
className,
|
|
16
|
+
size,
|
|
17
|
+
...props
|
|
18
|
+
}: CardProps): react_jsx_runtime0.JSX.Element;
|
|
19
|
+
declare function CardHeader({
|
|
20
|
+
className,
|
|
21
|
+
...props
|
|
22
|
+
}: CardHeaderProps): react_jsx_runtime0.JSX.Element;
|
|
23
|
+
declare function CardTitle({
|
|
24
|
+
className,
|
|
25
|
+
...props
|
|
26
|
+
}: CardTitleProps): react_jsx_runtime0.JSX.Element;
|
|
27
|
+
declare function CardDescription({
|
|
28
|
+
className,
|
|
29
|
+
...props
|
|
30
|
+
}: CardDescriptionProps): react_jsx_runtime0.JSX.Element;
|
|
31
|
+
declare function CardAction({
|
|
32
|
+
className,
|
|
33
|
+
...props
|
|
34
|
+
}: CardActionProps): react_jsx_runtime0.JSX.Element;
|
|
35
|
+
declare function CardContent({
|
|
36
|
+
className,
|
|
37
|
+
...props
|
|
38
|
+
}: CardContentProps): react_jsx_runtime0.JSX.Element;
|
|
39
|
+
declare function CardFooter({
|
|
40
|
+
className,
|
|
41
|
+
...props
|
|
42
|
+
}: CardFooterProps): react_jsx_runtime0.JSX.Element;
|
|
43
|
+
//#endregion
|
|
44
|
+
export { Card, CardAction, CardActionProps, CardContent, CardContentProps, CardDescription, CardDescriptionProps, CardFooter, CardFooterProps, CardHeader, CardHeaderProps, CardProps, CardTitle, CardTitleProps };
|
|
45
|
+
//# sourceMappingURL=card.d.ts.map
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{cn as e}from"../lib/utils.js";import{jsx as t}from"react/jsx-runtime";function n({className:n,size:r=`default`,...i}){return t(`div`,{"data-slot":`card`,"data-size":r,className:e(`ring-foreground/10 bg-card text-card-foreground gap-4 overflow-hidden rounded-xl py-4 text-sm ring-1 has-data-[slot=card-footer]:pb-0 has-[>img:first-child]:pt-0 data-[size=sm]:gap-3 data-[size=sm]:py-3 data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl group/card flex flex-col`,n),...i})}function r({className:n,...r}){return t(`div`,{"data-slot":`card-header`,className:e(`gap-1 rounded-t-xl px-4 group-data-[size=sm]/card:px-3 [.border-b]:pb-4 group-data-[size=sm]/card:[.border-b]:pb-3 group/card-header @container/card-header grid auto-rows-min items-start has-data-[slot=card-action]:grid-cols-[1fr_auto] has-data-[slot=card-description]:grid-rows-[auto_auto]`,n),...r})}function i({className:n,...r}){return t(`div`,{"data-slot":`card-title`,className:e(`text-base leading-snug font-medium group-data-[size=sm]/card:text-sm`,n),...r})}function a({className:n,...r}){return t(`div`,{"data-slot":`card-description`,className:e(`text-muted-foreground text-sm`,n),...r})}function o({className:n,...r}){return t(`div`,{"data-slot":`card-action`,className:e(`col-start-2 row-span-2 row-start-1 self-start justify-self-end`,n),...r})}function s({className:n,...r}){return t(`div`,{"data-slot":`card-content`,className:e(`px-4 group-data-[size=sm]/card:px-3`,n),...r})}function c({className:n,...r}){return t(`div`,{"data-slot":`card-footer`,className:e(`bg-muted/50 rounded-b-xl border-t p-4 group-data-[size=sm]/card:p-3 flex items-center`,n),...r})}export{n as Card,o as CardAction,s as CardContent,a as CardDescription,c as CardFooter,r as CardHeader,i as CardTitle};
|
|
2
|
+
//# sourceMappingURL=card.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"card.js","names":[],"sources":["../../src/components/card.tsx"],"sourcesContent":["import type * as React from 'react'\n\nimport { cn } from '../lib/utils'\n\nexport type CardProps = React.ComponentProps<'div'> & { size?: 'default' | 'sm' }\n\nexport type CardHeaderProps = React.ComponentProps<'div'>\n\nexport type CardTitleProps = React.ComponentProps<'div'>\n\nexport type CardDescriptionProps = React.ComponentProps<'div'>\n\nexport type CardActionProps = React.ComponentProps<'div'>\n\nexport type CardContentProps = React.ComponentProps<'div'>\n\nexport type CardFooterProps = React.ComponentProps<'div'>\n\nfunction Card({ className, size = 'default', ...props }: CardProps) {\n return (\n <div\n data-slot=\"card\"\n data-size={size}\n className={cn(\n 'ring-foreground/10 bg-card text-card-foreground gap-4 overflow-hidden rounded-xl py-4 text-sm ring-1 has-data-[slot=card-footer]:pb-0 has-[>img:first-child]:pt-0 data-[size=sm]:gap-3 data-[size=sm]:py-3 data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl group/card flex flex-col',\n className\n )}\n {...props}\n />\n )\n}\n\nfunction CardHeader({ className, ...props }: CardHeaderProps) {\n return (\n <div\n data-slot=\"card-header\"\n className={cn(\n 'gap-1 rounded-t-xl px-4 group-data-[size=sm]/card:px-3 [.border-b]:pb-4 group-data-[size=sm]/card:[.border-b]:pb-3 group/card-header @container/card-header grid auto-rows-min items-start has-data-[slot=card-action]:grid-cols-[1fr_auto] has-data-[slot=card-description]:grid-rows-[auto_auto]',\n className\n )}\n {...props}\n />\n )\n}\n\nfunction CardTitle({ className, ...props }: CardTitleProps) {\n return (\n <div\n data-slot=\"card-title\"\n className={cn('text-base leading-snug font-medium group-data-[size=sm]/card:text-sm', className)}\n {...props}\n />\n )\n}\n\nfunction CardDescription({ className, ...props }: CardDescriptionProps) {\n return <div data-slot=\"card-description\" className={cn('text-muted-foreground text-sm', className)} {...props} />\n}\n\nfunction CardAction({ className, ...props }: CardActionProps) {\n return (\n <div\n data-slot=\"card-action\"\n className={cn('col-start-2 row-span-2 row-start-1 self-start justify-self-end', className)}\n {...props}\n />\n )\n}\n\nfunction CardContent({ className, ...props }: CardContentProps) {\n return <div data-slot=\"card-content\" className={cn('px-4 group-data-[size=sm]/card:px-3', className)} {...props} />\n}\n\nfunction CardFooter({ className, ...props }: CardFooterProps) {\n return (\n <div\n data-slot=\"card-footer\"\n className={cn('bg-muted/50 rounded-b-xl border-t p-4 group-data-[size=sm]/card:p-3 flex items-center', className)}\n {...props}\n />\n )\n}\n\nexport { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle }\n"],"mappings":"6EAkBA,SAAS,EAAK,CAAE,YAAW,OAAO,UAAW,GAAG,GAAoB,CAClE,OACE,EAAC,MAAA,CACC,YAAU,OACV,YAAW,EACX,UAAW,EACT,uVACA,EACD,CACD,GAAI,GACJ,CAIN,SAAS,EAAW,CAAE,YAAW,GAAG,GAA0B,CAC5D,OACE,EAAC,MAAA,CACC,YAAU,cACV,UAAW,EACT,qSACA,EACD,CACD,GAAI,GACJ,CAIN,SAAS,EAAU,CAAE,YAAW,GAAG,GAAyB,CAC1D,OACE,EAAC,MAAA,CACC,YAAU,aACV,UAAW,EAAG,uEAAwE,EAAU,CAChG,GAAI,GACJ,CAIN,SAAS,EAAgB,CAAE,YAAW,GAAG,GAA+B,CACtE,OAAO,EAAC,MAAA,CAAI,YAAU,mBAAmB,UAAW,EAAG,gCAAiC,EAAU,CAAE,GAAI,GAAS,CAGnH,SAAS,EAAW,CAAE,YAAW,GAAG,GAA0B,CAC5D,OACE,EAAC,MAAA,CACC,YAAU,cACV,UAAW,EAAG,iEAAkE,EAAU,CAC1F,GAAI,GACJ,CAIN,SAAS,EAAY,CAAE,YAAW,GAAG,GAA2B,CAC9D,OAAO,EAAC,MAAA,CAAI,YAAU,eAAe,UAAW,EAAG,sCAAuC,EAAU,CAAE,GAAI,GAAS,CAGrH,SAAS,EAAW,CAAE,YAAW,GAAG,GAA0B,CAC5D,OACE,EAAC,MAAA,CACC,YAAU,cACV,UAAW,EAAG,wFAAyF,EAAU,CACjH,GAAI,GACJ"}
|
|
@@ -0,0 +1,71 @@
|
|
|
1
|
+
import { VariantProps } from "class-variance-authority";
|
|
2
|
+
import * as react_jsx_runtime0 from "react/jsx-runtime";
|
|
3
|
+
import * as React from "react";
|
|
4
|
+
import { Dialog as Dialog$1 } from "@base-ui/react/dialog";
|
|
5
|
+
import * as class_variance_authority_types0 from "class-variance-authority/types";
|
|
6
|
+
|
|
7
|
+
//#region src/components/dialog.d.ts
|
|
8
|
+
declare const dialogContentVariants: (props?: ({
|
|
9
|
+
size?: "sm" | "lg" | "md" | "xl" | "2xl" | null | undefined;
|
|
10
|
+
} & class_variance_authority_types0.ClassProp) | undefined) => string;
|
|
11
|
+
type DialogSize = NonNullable<VariantProps<typeof dialogContentVariants>['size']>;
|
|
12
|
+
type DialogProps = Dialog$1.Root.Props & {
|
|
13
|
+
size?: DialogSize;
|
|
14
|
+
};
|
|
15
|
+
type DialogTriggerProps = Dialog$1.Trigger.Props;
|
|
16
|
+
type DialogPortalProps = Dialog$1.Portal.Props;
|
|
17
|
+
type DialogCloseProps = Dialog$1.Close.Props;
|
|
18
|
+
type DialogOverlayProps = Dialog$1.Backdrop.Props;
|
|
19
|
+
type DialogContentProps = Dialog$1.Popup.Props & {
|
|
20
|
+
showCloseButton?: boolean;
|
|
21
|
+
};
|
|
22
|
+
type DialogHeaderProps = React.ComponentProps<'div'>;
|
|
23
|
+
type DialogFooterProps = React.ComponentProps<'div'> & {
|
|
24
|
+
showCloseButton?: boolean;
|
|
25
|
+
};
|
|
26
|
+
type DialogTitleProps = Dialog$1.Title.Props;
|
|
27
|
+
type DialogDescriptionProps = Dialog$1.Description.Props;
|
|
28
|
+
declare function Dialog({
|
|
29
|
+
size,
|
|
30
|
+
...props
|
|
31
|
+
}: DialogProps): react_jsx_runtime0.JSX.Element;
|
|
32
|
+
declare function DialogTrigger({
|
|
33
|
+
...props
|
|
34
|
+
}: DialogTriggerProps): react_jsx_runtime0.JSX.Element;
|
|
35
|
+
declare function DialogPortal({
|
|
36
|
+
...props
|
|
37
|
+
}: DialogPortalProps): react_jsx_runtime0.JSX.Element;
|
|
38
|
+
declare function DialogClose({
|
|
39
|
+
...props
|
|
40
|
+
}: DialogCloseProps): react_jsx_runtime0.JSX.Element;
|
|
41
|
+
declare function DialogOverlay({
|
|
42
|
+
className,
|
|
43
|
+
...props
|
|
44
|
+
}: DialogOverlayProps): react_jsx_runtime0.JSX.Element;
|
|
45
|
+
declare function DialogContent({
|
|
46
|
+
className,
|
|
47
|
+
children,
|
|
48
|
+
showCloseButton,
|
|
49
|
+
...props
|
|
50
|
+
}: DialogContentProps): react_jsx_runtime0.JSX.Element;
|
|
51
|
+
declare function DialogHeader({
|
|
52
|
+
className,
|
|
53
|
+
...props
|
|
54
|
+
}: DialogHeaderProps): react_jsx_runtime0.JSX.Element;
|
|
55
|
+
declare function DialogFooter({
|
|
56
|
+
className,
|
|
57
|
+
showCloseButton,
|
|
58
|
+
children,
|
|
59
|
+
...props
|
|
60
|
+
}: DialogFooterProps): react_jsx_runtime0.JSX.Element;
|
|
61
|
+
declare function DialogTitle({
|
|
62
|
+
className,
|
|
63
|
+
...props
|
|
64
|
+
}: DialogTitleProps): react_jsx_runtime0.JSX.Element;
|
|
65
|
+
declare function DialogDescription({
|
|
66
|
+
className,
|
|
67
|
+
...props
|
|
68
|
+
}: DialogDescriptionProps): react_jsx_runtime0.JSX.Element;
|
|
69
|
+
//#endregion
|
|
70
|
+
export { Dialog, DialogClose, DialogCloseProps, DialogContent, DialogContentProps, DialogDescription, DialogDescriptionProps, DialogFooter, DialogFooterProps, DialogHeader, DialogHeaderProps, DialogOverlay, DialogOverlayProps, DialogPortal, DialogPortalProps, DialogProps, DialogTitle, DialogTitleProps, DialogTrigger, DialogTriggerProps };
|
|
71
|
+
//# sourceMappingURL=dialog.d.ts.map
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{cn as e}from"../lib/utils.js";import{Button as t}from"./button.js";import{cva as n}from"class-variance-authority";import{jsx as r,jsxs as i}from"react/jsx-runtime";import*as a from"react";import{Dialog as o}from"@base-ui/react/dialog";import{IconX as s}from"@tabler/icons-react";const c=n(`bg-background data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 ring-foreground/10 grid max-w-[calc(100%-2rem)] gap-4 rounded-xl p-4 text-sm ring-1 duration-100 fixed top-1/2 left-1/2 z-50 w-full -translate-x-1/2 -translate-y-1/2 outline-none`,{variants:{size:{sm:`sm:max-w-sm`,md:`sm:max-w-md`,lg:`sm:max-w-lg`,xl:`sm:max-w-xl`,"2xl":`sm:max-w-2xl`}},defaultVariants:{size:`sm`}}),l=a.createContext({size:`sm`});function u({size:e=`sm`,...t}){let n=a.useMemo(()=>({size:e}),[e]);return r(l.Provider,{value:n,children:r(o.Root,{"data-slot":`dialog`,...t})})}function d({...e}){return r(o.Trigger,{"data-slot":`dialog-trigger`,...e})}function f({...e}){return r(o.Portal,{"data-slot":`dialog-portal`,...e})}function p({...e}){return r(o.Close,{"data-slot":`dialog-close`,...e})}function m({className:t,...n}){return r(o.Backdrop,{"data-slot":`dialog-overlay`,className:e(`data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 bg-black/10 duration-100 supports-backdrop-filter:backdrop-blur-xs fixed inset-0 isolate z-50`,t),...n})}function h({className:n,children:u,showCloseButton:d=!0,...p}){let{size:h}=a.useContext(l);return i(f,{children:[r(m,{}),i(o.Popup,{"data-slot":`dialog-content`,className:e(c({size:h}),n),...p,children:[u,d&&i(o.Close,{"data-slot":`dialog-close`,render:r(t,{variant:`ghost`,className:`absolute top-2 right-2`,size:`icon-sm`}),children:[r(s,{}),r(`span`,{className:`sr-only`,children:`Close`})]})]})]})}function g({className:t,...n}){return r(`div`,{"data-slot":`dialog-header`,className:e(`gap-2 flex flex-col`,t),...n})}function _({className:n,showCloseButton:a=!1,children:s,...c}){return i(`div`,{"data-slot":`dialog-footer`,className:e(`bg-muted/50 -mx-4 -mb-4 rounded-b-xl border-t p-4 flex flex-col-reverse gap-2 sm:flex-row sm:justify-end`,n),...c,children:[s,a&&r(o.Close,{render:r(t,{variant:`outline`}),children:`Close`})]})}function v({className:t,...n}){return r(o.Title,{"data-slot":`dialog-title`,className:e(`text-base leading-none font-medium`,t),...n})}function y({className:t,...n}){return r(o.Description,{"data-slot":`dialog-description`,className:e(`text-muted-foreground *:[a]:hover:text-foreground text-sm *:[a]:underline *:[a]:underline-offset-3`,t),...n})}export{u as Dialog,p as DialogClose,h as DialogContent,y as DialogDescription,_ as DialogFooter,g as DialogHeader,m as DialogOverlay,f as DialogPortal,v as DialogTitle,d as DialogTrigger};
|
|
2
|
+
//# sourceMappingURL=dialog.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"dialog.js","names":["DialogPrimitive"],"sources":["../../src/components/dialog.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Dialog as DialogPrimitive } from '@base-ui/react/dialog'\nimport { IconX } from '@tabler/icons-react'\nimport { Button } from '@uselets/ui/button'\nimport { cva, type VariantProps } from 'class-variance-authority'\n\nimport { cn } from '../lib/utils'\n\nconst dialogContentVariants = cva(\n 'bg-background data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 ring-foreground/10 grid max-w-[calc(100%-2rem)] gap-4 rounded-xl p-4 text-sm ring-1 duration-100 fixed top-1/2 left-1/2 z-50 w-full -translate-x-1/2 -translate-y-1/2 outline-none',\n {\n variants: {\n size: {\n sm: 'sm:max-w-sm',\n md: 'sm:max-w-md',\n lg: 'sm:max-w-lg',\n xl: 'sm:max-w-xl',\n '2xl': 'sm:max-w-2xl'\n }\n },\n defaultVariants: {\n size: 'sm'\n }\n }\n)\n\ntype DialogSize = NonNullable<VariantProps<typeof dialogContentVariants>['size']>\n\ntype DialogContextValue = {\n size: DialogSize\n}\n\nconst DialogContext = React.createContext<DialogContextValue>({\n size: 'sm'\n})\n\nexport type DialogProps = DialogPrimitive.Root.Props & {\n size?: DialogSize\n}\n\nexport type DialogTriggerProps = DialogPrimitive.Trigger.Props\n\nexport type DialogPortalProps = DialogPrimitive.Portal.Props\n\nexport type DialogCloseProps = DialogPrimitive.Close.Props\n\nexport type DialogOverlayProps = DialogPrimitive.Backdrop.Props\n\nexport type DialogContentProps = DialogPrimitive.Popup.Props & {\n showCloseButton?: boolean\n}\n\nexport type DialogHeaderProps = React.ComponentProps<'div'>\n\nexport type DialogFooterProps = React.ComponentProps<'div'> & {\n showCloseButton?: boolean\n}\n\nexport type DialogTitleProps = DialogPrimitive.Title.Props\n\nexport type DialogDescriptionProps = DialogPrimitive.Description.Props\n\nfunction Dialog({ size = 'sm', ...props }: DialogProps) {\n const contextValue = React.useMemo<DialogContextValue>(() => ({ size }), [size])\n\n return (\n <DialogContext.Provider value={contextValue}>\n <DialogPrimitive.Root data-slot=\"dialog\" {...props} />\n </DialogContext.Provider>\n )\n}\n\nfunction DialogTrigger({ ...props }: DialogTriggerProps) {\n return <DialogPrimitive.Trigger data-slot=\"dialog-trigger\" {...props} />\n}\n\nfunction DialogPortal({ ...props }: DialogPortalProps) {\n return <DialogPrimitive.Portal data-slot=\"dialog-portal\" {...props} />\n}\n\nfunction DialogClose({ ...props }: DialogCloseProps) {\n return <DialogPrimitive.Close data-slot=\"dialog-close\" {...props} />\n}\n\nfunction DialogOverlay({ className, ...props }: DialogOverlayProps) {\n return (\n <DialogPrimitive.Backdrop\n data-slot=\"dialog-overlay\"\n className={cn(\n 'data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 bg-black/10 duration-100 supports-backdrop-filter:backdrop-blur-xs fixed inset-0 isolate z-50',\n className\n )}\n {...props}\n />\n )\n}\n\nfunction DialogContent({ className, children, showCloseButton = true, ...props }: DialogContentProps) {\n const { size } = React.useContext(DialogContext)\n\n return (\n <DialogPortal>\n <DialogOverlay />\n <DialogPrimitive.Popup\n data-slot=\"dialog-content\"\n className={cn(dialogContentVariants({ size }), className)}\n {...props}\n >\n {children}\n {showCloseButton && (\n <DialogPrimitive.Close\n data-slot=\"dialog-close\"\n render={<Button variant=\"ghost\" className=\"absolute top-2 right-2\" size=\"icon-sm\" />}\n >\n <IconX />\n <span className=\"sr-only\">Close</span>\n </DialogPrimitive.Close>\n )}\n </DialogPrimitive.Popup>\n </DialogPortal>\n )\n}\n\nfunction DialogHeader({ className, ...props }: DialogHeaderProps) {\n return <div data-slot=\"dialog-header\" className={cn('gap-2 flex flex-col', className)} {...props} />\n}\n\nfunction DialogFooter({ className, showCloseButton = false, children, ...props }: DialogFooterProps) {\n return (\n <div\n data-slot=\"dialog-footer\"\n className={cn(\n 'bg-muted/50 -mx-4 -mb-4 rounded-b-xl border-t p-4 flex flex-col-reverse gap-2 sm:flex-row sm:justify-end',\n className\n )}\n {...props}\n >\n {children}\n {showCloseButton && <DialogPrimitive.Close render={<Button variant=\"outline\" />}>Close</DialogPrimitive.Close>}\n </div>\n )\n}\n\nfunction DialogTitle({ className, ...props }: DialogTitleProps) {\n return (\n <DialogPrimitive.Title\n data-slot=\"dialog-title\"\n className={cn('text-base leading-none font-medium', className)}\n {...props}\n />\n )\n}\n\nfunction DialogDescription({ className, ...props }: DialogDescriptionProps) {\n return (\n <DialogPrimitive.Description\n data-slot=\"dialog-description\"\n className={cn(\n 'text-muted-foreground *:[a]:hover:text-foreground text-sm *:[a]:underline *:[a]:underline-offset-3',\n className\n )}\n {...props}\n />\n )\n}\n\nexport {\n Dialog,\n DialogClose,\n DialogContent,\n DialogDescription,\n DialogFooter,\n DialogHeader,\n DialogOverlay,\n DialogPortal,\n DialogTitle,\n DialogTrigger\n}\n"],"mappings":"8RASA,MAAM,EAAwB,EAC5B,wUACA,CACE,SAAU,CACR,KAAM,CACJ,GAAI,cACJ,GAAI,cACJ,GAAI,cACJ,GAAI,cACJ,MAAO,eACR,CACF,CACD,gBAAiB,CACf,KAAM,KACP,CACF,CACF,CAQK,EAAgB,EAAM,cAAkC,CAC5D,KAAM,KACP,CAAC,CA4BF,SAAS,EAAO,CAAE,OAAO,KAAM,GAAG,GAAsB,CACtD,IAAM,EAAe,EAAM,aAAmC,CAAE,OAAM,EAAG,CAAC,EAAK,CAAC,CAEhF,OACE,EAAC,EAAc,SAAA,CAAS,MAAO,WAC7B,EAACA,EAAgB,KAAA,CAAK,YAAU,SAAS,GAAI,GAAS,EAC/B,CAI7B,SAAS,EAAc,CAAE,GAAG,GAA6B,CACvD,OAAO,EAACA,EAAgB,QAAA,CAAQ,YAAU,iBAAiB,GAAI,GAAS,CAG1E,SAAS,EAAa,CAAE,GAAG,GAA4B,CACrD,OAAO,EAACA,EAAgB,OAAA,CAAO,YAAU,gBAAgB,GAAI,GAAS,CAGxE,SAAS,EAAY,CAAE,GAAG,GAA2B,CACnD,OAAO,EAACA,EAAgB,MAAA,CAAM,YAAU,eAAe,GAAI,GAAS,CAGtE,SAAS,EAAc,CAAE,YAAW,GAAG,GAA6B,CAClE,OACE,EAACA,EAAgB,SAAA,CACf,YAAU,iBACV,UAAW,EACT,wLACA,EACD,CACD,GAAI,GACJ,CAIN,SAAS,EAAc,CAAE,YAAW,WAAU,kBAAkB,GAAM,GAAG,GAA6B,CACpG,GAAM,CAAE,QAAS,EAAM,WAAW,EAAc,CAEhD,OACE,EAAC,EAAA,CAAA,SAAA,CACC,EAAC,EAAA,EAAA,CAAgB,CACjB,EAACA,EAAgB,MAAA,CACf,YAAU,iBACV,UAAW,EAAG,EAAsB,CAAE,OAAM,CAAC,CAAE,EAAU,CACzD,GAAI,YAEH,EACA,GACC,EAACA,EAAgB,MAAA,CACf,YAAU,eACV,OAAQ,EAAC,EAAA,CAAO,QAAQ,QAAQ,UAAU,yBAAyB,KAAK,WAAY,WAEpF,EAAC,EAAA,EAAA,CAAQ,CACT,EAAC,OAAA,CAAK,UAAU,mBAAU,SAAY,CAAA,EAChB,CAAA,EAEJ,CAAA,CAAA,CACX,CAInB,SAAS,EAAa,CAAE,YAAW,GAAG,GAA4B,CAChE,OAAO,EAAC,MAAA,CAAI,YAAU,gBAAgB,UAAW,EAAG,sBAAuB,EAAU,CAAE,GAAI,GAAS,CAGtG,SAAS,EAAa,CAAE,YAAW,kBAAkB,GAAO,WAAU,GAAG,GAA4B,CACnG,OACE,EAAC,MAAA,CACC,YAAU,gBACV,UAAW,EACT,2GACA,EACD,CACD,GAAI,YAEH,EACA,GAAmB,EAACA,EAAgB,MAAA,CAAM,OAAQ,EAAC,EAAA,CAAO,QAAQ,UAAA,CAAY,UAAE,SAA6B,CAAA,EAC1G,CAIV,SAAS,EAAY,CAAE,YAAW,GAAG,GAA2B,CAC9D,OACE,EAACA,EAAgB,MAAA,CACf,YAAU,eACV,UAAW,EAAG,qCAAsC,EAAU,CAC9D,GAAI,GACJ,CAIN,SAAS,EAAkB,CAAE,YAAW,GAAG,GAAiC,CAC1E,OACE,EAACA,EAAgB,YAAA,CACf,YAAU,qBACV,UAAW,EACT,qGACA,EACD,CACD,GAAI,GACJ"}
|
|
@@ -0,0 +1,64 @@
|
|
|
1
|
+
import { VariantProps } from "class-variance-authority";
|
|
2
|
+
import * as react_jsx_runtime0 from "react/jsx-runtime";
|
|
3
|
+
import * as React from "react";
|
|
4
|
+
import { Drawer as Drawer$1 } from "vaul";
|
|
5
|
+
import * as class_variance_authority_types0 from "class-variance-authority/types";
|
|
6
|
+
|
|
7
|
+
//#region src/components/drawer.d.ts
|
|
8
|
+
declare const drawerContentVariants: (props?: ({
|
|
9
|
+
size?: "sm" | "lg" | "md" | null | undefined;
|
|
10
|
+
} & class_variance_authority_types0.ClassProp) | undefined) => string;
|
|
11
|
+
type DrawerSize = NonNullable<VariantProps<typeof drawerContentVariants>['size']>;
|
|
12
|
+
type DrawerProps = React.ComponentProps<typeof Drawer$1.Root> & {
|
|
13
|
+
size?: DrawerSize;
|
|
14
|
+
};
|
|
15
|
+
type DrawerTriggerProps = React.ComponentProps<typeof Drawer$1.Trigger>;
|
|
16
|
+
type DrawerPortalProps = React.ComponentProps<typeof Drawer$1.Portal>;
|
|
17
|
+
type DrawerCloseProps = React.ComponentProps<typeof Drawer$1.Close>;
|
|
18
|
+
type DrawerOverlayProps = React.ComponentProps<typeof Drawer$1.Overlay>;
|
|
19
|
+
type DrawerContentProps = React.ComponentProps<typeof Drawer$1.Content>;
|
|
20
|
+
type DrawerHeaderProps = React.ComponentProps<'div'>;
|
|
21
|
+
type DrawerFooterProps = React.ComponentProps<'div'>;
|
|
22
|
+
type DrawerTitleProps = React.ComponentProps<typeof Drawer$1.Title>;
|
|
23
|
+
type DrawerDescriptionProps = React.ComponentProps<typeof Drawer$1.Description>;
|
|
24
|
+
declare function Drawer({
|
|
25
|
+
size,
|
|
26
|
+
...props
|
|
27
|
+
}: DrawerProps): react_jsx_runtime0.JSX.Element;
|
|
28
|
+
declare function DrawerTrigger({
|
|
29
|
+
...props
|
|
30
|
+
}: DrawerTriggerProps): react_jsx_runtime0.JSX.Element;
|
|
31
|
+
declare function DrawerPortal({
|
|
32
|
+
...props
|
|
33
|
+
}: DrawerPortalProps): react_jsx_runtime0.JSX.Element;
|
|
34
|
+
declare function DrawerClose({
|
|
35
|
+
...props
|
|
36
|
+
}: DrawerCloseProps): react_jsx_runtime0.JSX.Element;
|
|
37
|
+
declare function DrawerOverlay({
|
|
38
|
+
className,
|
|
39
|
+
...props
|
|
40
|
+
}: DrawerOverlayProps): react_jsx_runtime0.JSX.Element;
|
|
41
|
+
declare function DrawerContent({
|
|
42
|
+
className,
|
|
43
|
+
children,
|
|
44
|
+
...props
|
|
45
|
+
}: DrawerContentProps): react_jsx_runtime0.JSX.Element;
|
|
46
|
+
declare function DrawerHeader({
|
|
47
|
+
className,
|
|
48
|
+
...props
|
|
49
|
+
}: DrawerHeaderProps): react_jsx_runtime0.JSX.Element;
|
|
50
|
+
declare function DrawerFooter({
|
|
51
|
+
className,
|
|
52
|
+
...props
|
|
53
|
+
}: DrawerFooterProps): react_jsx_runtime0.JSX.Element;
|
|
54
|
+
declare function DrawerTitle({
|
|
55
|
+
className,
|
|
56
|
+
...props
|
|
57
|
+
}: DrawerTitleProps): react_jsx_runtime0.JSX.Element;
|
|
58
|
+
declare function DrawerDescription({
|
|
59
|
+
className,
|
|
60
|
+
...props
|
|
61
|
+
}: DrawerDescriptionProps): react_jsx_runtime0.JSX.Element;
|
|
62
|
+
//#endregion
|
|
63
|
+
export { Drawer, DrawerClose, DrawerCloseProps, DrawerContent, DrawerContentProps, DrawerDescription, DrawerDescriptionProps, DrawerFooter, DrawerFooterProps, DrawerHeader, DrawerHeaderProps, DrawerOverlay, DrawerOverlayProps, DrawerPortal, DrawerPortalProps, DrawerProps, DrawerTitle, DrawerTitleProps, DrawerTrigger, DrawerTriggerProps };
|
|
64
|
+
//# sourceMappingURL=drawer.d.ts.map
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{cn as e}from"../lib/utils.js";import{cva as t}from"class-variance-authority";import{jsx as n,jsxs as r}from"react/jsx-runtime";import*as i from"react";import{Drawer as a}from"vaul";const o=t(`bg-background flex h-auto flex-col text-sm data-[vaul-drawer-direction=bottom]:inset-x-0 data-[vaul-drawer-direction=bottom]:bottom-0 data-[vaul-drawer-direction=bottom]:rounded-t-xl data-[vaul-drawer-direction=bottom]:border-t data-[vaul-drawer-direction=left]:inset-y-0 data-[vaul-drawer-direction=left]:left-0 data-[vaul-drawer-direction=left]:rounded-r-xl data-[vaul-drawer-direction=left]:border-r data-[vaul-drawer-direction=right]:inset-y-0 data-[vaul-drawer-direction=right]:right-0 data-[vaul-drawer-direction=right]:rounded-l-xl data-[vaul-drawer-direction=right]:border-l data-[vaul-drawer-direction=top]:inset-x-0 data-[vaul-drawer-direction=top]:top-0 data-[vaul-drawer-direction=top]:rounded-b-xl data-[vaul-drawer-direction=top]:border-b group/drawer-content fixed z-50`,{variants:{size:{sm:`data-[vaul-drawer-direction=bottom]:mt-24 data-[vaul-drawer-direction=bottom]:max-h-[80vh] data-[vaul-drawer-direction=top]:mb-24 data-[vaul-drawer-direction=top]:max-h-[80vh] data-[vaul-drawer-direction=left]:w-3/4 data-[vaul-drawer-direction=left]:sm:max-w-sm data-[vaul-drawer-direction=right]:w-3/4 data-[vaul-drawer-direction=right]:sm:max-w-sm`,md:`data-[vaul-drawer-direction=bottom]:mt-20 data-[vaul-drawer-direction=bottom]:max-h-[85vh] data-[vaul-drawer-direction=top]:mb-20 data-[vaul-drawer-direction=top]:max-h-[85vh] data-[vaul-drawer-direction=left]:w-4/5 data-[vaul-drawer-direction=left]:sm:max-w-md data-[vaul-drawer-direction=right]:w-4/5 data-[vaul-drawer-direction=right]:sm:max-w-md`,lg:`data-[vaul-drawer-direction=bottom]:mt-12 data-[vaul-drawer-direction=bottom]:max-h-[90vh] data-[vaul-drawer-direction=top]:mb-12 data-[vaul-drawer-direction=top]:max-h-[90vh] data-[vaul-drawer-direction=left]:w-[90%] data-[vaul-drawer-direction=left]:sm:max-w-lg data-[vaul-drawer-direction=right]:w-[90%] data-[vaul-drawer-direction=right]:sm:max-w-lg`}},defaultVariants:{size:`sm`}}),s=i.createContext({size:`sm`});function c({size:e=`sm`,...t}){let r=i.useMemo(()=>({size:e}),[e]);return n(s.Provider,{value:r,children:n(a.Root,{"data-slot":`drawer`,...t})})}function l({...e}){return n(a.Trigger,{"data-slot":`drawer-trigger`,...e})}function u({...e}){return n(a.Portal,{"data-slot":`drawer-portal`,...e})}function d({...e}){return n(a.Close,{"data-slot":`drawer-close`,...e})}function f({className:t,...r}){return n(a.Overlay,{"data-slot":`drawer-overlay`,className:e(`data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 bg-black/10 supports-backdrop-filter:backdrop-blur-xs fixed inset-0 z-50`,t),...r})}function p({className:t,children:c,...l}){let{size:d}=i.useContext(s);return r(u,{"data-slot":`drawer-portal`,children:[n(f,{}),r(a.Content,{"data-slot":`drawer-content`,className:e(o({size:d}),t),...l,children:[n(`div`,{className:`bg-muted mt-4 h-1 w-25 rounded-full mx-auto hidden shrink-0 group-data-[vaul-drawer-direction=bottom]/drawer-content:block`}),c]})]})}function m({className:t,...r}){return n(`div`,{"data-slot":`drawer-header`,className:e(`gap-0.5 p-4 group-data-[vaul-drawer-direction=bottom]/drawer-content:text-center group-data-[vaul-drawer-direction=top]/drawer-content:text-center md:gap-0.5 md:text-left flex flex-col`,t),...r})}function h({className:t,...r}){return n(`div`,{"data-slot":`drawer-footer`,className:e(`gap-2 p-4 mt-auto flex flex-col`,t),...r})}function g({className:t,...r}){return n(a.Title,{"data-slot":`drawer-title`,className:e(`text-foreground text-base font-medium`,t),...r})}function _({className:t,...r}){return n(a.Description,{"data-slot":`drawer-description`,className:e(`text-muted-foreground text-sm`,t),...r})}export{c as Drawer,d as DrawerClose,p as DrawerContent,_ as DrawerDescription,h as DrawerFooter,m as DrawerHeader,f as DrawerOverlay,u as DrawerPortal,g as DrawerTitle,l as DrawerTrigger};
|
|
2
|
+
//# sourceMappingURL=drawer.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"drawer.js","names":["DrawerPrimitive"],"sources":["../../src/components/drawer.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { Drawer as DrawerPrimitive } from 'vaul'\n\nimport { cn } from '../lib/utils'\n\nconst drawerContentVariants = cva(\n 'bg-background flex h-auto flex-col text-sm data-[vaul-drawer-direction=bottom]:inset-x-0 data-[vaul-drawer-direction=bottom]:bottom-0 data-[vaul-drawer-direction=bottom]:rounded-t-xl data-[vaul-drawer-direction=bottom]:border-t data-[vaul-drawer-direction=left]:inset-y-0 data-[vaul-drawer-direction=left]:left-0 data-[vaul-drawer-direction=left]:rounded-r-xl data-[vaul-drawer-direction=left]:border-r data-[vaul-drawer-direction=right]:inset-y-0 data-[vaul-drawer-direction=right]:right-0 data-[vaul-drawer-direction=right]:rounded-l-xl data-[vaul-drawer-direction=right]:border-l data-[vaul-drawer-direction=top]:inset-x-0 data-[vaul-drawer-direction=top]:top-0 data-[vaul-drawer-direction=top]:rounded-b-xl data-[vaul-drawer-direction=top]:border-b group/drawer-content fixed z-50',\n {\n variants: {\n size: {\n sm: 'data-[vaul-drawer-direction=bottom]:mt-24 data-[vaul-drawer-direction=bottom]:max-h-[80vh] data-[vaul-drawer-direction=top]:mb-24 data-[vaul-drawer-direction=top]:max-h-[80vh] data-[vaul-drawer-direction=left]:w-3/4 data-[vaul-drawer-direction=left]:sm:max-w-sm data-[vaul-drawer-direction=right]:w-3/4 data-[vaul-drawer-direction=right]:sm:max-w-sm',\n md: 'data-[vaul-drawer-direction=bottom]:mt-20 data-[vaul-drawer-direction=bottom]:max-h-[85vh] data-[vaul-drawer-direction=top]:mb-20 data-[vaul-drawer-direction=top]:max-h-[85vh] data-[vaul-drawer-direction=left]:w-4/5 data-[vaul-drawer-direction=left]:sm:max-w-md data-[vaul-drawer-direction=right]:w-4/5 data-[vaul-drawer-direction=right]:sm:max-w-md',\n lg: 'data-[vaul-drawer-direction=bottom]:mt-12 data-[vaul-drawer-direction=bottom]:max-h-[90vh] data-[vaul-drawer-direction=top]:mb-12 data-[vaul-drawer-direction=top]:max-h-[90vh] data-[vaul-drawer-direction=left]:w-[90%] data-[vaul-drawer-direction=left]:sm:max-w-lg data-[vaul-drawer-direction=right]:w-[90%] data-[vaul-drawer-direction=right]:sm:max-w-lg'\n }\n },\n defaultVariants: {\n size: 'sm'\n }\n }\n)\n\ntype DrawerSize = NonNullable<VariantProps<typeof drawerContentVariants>['size']>\n\ntype DrawerContextValue = {\n size: DrawerSize\n}\n\nconst DrawerContext = React.createContext<DrawerContextValue>({\n size: 'sm'\n})\n\nexport type DrawerProps = React.ComponentProps<typeof DrawerPrimitive.Root> & {\n size?: DrawerSize\n}\n\nexport type DrawerTriggerProps = React.ComponentProps<typeof DrawerPrimitive.Trigger>\n\nexport type DrawerPortalProps = React.ComponentProps<typeof DrawerPrimitive.Portal>\n\nexport type DrawerCloseProps = React.ComponentProps<typeof DrawerPrimitive.Close>\n\nexport type DrawerOverlayProps = React.ComponentProps<typeof DrawerPrimitive.Overlay>\n\nexport type DrawerContentProps = React.ComponentProps<typeof DrawerPrimitive.Content>\n\nexport type DrawerHeaderProps = React.ComponentProps<'div'>\n\nexport type DrawerFooterProps = React.ComponentProps<'div'>\n\nexport type DrawerTitleProps = React.ComponentProps<typeof DrawerPrimitive.Title>\n\nexport type DrawerDescriptionProps = React.ComponentProps<typeof DrawerPrimitive.Description>\n\nfunction Drawer({ size = 'sm', ...props }: DrawerProps) {\n const contextValue = React.useMemo<DrawerContextValue>(() => ({ size }), [size])\n\n return (\n <DrawerContext.Provider value={contextValue}>\n <DrawerPrimitive.Root data-slot=\"drawer\" {...props} />\n </DrawerContext.Provider>\n )\n}\n\nfunction DrawerTrigger({ ...props }: DrawerTriggerProps) {\n return <DrawerPrimitive.Trigger data-slot=\"drawer-trigger\" {...props} />\n}\n\nfunction DrawerPortal({ ...props }: DrawerPortalProps) {\n return <DrawerPrimitive.Portal data-slot=\"drawer-portal\" {...props} />\n}\n\nfunction DrawerClose({ ...props }: DrawerCloseProps) {\n return <DrawerPrimitive.Close data-slot=\"drawer-close\" {...props} />\n}\n\nfunction DrawerOverlay({ className, ...props }: DrawerOverlayProps) {\n return (\n <DrawerPrimitive.Overlay\n data-slot=\"drawer-overlay\"\n className={cn(\n 'data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 bg-black/10 supports-backdrop-filter:backdrop-blur-xs fixed inset-0 z-50',\n className\n )}\n {...props}\n />\n )\n}\n\nfunction DrawerContent({ className, children, ...props }: DrawerContentProps) {\n const { size } = React.useContext(DrawerContext)\n\n return (\n <DrawerPortal data-slot=\"drawer-portal\">\n <DrawerOverlay />\n <DrawerPrimitive.Content\n data-slot=\"drawer-content\"\n className={cn(drawerContentVariants({ size }), className)}\n {...props}\n >\n <div className=\"bg-muted mt-4 h-1 w-25 rounded-full mx-auto hidden shrink-0 group-data-[vaul-drawer-direction=bottom]/drawer-content:block\" />\n {children}\n </DrawerPrimitive.Content>\n </DrawerPortal>\n )\n}\n\nfunction DrawerHeader({ className, ...props }: DrawerHeaderProps) {\n return (\n <div\n data-slot=\"drawer-header\"\n className={cn(\n 'gap-0.5 p-4 group-data-[vaul-drawer-direction=bottom]/drawer-content:text-center group-data-[vaul-drawer-direction=top]/drawer-content:text-center md:gap-0.5 md:text-left flex flex-col',\n className\n )}\n {...props}\n />\n )\n}\n\nfunction DrawerFooter({ className, ...props }: DrawerFooterProps) {\n return <div data-slot=\"drawer-footer\" className={cn('gap-2 p-4 mt-auto flex flex-col', className)} {...props} />\n}\n\nfunction DrawerTitle({ className, ...props }: DrawerTitleProps) {\n return (\n <DrawerPrimitive.Title\n data-slot=\"drawer-title\"\n className={cn('text-foreground text-base font-medium', className)}\n {...props}\n />\n )\n}\n\nfunction DrawerDescription({ className, ...props }: DrawerDescriptionProps) {\n return (\n <DrawerPrimitive.Description\n data-slot=\"drawer-description\"\n className={cn('text-muted-foreground text-sm', className)}\n {...props}\n />\n )\n}\n\nexport {\n Drawer,\n DrawerClose,\n DrawerContent,\n DrawerDescription,\n DrawerFooter,\n DrawerHeader,\n DrawerOverlay,\n DrawerPortal,\n DrawerTitle,\n DrawerTrigger\n}\n"],"mappings":"4LAOA,MAAM,EAAwB,EAC5B,mxBACA,CACE,SAAU,CACR,KAAM,CACJ,GAAI,gWACJ,GAAI,gWACJ,GAAI,oWACL,CACF,CACD,gBAAiB,CACf,KAAM,KACP,CACF,CACF,CAQK,EAAgB,EAAM,cAAkC,CAC5D,KAAM,KACP,CAAC,CAwBF,SAAS,EAAO,CAAE,OAAO,KAAM,GAAG,GAAsB,CACtD,IAAM,EAAe,EAAM,aAAmC,CAAE,OAAM,EAAG,CAAC,EAAK,CAAC,CAEhF,OACE,EAAC,EAAc,SAAA,CAAS,MAAO,WAC7B,EAACA,EAAgB,KAAA,CAAK,YAAU,SAAS,GAAI,GAAS,EAC/B,CAI7B,SAAS,EAAc,CAAE,GAAG,GAA6B,CACvD,OAAO,EAACA,EAAgB,QAAA,CAAQ,YAAU,iBAAiB,GAAI,GAAS,CAG1E,SAAS,EAAa,CAAE,GAAG,GAA4B,CACrD,OAAO,EAACA,EAAgB,OAAA,CAAO,YAAU,gBAAgB,GAAI,GAAS,CAGxE,SAAS,EAAY,CAAE,GAAG,GAA2B,CACnD,OAAO,EAACA,EAAgB,MAAA,CAAM,YAAU,eAAe,GAAI,GAAS,CAGtE,SAAS,EAAc,CAAE,YAAW,GAAG,GAA6B,CAClE,OACE,EAACA,EAAgB,QAAA,CACf,YAAU,iBACV,UAAW,EACT,mKACA,EACD,CACD,GAAI,GACJ,CAIN,SAAS,EAAc,CAAE,YAAW,WAAU,GAAG,GAA6B,CAC5E,GAAM,CAAE,QAAS,EAAM,WAAW,EAAc,CAEhD,OACE,EAAC,EAAA,CAAa,YAAU,0BACtB,EAAC,EAAA,EAAA,CAAgB,CACjB,EAACA,EAAgB,QAAA,CACf,YAAU,iBACV,UAAW,EAAG,EAAsB,CAAE,OAAM,CAAC,CAAE,EAAU,CACzD,GAAI,YAEJ,EAAC,MAAA,CAAI,UAAU,6HAAA,CAA+H,CAC7I,EAAA,EACuB,CAAA,EACb,CAInB,SAAS,EAAa,CAAE,YAAW,GAAG,GAA4B,CAChE,OACE,EAAC,MAAA,CACC,YAAU,gBACV,UAAW,EACT,2LACA,EACD,CACD,GAAI,GACJ,CAIN,SAAS,EAAa,CAAE,YAAW,GAAG,GAA4B,CAChE,OAAO,EAAC,MAAA,CAAI,YAAU,gBAAgB,UAAW,EAAG,kCAAmC,EAAU,CAAE,GAAI,GAAS,CAGlH,SAAS,EAAY,CAAE,YAAW,GAAG,GAA2B,CAC9D,OACE,EAACA,EAAgB,MAAA,CACf,YAAU,eACV,UAAW,EAAG,wCAAyC,EAAU,CACjE,GAAI,GACJ,CAIN,SAAS,EAAkB,CAAE,YAAW,GAAG,GAAiC,CAC1E,OACE,EAACA,EAAgB,YAAA,CACf,YAAU,qBACV,UAAW,EAAG,gCAAiC,EAAU,CACzD,GAAI,GACJ"}
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import { VariantProps } from "class-variance-authority";
|
|
2
|
+
import * as react_jsx_runtime0 from "react/jsx-runtime";
|
|
3
|
+
import * as class_variance_authority_types0 from "class-variance-authority/types";
|
|
4
|
+
|
|
5
|
+
//#region src/components/empty.d.ts
|
|
6
|
+
type EmptyProps = React.ComponentProps<'div'>;
|
|
7
|
+
type EmptyHeaderProps = React.ComponentProps<'div'>;
|
|
8
|
+
type EmptyMediaProps = React.ComponentProps<'div'> & VariantProps<typeof emptyMediaVariants>;
|
|
9
|
+
type EmptyTitleProps = React.ComponentProps<'div'>;
|
|
10
|
+
type EmptyDescriptionProps = React.ComponentProps<'p'>;
|
|
11
|
+
type EmptyContentProps = React.ComponentProps<'div'>;
|
|
12
|
+
declare function Empty({
|
|
13
|
+
className,
|
|
14
|
+
...props
|
|
15
|
+
}: EmptyProps): react_jsx_runtime0.JSX.Element;
|
|
16
|
+
declare function EmptyHeader({
|
|
17
|
+
className,
|
|
18
|
+
...props
|
|
19
|
+
}: EmptyHeaderProps): react_jsx_runtime0.JSX.Element;
|
|
20
|
+
declare const emptyMediaVariants: (props?: ({
|
|
21
|
+
variant?: "default" | "icon" | null | undefined;
|
|
22
|
+
} & class_variance_authority_types0.ClassProp) | undefined) => string;
|
|
23
|
+
declare function EmptyMedia({
|
|
24
|
+
className,
|
|
25
|
+
variant,
|
|
26
|
+
...props
|
|
27
|
+
}: EmptyMediaProps): react_jsx_runtime0.JSX.Element;
|
|
28
|
+
declare function EmptyTitle({
|
|
29
|
+
className,
|
|
30
|
+
...props
|
|
31
|
+
}: EmptyTitleProps): react_jsx_runtime0.JSX.Element;
|
|
32
|
+
declare function EmptyDescription({
|
|
33
|
+
className,
|
|
34
|
+
...props
|
|
35
|
+
}: EmptyDescriptionProps): react_jsx_runtime0.JSX.Element;
|
|
36
|
+
declare function EmptyContent({
|
|
37
|
+
className,
|
|
38
|
+
...props
|
|
39
|
+
}: EmptyContentProps): react_jsx_runtime0.JSX.Element;
|
|
40
|
+
//#endregion
|
|
41
|
+
export { Empty, EmptyContent, EmptyContentProps, EmptyDescription, EmptyDescriptionProps, EmptyHeader, EmptyHeaderProps, EmptyMedia, EmptyMediaProps, EmptyProps, EmptyTitle, EmptyTitleProps };
|
|
42
|
+
//# sourceMappingURL=empty.d.ts.map
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{cn as e}from"../lib/utils.js";import{cva as t}from"class-variance-authority";import{jsx as n}from"react/jsx-runtime";function r({className:t,...r}){return n(`div`,{"data-slot":`empty`,className:e(`gap-4 rounded-xl border-dashed p-6 flex w-full min-w-0 flex-1 flex-col items-center justify-center text-center text-balance`,t),...r})}function i({className:t,...r}){return n(`div`,{"data-slot":`empty-header`,className:e(`gap-2 flex max-w-sm flex-col items-center`,t),...r})}const a=t(`mb-2 flex shrink-0 items-center justify-center [&_svg]:pointer-events-none [&_svg]:shrink-0`,{variants:{variant:{default:`bg-transparent`,icon:`bg-muted text-foreground flex size-8 shrink-0 items-center justify-center rounded-lg [&_svg:not([class*='size-'])]:size-4`}},defaultVariants:{variant:`default`}});function o({className:t,variant:r=`default`,...i}){return n(`div`,{"data-slot":`empty-icon`,"data-variant":r,className:e(a({variant:r,className:t})),...i})}function s({className:t,...r}){return n(`div`,{"data-slot":`empty-title`,className:e(`text-sm font-medium tracking-tight`,t),...r})}function c({className:t,...r}){return n(`div`,{"data-slot":`empty-description`,className:e(`text-sm/relaxed text-muted-foreground [&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4`,t),...r})}function l({className:t,...r}){return n(`div`,{"data-slot":`empty-content`,className:e(`gap-2.5 text-sm flex w-full max-w-sm min-w-0 flex-col items-center text-balance`,t),...r})}export{r as Empty,l as EmptyContent,c as EmptyDescription,i as EmptyHeader,o as EmptyMedia,s as EmptyTitle};
|
|
2
|
+
//# sourceMappingURL=empty.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"empty.js","names":[],"sources":["../../src/components/empty.tsx"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority'\n\nimport { cn } from '../lib/utils'\n\nexport type EmptyProps = React.ComponentProps<'div'>\n\nexport type EmptyHeaderProps = React.ComponentProps<'div'>\n\nexport type EmptyMediaProps = React.ComponentProps<'div'> & VariantProps<typeof emptyMediaVariants>\n\nexport type EmptyTitleProps = React.ComponentProps<'div'>\n\nexport type EmptyDescriptionProps = React.ComponentProps<'p'>\n\nexport type EmptyContentProps = React.ComponentProps<'div'>\n\nfunction Empty({ className, ...props }: EmptyProps) {\n return (\n <div\n data-slot=\"empty\"\n className={cn(\n 'gap-4 rounded-xl border-dashed p-6 flex w-full min-w-0 flex-1 flex-col items-center justify-center text-center text-balance',\n className\n )}\n {...props}\n />\n )\n}\n\nfunction EmptyHeader({ className, ...props }: EmptyHeaderProps) {\n return (\n <div data-slot=\"empty-header\" className={cn('gap-2 flex max-w-sm flex-col items-center', className)} {...props} />\n )\n}\n\nconst emptyMediaVariants = cva(\n 'mb-2 flex shrink-0 items-center justify-center [&_svg]:pointer-events-none [&_svg]:shrink-0',\n {\n variants: {\n variant: {\n default: 'bg-transparent',\n icon: \"bg-muted text-foreground flex size-8 shrink-0 items-center justify-center rounded-lg [&_svg:not([class*='size-'])]:size-4\"\n }\n },\n defaultVariants: {\n variant: 'default'\n }\n }\n)\n\nfunction EmptyMedia({ className, variant = 'default', ...props }: EmptyMediaProps) {\n return (\n <div\n data-slot=\"empty-icon\"\n data-variant={variant}\n className={cn(emptyMediaVariants({ variant, className }))}\n {...props}\n />\n )\n}\n\nfunction EmptyTitle({ className, ...props }: EmptyTitleProps) {\n return <div data-slot=\"empty-title\" className={cn('text-sm font-medium tracking-tight', className)} {...props} />\n}\n\nfunction EmptyDescription({ className, ...props }: EmptyDescriptionProps) {\n return (\n <div\n data-slot=\"empty-description\"\n className={cn(\n 'text-sm/relaxed text-muted-foreground [&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4',\n className\n )}\n {...props}\n />\n )\n}\n\nfunction EmptyContent({ className, ...props }: EmptyContentProps) {\n return (\n <div\n data-slot=\"empty-content\"\n className={cn('gap-2.5 text-sm flex w-full max-w-sm min-w-0 flex-col items-center text-balance', className)}\n {...props}\n />\n )\n}\n\nexport { Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle }\n"],"mappings":"4HAgBA,SAAS,EAAM,CAAE,YAAW,GAAG,GAAqB,CAClD,OACE,EAAC,MAAA,CACC,YAAU,QACV,UAAW,EACT,8HACA,EACD,CACD,GAAI,GACJ,CAIN,SAAS,EAAY,CAAE,YAAW,GAAG,GAA2B,CAC9D,OACE,EAAC,MAAA,CAAI,YAAU,eAAe,UAAW,EAAG,4CAA6C,EAAU,CAAE,GAAI,GAAS,CAItH,MAAM,EAAqB,EACzB,8FACA,CACE,SAAU,CACR,QAAS,CACP,QAAS,iBACT,KAAM,4HACP,CACF,CACD,gBAAiB,CACf,QAAS,UACV,CACF,CACF,CAED,SAAS,EAAW,CAAE,YAAW,UAAU,UAAW,GAAG,GAA0B,CACjF,OACE,EAAC,MAAA,CACC,YAAU,aACV,eAAc,EACd,UAAW,EAAG,EAAmB,CAAE,UAAS,YAAW,CAAC,CAAC,CACzD,GAAI,GACJ,CAIN,SAAS,EAAW,CAAE,YAAW,GAAG,GAA0B,CAC5D,OAAO,EAAC,MAAA,CAAI,YAAU,cAAc,UAAW,EAAG,qCAAsC,EAAU,CAAE,GAAI,GAAS,CAGnH,SAAS,EAAiB,CAAE,YAAW,GAAG,GAAgC,CACxE,OACE,EAAC,MAAA,CACC,YAAU,oBACV,UAAW,EACT,0GACA,EACD,CACD,GAAI,GACJ,CAIN,SAAS,EAAa,CAAE,YAAW,GAAG,GAA4B,CAChE,OACE,EAAC,MAAA,CACC,YAAU,gBACV,UAAW,EAAG,kFAAmF,EAAU,CAC3G,GAAI,GACJ"}
|
|
@@ -0,0 +1,75 @@
|
|
|
1
|
+
import { Label } from "./label.js";
|
|
2
|
+
import { VariantProps } from "class-variance-authority";
|
|
3
|
+
import * as react_jsx_runtime0 from "react/jsx-runtime";
|
|
4
|
+
import * as class_variance_authority_types0 from "class-variance-authority/types";
|
|
5
|
+
|
|
6
|
+
//#region src/components/field.d.ts
|
|
7
|
+
type FieldSetProps = React.ComponentProps<'fieldset'>;
|
|
8
|
+
type FieldLegendProps = React.ComponentProps<'legend'> & {
|
|
9
|
+
variant?: 'legend' | 'label';
|
|
10
|
+
};
|
|
11
|
+
type FieldGroupProps = React.ComponentProps<'div'>;
|
|
12
|
+
type FieldContentProps = React.ComponentProps<'div'>;
|
|
13
|
+
type FieldLabelProps = React.ComponentProps<typeof Label>;
|
|
14
|
+
type FieldTitleProps = React.ComponentProps<'div'>;
|
|
15
|
+
type FieldDescriptionProps = React.ComponentProps<'p'>;
|
|
16
|
+
type FieldSeparatorProps = React.ComponentProps<'div'> & {
|
|
17
|
+
children?: React.ReactNode;
|
|
18
|
+
};
|
|
19
|
+
type FieldErrorProps = React.ComponentProps<'div'> & {
|
|
20
|
+
errors?: Array<{
|
|
21
|
+
message?: string;
|
|
22
|
+
} | undefined>;
|
|
23
|
+
};
|
|
24
|
+
declare function FieldSet({
|
|
25
|
+
className,
|
|
26
|
+
...props
|
|
27
|
+
}: FieldSetProps): react_jsx_runtime0.JSX.Element;
|
|
28
|
+
declare function FieldLegend({
|
|
29
|
+
className,
|
|
30
|
+
variant,
|
|
31
|
+
...props
|
|
32
|
+
}: FieldLegendProps): react_jsx_runtime0.JSX.Element;
|
|
33
|
+
declare function FieldGroup({
|
|
34
|
+
className,
|
|
35
|
+
...props
|
|
36
|
+
}: FieldGroupProps): react_jsx_runtime0.JSX.Element;
|
|
37
|
+
declare const fieldVariants: (props?: ({
|
|
38
|
+
orientation?: "vertical" | "horizontal" | "responsive" | null | undefined;
|
|
39
|
+
} & class_variance_authority_types0.ClassProp) | undefined) => string;
|
|
40
|
+
type FieldProps = React.ComponentProps<'div'> & VariantProps<typeof fieldVariants>;
|
|
41
|
+
declare function Field({
|
|
42
|
+
className,
|
|
43
|
+
orientation,
|
|
44
|
+
...props
|
|
45
|
+
}: FieldProps): react_jsx_runtime0.JSX.Element;
|
|
46
|
+
declare function FieldContent({
|
|
47
|
+
className,
|
|
48
|
+
...props
|
|
49
|
+
}: FieldContentProps): react_jsx_runtime0.JSX.Element;
|
|
50
|
+
declare function FieldLabel({
|
|
51
|
+
className,
|
|
52
|
+
...props
|
|
53
|
+
}: FieldLabelProps): react_jsx_runtime0.JSX.Element;
|
|
54
|
+
declare function FieldTitle({
|
|
55
|
+
className,
|
|
56
|
+
...props
|
|
57
|
+
}: FieldTitleProps): react_jsx_runtime0.JSX.Element;
|
|
58
|
+
declare function FieldDescription({
|
|
59
|
+
className,
|
|
60
|
+
...props
|
|
61
|
+
}: FieldDescriptionProps): react_jsx_runtime0.JSX.Element;
|
|
62
|
+
declare function FieldSeparator({
|
|
63
|
+
children,
|
|
64
|
+
className,
|
|
65
|
+
...props
|
|
66
|
+
}: FieldSeparatorProps): react_jsx_runtime0.JSX.Element;
|
|
67
|
+
declare function FieldError({
|
|
68
|
+
className,
|
|
69
|
+
children,
|
|
70
|
+
errors,
|
|
71
|
+
...props
|
|
72
|
+
}: FieldErrorProps): react_jsx_runtime0.JSX.Element | null;
|
|
73
|
+
//#endregion
|
|
74
|
+
export { Field, FieldContent, FieldContentProps, FieldDescription, FieldDescriptionProps, FieldError, FieldErrorProps, FieldGroup, FieldGroupProps, FieldLabel, FieldLabelProps, FieldLegend, FieldLegendProps, FieldProps, FieldSeparator, FieldSeparatorProps, FieldSet, FieldSetProps, FieldTitle, FieldTitleProps };
|
|
75
|
+
//# sourceMappingURL=field.d.ts.map
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{cn as e}from"../lib/utils.js";import{Label as t}from"./label.js";import{Separator as n}from"./separator.js";import{cva as r}from"class-variance-authority";import{jsx as i,jsxs as a}from"react/jsx-runtime";import{useMemo as o}from"react";function s({className:t,...n}){return i(`fieldset`,{"data-slot":`field-set`,className:e(`gap-4 has-[>[data-slot=checkbox-group]]:gap-3 has-[>[data-slot=radio-group]]:gap-3 flex flex-col`,t),...n})}function c({className:t,variant:n=`legend`,...r}){return i(`legend`,{"data-slot":`field-legend`,"data-variant":n,className:e(`mb-1.5 font-medium data-[variant=label]:text-sm data-[variant=legend]:text-base`,t),...r})}function l({className:t,...n}){return i(`div`,{"data-slot":`field-group`,className:e(`gap-5 data-[slot=checkbox-group]:gap-3 *:data-[slot=field-group]:gap-4 group/field-group @container/field-group flex w-full flex-col`,t),...n})}const u=r(`data-[invalid=true]:text-destructive gap-2 group/field flex w-full`,{variants:{orientation:{vertical:`flex-col *:w-full [&>.sr-only]:w-auto`,horizontal:`flex-row items-center *:data-[slot=field-label]:flex-auto has-[>[data-slot=field-content]]:items-start has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px`,responsive:`flex-col *:w-full [&>.sr-only]:w-auto @md/field-group:flex-row @md/field-group:items-center @md/field-group:*:w-auto @md/field-group:*:data-[slot=field-label]:flex-auto @md/field-group:has-[>[data-slot=field-content]]:items-start @md/field-group:has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px`}},defaultVariants:{orientation:`vertical`}});function d({className:t,orientation:n=`vertical`,...r}){return i(`div`,{role:`group`,"data-slot":`field`,"data-orientation":n,className:e(u({orientation:n}),t),...r})}function f({className:t,...n}){return i(`div`,{"data-slot":`field-content`,className:e(`gap-0.5 group/field-content flex flex-1 flex-col leading-snug`,t),...n})}function p({className:n,...r}){return i(t,{"data-slot":`field-label`,className:e(`has-data-checked:bg-primary/5 has-data-checked:border-primary/30 dark:has-data-checked:border-primary/20 dark:has-data-checked:bg-primary/10 gap-2 group-data-[disabled=true]/field:opacity-50 has-[>[data-slot=field]]:rounded-lg has-[>[data-slot=field]]:border *:data-[slot=field]:p-2.5 group/field-label peer/field-label flex w-fit leading-snug`,`has-[>[data-slot=field]]:w-full has-[>[data-slot=field]]:flex-col`,n),...r})}function m({className:t,...n}){return i(`div`,{"data-slot":`field-label`,className:e(`gap-2 text-sm font-medium group-data-[disabled=true]/field:opacity-50 flex w-fit items-center leading-snug`,t),...n})}function h({className:t,...n}){return i(`p`,{"data-slot":`field-description`,className:e(`text-muted-foreground text-left text-sm [[data-variant=legend]+&]:-mt-1.5 leading-normal font-normal group-has-data-horizontal/field:text-balance`,`last:mt-0 nth-last-2:-mt-1`,`[&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4`,t),...n})}function g({children:t,className:r,...o}){return a(`div`,{"data-slot":`field-separator`,"data-content":!!t,className:e(`-my-2 h-5 text-sm group-data-[variant=outline]/field-group:-mb-2 relative`,r),...o,children:[i(n,{className:`absolute inset-0 top-1/2`}),t&&i(`span`,{className:`text-muted-foreground px-2 bg-background relative mx-auto block w-fit`,"data-slot":`field-separator-content`,children:t})]})}function _({className:t,children:n,errors:r,...a}){let s=o(()=>{if(n)return n;if(!r?.length)return null;let e=[...new Map(r.map(e=>[e?.message,e])).values()];return e?.length===1?e[0]?.message:i(`ul`,{className:`ml-4 flex list-disc flex-col gap-1`,children:e.map((e,t)=>e?.message&&i(`li`,{children:e.message},String(t)))})},[n,r]);return s?i(`div`,{role:`alert`,"data-slot":`field-error`,className:e(`text-destructive text-sm font-normal`,t),...a,children:s}):null}export{d as Field,f as FieldContent,h as FieldDescription,_ as FieldError,l as FieldGroup,p as FieldLabel,c as FieldLegend,g as FieldSeparator,s as FieldSet,m as FieldTitle};
|
|
2
|
+
//# sourceMappingURL=field.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"field.js","names":[],"sources":["../../src/components/field.tsx"],"sourcesContent":["/** biome-ignore-all lint/a11y/useSemanticElements: ignore */\n\nimport { useMemo } from 'react'\n\nimport { Label } from '@uselets/ui/label'\nimport { Separator } from '@uselets/ui/separator'\nimport { cva, type VariantProps } from 'class-variance-authority'\n\nimport { cn } from '../lib/utils'\n\nexport type FieldSetProps = React.ComponentProps<'fieldset'>\n\nexport type FieldLegendProps = React.ComponentProps<'legend'> & { variant?: 'legend' | 'label' }\n\nexport type FieldGroupProps = React.ComponentProps<'div'>\n\nexport type FieldContentProps = React.ComponentProps<'div'>\n\nexport type FieldLabelProps = React.ComponentProps<typeof Label>\n\nexport type FieldTitleProps = React.ComponentProps<'div'>\n\nexport type FieldDescriptionProps = React.ComponentProps<'p'>\n\nexport type FieldSeparatorProps = React.ComponentProps<'div'> & {\n children?: React.ReactNode\n}\n\nexport type FieldErrorProps = React.ComponentProps<'div'> & {\n errors?: Array<{ message?: string } | undefined>\n}\n\nfunction FieldSet({ className, ...props }: FieldSetProps) {\n return (\n <fieldset\n data-slot=\"field-set\"\n className={cn(\n 'gap-4 has-[>[data-slot=checkbox-group]]:gap-3 has-[>[data-slot=radio-group]]:gap-3 flex flex-col',\n className\n )}\n {...props}\n />\n )\n}\n\nfunction FieldLegend({ className, variant = 'legend', ...props }: FieldLegendProps) {\n return (\n <legend\n data-slot=\"field-legend\"\n data-variant={variant}\n className={cn('mb-1.5 font-medium data-[variant=label]:text-sm data-[variant=legend]:text-base', className)}\n {...props}\n />\n )\n}\n\nfunction FieldGroup({ className, ...props }: FieldGroupProps) {\n return (\n <div\n data-slot=\"field-group\"\n className={cn(\n 'gap-5 data-[slot=checkbox-group]:gap-3 *:data-[slot=field-group]:gap-4 group/field-group @container/field-group flex w-full flex-col',\n className\n )}\n {...props}\n />\n )\n}\n\nconst fieldVariants = cva('data-[invalid=true]:text-destructive gap-2 group/field flex w-full', {\n variants: {\n orientation: {\n vertical: 'flex-col *:w-full [&>.sr-only]:w-auto',\n horizontal:\n 'flex-row items-center *:data-[slot=field-label]:flex-auto has-[>[data-slot=field-content]]:items-start has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px',\n responsive:\n 'flex-col *:w-full [&>.sr-only]:w-auto @md/field-group:flex-row @md/field-group:items-center @md/field-group:*:w-auto @md/field-group:*:data-[slot=field-label]:flex-auto @md/field-group:has-[>[data-slot=field-content]]:items-start @md/field-group:has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px'\n }\n },\n defaultVariants: {\n orientation: 'vertical'\n }\n})\n\nexport type FieldProps = React.ComponentProps<'div'> & VariantProps<typeof fieldVariants>\n\nfunction Field({ className, orientation = 'vertical', ...props }: FieldProps) {\n return (\n <div\n role=\"group\"\n data-slot=\"field\"\n data-orientation={orientation}\n className={cn(fieldVariants({ orientation }), className)}\n {...props}\n />\n )\n}\n\nfunction FieldContent({ className, ...props }: FieldContentProps) {\n return (\n <div\n data-slot=\"field-content\"\n className={cn('gap-0.5 group/field-content flex flex-1 flex-col leading-snug', className)}\n {...props}\n />\n )\n}\n\nfunction FieldLabel({ className, ...props }: FieldLabelProps) {\n return (\n <Label\n data-slot=\"field-label\"\n className={cn(\n 'has-data-checked:bg-primary/5 has-data-checked:border-primary/30 dark:has-data-checked:border-primary/20 dark:has-data-checked:bg-primary/10 gap-2 group-data-[disabled=true]/field:opacity-50 has-[>[data-slot=field]]:rounded-lg has-[>[data-slot=field]]:border *:data-[slot=field]:p-2.5 group/field-label peer/field-label flex w-fit leading-snug',\n 'has-[>[data-slot=field]]:w-full has-[>[data-slot=field]]:flex-col',\n className\n )}\n {...props}\n />\n )\n}\n\nfunction FieldTitle({ className, ...props }: FieldTitleProps) {\n return (\n <div\n data-slot=\"field-label\"\n className={cn(\n 'gap-2 text-sm font-medium group-data-[disabled=true]/field:opacity-50 flex w-fit items-center leading-snug',\n className\n )}\n {...props}\n />\n )\n}\n\nfunction FieldDescription({ className, ...props }: FieldDescriptionProps) {\n return (\n <p\n data-slot=\"field-description\"\n className={cn(\n 'text-muted-foreground text-left text-sm [[data-variant=legend]+&]:-mt-1.5 leading-normal font-normal group-has-data-horizontal/field:text-balance',\n 'last:mt-0 nth-last-2:-mt-1',\n '[&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4',\n className\n )}\n {...props}\n />\n )\n}\n\nfunction FieldSeparator({ children, className, ...props }: FieldSeparatorProps) {\n return (\n <div\n data-slot=\"field-separator\"\n data-content={!!children}\n className={cn('-my-2 h-5 text-sm group-data-[variant=outline]/field-group:-mb-2 relative', className)}\n {...props}\n >\n <Separator className=\"absolute inset-0 top-1/2\" />\n {children && (\n <span\n className=\"text-muted-foreground px-2 bg-background relative mx-auto block w-fit\"\n data-slot=\"field-separator-content\"\n >\n {children}\n </span>\n )}\n </div>\n )\n}\n\nfunction FieldError({ className, children, errors, ...props }: FieldErrorProps) {\n const content = useMemo(() => {\n if (children) {\n return children\n }\n\n if (!errors?.length) {\n return null\n }\n\n const uniqueErrors = [...new Map(errors.map((error) => [error?.message, error])).values()]\n\n if (uniqueErrors?.length === 1) {\n return uniqueErrors[0]?.message\n }\n\n return (\n <ul className=\"ml-4 flex list-disc flex-col gap-1\">\n {uniqueErrors.map((error, index) => error?.message && <li key={String(index)}>{error.message}</li>)}\n </ul>\n )\n }, [children, errors])\n\n if (!content) {\n return null\n }\n\n return (\n <div\n role=\"alert\"\n data-slot=\"field-error\"\n className={cn('text-destructive text-sm font-normal', className)}\n {...props}\n >\n {content}\n </div>\n )\n}\n\nexport {\n Field,\n FieldContent,\n FieldDescription,\n FieldError,\n FieldGroup,\n FieldLabel,\n FieldLegend,\n FieldSeparator,\n FieldSet,\n FieldTitle\n}\n"],"mappings":"oPAgCA,SAAS,EAAS,CAAE,YAAW,GAAG,GAAwB,CACxD,OACE,EAAC,WAAA,CACC,YAAU,YACV,UAAW,EACT,mGACA,EACD,CACD,GAAI,GACJ,CAIN,SAAS,EAAY,CAAE,YAAW,UAAU,SAAU,GAAG,GAA2B,CAClF,OACE,EAAC,SAAA,CACC,YAAU,eACV,eAAc,EACd,UAAW,EAAG,kFAAmF,EAAU,CAC3G,GAAI,GACJ,CAIN,SAAS,EAAW,CAAE,YAAW,GAAG,GAA0B,CAC5D,OACE,EAAC,MAAA,CACC,YAAU,cACV,UAAW,EACT,uIACA,EACD,CACD,GAAI,GACJ,CAIN,MAAM,EAAgB,EAAI,qEAAsE,CAC9F,SAAU,CACR,YAAa,CACX,SAAU,wCACV,WACE,iLACF,WACE,gUACH,CACF,CACD,gBAAiB,CACf,YAAa,WACd,CACF,CAAC,CAIF,SAAS,EAAM,CAAE,YAAW,cAAc,WAAY,GAAG,GAAqB,CAC5E,OACE,EAAC,MAAA,CACC,KAAK,QACL,YAAU,QACV,mBAAkB,EAClB,UAAW,EAAG,EAAc,CAAE,cAAa,CAAC,CAAE,EAAU,CACxD,GAAI,GACJ,CAIN,SAAS,EAAa,CAAE,YAAW,GAAG,GAA4B,CAChE,OACE,EAAC,MAAA,CACC,YAAU,gBACV,UAAW,EAAG,gEAAiE,EAAU,CACzF,GAAI,GACJ,CAIN,SAAS,EAAW,CAAE,YAAW,GAAG,GAA0B,CAC5D,OACE,EAAC,EAAA,CACC,YAAU,cACV,UAAW,EACT,0VACA,oEACA,EACD,CACD,GAAI,GACJ,CAIN,SAAS,EAAW,CAAE,YAAW,GAAG,GAA0B,CAC5D,OACE,EAAC,MAAA,CACC,YAAU,cACV,UAAW,EACT,6GACA,EACD,CACD,GAAI,GACJ,CAIN,SAAS,EAAiB,CAAE,YAAW,GAAG,GAAgC,CACxE,OACE,EAAC,IAAA,CACC,YAAU,oBACV,UAAW,EACT,oJACA,6BACA,oEACA,EACD,CACD,GAAI,GACJ,CAIN,SAAS,EAAe,CAAE,WAAU,YAAW,GAAG,GAA8B,CAC9E,OACE,EAAC,MAAA,CACC,YAAU,kBACV,eAAc,CAAC,CAAC,EAChB,UAAW,EAAG,4EAA6E,EAAU,CACrG,GAAI,YAEJ,EAAC,EAAA,CAAU,UAAU,2BAAA,CAA6B,CACjD,GACC,EAAC,OAAA,CACC,UAAU,wEACV,YAAU,0BAET,YACI,CAAA,EAEL,CAIV,SAAS,EAAW,CAAE,YAAW,WAAU,SAAQ,GAAG,GAA0B,CAC9E,IAAM,EAAU,MAAc,CAC5B,GAAI,EACF,OAAO,EAGT,GAAI,CAAC,GAAQ,OACX,OAAO,KAGT,IAAM,EAAe,CAAC,GAAG,IAAI,IAAI,EAAO,IAAK,GAAU,CAAC,GAAO,QAAS,EAAM,CAAC,CAAC,CAAC,QAAQ,CAAC,CAM1F,OAJI,GAAc,SAAW,EACpB,EAAa,IAAI,QAIxB,EAAC,KAAA,CAAG,UAAU,8CACX,EAAa,KAAK,EAAO,IAAU,GAAO,SAAW,EAAC,KAAA,CAAA,SAAwB,EAAM,QAAA,CAAtB,OAAO,EAAM,CAAsB,CAAC,EAChG,EAEN,CAAC,EAAU,EAAO,CAAC,CAMtB,OAJK,EAKH,EAAC,MAAA,CACC,KAAK,QACL,YAAU,cACV,UAAW,EAAG,uCAAwC,EAAU,CAChE,GAAI,WAEH,GACG,CAXC"}
|