@djangocfg/ui-core 2.1.502 → 2.1.503
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/package.json +4 -4
- package/src/components/navigation/context-menu/index.tsx +2 -2
- package/src/components/navigation/dropdown-menu/index.tsx +11 -8
- package/src/components/navigation/menubar/index.tsx +2 -2
- package/src/components/overlay/dialog/index.tsx +7 -4
- package/src/components/overlay/hover-card/index.tsx +1 -1
- package/src/components/overlay/popover/index.tsx +1 -1
- package/src/components/overlay/tooltip/index.tsx +1 -1
- package/src/components/select/select.tsx +1 -1
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@djangocfg/ui-core",
|
|
3
|
-
"version": "2.1.
|
|
3
|
+
"version": "2.1.503",
|
|
4
4
|
"description": "Pure React UI component library without Next.js dependencies - for Electron, Vite, CRA apps",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"ui-components",
|
|
@@ -128,7 +128,7 @@
|
|
|
128
128
|
"check:contrast": "node scripts/check-preset-contrast.mjs"
|
|
129
129
|
},
|
|
130
130
|
"peerDependencies": {
|
|
131
|
-
"@djangocfg/i18n": "^2.1.
|
|
131
|
+
"@djangocfg/i18n": "^2.1.503",
|
|
132
132
|
"consola": "^3.4.2",
|
|
133
133
|
"lucide-react": "^0.545.0",
|
|
134
134
|
"moment": "^2.30.1",
|
|
@@ -206,8 +206,8 @@
|
|
|
206
206
|
"@chenglou/pretext": "^0.0.8"
|
|
207
207
|
},
|
|
208
208
|
"devDependencies": {
|
|
209
|
-
"@djangocfg/i18n": "^2.1.
|
|
210
|
-
"@djangocfg/typescript-config": "^2.1.
|
|
209
|
+
"@djangocfg/i18n": "^2.1.503",
|
|
210
|
+
"@djangocfg/typescript-config": "^2.1.503",
|
|
211
211
|
"@types/node": "^24.13.3",
|
|
212
212
|
"@types/react": "19.2.15",
|
|
213
213
|
"@types/react-dom": "19.2.3",
|
|
@@ -47,7 +47,7 @@ const ContextMenuSubContent = React.forwardRef<
|
|
|
47
47
|
<ContextMenuPrimitive.SubContent
|
|
48
48
|
ref={ref}
|
|
49
49
|
className={cn(
|
|
50
|
-
"z-[
|
|
50
|
+
"z-[1400] min-w-32 overflow-hidden rounded-[var(--radius-popover)] border bg-popover p-1 text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=open]:duration-75 data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-98 motion-reduce:data-[state=open]:animate-none",
|
|
51
51
|
className
|
|
52
52
|
)}
|
|
53
53
|
{...props}
|
|
@@ -63,7 +63,7 @@ const ContextMenuContent = React.forwardRef<
|
|
|
63
63
|
<ContextMenuPrimitive.Content
|
|
64
64
|
ref={ref}
|
|
65
65
|
className={cn(
|
|
66
|
-
"z-[
|
|
66
|
+
"z-[1400] max-h-[--radix-context-menu-content-available-height] min-w-[8rem] overflow-y-auto overflow-x-hidden rounded-[var(--radius-popover)] border bg-popover p-1 text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=open]:duration-75 data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-98 motion-reduce:data-[state=open]:animate-none",
|
|
67
67
|
className
|
|
68
68
|
)}
|
|
69
69
|
{...props}
|
|
@@ -53,7 +53,7 @@ const DropdownMenuSubContent = React.forwardRef<
|
|
|
53
53
|
// and clip. `min()` of the space Radix measured to the viewport edge and a
|
|
54
54
|
// comfortable ceiling — a menu that spans the WHOLE screen reads as a page,
|
|
55
55
|
// not a menu, so we stop well short of the viewport even when it would fit.
|
|
56
|
-
"z-[
|
|
56
|
+
"z-[1400] max-h-[min(var(--radix-dropdown-menu-content-available-height),24rem)] min-w-32 overflow-y-auto overflow-x-hidden rounded-[var(--radius-popover)] border bg-popover backdrop-blur-xl p-1 text-popover-foreground shadow-md 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 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
|
|
57
57
|
className
|
|
58
58
|
)}
|
|
59
59
|
{...props}
|
|
@@ -78,14 +78,17 @@ const DropdownMenuContent = React.forwardRef<
|
|
|
78
78
|
// See DropdownMenuSubContent: cap at the SMALLER of the space to the
|
|
79
79
|
// viewport edge and a comfortable ceiling, then scroll inside.
|
|
80
80
|
//
|
|
81
|
-
// z-[
|
|
81
|
+
// z-[1400] is the shared popover layer across ui-core (dropdown, select,
|
|
82
82
|
// popover, tooltip, hover-card, context-menu, menubar) — keep them equal.
|
|
83
|
-
//
|
|
84
|
-
//
|
|
85
|
-
//
|
|
86
|
-
//
|
|
87
|
-
//
|
|
88
|
-
|
|
83
|
+
// Radix portals this content to <body>, so an open menu is a SIBLING of
|
|
84
|
+
// whatever it was opened from, and z-index is the ONLY arbiter. It must
|
|
85
|
+
// sit ABOVE everything a popover can be opened from: app shells (public
|
|
86
|
+
// drawer z-1000, its navbar z-1001) AND dialogs/alert-dialogs (z-1300) —
|
|
87
|
+
// a Select/language dropdown INSIDE a settings dialog would otherwise
|
|
88
|
+
// render behind it (reported: language list clipped under the dialog).
|
|
89
|
+
// So the layer order is: sheet(200) < shell(1000/1001) < dialog(1300) <
|
|
90
|
+
// popover(1400). A popover always belongs on top of its opener.
|
|
91
|
+
"z-[1400] max-h-[min(var(--radix-dropdown-menu-content-available-height),24rem)] min-w-32 overflow-y-auto overflow-x-hidden rounded-[var(--radius-popover)] border bg-popover backdrop-blur-xl p-1 text-popover-foreground shadow-md",
|
|
89
92
|
"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 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
|
|
90
93
|
className
|
|
91
94
|
)}
|
|
@@ -95,7 +95,7 @@ const MenubarSubContent = React.forwardRef<
|
|
|
95
95
|
<MenubarPrimitive.SubContent
|
|
96
96
|
ref={ref}
|
|
97
97
|
className={cn(
|
|
98
|
-
"z-[
|
|
98
|
+
"z-[1400] min-w-32 overflow-hidden rounded-[var(--radius-popover)] border bg-popover backdrop-blur-xl p-1 text-popover-foreground shadow-lg 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 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
|
|
99
99
|
className
|
|
100
100
|
)}
|
|
101
101
|
{...props}
|
|
@@ -118,7 +118,7 @@ const MenubarContent = React.forwardRef<
|
|
|
118
118
|
alignOffset={alignOffset}
|
|
119
119
|
sideOffset={sideOffset}
|
|
120
120
|
className={cn(
|
|
121
|
-
"z-[
|
|
121
|
+
"z-[1400] min-w-48 overflow-hidden rounded-[var(--radius-popover)] border bg-popover backdrop-blur-xl p-1 text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
|
|
122
122
|
className
|
|
123
123
|
)}
|
|
124
124
|
{...props}
|
|
@@ -22,10 +22,13 @@ const DialogOverlay = React.forwardRef<
|
|
|
22
22
|
<DialogPrimitive.Overlay
|
|
23
23
|
ref={ref}
|
|
24
24
|
className={cn(
|
|
25
|
-
//
|
|
26
|
-
//
|
|
27
|
-
//
|
|
28
|
-
//
|
|
25
|
+
// A modal must cover the app shell (public drawer z-1000, its navbar
|
|
26
|
+
// z-1001) — a dialog opened FROM those is meaningless underneath them.
|
|
27
|
+
// But it sits BELOW the popover layer (z-1400): a Select / dropdown /
|
|
28
|
+
// popover opened from INSIDE the dialog is portaled to <body> as a
|
|
29
|
+
// sibling and must render on top of the dialog it belongs to (otherwise
|
|
30
|
+
// e.g. a language list clips behind the settings dialog). Keep dialog and
|
|
31
|
+
// alert-dialog on the same value.
|
|
29
32
|
"fixed inset-0 z-1300 bg-overlay data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
|
|
30
33
|
className
|
|
31
34
|
)}
|
|
@@ -20,7 +20,7 @@ const HoverCardContent = React.forwardRef<
|
|
|
20
20
|
align={align}
|
|
21
21
|
sideOffset={sideOffset}
|
|
22
22
|
className={cn(
|
|
23
|
-
"z-[
|
|
23
|
+
"z-[1400] w-64 rounded-[var(--radius-popover)] border bg-popover backdrop-blur-xl p-4 text-popover-foreground shadow-md outline-none 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 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
|
|
24
24
|
className
|
|
25
25
|
)}
|
|
26
26
|
{...props}
|
|
@@ -23,7 +23,7 @@ const PopoverContent = React.forwardRef<
|
|
|
23
23
|
align={align}
|
|
24
24
|
sideOffset={sideOffset}
|
|
25
25
|
className={cn(
|
|
26
|
-
"z-[
|
|
26
|
+
"z-[1400] w-72 rounded-[var(--radius-popover)] border bg-popover backdrop-blur-xl p-4 text-popover-foreground shadow-md outline-none 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 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
|
|
27
27
|
className
|
|
28
28
|
)}
|
|
29
29
|
{...props}
|
|
@@ -25,7 +25,7 @@ const TooltipContent = React.forwardRef<
|
|
|
25
25
|
// INVERSE surface (foreground bg + background text) so the tooltip is
|
|
26
26
|
// always high-contrast against any panel — light tooltip on dark theme,
|
|
27
27
|
// dark tooltip on light theme (Claude/Vercel/macOS). No border needed.
|
|
28
|
-
"z-[
|
|
28
|
+
"z-[1400] overflow-hidden rounded-[var(--radius-tooltip)] bg-foreground px-3 py-1.5 text-xs font-medium text-background shadow-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
|
|
29
29
|
className
|
|
30
30
|
)}
|
|
31
31
|
{...props}
|
|
@@ -137,7 +137,7 @@ const SelectContent = React.forwardRef<
|
|
|
137
137
|
<SelectPrimitive.Content
|
|
138
138
|
ref={ref}
|
|
139
139
|
className={cn(
|
|
140
|
-
"relative z-[
|
|
140
|
+
"relative z-[1400] max-h-[--radix-select-content-available-height] min-w-32 overflow-y-auto overflow-x-hidden rounded-[var(--radius-popover)] border bg-popover backdrop-blur-xl text-popover-foreground shadow-md 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 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
|
|
141
141
|
position === "popper" &&
|
|
142
142
|
"data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
|
|
143
143
|
className
|