@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
|
@@ -10,7 +10,6 @@ import {
|
|
|
10
10
|
useTranslation,
|
|
11
11
|
useValue
|
|
12
12
|
} from "tldraw";
|
|
13
|
-
import { TooltipButton } from "../ui/tooltip-button.mjs";
|
|
14
13
|
import { sidebarFilters } from "./state.mjs";
|
|
15
14
|
function CommentsFilterMenu({
|
|
16
15
|
canFilterByAuthor,
|
|
@@ -23,7 +22,16 @@ function CommentsFilterMenu({
|
|
|
23
22
|
sidebarFilters.update(editor, (f) => ({ ...f, [key]: !f[key] }));
|
|
24
23
|
};
|
|
25
24
|
return /* @__PURE__ */ jsxs(TldrawUiDropdownMenuRoot, { id: "comments-filter", children: [
|
|
26
|
-
/* @__PURE__ */ jsx(TldrawUiDropdownMenuTrigger, { children: /* @__PURE__ */ jsx(
|
|
25
|
+
/* @__PURE__ */ jsx(TldrawUiDropdownMenuTrigger, { children: /* @__PURE__ */ jsx(
|
|
26
|
+
"button",
|
|
27
|
+
{
|
|
28
|
+
type: "button",
|
|
29
|
+
className: "tlui-cmt-header-btn",
|
|
30
|
+
title: msg("comments.filter"),
|
|
31
|
+
"aria-label": msg("comments.filter"),
|
|
32
|
+
children: /* @__PURE__ */ jsx(FilterIcon, {})
|
|
33
|
+
}
|
|
34
|
+
) }),
|
|
27
35
|
/* @__PURE__ */ jsx(
|
|
28
36
|
TldrawUiDropdownMenuContent,
|
|
29
37
|
{
|
|
@@ -35,18 +43,18 @@ function CommentsFilterMenu({
|
|
|
35
43
|
/* @__PURE__ */ jsx(
|
|
36
44
|
TldrawUiMenuCheckboxItem,
|
|
37
45
|
{
|
|
38
|
-
id: "show-
|
|
39
|
-
label: "comments.show-
|
|
40
|
-
checked:
|
|
41
|
-
onSelect: () => toggle("
|
|
46
|
+
id: "show-resolved",
|
|
47
|
+
label: "comments.show-resolved",
|
|
48
|
+
checked: filters.showResolved,
|
|
49
|
+
onSelect: () => toggle("showResolved")
|
|
42
50
|
}
|
|
43
51
|
),
|
|
44
52
|
canFilterByAuthor && /* @__PURE__ */ jsx(
|
|
45
53
|
TldrawUiMenuCheckboxItem,
|
|
46
54
|
{
|
|
47
|
-
id: "
|
|
48
|
-
label: "comments.
|
|
49
|
-
checked:
|
|
55
|
+
id: "only-mine",
|
|
56
|
+
label: "comments.only-mine",
|
|
57
|
+
checked: filters.onlyMine,
|
|
50
58
|
onSelect: () => toggle("onlyMine")
|
|
51
59
|
}
|
|
52
60
|
),
|
|
@@ -62,10 +70,10 @@ function CommentsFilterMenu({
|
|
|
62
70
|
/* @__PURE__ */ jsx(
|
|
63
71
|
TldrawUiMenuCheckboxItem,
|
|
64
72
|
{
|
|
65
|
-
id: "
|
|
66
|
-
label: "comments.
|
|
67
|
-
checked: filters.
|
|
68
|
-
onSelect: () => toggle("
|
|
73
|
+
id: "only-current-page",
|
|
74
|
+
label: "comments.only-current-page",
|
|
75
|
+
checked: filters.onlyCurrentPage,
|
|
76
|
+
onSelect: () => toggle("onlyCurrentPage")
|
|
69
77
|
}
|
|
70
78
|
)
|
|
71
79
|
] }) })
|
|
@@ -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": "
|
|
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": "AA4CK,cAUA,YAVA;AA5CL;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACM;AAEP,SAAS,sBAAsB;AAYxB,SAAS,mBAAmB;AAAA,EAClC;AAAA,EACA;AACD,GAA4B;AAC3B,QAAM,SAAS,UAAU;AACzB,QAAM,MAAM,eAAe;AAC3B,QAAM,UAAU,SAAS,mBAAmB,MAAM,eAAe,IAAI,MAAM,GAAG,CAAC,MAAM,CAAC;AACtF,QAAM,SAAS,CAAC,QAA8B;AAC7C,mBAAe,OAAO,QAAQ,CAAC,OAAO,EAAE,GAAG,GAAG,CAAC,GAAG,GAAG,CAAC,EAAE,GAAG,EAAE,EAAE;AAAA,EAChE;AAEA,SACC,qBAAC,4BAAyB,IAAG,mBAC5B;AAAA,wBAAC,+BACA;AAAA,MAAC;AAAA;AAAA,QACA,MAAK;AAAA,QACL,WAAU;AAAA,QACV,OAAO,IAAI,iBAAiB;AAAA,QAC5B,cAAY,IAAI,iBAAiB;AAAA,QAEjC,8BAAC,cAAW;AAAA;AAAA,IACb,GACD;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACA,WAAU;AAAA,QACV,MAAK;AAAA,QACL,OAAM;AAAA,QACN,aAAa;AAAA,QAEb,8BAAC,+BAA4B,MAAK,QAAO,UAAS,QACjD,+BAAC,qBAAkB,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,oBAAC,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
|
}
|
|
@@ -10,7 +10,6 @@ import {
|
|
|
10
10
|
useTranslation,
|
|
11
11
|
useValue
|
|
12
12
|
} from "tldraw";
|
|
13
|
-
import { TooltipButton } from "../ui/tooltip-button.mjs";
|
|
14
13
|
import { commentsHidden, toggleCommentsHidden } from "./state.mjs";
|
|
15
14
|
const HIDE_SHORTCUT = "\u21E7C";
|
|
16
15
|
function CommentsOverflowMenu() {
|
|
@@ -18,7 +17,16 @@ function CommentsOverflowMenu() {
|
|
|
18
17
|
const msg = useTranslation();
|
|
19
18
|
const hidden = useValue("comments hidden", () => commentsHidden.get(editor), [editor]);
|
|
20
19
|
return /* @__PURE__ */ jsxs(TldrawUiDropdownMenuRoot, { id: "comments-overflow", children: [
|
|
21
|
-
/* @__PURE__ */ jsx(TldrawUiDropdownMenuTrigger, { children: /* @__PURE__ */ jsx(
|
|
20
|
+
/* @__PURE__ */ jsx(TldrawUiDropdownMenuTrigger, { children: /* @__PURE__ */ jsx(
|
|
21
|
+
"button",
|
|
22
|
+
{
|
|
23
|
+
type: "button",
|
|
24
|
+
className: "tlui-cmt-header-btn",
|
|
25
|
+
title: msg("comments.more-options"),
|
|
26
|
+
"aria-label": msg("comments.more-options"),
|
|
27
|
+
children: /* @__PURE__ */ jsx(TldrawUiIcon, { icon: "dots-vertical", label: msg("comments.more-options"), small: true })
|
|
28
|
+
}
|
|
29
|
+
) }),
|
|
22
30
|
/* @__PURE__ */ jsx(
|
|
23
31
|
TldrawUiDropdownMenuContent,
|
|
24
32
|
{
|
|
@@ -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": "
|
|
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": "AAiCK,cAWC,YAXD;AAjCL;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACM;AACP,SAAS,gBAAgB,4BAA4B;AAGrD,MAAM,gBAAgB;AAKf,SAAS,uBAAuB;AACtC,QAAM,SAAS,UAAU;AACzB,QAAM,MAAM,eAAe;AAC3B,QAAM,SAAS,SAAS,mBAAmB,MAAM,eAAe,IAAI,MAAM,GAAG,CAAC,MAAM,CAAC;AAErF,SACC,qBAAC,4BAAyB,IAAG,qBAC5B;AAAA,wBAAC,+BACA;AAAA,MAAC;AAAA;AAAA,QACA,MAAK;AAAA,QACL,WAAU;AAAA,QACV,OAAO,IAAI,uBAAuB;AAAA,QAClC,cAAY,IAAI,uBAAuB;AAAA,QAEvC,8BAAC,gBAAa,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,8BAAC,6BACA,8BAAC,4BACA;AAAA,UAAC;AAAA;AAAA,YACA,MAAK;AAAA,YACL,WAAU;AAAA,YACV,SAAS,MAAM,qBAAqB,MAAM;AAAA,YAE1C;AAAA,kCAAC,UAAM,mBAAS,IAAI,eAAe,IAAI,IAAI,eAAe,GAAE;AAAA,cAC5D,oBAAC,UAAK,WAAU,gCAAgC,yBAAc;AAAA;AAAA;AAAA,QAC/D,GACD,GACD;AAAA;AAAA,IACD;AAAA,KACD;AAEF;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -35,7 +35,6 @@ import { CommentPin } from "../ui/comment-pin.mjs";
|
|
|
35
35
|
import { CommentThread } from "../ui/comment-thread.mjs";
|
|
36
36
|
import { CountBadge } from "../ui/count-badge.mjs";
|
|
37
37
|
import { isMentionPickerOpen } from "../ui/mention-suggestion.mjs";
|
|
38
|
-
import { TooltipButton } from "../ui/tooltip-button.mjs";
|
|
39
38
|
import { collectClusterLeaves } from "./cluster-input.mjs";
|
|
40
39
|
import { CommentBody } from "./comment-body.mjs";
|
|
41
40
|
import {
|
|
@@ -787,11 +786,6 @@ const ThreadPin = memo(function ThreadPin2({
|
|
|
787
786
|
const dragRef = useRef(null);
|
|
788
787
|
const markerRef = useRef(null);
|
|
789
788
|
usePassThroughWheelEvents(markerRef);
|
|
790
|
-
useEffect(() => {
|
|
791
|
-
return () => {
|
|
792
|
-
if (dragRef.current) editor.setHintingShapes([]);
|
|
793
|
-
};
|
|
794
|
-
}, [editor]);
|
|
795
789
|
useEffect(() => {
|
|
796
790
|
if (!open) return;
|
|
797
791
|
const onPointerDown = (e) => {
|
|
@@ -922,10 +916,11 @@ const ThreadPin = memo(function ThreadPin2({
|
|
|
922
916
|
...card,
|
|
923
917
|
actions: comment.authorId === currentUserId ? /* @__PURE__ */ jsxs(TldrawUiDropdownMenuRoot, { id: `comment-actions-${comment.id}`, children: [
|
|
924
918
|
/* @__PURE__ */ jsx(TldrawUiDropdownMenuTrigger, { children: /* @__PURE__ */ jsx(
|
|
925
|
-
|
|
919
|
+
"button",
|
|
926
920
|
{
|
|
927
|
-
|
|
921
|
+
type: "button",
|
|
928
922
|
className: "tlui-cmt-thread__action",
|
|
923
|
+
title: msg("comments.more-options"),
|
|
929
924
|
children: /* @__PURE__ */ jsx(TldrawUiIcon, { icon: "dots-vertical", label: msg("comments.more-options"), small: true })
|
|
930
925
|
}
|
|
931
926
|
) }),
|
|
@@ -964,10 +959,10 @@ const ThreadPin = memo(function ThreadPin2({
|
|
|
964
959
|
};
|
|
965
960
|
const headerActions = /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
966
961
|
currentUserId && /* @__PURE__ */ jsx(
|
|
967
|
-
|
|
962
|
+
"button",
|
|
968
963
|
{
|
|
969
|
-
tooltip: msg(thread.resolved ? "comments.reopen" : "comments.resolve"),
|
|
970
964
|
className: "tlui-cmt-thread__action",
|
|
965
|
+
title: msg(thread.resolved ? "comments.reopen" : "comments.resolve"),
|
|
971
966
|
onClick: toggleResolve,
|
|
972
967
|
children: /* @__PURE__ */ jsx(
|
|
973
968
|
TldrawUiIcon,
|
|
@@ -981,10 +976,11 @@ const ThreadPin = memo(function ThreadPin2({
|
|
|
981
976
|
),
|
|
982
977
|
currentUserId && /* @__PURE__ */ jsxs(TldrawUiDropdownMenuRoot, { id: `comment-thread-actions-${thread.id}`, children: [
|
|
983
978
|
/* @__PURE__ */ jsx(TldrawUiDropdownMenuTrigger, { children: /* @__PURE__ */ jsx(
|
|
984
|
-
|
|
979
|
+
"button",
|
|
985
980
|
{
|
|
986
|
-
|
|
981
|
+
type: "button",
|
|
987
982
|
className: "tlui-cmt-thread__action",
|
|
983
|
+
title: msg("comments.more-options"),
|
|
988
984
|
children: /* @__PURE__ */ jsx(TldrawUiIcon, { icon: "dots-vertical", label: msg("comments.more-options"), small: true })
|
|
989
985
|
}
|
|
990
986
|
) }),
|
|
@@ -1044,22 +1040,7 @@ const ThreadPin = memo(function ThreadPin2({
|
|
|
1044
1040
|
if (!drag.moved && Math.hypot(e.clientX - drag.startX, e.clientY - drag.startY) < 4) return;
|
|
1045
1041
|
drag.moved = true;
|
|
1046
1042
|
const cursorPage = editor.screenToPage({ x: e.clientX, y: e.clientY });
|
|
1047
|
-
|
|
1048
|
-
setDragPagePoint(pagePoint);
|
|
1049
|
-
if (!isRegion) {
|
|
1050
|
-
const hit = editor.getShapeAtPoint(pagePoint, { hitInside: true });
|
|
1051
|
-
editor.setHintingShapes(hit ? [hit.id] : []);
|
|
1052
|
-
}
|
|
1053
|
-
};
|
|
1054
|
-
const cancelDrag = (e) => {
|
|
1055
|
-
const drag = dragRef.current;
|
|
1056
|
-
dragRef.current = null;
|
|
1057
|
-
if (e.currentTarget.hasPointerCapture(e.pointerId)) {
|
|
1058
|
-
e.currentTarget.releasePointerCapture(e.pointerId);
|
|
1059
|
-
}
|
|
1060
|
-
if (!drag) return;
|
|
1061
|
-
setDragPagePoint(null);
|
|
1062
|
-
editor.setHintingShapes([]);
|
|
1043
|
+
setDragPagePoint({ x: cursorPage.x + drag.offsetX, y: cursorPage.y + drag.offsetY });
|
|
1063
1044
|
};
|
|
1064
1045
|
const endDrag = (e) => {
|
|
1065
1046
|
const drag = dragRef.current;
|
|
@@ -1068,7 +1049,6 @@ const ThreadPin = memo(function ThreadPin2({
|
|
|
1068
1049
|
e.currentTarget.releasePointerCapture(e.pointerId);
|
|
1069
1050
|
}
|
|
1070
1051
|
if (!drag) return;
|
|
1071
|
-
editor.setHintingShapes([]);
|
|
1072
1052
|
if (!drag.moved) {
|
|
1073
1053
|
openThreadId.set(editor, openThreadId.get(editor) === thread.id ? null : thread.id);
|
|
1074
1054
|
return;
|
|
@@ -1148,7 +1128,6 @@ const ThreadPin = memo(function ThreadPin2({
|
|
|
1148
1128
|
onPointerDown: startDrag,
|
|
1149
1129
|
onPointerMove: onDrag,
|
|
1150
1130
|
onPointerUp: endDrag,
|
|
1151
|
-
onPointerCancel: cancelDrag,
|
|
1152
1131
|
onPointerEnter: () => setPinHovered(true),
|
|
1153
1132
|
onPointerLeave: () => setPinHovered(false),
|
|
1154
1133
|
children: /* @__PURE__ */ jsx(CommentPin, { resolved: thread.resolved != null, open, color: threadAuthor?.color, children: pinContent })
|