@alexgorbatchev/shadcn 0.0.46 → 0.0.48
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/README.md +12 -4
- package/dist/{chunk-p1eqxz4v.js → chunk-a6mes7w0.js} +80 -80
- package/dist/{chunk-8wc2z7te.js → chunk-cfnkbp0y.js} +103 -75
- package/dist/{chunk-8rtm4y46.js → chunk-pj01ybcm.js} +6 -6
- package/dist/{chunk-0qgd06td.js → chunk-svr3r7pj.js} +754 -718
- package/dist/components/ActionsMenu.d.ts +21 -0
- package/dist/components/ConfirmationDialog.d.ts +3 -2
- package/dist/components/ContextMenu.d.ts +3 -16
- package/dist/components/DropdownMenu.d.ts +4 -23
- package/dist/components/FormDialog.d.ts +23 -0
- package/dist/components/InlineEdit.d.ts +4 -2
- package/dist/components/MenuParts.d.ts +24 -0
- package/dist/components/MenuPopup.d.ts +6 -0
- package/dist/components/Menubar.d.ts +4 -6
- package/dist/components/assistant-ui/elements/RegenerateMenu.js +2 -2
- package/dist/components/assistant-ui/index.js +2 -2
- package/dist/components/data-grid/index.js +2 -2
- package/dist/components/json-render/catalog.d.ts +1 -1
- package/dist/components/json-render/index.js +20 -20
- package/dist/components/tree/index.js +2218 -15
- package/dist/index.d.ts +4 -0
- package/dist/index.js +70 -58
- package/dist/menu/types.d.ts +3 -0
- package/dist/prototype.js +3 -2
- package/llms/components/forms/InlineEdit.md +34 -1
- package/llms/components/navigation/ActionsMenu.md +143 -0
- package/llms/components/overlays/ConfirmationDialog.md +31 -1
- package/llms/components/overlays/FormDialog.md +102 -0
- package/llms/setup.md +12 -4
- package/llms.txt +2 -0
- package/package.json +1 -1
|
@@ -16,23 +16,11 @@ import {
|
|
|
16
16
|
useAnalyticsCallback
|
|
17
17
|
} from "./chunk-5mydsjp3.js";
|
|
18
18
|
|
|
19
|
-
// src/components/
|
|
19
|
+
// src/components/MenuPopup.tsx
|
|
20
20
|
import { Menu as MenuPrimitive } from "@base-ui/react/menu";
|
|
21
|
-
import {
|
|
22
|
-
import { jsx, jsxs } from "react/jsx-runtime";
|
|
21
|
+
import { jsx } from "react/jsx-runtime";
|
|
23
22
|
"use client";
|
|
24
|
-
function
|
|
25
|
-
analytics,
|
|
26
|
-
...props
|
|
27
|
-
}) {
|
|
28
|
-
const trackedOnOpenChange = useAnalyticsCallback("DropdownMenu", analytics, (open, _details) => ({ name: "ui.open-request", open }), props.onOpenChange);
|
|
29
|
-
return /* @__PURE__ */ jsx(MenuPrimitive.Root, {
|
|
30
|
-
"data-slot": "dropdown-menu",
|
|
31
|
-
...props,
|
|
32
|
-
onOpenChange: trackedOnOpenChange
|
|
33
|
-
});
|
|
34
|
-
}
|
|
35
|
-
function DropdownMenuPortal2({ container, ref, children, ...props }) {
|
|
23
|
+
function MenuPortal({ container, ref, children, ...props }) {
|
|
36
24
|
const resolvedContainer = usePortalContainer2(container);
|
|
37
25
|
const portal = usePortalNode(ref);
|
|
38
26
|
return /* @__PURE__ */ jsx(MenuPrimitive.Portal, {
|
|
@@ -46,13 +34,7 @@ function DropdownMenuPortal2({ container, ref, children, ...props }) {
|
|
|
46
34
|
})
|
|
47
35
|
});
|
|
48
36
|
}
|
|
49
|
-
function
|
|
50
|
-
return /* @__PURE__ */ jsx(MenuPrimitive.Trigger, {
|
|
51
|
-
"data-slot": "dropdown-menu-trigger",
|
|
52
|
-
...props
|
|
53
|
-
});
|
|
54
|
-
}
|
|
55
|
-
function DropdownMenuContent2({
|
|
37
|
+
function MenuPopup({
|
|
56
38
|
density,
|
|
57
39
|
width = "content",
|
|
58
40
|
align = "start",
|
|
@@ -64,7 +46,7 @@ function DropdownMenuContent2({
|
|
|
64
46
|
}) {
|
|
65
47
|
const resolvedDensity = useDensity(density);
|
|
66
48
|
const direction = useDirection2();
|
|
67
|
-
return /* @__PURE__ */ jsx(
|
|
49
|
+
return /* @__PURE__ */ jsx(MenuPortal, {
|
|
68
50
|
children: /* @__PURE__ */ jsx(MenuPrimitive.Positioner, {
|
|
69
51
|
dir: direction,
|
|
70
52
|
className: "isolate outline-none",
|
|
@@ -73,6 +55,7 @@ function DropdownMenuContent2({
|
|
|
73
55
|
side,
|
|
74
56
|
sideOffset,
|
|
75
57
|
children: /* @__PURE__ */ jsx(MenuPrimitive.Popup, {
|
|
58
|
+
dir: direction,
|
|
76
59
|
"data-density": resolvedDensity,
|
|
77
60
|
"data-slot": "dropdown-menu-content",
|
|
78
61
|
className: (state) => cn2("max-h-(--available-height) max-w-(--available-width) min-w-32 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-md bg-popover p-1 text-popover-foreground shadow-frame border border-frame-edge shadow-frame duration-120 outline-none data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:overflow-hidden data-closed:fade-out-0", width === "anchor" ? "w-(--anchor-width)" : "w-max", typeof className === "function" ? className(state) : className),
|
|
@@ -81,22 +64,29 @@ function DropdownMenuContent2({
|
|
|
81
64
|
})
|
|
82
65
|
});
|
|
83
66
|
}
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
67
|
+
|
|
68
|
+
// src/components/MenuParts.tsx
|
|
69
|
+
import { Menu as MenuPrimitive2 } from "@base-ui/react/menu";
|
|
70
|
+
import { ChevronRightIcon, CheckIcon } from "lucide-react";
|
|
71
|
+
import { jsx as jsx2, jsxs } from "react/jsx-runtime";
|
|
72
|
+
"use client";
|
|
73
|
+
var menuItemClassName = "group/menu-item relative flex cursor-default items-center gap-control-gap rounded-md px-1.5 py-1 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground data-inset:ps-7 data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 data-[variant=destructive]:focus:text-destructive data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 data-[variant=destructive]:*:[svg]:text-destructive";
|
|
74
|
+
function MenuGroup2({ ...props }) {
|
|
75
|
+
return /* @__PURE__ */ jsx2(MenuPrimitive2.Group, {
|
|
76
|
+
"data-slot": "menu-group",
|
|
87
77
|
...props
|
|
88
78
|
});
|
|
89
79
|
}
|
|
90
|
-
function
|
|
91
|
-
return /* @__PURE__ */
|
|
80
|
+
function MenuLabel2({ density, className, inset, ...props }) {
|
|
81
|
+
return /* @__PURE__ */ jsx2(MenuPrimitive2.GroupLabel, {
|
|
92
82
|
"data-density": density,
|
|
93
|
-
"data-slot": "
|
|
83
|
+
"data-slot": "menu-label",
|
|
94
84
|
"data-inset": inset,
|
|
95
85
|
className: (state) => cn2("px-1.5 py-1 text-xs font-medium text-muted-foreground data-inset:ps-7", typeof className === "function" ? className(state) : className),
|
|
96
86
|
...props
|
|
97
87
|
});
|
|
98
88
|
}
|
|
99
|
-
function
|
|
89
|
+
function MenuItem2({
|
|
100
90
|
analytics,
|
|
101
91
|
density,
|
|
102
92
|
className,
|
|
@@ -104,41 +94,60 @@ function DropdownMenuItem2({
|
|
|
104
94
|
variant = "default",
|
|
105
95
|
...props
|
|
106
96
|
}) {
|
|
107
|
-
const trackedOnClick = useAnalyticsCallback("
|
|
108
|
-
return /* @__PURE__ */
|
|
97
|
+
const trackedOnClick = useAnalyticsCallback("MenuItem", analytics, { name: "ui.activate" }, props.onClick);
|
|
98
|
+
return /* @__PURE__ */ jsx2(MenuPrimitive2.Item, {
|
|
109
99
|
"data-density": density,
|
|
110
|
-
"data-slot": "
|
|
100
|
+
"data-slot": "menu-item",
|
|
111
101
|
"data-inset": inset,
|
|
112
102
|
"data-variant": variant,
|
|
113
|
-
className: (state) => cn2(
|
|
103
|
+
className: (state) => cn2(menuItemClassName, typeof className === "function" ? className(state) : className),
|
|
114
104
|
...props,
|
|
115
105
|
onClick: trackedOnClick
|
|
116
106
|
});
|
|
117
107
|
}
|
|
118
|
-
function
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
108
|
+
function MenuLinkItem2({
|
|
109
|
+
analytics,
|
|
110
|
+
density,
|
|
111
|
+
className,
|
|
112
|
+
inset,
|
|
113
|
+
variant = "default",
|
|
114
|
+
...props
|
|
115
|
+
}) {
|
|
116
|
+
const trackedOnClick = useAnalyticsCallback("MenuLinkItem", analytics, { name: "ui.activate" }, props.onClick);
|
|
117
|
+
return /* @__PURE__ */ jsx2(MenuPrimitive2.LinkItem, {
|
|
118
|
+
"data-density": density,
|
|
119
|
+
"data-slot": "menu-item",
|
|
120
|
+
"data-inset": inset,
|
|
121
|
+
"data-variant": variant,
|
|
122
|
+
className: (state) => cn2(menuItemClassName, typeof className === "function" ? className(state) : className),
|
|
123
|
+
...props,
|
|
124
|
+
onClick: trackedOnClick
|
|
125
|
+
});
|
|
126
|
+
}
|
|
127
|
+
function MenuSub2({ analytics, ...props }) {
|
|
128
|
+
const trackedOnOpenChange = useAnalyticsCallback("MenuSub", analytics, (open, _details) => ({ name: "ui.open-request", open }), props.onOpenChange);
|
|
129
|
+
return /* @__PURE__ */ jsx2(MenuPrimitive2.SubmenuRoot, {
|
|
130
|
+
"data-slot": "menu-sub",
|
|
122
131
|
...props,
|
|
123
132
|
onOpenChange: trackedOnOpenChange
|
|
124
133
|
});
|
|
125
134
|
}
|
|
126
|
-
function
|
|
127
|
-
return /* @__PURE__ */ jsxs(
|
|
135
|
+
function MenuSubTrigger2({ density, className, inset, children, ...props }) {
|
|
136
|
+
return /* @__PURE__ */ jsxs(MenuPrimitive2.SubmenuTrigger, {
|
|
128
137
|
"data-density": density,
|
|
129
|
-
"data-slot": "
|
|
138
|
+
"data-slot": "menu-sub-trigger",
|
|
130
139
|
"data-inset": inset,
|
|
131
140
|
className: (state) => cn2("flex cursor-default items-center gap-control-gap rounded-md px-1.5 py-1 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground data-inset:ps-7 data-popup-open:bg-accent data-popup-open:text-accent-foreground data-open:bg-accent data-open:text-accent-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", typeof className === "function" ? className(state) : className),
|
|
132
141
|
...props,
|
|
133
142
|
children: [
|
|
134
143
|
children,
|
|
135
|
-
/* @__PURE__ */
|
|
144
|
+
/* @__PURE__ */ jsx2(ChevronRightIcon, {
|
|
136
145
|
className: "ms-auto rtl:rotate-180"
|
|
137
146
|
})
|
|
138
147
|
]
|
|
139
148
|
});
|
|
140
149
|
}
|
|
141
|
-
function
|
|
150
|
+
function MenuSubContent2({
|
|
142
151
|
density,
|
|
143
152
|
align = "start",
|
|
144
153
|
alignOffset = -3,
|
|
@@ -148,9 +157,9 @@ function DropdownMenuSubContent2({
|
|
|
148
157
|
...props
|
|
149
158
|
}) {
|
|
150
159
|
const resolvedDensity = useDensity(density);
|
|
151
|
-
return /* @__PURE__ */
|
|
160
|
+
return /* @__PURE__ */ jsx2(MenuPopup, {
|
|
152
161
|
"data-density": resolvedDensity,
|
|
153
|
-
"data-slot": "
|
|
162
|
+
"data-slot": "menu-sub-content",
|
|
154
163
|
className: (state) => cn2("w-auto min-w-[96px] rounded-md bg-popover p-1 text-popover-foreground shadow-frame border border-frame-edge shadow-frame duration-120 data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0", typeof className === "function" ? className(state) : className),
|
|
155
164
|
align,
|
|
156
165
|
alignOffset,
|
|
@@ -159,7 +168,7 @@ function DropdownMenuSubContent2({
|
|
|
159
168
|
...props
|
|
160
169
|
});
|
|
161
170
|
}
|
|
162
|
-
function
|
|
171
|
+
function MenuCheckboxItem2({
|
|
163
172
|
analytics,
|
|
164
173
|
density,
|
|
165
174
|
className,
|
|
@@ -168,72 +177,91 @@ function DropdownMenuCheckboxItem2({
|
|
|
168
177
|
inset,
|
|
169
178
|
...props
|
|
170
179
|
}) {
|
|
171
|
-
const trackedOnCheckedChange = useAnalyticsCallback("
|
|
172
|
-
return /* @__PURE__ */ jsxs(
|
|
180
|
+
const trackedOnCheckedChange = useAnalyticsCallback("MenuCheckboxItem", analytics, { name: "ui.change-request" }, props.onCheckedChange);
|
|
181
|
+
return /* @__PURE__ */ jsxs(MenuPrimitive2.CheckboxItem, {
|
|
173
182
|
"data-density": density,
|
|
174
|
-
"data-slot": "
|
|
183
|
+
"data-slot": "menu-checkbox-item",
|
|
175
184
|
"data-inset": inset,
|
|
176
185
|
className: (state) => cn2("relative flex cursor-default items-center gap-control-gap rounded-md py-1 pe-8 ps-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground focus:**:text-accent-foreground data-inset:ps-7 data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", typeof className === "function" ? className(state) : className),
|
|
177
186
|
checked,
|
|
178
187
|
...props,
|
|
179
188
|
onCheckedChange: trackedOnCheckedChange,
|
|
180
189
|
children: [
|
|
181
|
-
/* @__PURE__ */
|
|
190
|
+
/* @__PURE__ */ jsx2("span", {
|
|
182
191
|
className: "pointer-events-none absolute end-2 flex items-center justify-center",
|
|
183
|
-
"data-slot": "
|
|
184
|
-
children: /* @__PURE__ */
|
|
185
|
-
children: /* @__PURE__ */
|
|
192
|
+
"data-slot": "menu-checkbox-item-indicator",
|
|
193
|
+
children: /* @__PURE__ */ jsx2(MenuPrimitive2.CheckboxItemIndicator, {
|
|
194
|
+
children: /* @__PURE__ */ jsx2(CheckIcon, {})
|
|
186
195
|
})
|
|
187
196
|
}),
|
|
188
197
|
children
|
|
189
198
|
]
|
|
190
199
|
});
|
|
191
200
|
}
|
|
192
|
-
function
|
|
193
|
-
analytics,
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
const trackedOnValueChange = useAnalyticsCallback("DropdownMenuRadioGroup", analytics, { name: "ui.change-request" }, props.onValueChange);
|
|
197
|
-
return /* @__PURE__ */ jsx(MenuPrimitive.RadioGroup, {
|
|
198
|
-
"data-slot": "dropdown-menu-radio-group",
|
|
201
|
+
function MenuRadioGroup2({ analytics, ...props }) {
|
|
202
|
+
const trackedOnValueChange = useAnalyticsCallback("MenuRadioGroup", analytics, { name: "ui.change-request" }, props.onValueChange);
|
|
203
|
+
return /* @__PURE__ */ jsx2(MenuPrimitive2.RadioGroup, {
|
|
204
|
+
"data-slot": "menu-radio-group",
|
|
199
205
|
...props,
|
|
200
206
|
onValueChange: trackedOnValueChange
|
|
201
207
|
});
|
|
202
208
|
}
|
|
203
|
-
function
|
|
204
|
-
return /* @__PURE__ */ jsxs(
|
|
209
|
+
function MenuRadioItem2({ density, className, children, inset, ...props }) {
|
|
210
|
+
return /* @__PURE__ */ jsxs(MenuPrimitive2.RadioItem, {
|
|
205
211
|
"data-density": density,
|
|
206
|
-
"data-slot": "
|
|
212
|
+
"data-slot": "menu-radio-item",
|
|
207
213
|
"data-inset": inset,
|
|
208
214
|
className: (state) => cn2("relative flex cursor-default items-center gap-control-gap rounded-md py-1 pe-8 ps-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground focus:**:text-accent-foreground data-inset:ps-7 data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", typeof className === "function" ? className(state) : className),
|
|
209
215
|
...props,
|
|
210
216
|
children: [
|
|
211
|
-
/* @__PURE__ */
|
|
217
|
+
/* @__PURE__ */ jsx2("span", {
|
|
212
218
|
className: "pointer-events-none absolute end-2 flex items-center justify-center",
|
|
213
|
-
"data-slot": "
|
|
214
|
-
children: /* @__PURE__ */
|
|
215
|
-
children: /* @__PURE__ */
|
|
219
|
+
"data-slot": "menu-radio-item-indicator",
|
|
220
|
+
children: /* @__PURE__ */ jsx2(MenuPrimitive2.RadioItemIndicator, {
|
|
221
|
+
children: /* @__PURE__ */ jsx2(CheckIcon, {})
|
|
216
222
|
})
|
|
217
223
|
}),
|
|
218
224
|
children
|
|
219
225
|
]
|
|
220
226
|
});
|
|
221
227
|
}
|
|
222
|
-
function
|
|
223
|
-
return /* @__PURE__ */
|
|
228
|
+
function MenuSeparator2({ density, className, ...props }) {
|
|
229
|
+
return /* @__PURE__ */ jsx2(MenuPrimitive2.Separator, {
|
|
224
230
|
"data-density": density,
|
|
225
|
-
"data-slot": "
|
|
231
|
+
"data-slot": "menu-separator",
|
|
226
232
|
className: (state) => cn2("-mx-1 my-1 h-px bg-border", typeof className === "function" ? className(state) : className),
|
|
227
233
|
...props
|
|
228
234
|
});
|
|
229
235
|
}
|
|
230
|
-
function
|
|
231
|
-
return /* @__PURE__ */
|
|
236
|
+
function MenuShortcut2({ density, className, ...props }) {
|
|
237
|
+
return /* @__PURE__ */ jsx2("span", {
|
|
232
238
|
"data-density": density,
|
|
233
|
-
"data-slot": "
|
|
234
|
-
className: cn2("ms-auto text-xs tracking-widest text-muted-foreground group-focus/
|
|
239
|
+
"data-slot": "menu-shortcut",
|
|
240
|
+
className: cn2("ms-auto text-xs tracking-widest text-muted-foreground group-focus/menu-item:text-accent-foreground", className),
|
|
241
|
+
...props
|
|
242
|
+
});
|
|
243
|
+
}
|
|
244
|
+
|
|
245
|
+
// src/components/DropdownMenu.tsx
|
|
246
|
+
import { Menu as MenuPrimitive3 } from "@base-ui/react/menu";
|
|
247
|
+
import { jsx as jsx3 } from "react/jsx-runtime";
|
|
248
|
+
"use client";
|
|
249
|
+
function DropdownMenu2({
|
|
250
|
+
analytics,
|
|
251
|
+
...props
|
|
252
|
+
}) {
|
|
253
|
+
const trackedOnOpenChange = useAnalyticsCallback("DropdownMenu", analytics, (open, _details) => ({ name: "ui.open-request", open }), props.onOpenChange);
|
|
254
|
+
return /* @__PURE__ */ jsx3(MenuPrimitive3.Root, {
|
|
255
|
+
"data-slot": "dropdown-menu",
|
|
256
|
+
...props,
|
|
257
|
+
onOpenChange: trackedOnOpenChange
|
|
258
|
+
});
|
|
259
|
+
}
|
|
260
|
+
function DropdownMenuTrigger2({ ...props }) {
|
|
261
|
+
return /* @__PURE__ */ jsx3(MenuPrimitive3.Trigger, {
|
|
262
|
+
"data-slot": "dropdown-menu-trigger",
|
|
235
263
|
...props
|
|
236
264
|
});
|
|
237
265
|
}
|
|
238
266
|
|
|
239
|
-
export {
|
|
267
|
+
export { MenuPortal, MenuPopup, MenuGroup2, MenuLabel2, MenuItem2, MenuLinkItem2, MenuSub2, MenuSubTrigger2, MenuSubContent2, MenuCheckboxItem2, MenuRadioGroup2, MenuRadioItem2, MenuSeparator2, MenuShortcut2, DropdownMenu2, DropdownMenuTrigger2 };
|
|
@@ -5,11 +5,11 @@ import {
|
|
|
5
5
|
Button2
|
|
6
6
|
} from "./chunk-38301e40.js";
|
|
7
7
|
import {
|
|
8
|
+
MenuPopup,
|
|
9
|
+
MenuItem2,
|
|
8
10
|
DropdownMenu2,
|
|
9
|
-
DropdownMenuTrigger2
|
|
10
|
-
|
|
11
|
-
DropdownMenuItem2
|
|
12
|
-
} from "./chunk-8wc2z7te.js";
|
|
11
|
+
DropdownMenuTrigger2
|
|
12
|
+
} from "./chunk-cfnkbp0y.js";
|
|
13
13
|
import {
|
|
14
14
|
mono
|
|
15
15
|
} from "./chunk-fgmcbtyt.js";
|
|
@@ -46,7 +46,7 @@ function RegenerateMenu2({
|
|
|
46
46
|
"aria-hidden": "true"
|
|
47
47
|
})
|
|
48
48
|
}),
|
|
49
|
-
/* @__PURE__ */ jsx(
|
|
49
|
+
/* @__PURE__ */ jsx(MenuPopup, {
|
|
50
50
|
children: options.map((option) => {
|
|
51
51
|
const content = /* @__PURE__ */ jsxs(Fragment, {
|
|
52
52
|
children: [
|
|
@@ -60,7 +60,7 @@ function RegenerateMenu2({
|
|
|
60
60
|
})
|
|
61
61
|
]
|
|
62
62
|
});
|
|
63
|
-
return /* @__PURE__ */ jsx(
|
|
63
|
+
return /* @__PURE__ */ jsx(MenuItem2, {
|
|
64
64
|
disabled: !onPick,
|
|
65
65
|
onClick: () => onPick?.(option.id),
|
|
66
66
|
children: content
|