@tldraw/commenting 5.3.0-internal.41291fb579ed → 5.3.0-internal.5f14a24c179e
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/commenting.css +3 -5
- package/dist-cjs/canvas/comments-filter-menu.js +21 -13
- package/dist-cjs/canvas/comments-filter-menu.js.map +2 -2
- package/dist-cjs/canvas/comments-overflow-menu.js +10 -2
- package/dist-cjs/canvas/comments-overflow-menu.js.map +2 -2
- package/dist-cjs/canvas/comments-overlay.js +9 -30
- package/dist-cjs/canvas/comments-overlay.js.map +2 -2
- package/dist-cjs/canvas/comments-visibility-toggle.js +4 -3
- package/dist-cjs/canvas/comments-visibility-toggle.js.map +2 -2
- package/dist-cjs/index.js +1 -1
- package/dist-esm/canvas/comments-filter-menu.mjs +21 -13
- package/dist-esm/canvas/comments-filter-menu.mjs.map +2 -2
- package/dist-esm/canvas/comments-overflow-menu.mjs +10 -2
- package/dist-esm/canvas/comments-overflow-menu.mjs.map +2 -2
- package/dist-esm/canvas/comments-overlay.mjs +9 -30
- package/dist-esm/canvas/comments-overlay.mjs.map +2 -2
- package/dist-esm/canvas/comments-visibility-toggle.mjs +4 -3
- package/dist-esm/canvas/comments-visibility-toggle.mjs.map +2 -2
- package/dist-esm/index.mjs +1 -1
- package/package.json +3 -3
- package/src/canvas/comments-filter-menu.tsx +18 -14
- package/src/canvas/comments-overflow-menu.tsx +7 -3
- package/src/canvas/comments-overlay.tsx +12 -41
- package/src/canvas/comments-visibility-toggle.tsx +5 -4
- package/src/ui/comments.css +3 -5
- package/dist-cjs/ui/tooltip-button.js +0 -32
- package/dist-cjs/ui/tooltip-button.js.map +0 -7
- package/dist-esm/ui/tooltip-button.mjs +0 -12
- package/dist-esm/ui/tooltip-button.mjs.map +0 -7
- package/src/ui/tooltip-button.tsx +0 -20
package/commenting.css
CHANGED
|
@@ -36,7 +36,7 @@
|
|
|
36
36
|
|
|
37
37
|
.tlui-cmt-head {
|
|
38
38
|
display: flex;
|
|
39
|
-
align-items:
|
|
39
|
+
align-items: baseline;
|
|
40
40
|
gap: 6px;
|
|
41
41
|
}
|
|
42
42
|
|
|
@@ -47,7 +47,7 @@
|
|
|
47
47
|
}
|
|
48
48
|
|
|
49
49
|
.tlui-cmt-time {
|
|
50
|
-
font-size:
|
|
50
|
+
font-size: 11px;
|
|
51
51
|
color: var(--tl-color-text-3);
|
|
52
52
|
}
|
|
53
53
|
|
|
@@ -570,9 +570,7 @@
|
|
|
570
570
|
margin-top: 2px;
|
|
571
571
|
}
|
|
572
572
|
|
|
573
|
-
|
|
574
|
-
padding: 4px 0 0;
|
|
575
|
-
}
|
|
573
|
+
/* The reply composer carries no avatar at all — the field spans the thread's full width. */
|
|
576
574
|
.tlui-cmt-thread .tlui-cmt-composer .tlui-cmt-avatar {
|
|
577
575
|
display: none;
|
|
578
576
|
}
|
|
@@ -23,7 +23,6 @@ __export(comments_filter_menu_exports, {
|
|
|
23
23
|
module.exports = __toCommonJS(comments_filter_menu_exports);
|
|
24
24
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
25
25
|
var import_tldraw = require("tldraw");
|
|
26
|
-
var import_tooltip_button = require("../ui/tooltip-button");
|
|
27
26
|
var import_state = require("./state");
|
|
28
27
|
function CommentsFilterMenu({
|
|
29
28
|
canFilterByAuthor,
|
|
@@ -36,7 +35,16 @@ function CommentsFilterMenu({
|
|
|
36
35
|
import_state.sidebarFilters.update(editor, (f) => ({ ...f, [key]: !f[key] }));
|
|
37
36
|
};
|
|
38
37
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tldraw.TldrawUiDropdownMenuRoot, { id: "comments-filter", children: [
|
|
39
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tldraw.TldrawUiDropdownMenuTrigger, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
38
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tldraw.TldrawUiDropdownMenuTrigger, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
39
|
+
"button",
|
|
40
|
+
{
|
|
41
|
+
type: "button",
|
|
42
|
+
className: "tlui-cmt-header-btn",
|
|
43
|
+
title: msg("comments.filter"),
|
|
44
|
+
"aria-label": msg("comments.filter"),
|
|
45
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FilterIcon, {})
|
|
46
|
+
}
|
|
47
|
+
) }),
|
|
40
48
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
41
49
|
import_tldraw.TldrawUiDropdownMenuContent,
|
|
42
50
|
{
|
|
@@ -48,18 +56,18 @@ function CommentsFilterMenu({
|
|
|
48
56
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
49
57
|
import_tldraw.TldrawUiMenuCheckboxItem,
|
|
50
58
|
{
|
|
51
|
-
id: "show-
|
|
52
|
-
label: "comments.show-
|
|
53
|
-
checked:
|
|
54
|
-
onSelect: () => toggle("
|
|
59
|
+
id: "show-resolved",
|
|
60
|
+
label: "comments.show-resolved",
|
|
61
|
+
checked: filters.showResolved,
|
|
62
|
+
onSelect: () => toggle("showResolved")
|
|
55
63
|
}
|
|
56
64
|
),
|
|
57
65
|
canFilterByAuthor && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
58
66
|
import_tldraw.TldrawUiMenuCheckboxItem,
|
|
59
67
|
{
|
|
60
|
-
id: "
|
|
61
|
-
label: "comments.
|
|
62
|
-
checked:
|
|
68
|
+
id: "only-mine",
|
|
69
|
+
label: "comments.only-mine",
|
|
70
|
+
checked: filters.onlyMine,
|
|
63
71
|
onSelect: () => toggle("onlyMine")
|
|
64
72
|
}
|
|
65
73
|
),
|
|
@@ -75,10 +83,10 @@ function CommentsFilterMenu({
|
|
|
75
83
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
76
84
|
import_tldraw.TldrawUiMenuCheckboxItem,
|
|
77
85
|
{
|
|
78
|
-
id: "
|
|
79
|
-
label: "comments.
|
|
80
|
-
checked: filters.
|
|
81
|
-
onSelect: () => toggle("
|
|
86
|
+
id: "only-current-page",
|
|
87
|
+
label: "comments.only-current-page",
|
|
88
|
+
checked: filters.onlyCurrentPage,
|
|
89
|
+
onSelect: () => toggle("onlyCurrentPage")
|
|
82
90
|
}
|
|
83
91
|
)
|
|
84
92
|
] }) })
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/canvas/comments-filter-menu.tsx"],
|
|
4
|
-
"sourcesContent": ["import {\n\tTldrawUiDropdownMenuContent,\n\tTldrawUiDropdownMenuRoot,\n\tTldrawUiDropdownMenuTrigger,\n\tTldrawUiMenuCheckboxItem,\n\tTldrawUiMenuContextProvider,\n\tTldrawUiMenuGroup,\n\tuseEditor,\n\tuseTranslation,\n\tuseValue,\n} from 'tldraw'\nimport {
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;
|
|
4
|
+
"sourcesContent": ["import {\n\tTldrawUiDropdownMenuContent,\n\tTldrawUiDropdownMenuRoot,\n\tTldrawUiDropdownMenuTrigger,\n\tTldrawUiMenuCheckboxItem,\n\tTldrawUiMenuContextProvider,\n\tTldrawUiMenuGroup,\n\tuseEditor,\n\tuseTranslation,\n\tuseValue,\n} from 'tldraw'\nimport { SidebarFilters } from './sidebar-filters'\nimport { sidebarFilters } from './state'\n\n/** @public */\nexport interface CommentsFilterMenuProps {\n\t/** Whether to offer the \"only your threads\" toggle (needs a known current user). */\n\tcanFilterByAuthor?: boolean\n\t/** Whether to offer the \"only unread\" toggle (needs a read-status source). */\n\tcanFilterByUnread?: boolean\n}\n\n/** The funnel dropdown in the sidebar header: toggles for which threads the list shows.\n * @public @react */\nexport function CommentsFilterMenu({\n\tcanFilterByAuthor,\n\tcanFilterByUnread,\n}: CommentsFilterMenuProps) {\n\tconst editor = useEditor()\n\tconst msg = useTranslation()\n\tconst filters = useValue('sidebar filters', () => sidebarFilters.get(editor), [editor])\n\tconst toggle = (key: keyof SidebarFilters) => {\n\t\tsidebarFilters.update(editor, (f) => ({ ...f, [key]: !f[key] }))\n\t}\n\n\treturn (\n\t\t<TldrawUiDropdownMenuRoot id=\"comments-filter\">\n\t\t\t<TldrawUiDropdownMenuTrigger>\n\t\t\t\t<button\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\tclassName=\"tlui-cmt-header-btn\"\n\t\t\t\t\ttitle={msg('comments.filter')}\n\t\t\t\t\taria-label={msg('comments.filter')}\n\t\t\t\t>\n\t\t\t\t\t<FilterIcon />\n\t\t\t\t</button>\n\t\t\t</TldrawUiDropdownMenuTrigger>\n\t\t\t<TldrawUiDropdownMenuContent\n\t\t\t\tclassName=\"tlui-cmt-menu\"\n\t\t\t\tside=\"bottom\"\n\t\t\t\talign=\"end\"\n\t\t\t\talignOffset={0}\n\t\t\t>\n\t\t\t\t<TldrawUiMenuContextProvider type=\"menu\" sourceId=\"menu\">\n\t\t\t\t\t<TldrawUiMenuGroup id=\"comments-filter\">\n\t\t\t\t\t\t<TldrawUiMenuCheckboxItem\n\t\t\t\t\t\t\tid=\"show-resolved\"\n\t\t\t\t\t\t\tlabel=\"comments.show-resolved\"\n\t\t\t\t\t\t\tchecked={filters.showResolved}\n\t\t\t\t\t\t\tonSelect={() => toggle('showResolved')}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t{canFilterByAuthor && (\n\t\t\t\t\t\t\t<TldrawUiMenuCheckboxItem\n\t\t\t\t\t\t\t\tid=\"only-mine\"\n\t\t\t\t\t\t\t\tlabel=\"comments.only-mine\"\n\t\t\t\t\t\t\t\tchecked={filters.onlyMine}\n\t\t\t\t\t\t\t\tonSelect={() => toggle('onlyMine')}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{canFilterByUnread && (\n\t\t\t\t\t\t\t<TldrawUiMenuCheckboxItem\n\t\t\t\t\t\t\t\tid=\"only-unread\"\n\t\t\t\t\t\t\t\tlabel=\"comments.only-unread\"\n\t\t\t\t\t\t\t\tchecked={filters.onlyUnread}\n\t\t\t\t\t\t\t\tonSelect={() => toggle('onlyUnread')}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t<TldrawUiMenuCheckboxItem\n\t\t\t\t\t\t\tid=\"only-current-page\"\n\t\t\t\t\t\t\tlabel=\"comments.only-current-page\"\n\t\t\t\t\t\t\tchecked={filters.onlyCurrentPage}\n\t\t\t\t\t\t\tonSelect={() => toggle('onlyCurrentPage')}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</TldrawUiMenuGroup>\n\t\t\t\t</TldrawUiMenuContextProvider>\n\t\t\t</TldrawUiDropdownMenuContent>\n\t\t</TldrawUiDropdownMenuRoot>\n\t)\n}\n\nfunction FilterIcon() {\n\treturn (\n\t\t<svg width=\"15\" height=\"15\" viewBox=\"0 0 15 15\" fill=\"none\" aria-hidden=\"true\">\n\t\t\t<path\n\t\t\t\td=\"M5.5 3C4.67157 3 4 3.67157 4 4.5C4 5.32843 4.67157 6 5.5 6C6.32843 6 7 5.32843 7 4.5C7 3.67157 6.32843 3 5.5 3ZM3 5C3.01671 5 3.03323 4.99918 3.04952 4.99758C3.28022 6.1399 4.28967 7 5.5 7C6.71033 7 7.71978 6.1399 7.95048 4.99758C7.96677 4.99918 7.98329 5 8 5H13.5C13.7761 5 14 4.77614 14 4.5C14 4.22386 13.7761 4 13.5 4H8C7.98329 4 7.96677 4.00082 7.95048 4.00242C7.71978 2.86009 6.71033 2 5.5 2C4.28967 2 3.28022 2.86009 3.04952 4.00242C3.03323 4.00082 3.01671 4 3 4H1.5C1.22386 4 1 4.22386 1 4.5C1 4.77614 1.22386 5 1.5 5H3ZM11.9505 10.9976C11.7198 12.1399 10.7103 13 9.5 13C8.28967 13 7.28022 12.1399 7.04952 10.9976C7.03323 10.9992 7.01671 11 7 11H1.5C1.22386 11 1 10.7761 1 10.5C1 10.2239 1.22386 10 1.5 10H7C7.01671 10 7.03323 10.0008 7.04952 10.0024C7.28022 8.8601 8.28967 8 9.5 8C10.7103 8 11.7198 8.8601 11.9505 10.0024C11.9668 10.0008 11.9833 10 12 10H13.5C13.7761 10 14 10.2239 14 10.5C14 10.7761 13.7761 11 13.5 11H12C11.9833 11 11.9668 10.9992 11.9505 10.9976ZM8 10.5C8 9.67157 8.67157 9 9.5 9C10.3284 9 11 9.67157 11 10.5C11 11.3284 10.3284 12 9.5 12C8.67157 12 8 11.3284 8 10.5Z\"\n\t\t\t\tfill=\"currentColor\"\n\t\t\t\tfillRule=\"evenodd\"\n\t\t\t\tclipRule=\"evenodd\"\n\t\t\t/>\n\t\t</svg>\n\t)\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA4CK;AA5CL,oBAUO;AAEP,mBAA+B;AAYxB,SAAS,mBAAmB;AAAA,EAClC;AAAA,EACA;AACD,GAA4B;AAC3B,QAAM,aAAS,yBAAU;AACzB,QAAM,UAAM,8BAAe;AAC3B,QAAM,cAAU,wBAAS,mBAAmB,MAAM,4BAAe,IAAI,MAAM,GAAG,CAAC,MAAM,CAAC;AACtF,QAAM,SAAS,CAAC,QAA8B;AAC7C,gCAAe,OAAO,QAAQ,CAAC,OAAO,EAAE,GAAG,GAAG,CAAC,GAAG,GAAG,CAAC,EAAE,GAAG,EAAE,EAAE;AAAA,EAChE;AAEA,SACC,6CAAC,0CAAyB,IAAG,mBAC5B;AAAA,gDAAC,6CACA;AAAA,MAAC;AAAA;AAAA,QACA,MAAK;AAAA,QACL,WAAU;AAAA,QACV,OAAO,IAAI,iBAAiB;AAAA,QAC5B,cAAY,IAAI,iBAAiB;AAAA,QAEjC,sDAAC,cAAW;AAAA;AAAA,IACb,GACD;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACA,WAAU;AAAA,QACV,MAAK;AAAA,QACL,OAAM;AAAA,QACN,aAAa;AAAA,QAEb,sDAAC,6CAA4B,MAAK,QAAO,UAAS,QACjD,uDAAC,mCAAkB,IAAG,mBACrB;AAAA;AAAA,YAAC;AAAA;AAAA,cACA,IAAG;AAAA,cACH,OAAM;AAAA,cACN,SAAS,QAAQ;AAAA,cACjB,UAAU,MAAM,OAAO,cAAc;AAAA;AAAA,UACtC;AAAA,UACC,qBACA;AAAA,YAAC;AAAA;AAAA,cACA,IAAG;AAAA,cACH,OAAM;AAAA,cACN,SAAS,QAAQ;AAAA,cACjB,UAAU,MAAM,OAAO,UAAU;AAAA;AAAA,UAClC;AAAA,UAEA,qBACA;AAAA,YAAC;AAAA;AAAA,cACA,IAAG;AAAA,cACH,OAAM;AAAA,cACN,SAAS,QAAQ;AAAA,cACjB,UAAU,MAAM,OAAO,YAAY;AAAA;AAAA,UACpC;AAAA,UAED;AAAA,YAAC;AAAA;AAAA,cACA,IAAG;AAAA,cACH,OAAM;AAAA,cACN,SAAS,QAAQ;AAAA,cACjB,UAAU,MAAM,OAAO,iBAAiB;AAAA;AAAA,UACzC;AAAA,WACD,GACD;AAAA;AAAA,IACD;AAAA,KACD;AAEF;AAEA,SAAS,aAAa;AACrB,SACC,4CAAC,SAAI,OAAM,MAAK,QAAO,MAAK,SAAQ,aAAY,MAAK,QAAO,eAAY,QACvE;AAAA,IAAC;AAAA;AAAA,MACA,GAAE;AAAA,MACF,MAAK;AAAA,MACL,UAAS;AAAA,MACT,UAAS;AAAA;AAAA,EACV,GACD;AAEF;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -23,7 +23,6 @@ __export(comments_overflow_menu_exports, {
|
|
|
23
23
|
module.exports = __toCommonJS(comments_overflow_menu_exports);
|
|
24
24
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
25
25
|
var import_tldraw = require("tldraw");
|
|
26
|
-
var import_tooltip_button = require("../ui/tooltip-button");
|
|
27
26
|
var import_state = require("./state");
|
|
28
27
|
const HIDE_SHORTCUT = "\u21E7C";
|
|
29
28
|
function CommentsOverflowMenu() {
|
|
@@ -31,7 +30,16 @@ function CommentsOverflowMenu() {
|
|
|
31
30
|
const msg = (0, import_tldraw.useTranslation)();
|
|
32
31
|
const hidden = (0, import_tldraw.useValue)("comments hidden", () => import_state.commentsHidden.get(editor), [editor]);
|
|
33
32
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tldraw.TldrawUiDropdownMenuRoot, { id: "comments-overflow", children: [
|
|
34
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tldraw.TldrawUiDropdownMenuTrigger, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
33
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tldraw.TldrawUiDropdownMenuTrigger, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
34
|
+
"button",
|
|
35
|
+
{
|
|
36
|
+
type: "button",
|
|
37
|
+
className: "tlui-cmt-header-btn",
|
|
38
|
+
title: msg("comments.more-options"),
|
|
39
|
+
"aria-label": msg("comments.more-options"),
|
|
40
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tldraw.TldrawUiIcon, { icon: "dots-vertical", label: msg("comments.more-options"), small: true })
|
|
41
|
+
}
|
|
42
|
+
) }),
|
|
35
43
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
36
44
|
import_tldraw.TldrawUiDropdownMenuContent,
|
|
37
45
|
{
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/canvas/comments-overflow-menu.tsx"],
|
|
4
|
-
"sourcesContent": ["import {\n\tTldrawUiDropdownMenuContent,\n\tTldrawUiDropdownMenuGroup,\n\tTldrawUiDropdownMenuItem,\n\tTldrawUiDropdownMenuRoot,\n\tTldrawUiDropdownMenuTrigger,\n\tTldrawUiIcon,\n\tuseEditor,\n\tuseTranslation,\n\tuseValue,\n} from 'tldraw'\nimport {
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;
|
|
4
|
+
"sourcesContent": ["import {\n\tTldrawUiDropdownMenuContent,\n\tTldrawUiDropdownMenuGroup,\n\tTldrawUiDropdownMenuItem,\n\tTldrawUiDropdownMenuRoot,\n\tTldrawUiDropdownMenuTrigger,\n\tTldrawUiIcon,\n\tuseEditor,\n\tuseTranslation,\n\tuseValue,\n} from 'tldraw'\nimport { commentsHidden, toggleCommentsHidden } from './state'\n\n// A keyboard-shortcut glyph, not translatable copy \u2014 kept out of JSX as a constant.\nconst HIDE_SHORTCUT = '\u21E7C'\n\n/** The overflow (\u22EF) dropdown in the sidebar header. For now it holds the hide/show-comments\n * toggle; it's the home for later comment-wide controls (notifications, mark all as read).\n * @public @react */\nexport function CommentsOverflowMenu() {\n\tconst editor = useEditor()\n\tconst msg = useTranslation()\n\tconst hidden = useValue('comments hidden', () => commentsHidden.get(editor), [editor])\n\n\treturn (\n\t\t<TldrawUiDropdownMenuRoot id=\"comments-overflow\">\n\t\t\t<TldrawUiDropdownMenuTrigger>\n\t\t\t\t<button\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\tclassName=\"tlui-cmt-header-btn\"\n\t\t\t\t\ttitle={msg('comments.more-options')}\n\t\t\t\t\taria-label={msg('comments.more-options')}\n\t\t\t\t>\n\t\t\t\t\t<TldrawUiIcon icon=\"dots-vertical\" label={msg('comments.more-options')} small />\n\t\t\t\t</button>\n\t\t\t</TldrawUiDropdownMenuTrigger>\n\t\t\t<TldrawUiDropdownMenuContent\n\t\t\t\tclassName=\"tlui-cmt-menu\"\n\t\t\t\tside=\"bottom\"\n\t\t\t\talign=\"end\"\n\t\t\t\talignOffset={0}\n\t\t\t>\n\t\t\t\t<TldrawUiDropdownMenuGroup>\n\t\t\t\t\t<TldrawUiDropdownMenuItem>\n\t\t\t\t\t\t<button\n\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\tclassName=\"tlui-cmt-menu-item\"\n\t\t\t\t\t\t\tonClick={() => toggleCommentsHidden(editor)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<span>{hidden ? msg('comments.show') : msg('comments.hide')}</span>\n\t\t\t\t\t\t\t<span className=\"tlui-cmt-menu-item__shortcut\">{HIDE_SHORTCUT}</span>\n\t\t\t\t\t\t</button>\n\t\t\t\t\t</TldrawUiDropdownMenuItem>\n\t\t\t\t</TldrawUiDropdownMenuGroup>\n\t\t\t</TldrawUiDropdownMenuContent>\n\t\t</TldrawUiDropdownMenuRoot>\n\t)\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAiCK;AAjCL,oBAUO;AACP,mBAAqD;AAGrD,MAAM,gBAAgB;AAKf,SAAS,uBAAuB;AACtC,QAAM,aAAS,yBAAU;AACzB,QAAM,UAAM,8BAAe;AAC3B,QAAM,aAAS,wBAAS,mBAAmB,MAAM,4BAAe,IAAI,MAAM,GAAG,CAAC,MAAM,CAAC;AAErF,SACC,6CAAC,0CAAyB,IAAG,qBAC5B;AAAA,gDAAC,6CACA;AAAA,MAAC;AAAA;AAAA,QACA,MAAK;AAAA,QACL,WAAU;AAAA,QACV,OAAO,IAAI,uBAAuB;AAAA,QAClC,cAAY,IAAI,uBAAuB;AAAA,QAEvC,sDAAC,8BAAa,MAAK,iBAAgB,OAAO,IAAI,uBAAuB,GAAG,OAAK,MAAC;AAAA;AAAA,IAC/E,GACD;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACA,WAAU;AAAA,QACV,MAAK;AAAA,QACL,OAAM;AAAA,QACN,aAAa;AAAA,QAEb,sDAAC,2CACA,sDAAC,0CACA;AAAA,UAAC;AAAA;AAAA,YACA,MAAK;AAAA,YACL,WAAU;AAAA,YACV,SAAS,UAAM,mCAAqB,MAAM;AAAA,YAE1C;AAAA,0DAAC,UAAM,mBAAS,IAAI,eAAe,IAAI,IAAI,eAAe,GAAE;AAAA,cAC5D,4CAAC,UAAK,WAAU,gCAAgC,yBAAc;AAAA;AAAA;AAAA,QAC/D,GACD,GACD;AAAA;AAAA,IACD;AAAA,KACD;AAEF;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -34,7 +34,6 @@ var import_comment_pin = require("../ui/comment-pin");
|
|
|
34
34
|
var import_comment_thread = require("../ui/comment-thread");
|
|
35
35
|
var import_count_badge = require("../ui/count-badge");
|
|
36
36
|
var import_mention_suggestion = require("../ui/mention-suggestion");
|
|
37
|
-
var import_tooltip_button = require("../ui/tooltip-button");
|
|
38
37
|
var import_cluster_input = require("./cluster-input");
|
|
39
38
|
var import_comment_body = require("./comment-body");
|
|
40
39
|
var import_comment_drafts = require("./comment-drafts");
|
|
@@ -761,11 +760,6 @@ const ThreadPin = (0, import_react.memo)(function ThreadPin2({
|
|
|
761
760
|
const dragRef = (0, import_react.useRef)(null);
|
|
762
761
|
const markerRef = (0, import_react.useRef)(null);
|
|
763
762
|
(0, import_tldraw.usePassThroughWheelEvents)(markerRef);
|
|
764
|
-
(0, import_react.useEffect)(() => {
|
|
765
|
-
return () => {
|
|
766
|
-
if (dragRef.current) editor.setHintingShapes([]);
|
|
767
|
-
};
|
|
768
|
-
}, [editor]);
|
|
769
763
|
(0, import_react.useEffect)(() => {
|
|
770
764
|
if (!open) return;
|
|
771
765
|
const onPointerDown = (e) => {
|
|
@@ -896,10 +890,11 @@ const ThreadPin = (0, import_react.memo)(function ThreadPin2({
|
|
|
896
890
|
...card,
|
|
897
891
|
actions: comment.authorId === currentUserId ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tldraw.TldrawUiDropdownMenuRoot, { id: `comment-actions-${comment.id}`, children: [
|
|
898
892
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tldraw.TldrawUiDropdownMenuTrigger, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
899
|
-
|
|
893
|
+
"button",
|
|
900
894
|
{
|
|
901
|
-
|
|
895
|
+
type: "button",
|
|
902
896
|
className: "tlui-cmt-thread__action",
|
|
897
|
+
title: msg("comments.more-options"),
|
|
903
898
|
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tldraw.TldrawUiIcon, { icon: "dots-vertical", label: msg("comments.more-options"), small: true })
|
|
904
899
|
}
|
|
905
900
|
) }),
|
|
@@ -938,10 +933,10 @@ const ThreadPin = (0, import_react.memo)(function ThreadPin2({
|
|
|
938
933
|
};
|
|
939
934
|
const headerActions = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
|
|
940
935
|
currentUserId && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
941
|
-
|
|
936
|
+
"button",
|
|
942
937
|
{
|
|
943
|
-
tooltip: msg(thread.resolved ? "comments.reopen" : "comments.resolve"),
|
|
944
938
|
className: "tlui-cmt-thread__action",
|
|
939
|
+
title: msg(thread.resolved ? "comments.reopen" : "comments.resolve"),
|
|
945
940
|
onClick: toggleResolve,
|
|
946
941
|
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
947
942
|
import_tldraw.TldrawUiIcon,
|
|
@@ -955,10 +950,11 @@ const ThreadPin = (0, import_react.memo)(function ThreadPin2({
|
|
|
955
950
|
),
|
|
956
951
|
currentUserId && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tldraw.TldrawUiDropdownMenuRoot, { id: `comment-thread-actions-${thread.id}`, children: [
|
|
957
952
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tldraw.TldrawUiDropdownMenuTrigger, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
958
|
-
|
|
953
|
+
"button",
|
|
959
954
|
{
|
|
960
|
-
|
|
955
|
+
type: "button",
|
|
961
956
|
className: "tlui-cmt-thread__action",
|
|
957
|
+
title: msg("comments.more-options"),
|
|
962
958
|
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tldraw.TldrawUiIcon, { icon: "dots-vertical", label: msg("comments.more-options"), small: true })
|
|
963
959
|
}
|
|
964
960
|
) }),
|
|
@@ -1018,22 +1014,7 @@ const ThreadPin = (0, import_react.memo)(function ThreadPin2({
|
|
|
1018
1014
|
if (!drag.moved && Math.hypot(e.clientX - drag.startX, e.clientY - drag.startY) < 4) return;
|
|
1019
1015
|
drag.moved = true;
|
|
1020
1016
|
const cursorPage = editor.screenToPage({ x: e.clientX, y: e.clientY });
|
|
1021
|
-
|
|
1022
|
-
setDragPagePoint(pagePoint);
|
|
1023
|
-
if (!isRegion) {
|
|
1024
|
-
const hit = editor.getShapeAtPoint(pagePoint, { hitInside: true });
|
|
1025
|
-
editor.setHintingShapes(hit ? [hit.id] : []);
|
|
1026
|
-
}
|
|
1027
|
-
};
|
|
1028
|
-
const cancelDrag = (e) => {
|
|
1029
|
-
const drag = dragRef.current;
|
|
1030
|
-
dragRef.current = null;
|
|
1031
|
-
if (e.currentTarget.hasPointerCapture(e.pointerId)) {
|
|
1032
|
-
e.currentTarget.releasePointerCapture(e.pointerId);
|
|
1033
|
-
}
|
|
1034
|
-
if (!drag) return;
|
|
1035
|
-
setDragPagePoint(null);
|
|
1036
|
-
editor.setHintingShapes([]);
|
|
1017
|
+
setDragPagePoint({ x: cursorPage.x + drag.offsetX, y: cursorPage.y + drag.offsetY });
|
|
1037
1018
|
};
|
|
1038
1019
|
const endDrag = (e) => {
|
|
1039
1020
|
const drag = dragRef.current;
|
|
@@ -1042,7 +1023,6 @@ const ThreadPin = (0, import_react.memo)(function ThreadPin2({
|
|
|
1042
1023
|
e.currentTarget.releasePointerCapture(e.pointerId);
|
|
1043
1024
|
}
|
|
1044
1025
|
if (!drag) return;
|
|
1045
|
-
editor.setHintingShapes([]);
|
|
1046
1026
|
if (!drag.moved) {
|
|
1047
1027
|
import_state.openThreadId.set(editor, import_state.openThreadId.get(editor) === thread.id ? null : thread.id);
|
|
1048
1028
|
return;
|
|
@@ -1122,7 +1102,6 @@ const ThreadPin = (0, import_react.memo)(function ThreadPin2({
|
|
|
1122
1102
|
onPointerDown: startDrag,
|
|
1123
1103
|
onPointerMove: onDrag,
|
|
1124
1104
|
onPointerUp: endDrag,
|
|
1125
|
-
onPointerCancel: cancelDrag,
|
|
1126
1105
|
onPointerEnter: () => setPinHovered(true),
|
|
1127
1106
|
onPointerLeave: () => setPinHovered(false),
|
|
1128
1107
|
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_comment_pin.CommentPin, { resolved: thread.resolved != null, open, color: threadAuthor?.color, children: pinContent })
|