1
- import * as React from "react"
2
- import * as DialogPrimitive from "@radix-ui/react-dialog"
3
- import { XIcon } from "lucide-react"
1
+ /* eslint-disable linebreak-style */
2
+ /* eslint-disable react/prop-types */
3
+ import * as React from 'react' ;
4
+ import * as DialogPrimitive from '@radix-ui/react-dialog' ;
5
+ import { XIcon } from 'lucide-react' ;
4
6
5
- import { cn } from " @/lib/utils"
7
+ import { cn } from ' @/lib/utils' ;
6
8
7
9
function Dialog ( {
8
10
...props
9
11
} : React . ComponentProps < typeof DialogPrimitive . Root > ) {
10
- return < DialogPrimitive . Root data-slot = " dialog" { ...props } />
12
+ return < DialogPrimitive . Root data-slot = ' dialog' { ...props } /> ;
11
13
}
12
14
13
15
function DialogTrigger ( {
14
16
...props
15
17
} : React . ComponentProps < typeof DialogPrimitive . Trigger > ) {
16
- return < DialogPrimitive . Trigger data-slot = " dialog-trigger" { ...props } />
18
+ return < DialogPrimitive . Trigger data-slot = ' dialog-trigger' { ...props } /> ;
17
19
}
18
20
19
21
function DialogPortal ( {
20
22
...props
21
23
} : React . ComponentProps < typeof DialogPrimitive . Portal > ) {
22
- return < DialogPrimitive . Portal data-slot = " dialog-portal" { ...props } />
24
+ return < DialogPrimitive . Portal data-slot = ' dialog-portal' { ...props } /> ;
23
25
}
24
26
25
27
function DialogClose ( {
26
28
...props
27
29
} : React . ComponentProps < typeof DialogPrimitive . Close > ) {
28
- return < DialogPrimitive . Close data-slot = " dialog-close" { ...props } />
30
+ return < DialogPrimitive . Close data-slot = ' dialog-close' { ...props } /> ;
29
31
}
30
32
31
33
function DialogOverlay ( {
@@ -34,14 +36,14 @@ function DialogOverlay({
34
36
} : React . ComponentProps < typeof DialogPrimitive . Overlay > ) {
35
37
return (
36
38
< DialogPrimitive . Overlay
37
- data-slot = " dialog-overlay"
39
+ data-slot = ' dialog-overlay'
38
40
className = { cn (
39
- " data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50" ,
40
- className
41
+ ' data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50' ,
42
+ className ,
41
43
) }
42
44
{ ...props }
43
45
/>
44
- )
46
+ ) ;
45
47
}
46
48
47
49
function DialogContent ( {
@@ -50,55 +52,55 @@ function DialogContent({
50
52
showCloseButton = true ,
51
53
...props
52
54
} : React . ComponentProps < typeof DialogPrimitive . Content > & {
53
- showCloseButton ?: boolean
55
+ showCloseButton ?: boolean ;
54
56
} ) {
55
57
return (
56
- < DialogPortal data-slot = " dialog-portal" >
58
+ < DialogPortal data-slot = ' dialog-portal' >
57
59
< DialogOverlay />
58
60
< DialogPrimitive . Content
59
- data-slot = " dialog-content"
61
+ data-slot = ' dialog-content'
60
62
className = { cn (
61
- " bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border p-6 shadow-lg duration-200 sm:max-w-lg" ,
62
- className
63
+ ' bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border p-6 shadow-lg duration-200 sm:max-w-lg' ,
64
+ className ,
63
65
) }
64
66
{ ...props }
65
67
>
66
68
{ children }
67
69
{ showCloseButton && (
68
70
< DialogPrimitive . Close
69
- data-slot = " dialog-close"
71
+ data-slot = ' dialog-close'
70
72
className = "ring-offset-background focus:ring-ring data-[state=open]:bg-accent data-[state=open]:text-muted-foreground absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4"
71
73
>
72
74
< XIcon />
73
- < span className = " sr-only" > Close</ span >
75
+ < span className = ' sr-only' > Close</ span >
74
76
</ DialogPrimitive . Close >
75
77
) }
76
78
</ DialogPrimitive . Content >
77
79
</ DialogPortal >
78
- )
80
+ ) ;
79
81
}
80
82
81
- function DialogHeader ( { className, ...props } : React . ComponentProps < " div" > ) {
83
+ function DialogHeader ( { className, ...props } : React . ComponentProps < ' div' > ) {
82
84
return (
83
85
< div
84
- data-slot = " dialog-header"
85
- className = { cn ( " flex flex-col gap-2 text-center sm:text-left" , className ) }
86
+ data-slot = ' dialog-header'
87
+ className = { cn ( ' flex flex-col gap-2 text-center sm:text-left' , className ) }
86
88
{ ...props }
87
89
/>
88
- )
90
+ ) ;
89
91
}
90
92
91
- function DialogFooter ( { className, ...props } : React . ComponentProps < " div" > ) {
93
+ function DialogFooter ( { className, ...props } : React . ComponentProps < ' div' > ) {
92
94
return (
93
95
< div
94
- data-slot = " dialog-footer"
96
+ data-slot = ' dialog-footer'
95
97
className = { cn (
96
- " flex flex-col-reverse gap-2 sm:flex-row sm:justify-end" ,
97
- className
98
+ ' flex flex-col-reverse gap-2 sm:flex-row sm:justify-end' ,
99
+ className ,
98
100
) }
99
101
{ ...props }
100
102
/>
101
- )
103
+ ) ;
102
104
}
103
105
104
106
function DialogTitle ( {
@@ -107,11 +109,11 @@ function DialogTitle({
107
109
} : React . ComponentProps < typeof DialogPrimitive . Title > ) {
108
110
return (
109
111
< DialogPrimitive . Title
110
- data-slot = " dialog-title"
111
- className = { cn ( " text-lg leading-none font-semibold" , className ) }
112
+ data-slot = ' dialog-title'
113
+ className = { cn ( ' text-lg leading-none font-semibold' , className ) }
112
114
{ ...props }
113
115
/>
114
- )
116
+ ) ;
115
117
}
116
118
117
119
function DialogDescription ( {
@@ -120,11 +122,11 @@ function DialogDescription({
120
122
} : React . ComponentProps < typeof DialogPrimitive . Description > ) {
121
123
return (
122
124
< DialogPrimitive . Description
123
- data-slot = " dialog-description"
124
- className = { cn ( " text-muted-foreground text-sm" , className ) }
125
+ data-slot = ' dialog-description'
126
+ className = { cn ( ' text-muted-foreground text-sm' , className ) }
125
127
{ ...props }
126
128
/>
127
- )
129
+ ) ;
128
130
}
129
131
130
132
export {
@@ -138,4 +140,4 @@ export {
138
140
DialogPortal ,
139
141
DialogTitle ,
140
142
DialogTrigger ,
141
- }
143
+ } ;
0 commit comments