@examplary/ui 1.55.0 → 1.58.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/ai/ai-icon.js +2 -25
- package/dist/components/ai/ai-prompt-suggestion.js +3 -26
- package/dist/components/brand/tick-icon.js +2 -25
- package/dist/components/chat/chat-input.js +8 -31
- package/dist/components/chat/chat-typing-indicator.js +2 -2
- package/dist/components/chat/chat-view.js +6 -34
- package/dist/components/loading/ai-spinner.js +2 -13
- package/dist/components/loading/tick-loader.js +39 -104
- package/dist/components/print/answer-box.js +2 -25
- package/dist/components/question-types/fetch-component.js +65 -106
- package/dist/components/question-types/format-question-type.d.ts +41 -41
- package/dist/components/question-types/format-question-type.js +36 -37
- package/dist/components/rich-text/minimal-rich-text-field.d.ts +2 -2
- package/dist/components/rich-text/minimal-rich-text-field.js +47 -85
- package/dist/components/rich-text/rich-text-display.js +15 -33
- package/dist/components/rich-text/rich-text-field.js +2 -25
- package/dist/components/rich-text/rich-text-toolbar.d.ts +3 -2
- package/dist/components/rich-text/rich-text-toolbar.js +5 -6
- package/dist/components/rich-text/tiptap/collaboration-caret.js +24 -34
- package/dist/components/rich-text/tiptap/comments/comment-bubble.d.ts +1 -1
- package/dist/components/rich-text/tiptap/comments/comment-bubble.js +36 -41
- package/dist/components/rich-text/tiptap/content-reference.js +6 -7
- package/dist/components/rich-text/tiptap/crop-page-clipping-modal.d.ts +3 -3
- package/dist/components/rich-text/tiptap/crop-page-clipping-modal.js +20 -25
- package/dist/components/rich-text/tiptap/extensions.d.ts +2 -2
- package/dist/components/rich-text/tiptap/extensions.js +6 -16
- package/dist/components/rich-text/tiptap/file-attachment.js +9 -11
- package/dist/components/rich-text/tiptap/file-handler.d.ts +2 -2
- package/dist/components/rich-text/tiptap/file-handler.js +110 -185
- package/dist/components/rich-text/tiptap/image.js +18 -23
- package/dist/components/rich-text/tiptap/mathematics-component.js +25 -30
- package/dist/components/rich-text/tiptap/mathematics.js +56 -82
- package/dist/components/rich-text/tiptap/page-clipping.js +3 -4
- package/dist/components/rich-text/tiptap/png-scanner.js +63 -108
- package/dist/components/rich-text/tiptap/rich-text-formatting-menu.d.ts +1 -1
- package/dist/components/rich-text/tiptap/rich-text-formatting-menu.js +31 -46
- package/dist/components/ui/alert.d.ts +3 -3
- package/dist/components/ui/alert.js +7 -32
- package/dist/components/ui/avatar.js +18 -14
- package/dist/components/ui/badge.d.ts +3 -3
- package/dist/components/ui/badge.js +4 -27
- package/dist/components/ui/button.d.ts +4 -4
- package/dist/components/ui/button.js +4 -27
- package/dist/components/ui/card.js +6 -46
- package/dist/components/ui/checkbox.js +1 -26
- package/dist/components/ui/color-picker.js +11 -22
- package/dist/components/ui/command-palette.d.ts +2 -2
- package/dist/components/ui/command-palette.js +38 -72
- package/dist/components/ui/command.js +18 -49
- package/dist/components/ui/comments.js +37 -107
- package/dist/components/ui/context-menu.js +30 -67
- package/dist/components/ui/dialog.js +15 -61
- package/dist/components/ui/dropdown.js +17 -64
- package/dist/components/ui/floating-menu.js +2 -25
- package/dist/components/ui/floating-resizable.d.ts +5 -0
- package/dist/components/ui/floating-resizable.js +24 -0
- package/dist/components/ui/help-icon.js +1 -2
- package/dist/components/ui/icon-picker.js +50 -130
- package/dist/components/ui/index.d.ts +1 -0
- package/dist/components/ui/index.js +1 -0
- package/dist/components/ui/input.js +2 -25
- package/dist/components/ui/label.d.ts +1 -1
- package/dist/components/ui/label.js +2 -27
- package/dist/components/ui/popover.d.ts +2 -2
- package/dist/components/ui/popover.js +4 -32
- package/dist/components/ui/progress-bar.js +2 -3
- package/dist/components/ui/radio-group.js +4 -28
- package/dist/components/ui/resizable.d.ts +6 -9
- package/dist/components/ui/resizable.js +13 -60
- package/dist/components/ui/select.js +12 -55
- package/dist/components/ui/separator.js +1 -26
- package/dist/components/ui/sheet.d.ts +3 -3
- package/dist/components/ui/sheet.js +11 -51
- package/dist/components/ui/skeleton.js +2 -25
- package/dist/components/ui/slider.js +7 -32
- package/dist/components/ui/sortable.d.ts +1 -1
- package/dist/components/ui/sortable.js +131 -155
- package/dist/components/ui/switch.d.ts +3 -3
- package/dist/components/ui/switch.js +3 -28
- package/dist/components/ui/table.js +8 -54
- package/dist/components/ui/tabs.js +8 -34
- package/dist/components/ui/text-selection-menu.d.ts +1 -1
- package/dist/components/ui/text-selection-menu.js +19 -25
- package/dist/components/ui/textarea.js +7 -30
- package/dist/components/ui/tooltip.js +4 -29
- package/dist/components/web-components/content-reference.js +81 -106
- package/dist/components/web-components/file-attachment.js +9 -30
- package/dist/components/web-components/index.js +1 -1
- package/dist/components/web-components/inline-comment-reply.js +3 -24
- package/dist/components/web-components/inline-comment.js +3 -24
- package/dist/components/web-components/inline-math.js +14 -36
- package/dist/components/web-components/page-clipping.js +13 -34
- package/dist/lib/compose-refs.js +10 -18
- package/dist/lib/use-spin-loop.js +19 -69
- package/dist/src/global.css +2 -2
- package/dist/utils.js +1 -5
- package/package.json +7 -6
- package/src/global.css +6 -1
- package/dist/components/rich-text/tiptap/comments/comment-reply.d.ts +0 -21
- package/dist/components/rich-text/tiptap/comments/comment-reply.js +0 -230
- package/dist/components/rich-text/tiptap/comments/comment.d.ts +0 -22
- package/dist/components/rich-text/tiptap/comments/comment.js +0 -199
- package/dist/components/rich-text/tiptap/comments/helpers.d.ts +0 -19
- package/dist/components/rich-text/tiptap/comments/helpers.js +0 -95
- package/dist/components/rich-text/tiptap/comments/types.d.ts +0 -29
- package/dist/components/rich-text/tiptap/comments/types.js +0 -1
|
@@ -1,65 +1,34 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
var __assign = (this && this.__assign) || function () {
|
|
3
|
-
__assign = Object.assign || function(t) {
|
|
4
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
-
s = arguments[i];
|
|
6
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
-
t[p] = s[p];
|
|
8
|
-
}
|
|
9
|
-
return t;
|
|
10
|
-
};
|
|
11
|
-
return __assign.apply(this, arguments);
|
|
12
|
-
};
|
|
13
|
-
var __rest = (this && this.__rest) || function (s, e) {
|
|
14
|
-
var t = {};
|
|
15
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
16
|
-
t[p] = s[p];
|
|
17
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
18
|
-
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
19
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
20
|
-
t[p[i]] = s[p[i]];
|
|
21
|
-
}
|
|
22
|
-
return t;
|
|
23
|
-
};
|
|
24
2
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
25
3
|
import { Command as CommandPrimitive } from "cmdk";
|
|
26
4
|
import { SearchIcon } from "lucide-react";
|
|
27
5
|
import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle, } from "./dialog";
|
|
28
6
|
import { cn } from "../../utils";
|
|
29
|
-
function Command(
|
|
30
|
-
|
|
31
|
-
return (_jsx(CommandPrimitive, __assign({ "data-slot": "command", className: cn("bg-popover text-popover-foreground flex h-full w-full flex-col overflow-hidden rounded-md", className) }, props)));
|
|
7
|
+
function Command({ className, ...props }) {
|
|
8
|
+
return (_jsx(CommandPrimitive, { "data-slot": "command", className: cn("bg-popover text-popover-foreground flex h-full w-full flex-col overflow-hidden rounded-md", className), ...props }));
|
|
32
9
|
}
|
|
33
|
-
function CommandDialog(
|
|
34
|
-
|
|
35
|
-
return (_jsxs(Dialog, __assign({}, props, { children: [_jsxs(DialogHeader, { className: "sr-only", children: [_jsx(DialogTitle, { children: title }), _jsx(DialogDescription, { children: description })] }), _jsx(DialogContent, { className: cn("overflow-hidden p-0!", className), showClose: showCloseButton, children: _jsx(Command, { className: "[&_[cmdk-group-heading]]:text-muted-foreground **:data-[slot=command-input-wrapper]:h-12 [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group]]:px-2 [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-input-wrapper]_svg]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5", children: children }) })] })));
|
|
10
|
+
function CommandDialog({ title = "Command Palette", description = "Search for a command to run...", children, className, showCloseButton = false, ...props }) {
|
|
11
|
+
return (_jsxs(Dialog, { ...props, children: [_jsxs(DialogHeader, { className: "sr-only", children: [_jsx(DialogTitle, { children: title }), _jsx(DialogDescription, { children: description })] }), _jsx(DialogContent, { className: cn("overflow-hidden p-0!", className), showClose: showCloseButton, children: _jsx(Command, { className: "[&_[cmdk-group-heading]]:text-muted-foreground **:data-[slot=command-input-wrapper]:h-12 [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group]]:px-2 [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-input-wrapper]_svg]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5", children: children }) })] }));
|
|
36
12
|
}
|
|
37
|
-
function CommandInput(
|
|
38
|
-
|
|
39
|
-
return (_jsxs("div", { "data-slot": "command-input-wrapper", className: "flex h-9 items-center gap-2 border-b border-border px-3", children: [_jsx(SearchIcon, { className: "size-4 shrink-0 opacity-50" }), _jsx(CommandPrimitive.Input, __assign({ "data-slot": "command-input", className: cn("placeholder:text-muted-foreground flex h-10 w-full rounded-md bg-transparent py-3 text-sm outline-hidden disabled:cursor-not-allowed disabled:opacity-50", className) }, props))] }));
|
|
13
|
+
function CommandInput({ className, ...props }) {
|
|
14
|
+
return (_jsxs("div", { "data-slot": "command-input-wrapper", className: "flex h-9 items-center gap-2 border-b border-border px-3", children: [_jsx(SearchIcon, { className: "size-4 shrink-0 opacity-50" }), _jsx(CommandPrimitive.Input, { "data-slot": "command-input", className: cn("placeholder:text-muted-foreground flex h-10 w-full rounded-md bg-transparent py-3 text-sm outline-hidden disabled:cursor-not-allowed disabled:opacity-50", className), ...props })] }));
|
|
40
15
|
}
|
|
41
|
-
function CommandList(
|
|
42
|
-
|
|
43
|
-
return (_jsx(CommandPrimitive.List, __assign({ "data-slot": "command-list", className: cn("max-h-[300px] scroll-py-1 overflow-x-hidden overflow-y-auto", className) }, props)));
|
|
16
|
+
function CommandList({ className, ...props }) {
|
|
17
|
+
return (_jsx(CommandPrimitive.List, { "data-slot": "command-list", className: cn("max-h-[300px] scroll-py-1 overflow-x-hidden overflow-y-auto", className), ...props }));
|
|
44
18
|
}
|
|
45
|
-
function CommandEmpty(
|
|
46
|
-
|
|
47
|
-
return (_jsx(CommandPrimitive.Empty, __assign({ "data-slot": "command-empty", className: "py-6 text-center text-sm" }, props)));
|
|
19
|
+
function CommandEmpty({ ...props }) {
|
|
20
|
+
return (_jsx(CommandPrimitive.Empty, { "data-slot": "command-empty", className: "py-6 text-center text-sm", ...props }));
|
|
48
21
|
}
|
|
49
|
-
function CommandGroup(
|
|
50
|
-
|
|
51
|
-
return (_jsx(CommandPrimitive.Group, __assign({ "data-slot": "command-group", className: cn("text-foreground [&_[cmdk-group-heading]]:text-muted-foreground overflow-hidden p-1 [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium", className) }, props)));
|
|
22
|
+
function CommandGroup({ className, ...props }) {
|
|
23
|
+
return (_jsx(CommandPrimitive.Group, { "data-slot": "command-group", className: cn("text-foreground [&_[cmdk-group-heading]]:text-muted-foreground overflow-hidden p-1 [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium", className), ...props }));
|
|
52
24
|
}
|
|
53
|
-
function CommandSeparator(
|
|
54
|
-
|
|
55
|
-
return (_jsx(CommandPrimitive.Separator, __assign({ "data-slot": "command-separator", className: cn("bg-border -mx-1 h-px", className) }, props)));
|
|
25
|
+
function CommandSeparator({ className, ...props }) {
|
|
26
|
+
return (_jsx(CommandPrimitive.Separator, { "data-slot": "command-separator", className: cn("bg-border -mx-1 h-px", className), ...props }));
|
|
56
27
|
}
|
|
57
|
-
function CommandItem(
|
|
58
|
-
|
|
59
|
-
return (_jsx(CommandPrimitive.Item, __assign({ "data-slot": "command-item", className: cn("data-[selected=true]:bg-accent data-[selected=true]:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className) }, props)));
|
|
28
|
+
function CommandItem({ className, ...props }) {
|
|
29
|
+
return (_jsx(CommandPrimitive.Item, { "data-slot": "command-item", className: cn("data-[selected=true]:bg-accent data-[selected=true]:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className), ...props }));
|
|
60
30
|
}
|
|
61
|
-
function CommandShortcut(
|
|
62
|
-
|
|
63
|
-
return (_jsx("span", __assign({ "data-slot": "command-shortcut", className: cn("text-zinc-500 ml-auto text-xs font-medium tracking-widest", className) }, props)));
|
|
31
|
+
function CommandShortcut({ className, ...props }) {
|
|
32
|
+
return (_jsx("span", { "data-slot": "command-shortcut", className: cn("text-zinc-500 ml-auto text-xs font-medium tracking-widest", className), ...props }));
|
|
64
33
|
}
|
|
65
34
|
export { Command, CommandDialog, CommandInput, CommandList, CommandEmpty, CommandGroup, CommandItem, CommandShortcut, CommandSeparator, };
|
|
@@ -1,50 +1,3 @@
|
|
|
1
|
-
var __assign = (this && this.__assign) || function () {
|
|
2
|
-
__assign = Object.assign || function(t) {
|
|
3
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
-
s = arguments[i];
|
|
5
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
6
|
-
t[p] = s[p];
|
|
7
|
-
}
|
|
8
|
-
return t;
|
|
9
|
-
};
|
|
10
|
-
return __assign.apply(this, arguments);
|
|
11
|
-
};
|
|
12
|
-
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
|
|
13
|
-
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
|
14
|
-
return new (P || (P = Promise))(function (resolve, reject) {
|
|
15
|
-
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
|
16
|
-
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
|
17
|
-
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
|
18
|
-
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
19
|
-
});
|
|
20
|
-
};
|
|
21
|
-
var __generator = (this && this.__generator) || function (thisArg, body) {
|
|
22
|
-
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
|
|
23
|
-
return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
|
|
24
|
-
function verb(n) { return function (v) { return step([n, v]); }; }
|
|
25
|
-
function step(op) {
|
|
26
|
-
if (f) throw new TypeError("Generator is already executing.");
|
|
27
|
-
while (g && (g = 0, op[0] && (_ = 0)), _) try {
|
|
28
|
-
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
|
|
29
|
-
if (y = 0, t) op = [op[0] & 2, t.value];
|
|
30
|
-
switch (op[0]) {
|
|
31
|
-
case 0: case 1: t = op; break;
|
|
32
|
-
case 4: _.label++; return { value: op[1], done: false };
|
|
33
|
-
case 5: _.label++; y = op[1]; op = [0]; continue;
|
|
34
|
-
case 7: op = _.ops.pop(); _.trys.pop(); continue;
|
|
35
|
-
default:
|
|
36
|
-
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
|
|
37
|
-
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
|
|
38
|
-
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
|
|
39
|
-
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
|
|
40
|
-
if (t[2]) _.ops.pop();
|
|
41
|
-
_.trys.pop(); continue;
|
|
42
|
-
}
|
|
43
|
-
op = body.call(thisArg, _);
|
|
44
|
-
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
|
|
45
|
-
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
|
|
46
|
-
}
|
|
47
|
-
};
|
|
48
1
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
49
2
|
import { useEffect, useMemo, useState } from "react";
|
|
50
3
|
import { Trans, useTranslation } from "react-i18next";
|
|
@@ -56,31 +9,26 @@ import { Popover, PopoverContent, PopoverItem, PopoverTrigger, } from "./popover
|
|
|
56
9
|
import { cn } from "../../utils";
|
|
57
10
|
import { MinimalRichTextField } from "../rich-text/minimal-rich-text-field";
|
|
58
11
|
import { RichTextDisplay } from "../rich-text/rich-text-display";
|
|
59
|
-
export
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
var _h = useState(!comment.value && ((_b = comment.createdBy) === null || _b === void 0 ? void 0 : _b.id) === (commentAuthor === null || commentAuthor === void 0 ? void 0 : commentAuthor.id) && !!onSave), editing = _h[0], setEditing = _h[1];
|
|
67
|
-
useEffect(function () {
|
|
12
|
+
export const CommentItem = ({ comment, onSave, onResolve, onReply, onDelete, onCancel, commentAuthor, onEditingChange, isTopLevel = true, className, }) => {
|
|
13
|
+
const { t } = useTranslation();
|
|
14
|
+
const [draft, setDraft] = useState(comment.value || "");
|
|
15
|
+
const [focused, setFocused] = useState(false);
|
|
16
|
+
const [loading, setLoading] = useState(false);
|
|
17
|
+
const [editing, setEditing] = useState(!comment.value && comment.createdBy?.id === commentAuthor?.id && !!onSave);
|
|
18
|
+
useEffect(() => {
|
|
68
19
|
if (onEditingChange) {
|
|
69
20
|
onEditingChange(comment.id, editing);
|
|
70
|
-
return
|
|
21
|
+
return () => onEditingChange(comment.id, false);
|
|
71
22
|
}
|
|
72
23
|
}, [editing, comment.id, onEditingChange]);
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
(comment.createdBy && getUserColor((_b = comment.createdBy) === null || _b === void 0 ? void 0 : _b.id));
|
|
77
|
-
}, [comment.createdBy]);
|
|
78
|
-
return (_jsxs("div", { className: cn("flex gap-3 items-start", className), children: [_jsx(Avatar, { entity: __assign({ type: "user" }, (comment.createdBy || {})), size: 24 }), _jsxs("div", { className: "flex-1 flex flex-col gap-1", children: [_jsxs("div", { children: [_jsx("div", { className: cn("leading-[1] font-medium font-heading", !comment.createdAt && "py-1.25"), children: ((_c = comment.createdBy) === null || _c === void 0 ? void 0 : _c.name) || "Unknown User" }), comment.createdAt && (_jsx("div", { className: "text-xs font-normal text-zinc-500", children: formatDistanceToNow(new Date(comment.createdAt), {
|
|
24
|
+
const quoteColor = useMemo(() => comment.createdBy?.color ||
|
|
25
|
+
(comment.createdBy && getUserColor(comment.createdBy?.id)), [comment.createdBy]);
|
|
26
|
+
return (_jsxs("div", { className: cn("flex gap-3 items-start", className), children: [_jsx(Avatar, { entity: { type: "user", ...(comment.createdBy || {}) }, size: 24 }), _jsxs("div", { className: "flex-1 flex flex-col gap-1 break-all", children: [_jsxs("div", { children: [_jsx("div", { className: cn("leading-[1] font-medium font-heading", !comment.createdAt && "py-1.25"), children: comment.createdBy?.name || "Unknown User" }), comment.createdAt && (_jsx("div", { className: "text-xs font-normal text-zinc-500", children: formatDistanceToNow(new Date(comment.createdAt), {
|
|
79
27
|
addSuffix: true,
|
|
80
|
-
}) }))] }), comment.quotation && (_jsxs("blockquote", { className: "mt-1 mb-2 pl-3.5 py-0.5 relative text-sm italic text-zinc-800 line-clamp-2", onClick:
|
|
28
|
+
}) }))] }), comment.quotation && (_jsxs("blockquote", { className: "mt-1 mb-2 pl-3.5 py-0.5 relative text-sm italic text-zinc-800 line-clamp-2", onClick: () => {
|
|
81
29
|
if (!comment.id)
|
|
82
30
|
return;
|
|
83
|
-
|
|
31
|
+
const highlight = document.querySelector(`[data-comment="${comment.id}"]`);
|
|
84
32
|
if (!highlight)
|
|
85
33
|
return;
|
|
86
34
|
highlight.scrollIntoView({
|
|
@@ -88,55 +36,37 @@ export var CommentItem = function (_a) {
|
|
|
88
36
|
block: "center",
|
|
89
37
|
});
|
|
90
38
|
highlight.classList.add("highlighted");
|
|
91
|
-
setTimeout(
|
|
92
|
-
}, children: [comment.quotation, _jsx("span", { className: "absolute inset-0 right-auto w-0.75 rounded bg-zinc-600 opacity-50", style: { backgroundColor: quoteColor } })] })), editing ? (_jsxs(_Fragment, { children: [_jsx(MinimalRichTextField, { value: draft, "data-comment-input": comment.id, onChange:
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
if (!(draft.trim().length > 0)) return [3 /*break*/, 4];
|
|
100
|
-
_a.label = 1;
|
|
101
|
-
case 1:
|
|
102
|
-
_a.trys.push([1, , 3, 4]);
|
|
103
|
-
return [4 /*yield*/, onSave(draft)];
|
|
104
|
-
case 2:
|
|
105
|
-
_a.sent();
|
|
39
|
+
setTimeout(() => highlight.classList.remove("highlighted"), 1200);
|
|
40
|
+
}, children: [comment.quotation, _jsx("span", { className: "absolute inset-0 right-auto w-0.75 rounded bg-zinc-600 opacity-50", style: { backgroundColor: quoteColor } })] })), editing ? (_jsxs(_Fragment, { children: [_jsx(MinimalRichTextField, { value: draft, "data-comment-input": comment.id, onChange: (value) => setDraft(value), onKeyDown: async (e) => {
|
|
41
|
+
if (e.key === "Enter" && e.metaKey) {
|
|
42
|
+
e.preventDefault();
|
|
43
|
+
setLoading(true);
|
|
44
|
+
if (draft.trim().length > 0) {
|
|
45
|
+
try {
|
|
46
|
+
await onSave(draft);
|
|
106
47
|
setEditing(false);
|
|
107
|
-
|
|
108
|
-
|
|
48
|
+
}
|
|
49
|
+
finally {
|
|
109
50
|
setLoading(false);
|
|
110
|
-
|
|
111
|
-
case 4: return [2 /*return*/];
|
|
51
|
+
}
|
|
112
52
|
}
|
|
113
|
-
}
|
|
114
|
-
}
|
|
53
|
+
}
|
|
54
|
+
}, autoFocus: true, placeholder: comment.inReplyTo
|
|
115
55
|
? t("formatting.comments.reply-placeholder")
|
|
116
|
-
: t("formatting.comments.comment-placeholder"), disabled: loading, className: cn("border border-border focus-within:border-border-accent", "px-3 py-2 text-sm font-normal rounded-3xl", "focus-within:rounded-xl focus-within:min-h-20 transition-all", focused && "rounded-xl min-h-20"), onFocus:
|
|
56
|
+
: t("formatting.comments.comment-placeholder"), disabled: loading, className: cn("border border-border focus-within:border-border-accent", "px-3 py-2 text-sm font-normal rounded-3xl", "focus-within:rounded-xl focus-within:min-h-20 transition-all", "flex-1 w-full overflow-x-auto break-all", focused && "rounded-xl min-h-20"), onFocus: () => setFocused(true) }), _jsxs("div", { className: "flex items-center justify-end gap-2 mt-2", children: [onCancel && (_jsx(Button, { type: "button", variant: "secondary", size: "sm", disabled: loading, onClick: () => {
|
|
117
57
|
onCancel();
|
|
118
58
|
setDraft(comment.value || "");
|
|
119
59
|
setEditing(false);
|
|
120
|
-
}, children: _jsx(Trans, { children: "formatting.comments.cancel" }) })), _jsx(Button, { type: "button", onClick:
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
_a.sent();
|
|
131
|
-
setEditing(false);
|
|
132
|
-
return [3 /*break*/, 4];
|
|
133
|
-
case 3:
|
|
134
|
-
setLoading(false);
|
|
135
|
-
return [7 /*endfinally*/];
|
|
136
|
-
case 4: return [2 /*return*/];
|
|
137
|
-
}
|
|
138
|
-
});
|
|
139
|
-
}); }, disabled: !draft.trim() || loading, variant: "primary", size: "sm", title: "Save comment", "aria-label": "Save comment", children: _jsx(Trans, { children: "formatting.comments.save-comment" }) })] })] })) : (_jsx(RichTextDisplay, { className: "text-sm font-normal", children: comment.value || "" }))] }), !editing && (_jsxs("div", { children: [isTopLevel && onReply && (_jsx("button", { type: "button", onClick: function () { return onReply(); }, title: "Reply", "aria-label": "Reply", className: "p-1.5 cursor-pointer hover:bg-zinc-100 rounded-base", children: _jsx(MessageCircleIcon, { className: "size-3.5" }) })), isTopLevel && onResolve && (_jsx("button", { type: "button", onClick: function () { return onResolve(); }, title: "Resolve comment", "aria-label": "Resolve comment", className: "p-1.5 cursor-pointer hover:bg-zinc-100 rounded-base", children: _jsx(CheckIcon, { className: "size-3.5" }) })), (onDelete || onSave) && (_jsxs(Popover, { children: [_jsx(PopoverTrigger, { asChild: true, children: _jsx("button", { type: "button", title: "Comment options", "aria-label": "Comment options", className: "p-1.5 cursor-pointer hover:bg-zinc-100 rounded-base", children: _jsx(MoreHorizontalIcon, { className: "size-3.5" }) }) }), _jsxs(PopoverContent, { className: "p-0 gap-0 overflow-hidden min-w-32", children: [!!onSave && (_jsxs(PopoverItem, { onClick: function () {
|
|
60
|
+
}, children: _jsx(Trans, { children: "formatting.comments.cancel" }) })), _jsx(Button, { type: "button", onClick: async () => {
|
|
61
|
+
setLoading(true);
|
|
62
|
+
try {
|
|
63
|
+
await onSave(draft);
|
|
64
|
+
setEditing(false);
|
|
65
|
+
}
|
|
66
|
+
finally {
|
|
67
|
+
setLoading(false);
|
|
68
|
+
}
|
|
69
|
+
}, disabled: !draft.trim() || loading, variant: "primary", size: "sm", title: "Save comment", "aria-label": "Save comment", children: _jsx(Trans, { children: "formatting.comments.save-comment" }) })] })] })) : (_jsx(RichTextDisplay, { className: "text-sm font-normal", children: comment.value || "" }))] }), !editing && (_jsxs("div", { children: [isTopLevel && onReply && (_jsx("button", { type: "button", onClick: () => onReply(), title: "Reply", "aria-label": "Reply", className: "p-1.5 cursor-pointer hover:bg-zinc-100 rounded-base", children: _jsx(MessageCircleIcon, { className: "size-3.5" }) })), isTopLevel && onResolve && (_jsx("button", { type: "button", onClick: () => onResolve(), title: "Resolve comment", "aria-label": "Resolve comment", className: "p-1.5 cursor-pointer hover:bg-zinc-100 rounded-base", children: _jsx(CheckIcon, { className: "size-3.5" }) })), (onDelete || onSave) && (_jsxs(Popover, { children: [_jsx(PopoverTrigger, { asChild: true, children: _jsx("button", { type: "button", title: "Comment options", "aria-label": "Comment options", className: "p-1.5 cursor-pointer hover:bg-zinc-100 rounded-base", children: _jsx(MoreHorizontalIcon, { className: "size-3.5" }) }) }), _jsxs(PopoverContent, { className: "p-0 gap-0 overflow-hidden min-w-32", children: [!!onSave && (_jsxs(PopoverItem, { onClick: () => {
|
|
140
70
|
setEditing(true);
|
|
141
71
|
}, className: "text-xs border-0", children: [_jsx(PencilLineIcon, { className: "size-3.5! mr-1" }), _jsx(Trans, { children: "formatting.comments.edit-comment" })] })), !!onDelete && (_jsxs(PopoverItem, { onClick: onDelete, className: "text-xs border-0", children: [_jsx(TrashIcon, { className: "size-3.5! mr-1" }), _jsx(Trans, { children: "formatting.comments.delete-comment" })] }))] })] }))] }))] }));
|
|
142
72
|
};
|
|
@@ -1,88 +1,51 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
var __assign = (this && this.__assign) || function () {
|
|
3
|
-
__assign = Object.assign || function(t) {
|
|
4
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
-
s = arguments[i];
|
|
6
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
-
t[p] = s[p];
|
|
8
|
-
}
|
|
9
|
-
return t;
|
|
10
|
-
};
|
|
11
|
-
return __assign.apply(this, arguments);
|
|
12
|
-
};
|
|
13
|
-
var __rest = (this && this.__rest) || function (s, e) {
|
|
14
|
-
var t = {};
|
|
15
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
16
|
-
t[p] = s[p];
|
|
17
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
18
|
-
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
19
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
20
|
-
t[p[i]] = s[p[i]];
|
|
21
|
-
}
|
|
22
|
-
return t;
|
|
23
|
-
};
|
|
24
2
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
25
3
|
import { ChevronRightIcon, CheckIcon } from "lucide-react";
|
|
26
4
|
import { ContextMenu as ContextMenuPrimitive } from "radix-ui";
|
|
27
5
|
import { cn } from "../../utils";
|
|
28
|
-
function ContextMenu(
|
|
29
|
-
|
|
30
|
-
return _jsx(ContextMenuPrimitive.Root, __assign({ "data-slot": "context-menu" }, props));
|
|
6
|
+
function ContextMenu({ ...props }) {
|
|
7
|
+
return _jsx(ContextMenuPrimitive.Root, { "data-slot": "context-menu", ...props });
|
|
31
8
|
}
|
|
32
|
-
function ContextMenuTrigger(
|
|
33
|
-
|
|
34
|
-
return (_jsx(ContextMenuPrimitive.Trigger, __assign({ "data-slot": "context-menu-trigger", className: cn("select-none", className) }, props)));
|
|
9
|
+
function ContextMenuTrigger({ className, ...props }) {
|
|
10
|
+
return (_jsx(ContextMenuPrimitive.Trigger, { "data-slot": "context-menu-trigger", className: cn("select-none", className), ...props }));
|
|
35
11
|
}
|
|
36
|
-
function ContextMenuGroup(
|
|
37
|
-
|
|
38
|
-
return (_jsx(ContextMenuPrimitive.Group, __assign({ "data-slot": "context-menu-group" }, props)));
|
|
12
|
+
function ContextMenuGroup({ ...props }) {
|
|
13
|
+
return (_jsx(ContextMenuPrimitive.Group, { "data-slot": "context-menu-group", ...props }));
|
|
39
14
|
}
|
|
40
|
-
function ContextMenuPortal(
|
|
41
|
-
|
|
42
|
-
return (_jsx(ContextMenuPrimitive.Portal, __assign({ "data-slot": "context-menu-portal" }, props)));
|
|
15
|
+
function ContextMenuPortal({ ...props }) {
|
|
16
|
+
return (_jsx(ContextMenuPrimitive.Portal, { "data-slot": "context-menu-portal", ...props }));
|
|
43
17
|
}
|
|
44
|
-
function ContextMenuSub(
|
|
45
|
-
|
|
46
|
-
return _jsx(ContextMenuPrimitive.Sub, __assign({ "data-slot": "context-menu-sub" }, props));
|
|
18
|
+
function ContextMenuSub({ ...props }) {
|
|
19
|
+
return _jsx(ContextMenuPrimitive.Sub, { "data-slot": "context-menu-sub", ...props });
|
|
47
20
|
}
|
|
48
|
-
function ContextMenuRadioGroup(
|
|
49
|
-
|
|
50
|
-
return (_jsx(ContextMenuPrimitive.RadioGroup, __assign({ "data-slot": "context-menu-radio-group" }, props)));
|
|
21
|
+
function ContextMenuRadioGroup({ ...props }) {
|
|
22
|
+
return (_jsx(ContextMenuPrimitive.RadioGroup, { "data-slot": "context-menu-radio-group", ...props }));
|
|
51
23
|
}
|
|
52
|
-
function ContextMenuContent(
|
|
53
|
-
|
|
54
|
-
return (_jsx(ContextMenuPrimitive.Portal, { children: _jsx(ContextMenuPrimitive.Content, __assign({ "data-slot": "context-menu-content", className: cn("empty:hidden 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 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 ring-black/10 bg-white text-black min-w-36 rounded-lg p-1 shadow-md ring-1 duration-100 z-50 max-h-(--radix-context-menu-content-available-height) origin-(--radix-context-menu-content-transform-origin) overflow-x-hidden overflow-y-auto", className) }, props)) }));
|
|
24
|
+
function ContextMenuContent({ className, ...props }) {
|
|
25
|
+
return (_jsx(ContextMenuPrimitive.Portal, { children: _jsx(ContextMenuPrimitive.Content, { "data-slot": "context-menu-content", className: cn("empty:hidden 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 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 ring-black/10 bg-white text-black min-w-36 rounded-lg p-1 shadow-md ring-1 duration-100 z-50 max-h-(--radix-context-menu-content-available-height) origin-(--radix-context-menu-content-transform-origin) overflow-x-hidden overflow-y-auto", className), ...props }) }));
|
|
55
26
|
}
|
|
56
|
-
function ContextMenuItem(
|
|
57
|
-
|
|
58
|
-
return (_jsx(ContextMenuPrimitive.Item, __assign({ "data-slot": "context-menu-item", "data-inset": inset, "data-variant": variant, className: cn("focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:text-destructive focus:*:[svg]:text-accent-foreground gap-1.5 rounded-md px-1.5 py-1 text-sm data-inset:pl-7 [&_svg:not([class*='size-'])]:size-4 group/context-menu-item relative flex cursor-default items-center outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0", className) }, props)));
|
|
27
|
+
function ContextMenuItem({ className, inset, variant = "default", ...props }) {
|
|
28
|
+
return (_jsx(ContextMenuPrimitive.Item, { "data-slot": "context-menu-item", "data-inset": inset, "data-variant": variant, className: cn("focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:text-destructive focus:*:[svg]:text-accent-foreground gap-1.5 rounded-md px-1.5 py-1 text-sm data-inset:pl-7 [&_svg:not([class*='size-'])]:size-4 group/context-menu-item relative flex cursor-default items-center outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0", className), ...props }));
|
|
59
29
|
}
|
|
60
|
-
function ContextMenuSubTrigger(
|
|
61
|
-
|
|
62
|
-
return (_jsxs(ContextMenuPrimitive.SubTrigger, __assign({ "data-slot": "context-menu-sub-trigger", "data-inset": inset, className: cn("focus:bg-accent focus:text-accent-foreground data-open:bg-accent data-open:text-accent-foreground gap-1.5 rounded-md px-1.5 py-1 text-sm data-inset:pl-7 [&_svg:not([class*='size-'])]:size-4 flex cursor-default items-center outline-hidden select-none [&_svg]:pointer-events-none [&_svg]:shrink-0", className) }, props, { children: [children, _jsx(ChevronRightIcon, { className: "cn-rtl-flip ml-auto" })] })));
|
|
30
|
+
function ContextMenuSubTrigger({ className, inset, children, ...props }) {
|
|
31
|
+
return (_jsxs(ContextMenuPrimitive.SubTrigger, { "data-slot": "context-menu-sub-trigger", "data-inset": inset, className: cn("focus:bg-accent focus:text-accent-foreground data-open:bg-accent data-open:text-accent-foreground gap-1.5 rounded-md px-1.5 py-1 text-sm data-inset:pl-7 [&_svg:not([class*='size-'])]:size-4 flex cursor-default items-center outline-hidden select-none [&_svg]:pointer-events-none [&_svg]:shrink-0", className), ...props, children: [children, _jsx(ChevronRightIcon, { className: "cn-rtl-flip ml-auto" })] }));
|
|
63
32
|
}
|
|
64
|
-
function ContextMenuSubContent(
|
|
65
|
-
|
|
66
|
-
return (_jsx(ContextMenuPrimitive.SubContent, __assign({ "data-slot": "context-menu-sub-content", className: cn("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 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 bg-popover text-popover-foreground min-w-32 rounded-lg border p-1 shadow-lg duration-100 z-50 origin-(--radix-context-menu-content-transform-origin) overflow-hidden", className) }, props)));
|
|
33
|
+
function ContextMenuSubContent({ className, ...props }) {
|
|
34
|
+
return (_jsx(ContextMenuPrimitive.SubContent, { "data-slot": "context-menu-sub-content", className: cn("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 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 bg-popover text-popover-foreground min-w-32 rounded-lg border p-1 shadow-lg duration-100 z-50 origin-(--radix-context-menu-content-transform-origin) overflow-hidden", className), ...props }));
|
|
67
35
|
}
|
|
68
|
-
function ContextMenuCheckboxItem(
|
|
69
|
-
|
|
70
|
-
return (_jsxs(ContextMenuPrimitive.CheckboxItem, __assign({ "data-slot": "context-menu-checkbox-item", "data-inset": inset, className: cn("focus:bg-accent focus:text-accent-foreground gap-1.5 rounded-md py-1 pr-8 pl-1.5 text-sm data-inset:pl-7 [&_svg:not([class*='size-'])]:size-4 relative flex cursor-default items-center outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0", className), checked: checked }, props, { children: [_jsx("span", { className: "absolute right-2 pointer-events-none", children: _jsx(ContextMenuPrimitive.ItemIndicator, { children: _jsx(CheckIcon, {}) }) }), children] })));
|
|
36
|
+
function ContextMenuCheckboxItem({ className, children, checked, inset, ...props }) {
|
|
37
|
+
return (_jsxs(ContextMenuPrimitive.CheckboxItem, { "data-slot": "context-menu-checkbox-item", "data-inset": inset, className: cn("focus:bg-accent focus:text-accent-foreground gap-1.5 rounded-md py-1 pr-8 pl-1.5 text-sm data-inset:pl-7 [&_svg:not([class*='size-'])]:size-4 relative flex cursor-default items-center outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0", className), checked: checked, ...props, children: [_jsx("span", { className: "absolute right-2 pointer-events-none", children: _jsx(ContextMenuPrimitive.ItemIndicator, { children: _jsx(CheckIcon, {}) }) }), children] }));
|
|
71
38
|
}
|
|
72
|
-
function ContextMenuRadioItem(
|
|
73
|
-
|
|
74
|
-
return (_jsxs(ContextMenuPrimitive.RadioItem, __assign({ "data-slot": "context-menu-radio-item", "data-inset": inset, className: cn("focus:bg-accent focus:text-accent-foreground gap-1.5 rounded-md py-1 pr-8 pl-1.5 text-sm data-inset:pl-7 [&_svg:not([class*='size-'])]:size-4 relative flex cursor-default items-center outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0", className) }, props, { children: [_jsx("span", { className: "absolute right-2 pointer-events-none", children: _jsx(ContextMenuPrimitive.ItemIndicator, { children: _jsx(CheckIcon, {}) }) }), children] })));
|
|
39
|
+
function ContextMenuRadioItem({ className, children, inset, ...props }) {
|
|
40
|
+
return (_jsxs(ContextMenuPrimitive.RadioItem, { "data-slot": "context-menu-radio-item", "data-inset": inset, className: cn("focus:bg-accent focus:text-accent-foreground gap-1.5 rounded-md py-1 pr-8 pl-1.5 text-sm data-inset:pl-7 [&_svg:not([class*='size-'])]:size-4 relative flex cursor-default items-center outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0", className), ...props, children: [_jsx("span", { className: "absolute right-2 pointer-events-none", children: _jsx(ContextMenuPrimitive.ItemIndicator, { children: _jsx(CheckIcon, {}) }) }), children] }));
|
|
75
41
|
}
|
|
76
|
-
function ContextMenuLabel(
|
|
77
|
-
|
|
78
|
-
return (_jsx(ContextMenuPrimitive.Label, __assign({ "data-slot": "context-menu-label", "data-inset": inset, className: cn("text-muted-foreground px-1.5 py-1 text-xs font-medium data-inset:pl-7", className) }, props)));
|
|
42
|
+
function ContextMenuLabel({ className, inset, ...props }) {
|
|
43
|
+
return (_jsx(ContextMenuPrimitive.Label, { "data-slot": "context-menu-label", "data-inset": inset, className: cn("text-muted-foreground px-1.5 py-1 text-xs font-medium data-inset:pl-7", className), ...props }));
|
|
79
44
|
}
|
|
80
|
-
function ContextMenuSeparator(
|
|
81
|
-
|
|
82
|
-
return (_jsx(ContextMenuPrimitive.Separator, __assign({ "data-slot": "context-menu-separator", className: cn("bg-border -mx-1 my-1 h-px", className) }, props)));
|
|
45
|
+
function ContextMenuSeparator({ className, ...props }) {
|
|
46
|
+
return (_jsx(ContextMenuPrimitive.Separator, { "data-slot": "context-menu-separator", className: cn("bg-border -mx-1 my-1 h-px", className), ...props }));
|
|
83
47
|
}
|
|
84
|
-
function ContextMenuShortcut(
|
|
85
|
-
|
|
86
|
-
return (_jsx("span", __assign({ "data-slot": "context-menu-shortcut", className: cn("text-muted-foreground group-focus/context-menu-item:text-accent-foreground ml-auto text-xs tracking-widest", className) }, props)));
|
|
48
|
+
function ContextMenuShortcut({ className, ...props }) {
|
|
49
|
+
return (_jsx("span", { "data-slot": "context-menu-shortcut", className: cn("text-muted-foreground group-focus/context-menu-item:text-accent-foreground ml-auto text-xs tracking-widest", className), ...props }));
|
|
87
50
|
}
|
|
88
51
|
export { ContextMenu, ContextMenuTrigger, ContextMenuContent, ContextMenuItem, ContextMenuCheckboxItem, ContextMenuRadioItem, ContextMenuLabel, ContextMenuSeparator, ContextMenuShortcut, ContextMenuGroup, ContextMenuPortal, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuRadioGroup, };
|
|
@@ -1,77 +1,31 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
var __assign = (this && this.__assign) || function () {
|
|
3
|
-
__assign = Object.assign || function(t) {
|
|
4
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
-
s = arguments[i];
|
|
6
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
-
t[p] = s[p];
|
|
8
|
-
}
|
|
9
|
-
return t;
|
|
10
|
-
};
|
|
11
|
-
return __assign.apply(this, arguments);
|
|
12
|
-
};
|
|
13
|
-
var __rest = (this && this.__rest) || function (s, e) {
|
|
14
|
-
var t = {};
|
|
15
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
16
|
-
t[p] = s[p];
|
|
17
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
18
|
-
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
19
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
20
|
-
t[p[i]] = s[p[i]];
|
|
21
|
-
}
|
|
22
|
-
return t;
|
|
23
|
-
};
|
|
24
2
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
25
3
|
import * as React from "react";
|
|
26
4
|
import * as DialogPrimitive from "@radix-ui/react-dialog";
|
|
27
5
|
import { XIcon } from "lucide-react";
|
|
28
6
|
import { Button } from "./button";
|
|
29
7
|
import { cn } from "../../utils";
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
var className = _a.className, props = __rest(_a, ["className"]);
|
|
36
|
-
return (_jsx(DialogPrimitive.Close, { asChild: true, children: _jsxs(Button, __assign({ variant: "roundedSecondary", size: "icon-sm", className: cn("absolute right-4 lg:right-7 top-4 lg:top-7 bg-white", className), ref: ref }, props, { children: [_jsx(XIcon, { strokeWidth: 2.5 }), _jsx("span", { className: "sr-only", children: "Close" })] })) }));
|
|
37
|
-
});
|
|
8
|
+
const Dialog = DialogPrimitive.Root;
|
|
9
|
+
const DialogTrigger = DialogPrimitive.Trigger;
|
|
10
|
+
const DialogPortal = DialogPrimitive.Portal;
|
|
11
|
+
const DialogClose = DialogPrimitive.Close;
|
|
12
|
+
const DialogCloseIcon = React.forwardRef(({ className, ...props }, ref) => (_jsx(DialogPrimitive.Close, { asChild: true, children: _jsxs(Button, { variant: "roundedSecondary", size: "icon-sm", className: cn("absolute right-4 lg:right-7 top-4 lg:top-7 bg-white", className), ref: ref, ...props, children: [_jsx(XIcon, { strokeWidth: 2.5 }), _jsx("span", { className: "sr-only", children: "Close" })] }) })));
|
|
38
13
|
DialogCloseIcon.displayName = "DialogCloseIcon";
|
|
39
|
-
|
|
40
|
-
var className = _a.className, props = __rest(_a, ["className"]);
|
|
41
|
-
return (_jsx(DialogPrimitive.Overlay, __assign({ ref: ref, className: cn("fixed inset-0 z-50 bg-nav/75 backdrop-blur-xs transition data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0", className) }, props)));
|
|
42
|
-
});
|
|
14
|
+
const DialogOverlay = React.forwardRef(({ className, ...props }, ref) => (_jsx(DialogPrimitive.Overlay, { ref: ref, className: cn("fixed inset-0 z-50 bg-nav/75 backdrop-blur-xs transition data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0", className), ...props })));
|
|
43
15
|
DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
document.body.style.pointerEvents = "";
|
|
49
|
-
} }, props, { children: [children, showClose && _jsx(DialogCloseIcon, {})] }))] }));
|
|
50
|
-
});
|
|
16
|
+
const DialogContent = React.forwardRef(({ className, children, showClose = true, ...props }, ref) => (_jsxs(DialogPortal, { children: [_jsx(DialogOverlay, {}), _jsxs(DialogPrimitive.Content, { ref: ref, className: cn("group/dialog fixed left-[50%] top-[50%] z-50 w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 duration-200 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-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-top-[48%]", "border border-border-accent bg-bg rounded-xl p-6 lg:p-8", "has-[.dialog-section]:bg-transparent has-[.dialog-section]:border-0 has-[.dialog-section]:px-1 has-[.dialog-section]:py-10 has-[.dialog-section]:outline-none has-[.dialog-section]:rounded-none has-[.dialog-section]:overflow-auto has-[.dialog-section]:max-h-none has-[.dialog-section]:h-screen has-[.dialog-section]:justify-center", className), onCloseAutoFocus: (event) => {
|
|
17
|
+
event.preventDefault();
|
|
18
|
+
document.body.style.pointerEvents = "";
|
|
19
|
+
}, ...props, children: [children, showClose && _jsx(DialogCloseIcon, {})] })] })));
|
|
51
20
|
DialogContent.displayName = DialogPrimitive.Content.displayName;
|
|
52
|
-
|
|
53
|
-
var className = _a.className, props = __rest(_a, ["className"]);
|
|
54
|
-
return (_jsx("div", __assign({ className: cn("flex flex-col space-y-1.5 text-center sm:text-left", className) }, props)));
|
|
55
|
-
};
|
|
21
|
+
const DialogHeader = ({ className, ...props }) => (_jsx("div", { className: cn("flex flex-col space-y-1.5 text-center sm:text-left", className), ...props }));
|
|
56
22
|
DialogHeader.displayName = "DialogHeader";
|
|
57
|
-
|
|
58
|
-
var className = _a.className, props = __rest(_a, ["className"]);
|
|
59
|
-
return (_jsx("div", __assign({ className: cn("relative dialog-section border border-border-accent bg-bg rounded-xl p-6 lg:p-8 max-h-[80vh] overflow-auto", className) }, props)));
|
|
60
|
-
};
|
|
23
|
+
const DialogSection = ({ className, ...props }) => (_jsx("div", { className: cn("relative dialog-section border border-border-accent bg-bg rounded-xl p-6 lg:p-8 max-h-[80vh] overflow-auto", className), ...props }));
|
|
61
24
|
DialogSection.displayName = "DialogSection";
|
|
62
|
-
|
|
63
|
-
var className = _a.className, props = __rest(_a, ["className"]);
|
|
64
|
-
return (_jsx("div", __assign({ className: cn("flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2", className) }, props)));
|
|
65
|
-
};
|
|
25
|
+
const DialogFooter = ({ className, ...props }) => (_jsx("div", { className: cn("flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2", className), ...props }));
|
|
66
26
|
DialogFooter.displayName = "DialogFooter";
|
|
67
|
-
|
|
68
|
-
var className = _a.className, props = __rest(_a, ["className"]);
|
|
69
|
-
return (_jsx(DialogPrimitive.Title, __assign({ ref: ref, className: cn("text-2xl font-heading font-medium leading-none mb-3", className) }, props)));
|
|
70
|
-
});
|
|
27
|
+
const DialogTitle = React.forwardRef(({ className, ...props }, ref) => (_jsx(DialogPrimitive.Title, { ref: ref, className: cn("text-2xl font-heading font-medium leading-none mb-3", className), ...props })));
|
|
71
28
|
DialogTitle.displayName = DialogPrimitive.Title.displayName;
|
|
72
|
-
|
|
73
|
-
var className = _a.className, props = __rest(_a, ["className"]);
|
|
74
|
-
return (_jsx(DialogPrimitive.Description, __assign({ ref: ref, className: cn("text-sm font-base text-text", className) }, props)));
|
|
75
|
-
});
|
|
29
|
+
const DialogDescription = React.forwardRef(({ className, ...props }, ref) => (_jsx(DialogPrimitive.Description, { ref: ref, className: cn("text-sm font-base text-text", className), ...props })));
|
|
76
30
|
DialogDescription.displayName = DialogPrimitive.Description.displayName;
|
|
77
31
|
export { Dialog, DialogPortal, DialogOverlay, DialogClose, DialogCloseIcon, DialogTrigger, DialogContent, DialogHeader, DialogFooter, DialogSection, DialogTitle, DialogDescription, };
|