@inspirare/design-system 0.0.26 → 0.0.28

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.
Files changed (7) hide show
  1. package/dist/components/ui/alert-dialog.js +10 -6
  2. package/dist/components/ui/dialog.js +21 -17
  3. package/dist/index.css +1 -1
  4. package/package.json +1 -1
  5. package/src/components/ui/alert-dialog.tsx +15 -10
  6. package/src/components/ui/dialog.tsx +31 -26
  7. package/src/index.css +0 -28
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@inspirare/design-system",
3
3
  "private": false,
4
- "version": "0.0.26",
4
+ "version": "0.0.28",
5
5
  "type": "module",
6
6
  "sideEffects": [
7
7
  "*.css"
package/src/components/ui/alert-dialog.tsx CHANGED
@@ -30,7 +30,7 @@ function AlertDialogOverlay({
30
30
  <AlertDialogPrimitive.Backdrop
31
31
  data-slot="alert-dialog-overlay"
32
32
  className={cn(
33
- "fixed inset-0 isolate z-50 bg-black/10 duration-100 supports-backdrop-filter:backdrop-blur-xs data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0",
33
+ "fixed inset-0 isolate z-50 bg-black/60 backdrop-blur-sm duration-100 data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0",
34
34
  className
35
35
  )}
36
36
  {...props}
@@ -48,15 +48,20 @@ function AlertDialogContent({
48
48
  return (
49
49
  <AlertDialogPortal>
50
50
  <AlertDialogOverlay />
51
- <AlertDialogPrimitive.Popup
52
- data-slot="alert-dialog-content"
53
- data-size={size}
54
- className={cn(
55
- "group/alert-dialog-content fixed inset-0 m-auto z-50 grid w-full max-h-[88dvh] h-fit gap-4 rounded-xl bg-popover p-4 text-popover-foreground ring-1 ring-foreground/10 duration-100 outline-none data-[size=default]:max-w-xs data-[size=sm]:max-w-xs data-[size=default]:sm:max-w-sm data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
56
- className
57
- )}
58
- {...props}
59
- />
51
+ <AlertDialogPrimitive.Viewport
52
+ data-slot="alert-dialog-viewport"
53
+ className="fixed inset-0 z-50 grid place-items-center overflow-y-auto p-4 sm:p-6 pointer-events-none"
54
+ >
55
+ <AlertDialogPrimitive.Popup
56
+ data-slot="alert-dialog-content"
57
+ data-size={size}
58
+ className={cn(
59
+ "pointer-events-auto relative z-50 my-auto grid w-full max-h-[85dvh] overflow-y-auto gap-4 rounded-xl bg-popover p-4 text-popover-foreground ring-1 ring-foreground/10 duration-100 outline-none data-[size=default]:max-w-xs data-[size=sm]:max-w-xs data-[size=default]:sm:max-w-sm data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
60
+ className
61
+ )}
62
+ {...props}
63
+ />
64
+ </AlertDialogPrimitive.Viewport>
60
65
  </AlertDialogPortal>
61
66
  )
62
67
  }
package/src/components/ui/dialog.tsx CHANGED
@@ -39,7 +39,7 @@ function DialogOverlay({
39
39
  <DialogPrimitive.Backdrop
40
40
  data-slot="dialog-overlay"
41
41
  className={cn(
42
- "fixed inset-0 isolate z-50 bg-black/80 backdrop-blur-sm duration-200 data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0",
42
+ "fixed inset-0 isolate z-50 bg-black/60 backdrop-blur-sm duration-200 data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0",
43
43
  className
44
44
  )}
45
45
  {...props}
@@ -54,32 +54,37 @@ const DialogContent = React.forwardRef<
54
54
  return (
55
55
  <DialogPortal>
56
56
  <DialogOverlay />
57
- <DialogPrimitive.Popup
58
- ref={ref}
59
- data-slot="dialog-content"
60
- className={cn(
61
- "fixed inset-0 m-auto z-50 grid w-[90vw] max-w-lg max-h-[88dvh] h-fit gap-4 rounded-2xl bg-popover/90 backdrop-blur-xl p-6 text-sm text-popover-foreground shadow-2xl ring-1 ring-border duration-200 outline-none data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
62
- className
63
- )}
64
- {...props}
57
+ <DialogPrimitive.Viewport
58
+ data-slot="dialog-viewport"
59
+ className="fixed inset-0 z-50 grid place-items-center overflow-y-auto p-4 sm:p-6 pointer-events-none"
65
60
  >
66
- {children}
67
- {showCloseButton && (
68
- <DialogPrimitive.Close
69
- data-slot="dialog-close"
70
- render={
71
- <Button
72
- variant="ghost"
73
- className="absolute top-4 right-4 rounded-full"
74
- size="icon-sm"
75
- />
76
- }
77
- >
78
- <XIcon />
79
- <span className="sr-only">Close</span>
80
- </DialogPrimitive.Close>
81
- )}
82
- </DialogPrimitive.Popup>
61
+ <DialogPrimitive.Popup
62
+ ref={ref}
63
+ data-slot="dialog-content"
64
+ className={cn(
65
+ "pointer-events-auto relative z-50 my-auto grid w-[90vw] max-w-lg max-h-[85dvh] overflow-y-auto gap-4 rounded-2xl bg-popover/95 backdrop-blur-xl p-6 text-sm text-popover-foreground shadow-2xl ring-1 ring-border duration-200 outline-none data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
66
+ className
67
+ )}
68
+ {...props}
69
+ >
70
+ {children}
71
+ {showCloseButton && (
72
+ <DialogPrimitive.Close
73
+ data-slot="dialog-close"
74
+ render={
75
+ <Button
76
+ variant="ghost"
77
+ className="absolute top-4 right-4 rounded-full"
78
+ size="icon-sm"
79
+ />
80
+ }
81
+ >
82
+ <XIcon />
83
+ <span className="sr-only">Close</span>
84
+ </DialogPrimitive.Close>
85
+ )}
86
+ </DialogPrimitive.Popup>
87
+ </DialogPrimitive.Viewport>
83
88
  </DialogPortal>
84
89
  )
85
90
  })
package/src/index.css CHANGED
@@ -3,34 +3,6 @@
3
3
  @import "shadcn/tailwind.css";
4
4
  @custom-variant dark (&:is(.dark *));
5
5
 
6
- /* ── Universal Dialog Viewport Centering & Boundary Safety ── */
7
- [data-slot="dialog-content"],
8
- [data-slot="alert-dialog-content"],
9
- [data-radix-dialog-content],
10
- div[role="dialog"],
11
- div[role="alertdialog"] {
12
- position: fixed !important;
13
- inset: 0 !important;
14
- top: 0 !important;
15
- right: 0 !important;
16
- bottom: 0 !important;
17
- left: 0 !important;
18
- margin: auto !important;
19
- max-height: 88vh !important;
20
- max-height: 88dvh !important;
21
- height: fit-content !important;
22
- }
23
-
24
- [data-slot="dialog-overlay"],
25
- [data-slot="alert-dialog-overlay"],
26
- [data-radix-dialog-overlay] {
27
- position: fixed !important;
28
- inset: 0 !important;
29
- top: 0 !important;
30
- right: 0 !important;
31
- bottom: 0 !important;
32
- left: 0 !important;
33
- }
34
6
 
35
7
 
36
8
  /* Detecção de conteúdo restrita à BIBLIOTECA. O playground do Vite