notra-editor 0.3.0 → 0.4.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/README.md +4 -8
- package/dist/components/blockquote-button/blockquote-button.cjs +91 -0
- package/dist/components/blockquote-button/blockquote-button.cjs.map +1 -0
- package/dist/components/blockquote-button/blockquote-button.d.cts +9 -0
- package/dist/components/blockquote-button/blockquote-button.d.ts +9 -0
- package/dist/components/blockquote-button/blockquote-button.mjs +67 -0
- package/dist/components/blockquote-button/blockquote-button.mjs.map +1 -0
- package/dist/components/code-block-button/code-block-button.cjs +91 -0
- package/dist/components/code-block-button/code-block-button.cjs.map +1 -0
- package/dist/components/code-block-button/code-block-button.d.cts +9 -0
- package/dist/components/code-block-button/code-block-button.d.ts +9 -0
- package/dist/components/code-block-button/code-block-button.mjs +67 -0
- package/dist/components/code-block-button/code-block-button.mjs.map +1 -0
- package/dist/components/code-block-view.cjs +39 -0
- package/dist/components/code-block-view.cjs.map +1 -0
- package/dist/components/code-block-view.d.cts +12 -0
- package/dist/components/code-block-view.d.ts +12 -0
- package/dist/components/code-block-view.mjs +17 -0
- package/dist/components/code-block-view.mjs.map +1 -0
- package/dist/components/copy-button.cjs +49 -0
- package/dist/components/copy-button.cjs.map +1 -0
- package/dist/components/copy-button.d.cts +9 -0
- package/dist/components/copy-button.d.ts +9 -0
- package/dist/components/copy-button.mjs +25 -0
- package/dist/components/copy-button.mjs.map +1 -0
- package/dist/components/heading-dropdown-menu/heading-dropdown-menu.cjs +67 -0
- package/dist/components/heading-dropdown-menu/heading-dropdown-menu.cjs.map +1 -0
- package/dist/components/heading-dropdown-menu/heading-dropdown-menu.d.cts +17 -0
- package/dist/components/heading-dropdown-menu/heading-dropdown-menu.d.ts +17 -0
- package/dist/components/heading-dropdown-menu/heading-dropdown-menu.mjs +51 -0
- package/dist/components/heading-dropdown-menu/heading-dropdown-menu.mjs.map +1 -0
- package/dist/components/heading-dropdown-menu/heading-menu-item.cjs +56 -0
- package/dist/components/heading-dropdown-menu/heading-menu-item.cjs.map +1 -0
- package/dist/components/heading-dropdown-menu/heading-menu-item.d.cts +12 -0
- package/dist/components/heading-dropdown-menu/heading-menu-item.d.ts +12 -0
- package/dist/components/heading-dropdown-menu/heading-menu-item.mjs +32 -0
- package/dist/components/heading-dropdown-menu/heading-menu-item.mjs.map +1 -0
- package/dist/components/heading-dropdown-menu/use-heading.cjs +109 -0
- package/dist/components/heading-dropdown-menu/use-heading.cjs.map +1 -0
- package/dist/components/heading-dropdown-menu/use-heading.d.cts +19 -0
- package/dist/components/heading-dropdown-menu/use-heading.d.ts +19 -0
- package/dist/components/heading-dropdown-menu/use-heading.mjs +83 -0
- package/dist/components/heading-dropdown-menu/use-heading.mjs.map +1 -0
- package/dist/components/link-popover/link-popover.cjs +148 -0
- package/dist/components/link-popover/link-popover.cjs.map +1 -0
- package/dist/components/link-popover/link-popover.d.cts +9 -0
- package/dist/components/link-popover/link-popover.d.ts +9 -0
- package/dist/components/link-popover/link-popover.mjs +129 -0
- package/dist/components/link-popover/link-popover.mjs.map +1 -0
- package/dist/components/link-popover/use-link-popover.cjs +71 -0
- package/dist/components/link-popover/use-link-popover.cjs.map +1 -0
- package/dist/components/link-popover/use-link-popover.d.cts +17 -0
- package/dist/components/link-popover/use-link-popover.d.ts +17 -0
- package/dist/components/link-popover/use-link-popover.mjs +47 -0
- package/dist/components/link-popover/use-link-popover.mjs.map +1 -0
- package/dist/components/list-dropdown-menu/list-dropdown-menu.cjs +73 -0
- package/dist/components/list-dropdown-menu/list-dropdown-menu.cjs.map +1 -0
- package/dist/components/list-dropdown-menu/list-dropdown-menu.d.cts +17 -0
- package/dist/components/list-dropdown-menu/list-dropdown-menu.d.ts +17 -0
- package/dist/components/list-dropdown-menu/list-dropdown-menu.mjs +57 -0
- package/dist/components/list-dropdown-menu/list-dropdown-menu.mjs.map +1 -0
- package/dist/components/list-dropdown-menu/list-menu-item.cjs +56 -0
- package/dist/components/list-dropdown-menu/list-menu-item.cjs.map +1 -0
- package/dist/components/list-dropdown-menu/list-menu-item.d.cts +12 -0
- package/dist/components/list-dropdown-menu/list-menu-item.d.ts +12 -0
- package/dist/components/list-dropdown-menu/list-menu-item.mjs +32 -0
- package/dist/components/list-dropdown-menu/list-menu-item.mjs.map +1 -0
- package/dist/components/list-dropdown-menu/use-list.cjs +111 -0
- package/dist/components/list-dropdown-menu/use-list.cjs.map +1 -0
- package/dist/components/list-dropdown-menu/use-list.d.cts +19 -0
- package/dist/components/list-dropdown-menu/use-list.d.ts +19 -0
- package/dist/components/list-dropdown-menu/use-list.mjs +85 -0
- package/dist/components/list-dropdown-menu/use-list.mjs.map +1 -0
- package/dist/components/mark-button/mark-button.cjs +72 -0
- package/dist/components/mark-button/mark-button.cjs.map +1 -0
- package/dist/components/mark-button/mark-button.d.cts +12 -0
- package/dist/components/mark-button/mark-button.d.ts +12 -0
- package/dist/components/mark-button/mark-button.mjs +48 -0
- package/dist/components/mark-button/mark-button.mjs.map +1 -0
- package/dist/components/mark-button/use-mark.cjs +71 -0
- package/dist/components/mark-button/use-mark.cjs.map +1 -0
- package/dist/components/mark-button/use-mark.d.cts +17 -0
- package/dist/components/mark-button/use-mark.d.ts +17 -0
- package/dist/components/mark-button/use-mark.mjs +47 -0
- package/dist/components/mark-button/use-mark.mjs.map +1 -0
- package/dist/components/toolbar/toolbar.cjs +77 -0
- package/dist/components/toolbar/toolbar.cjs.map +1 -0
- package/dist/components/toolbar/toolbar.d.cts +14 -0
- package/dist/components/toolbar/toolbar.d.ts +14 -0
- package/dist/components/toolbar/toolbar.mjs +51 -0
- package/dist/components/toolbar/toolbar.mjs.map +1 -0
- package/dist/components/ui/button.cjs +82 -0
- package/dist/components/ui/button.cjs.map +1 -0
- package/dist/components/ui/button.d.cts +14 -0
- package/dist/components/ui/button.d.ts +14 -0
- package/dist/components/ui/button.mjs +57 -0
- package/dist/components/ui/button.mjs.map +1 -0
- package/dist/components/ui/dropdown-menu.cjs +290 -0
- package/dist/components/ui/dropdown-menu.cjs.map +1 -0
- package/dist/components/ui/dropdown-menu.d.cts +32 -0
- package/dist/components/ui/dropdown-menu.d.ts +32 -0
- package/dist/components/ui/dropdown-menu.mjs +252 -0
- package/dist/components/ui/dropdown-menu.mjs.map +1 -0
- package/dist/components/ui/input.cjs +44 -0
- package/dist/components/ui/input.cjs.map +1 -0
- package/dist/components/ui/input.d.cts +6 -0
- package/dist/components/ui/input.d.ts +6 -0
- package/dist/components/ui/input.mjs +20 -0
- package/dist/components/ui/input.mjs.map +1 -0
- package/dist/components/ui/popover.cjs +72 -0
- package/dist/components/ui/popover.cjs.map +1 -0
- package/dist/components/ui/popover.d.cts +10 -0
- package/dist/components/ui/popover.d.ts +10 -0
- package/dist/components/ui/popover.mjs +45 -0
- package/dist/components/ui/popover.mjs.map +1 -0
- package/dist/components/ui/separator.cjs +51 -0
- package/dist/components/ui/separator.cjs.map +1 -0
- package/dist/components/ui/separator.d.cts +7 -0
- package/dist/components/ui/separator.d.ts +7 -0
- package/dist/components/ui/separator.mjs +27 -0
- package/dist/components/ui/separator.mjs.map +1 -0
- package/dist/components/ui/spacer.cjs +32 -0
- package/dist/components/ui/spacer.cjs.map +1 -0
- package/dist/components/ui/spacer.d.cts +5 -0
- package/dist/components/ui/spacer.d.ts +5 -0
- package/dist/components/ui/spacer.mjs +8 -0
- package/dist/components/ui/spacer.mjs.map +1 -0
- package/dist/components/undo-redo-button/undo-redo-button.cjs +63 -0
- package/dist/components/undo-redo-button/undo-redo-button.cjs.map +1 -0
- package/dist/components/undo-redo-button/undo-redo-button.d.cts +12 -0
- package/dist/components/undo-redo-button/undo-redo-button.d.ts +12 -0
- package/dist/components/undo-redo-button/undo-redo-button.mjs +39 -0
- package/dist/components/undo-redo-button/undo-redo-button.mjs.map +1 -0
- package/dist/components/undo-redo-button/use-undo-redo.cjs +68 -0
- package/dist/components/undo-redo-button/use-undo-redo.cjs.map +1 -0
- package/dist/components/undo-redo-button/use-undo-redo.d.cts +17 -0
- package/dist/components/undo-redo-button/use-undo-redo.d.ts +17 -0
- package/dist/components/undo-redo-button/use-undo-redo.mjs +44 -0
- package/dist/components/undo-redo-button/use-undo-redo.mjs.map +1 -0
- package/dist/extensions/code-block.cjs +46 -0
- package/dist/extensions/code-block.cjs.map +1 -0
- package/dist/extensions/code-block.d.cts +6 -0
- package/dist/extensions/code-block.d.ts +6 -0
- package/dist/extensions/code-block.mjs +12 -0
- package/dist/extensions/code-block.mjs.map +1 -0
- package/dist/extensions/editor.cjs +53 -0
- package/dist/extensions/editor.cjs.map +1 -0
- package/dist/extensions/editor.d.cts +9 -0
- package/dist/extensions/editor.d.ts +9 -0
- package/dist/extensions/editor.mjs +19 -0
- package/dist/extensions/editor.mjs.map +1 -0
- package/dist/extensions/index.cjs +32 -0
- package/dist/extensions/index.cjs.map +1 -0
- package/dist/extensions/index.d.cts +7 -0
- package/dist/extensions/index.d.ts +7 -0
- package/dist/extensions/index.mjs +7 -0
- package/dist/extensions/index.mjs.map +1 -0
- package/dist/extensions/shared.cjs +64 -0
- package/dist/extensions/shared.cjs.map +1 -0
- package/dist/extensions/shared.d.cts +8 -0
- package/dist/extensions/shared.d.ts +8 -0
- package/dist/extensions/shared.mjs +29 -0
- package/dist/extensions/shared.mjs.map +1 -0
- package/dist/hooks/use-copy-to-clipboard.cjs +50 -0
- package/dist/hooks/use-copy-to-clipboard.cjs.map +1 -0
- package/dist/hooks/use-copy-to-clipboard.d.cts +10 -0
- package/dist/hooks/use-copy-to-clipboard.d.ts +10 -0
- package/dist/hooks/use-copy-to-clipboard.mjs +26 -0
- package/dist/hooks/use-copy-to-clipboard.mjs.map +1 -0
- package/dist/hooks/use-markdown-editor.cjs +80 -0
- package/dist/hooks/use-markdown-editor.cjs.map +1 -0
- package/dist/hooks/use-markdown-editor.d.cts +13 -0
- package/dist/hooks/use-markdown-editor.d.ts +13 -0
- package/dist/hooks/use-markdown-editor.mjs +56 -0
- package/dist/hooks/use-markdown-editor.mjs.map +1 -0
- package/dist/icons/redo-icon.cjs +54 -0
- package/dist/icons/redo-icon.cjs.map +1 -0
- package/dist/icons/redo-icon.d.cts +7 -0
- package/dist/icons/redo-icon.d.ts +7 -0
- package/dist/icons/redo-icon.mjs +30 -0
- package/dist/icons/redo-icon.mjs.map +1 -0
- package/dist/icons/undo-icon.cjs +54 -0
- package/dist/icons/undo-icon.cjs.map +1 -0
- package/dist/icons/undo-icon.d.cts +7 -0
- package/dist/icons/undo-icon.d.ts +7 -0
- package/dist/icons/undo-icon.mjs +30 -0
- package/dist/icons/undo-icon.mjs.map +1 -0
- package/dist/index.cjs +24 -1322
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +22 -105
- package/dist/index.d.ts +22 -105
- package/dist/index.mjs +14 -1301
- package/dist/index.mjs.map +1 -1
- package/dist/lib/utils.cjs +33 -0
- package/dist/lib/utils.cjs.map +1 -0
- package/dist/lib/utils.d.cts +5 -0
- package/dist/lib/utils.d.ts +5 -0
- package/dist/lib/utils.mjs +9 -0
- package/dist/lib/utils.mjs.map +1 -0
- package/dist/notra-editor.cjs +88 -0
- package/dist/notra-editor.cjs.map +1 -0
- package/dist/notra-editor.d.cts +17 -0
- package/dist/notra-editor.d.ts +17 -0
- package/dist/notra-editor.mjs +68 -0
- package/dist/notra-editor.mjs.map +1 -0
- package/dist/notra-reader.cjs +47 -0
- package/dist/notra-reader.cjs.map +1 -0
- package/dist/notra-reader.d.cts +11 -0
- package/dist/notra-reader.d.ts +11 -0
- package/dist/notra-reader.mjs +23 -0
- package/dist/notra-reader.mjs.map +1 -0
- package/dist/styles/globals.css +29 -0
- package/dist/themes/default/editor.css +2 -0
- package/dist/themes/default/reader.css +2 -0
- package/dist/utils/markdown-to-json.cjs +50 -0
- package/dist/utils/markdown-to-json.cjs.map +1 -0
- package/dist/utils/markdown-to-json.d.cts +7 -0
- package/dist/utils/markdown-to-json.d.ts +7 -0
- package/dist/utils/markdown-to-json.mjs +26 -0
- package/dist/utils/markdown-to-json.mjs.map +1 -0
- package/package.json +2 -1
|
@@ -0,0 +1,148 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
"use client";
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __export = (target, all) => {
|
|
8
|
+
for (var name in all)
|
|
9
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
10
|
+
};
|
|
11
|
+
var __copyProps = (to, from, except, desc) => {
|
|
12
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
13
|
+
for (let key of __getOwnPropNames(from))
|
|
14
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
15
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
16
|
+
}
|
|
17
|
+
return to;
|
|
18
|
+
};
|
|
19
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
20
|
+
var link_popover_exports = {};
|
|
21
|
+
__export(link_popover_exports, {
|
|
22
|
+
LinkPopover: () => LinkPopover
|
|
23
|
+
});
|
|
24
|
+
module.exports = __toCommonJS(link_popover_exports);
|
|
25
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
26
|
+
var import_lucide_react = require("lucide-react");
|
|
27
|
+
var import_react = require("react");
|
|
28
|
+
var import_use_link_popover = require("./use-link-popover");
|
|
29
|
+
var import_button = require("../ui/button");
|
|
30
|
+
var import_input = require("../ui/input");
|
|
31
|
+
var import_popover = require("../ui/popover");
|
|
32
|
+
var import_separator = require("../ui/separator");
|
|
33
|
+
const LinkPopover = (0, import_react.forwardRef)(
|
|
34
|
+
({ editor, ...buttonProps }, ref) => {
|
|
35
|
+
const [isOpen, setIsOpen] = (0, import_react.useState)(false);
|
|
36
|
+
const { url, setUrl, isActive, canSet, setLink, removeLink, openLink } = (0, import_use_link_popover.useLinkPopover)({ editor });
|
|
37
|
+
(0, import_react.useEffect)(() => {
|
|
38
|
+
if (isActive) {
|
|
39
|
+
setIsOpen(true);
|
|
40
|
+
}
|
|
41
|
+
}, [isActive]);
|
|
42
|
+
const handleSetLink = (0, import_react.useCallback)(() => {
|
|
43
|
+
setLink();
|
|
44
|
+
setIsOpen(false);
|
|
45
|
+
}, [setLink]);
|
|
46
|
+
const handleRemoveLink = (0, import_react.useCallback)(() => {
|
|
47
|
+
removeLink();
|
|
48
|
+
setIsOpen(false);
|
|
49
|
+
}, [removeLink]);
|
|
50
|
+
const handleKeyDown = (0, import_react.useCallback)(
|
|
51
|
+
(event) => {
|
|
52
|
+
if (event.key === "Enter") {
|
|
53
|
+
event.preventDefault();
|
|
54
|
+
handleSetLink();
|
|
55
|
+
}
|
|
56
|
+
},
|
|
57
|
+
[handleSetLink]
|
|
58
|
+
);
|
|
59
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_popover.Popover, { open: isOpen, onOpenChange: setIsOpen, children: [
|
|
60
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_popover.PopoverTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
61
|
+
import_button.Button,
|
|
62
|
+
{
|
|
63
|
+
ref,
|
|
64
|
+
"aria-label": "Link",
|
|
65
|
+
"aria-pressed": isActive,
|
|
66
|
+
"data-active-state": isActive ? "on" : "off",
|
|
67
|
+
disabled: !canSet,
|
|
68
|
+
size: "icon",
|
|
69
|
+
tabIndex: -1,
|
|
70
|
+
type: "button",
|
|
71
|
+
variant: "ghost",
|
|
72
|
+
...buttonProps,
|
|
73
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
74
|
+
import_lucide_react.Link,
|
|
75
|
+
{
|
|
76
|
+
className: isActive ? "nt:text-[var(--tt-brand-color-500)]" : void 0
|
|
77
|
+
}
|
|
78
|
+
)
|
|
79
|
+
}
|
|
80
|
+
) }),
|
|
81
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
82
|
+
import_popover.PopoverContent,
|
|
83
|
+
{
|
|
84
|
+
align: "start",
|
|
85
|
+
className: "nt:flex nt:w-auto nt:items-center nt:gap-1 nt:p-1",
|
|
86
|
+
children: [
|
|
87
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
88
|
+
import_input.Input,
|
|
89
|
+
{
|
|
90
|
+
autoFocus: true,
|
|
91
|
+
className: "nt:h-7 nt:min-w-48 nt:border-none nt:shadow-none nt:focus-visible:ring-0",
|
|
92
|
+
placeholder: "Paste a link...",
|
|
93
|
+
type: "url",
|
|
94
|
+
value: url,
|
|
95
|
+
onChange: (e) => setUrl(e.target.value),
|
|
96
|
+
onKeyDown: handleKeyDown
|
|
97
|
+
}
|
|
98
|
+
),
|
|
99
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
100
|
+
import_button.Button,
|
|
101
|
+
{
|
|
102
|
+
"aria-label": "Apply link",
|
|
103
|
+
disabled: !url && !isActive,
|
|
104
|
+
size: "icon-sm",
|
|
105
|
+
tabIndex: -1,
|
|
106
|
+
type: "button",
|
|
107
|
+
variant: "ghost",
|
|
108
|
+
onClick: handleSetLink,
|
|
109
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.CornerDownLeft, {})
|
|
110
|
+
}
|
|
111
|
+
),
|
|
112
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_separator.Separator, { className: "nt:h-5", orientation: "vertical" }),
|
|
113
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
114
|
+
import_button.Button,
|
|
115
|
+
{
|
|
116
|
+
"aria-label": "Open link in new window",
|
|
117
|
+
size: "icon-sm",
|
|
118
|
+
tabIndex: -1,
|
|
119
|
+
type: "button",
|
|
120
|
+
variant: "ghost",
|
|
121
|
+
onClick: openLink,
|
|
122
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.ExternalLink, {})
|
|
123
|
+
}
|
|
124
|
+
),
|
|
125
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
126
|
+
import_button.Button,
|
|
127
|
+
{
|
|
128
|
+
"aria-label": "Remove link",
|
|
129
|
+
size: "icon-sm",
|
|
130
|
+
tabIndex: -1,
|
|
131
|
+
type: "button",
|
|
132
|
+
variant: "ghost",
|
|
133
|
+
onClick: handleRemoveLink,
|
|
134
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Trash2, {})
|
|
135
|
+
}
|
|
136
|
+
)
|
|
137
|
+
]
|
|
138
|
+
}
|
|
139
|
+
)
|
|
140
|
+
] });
|
|
141
|
+
}
|
|
142
|
+
);
|
|
143
|
+
LinkPopover.displayName = "LinkPopover";
|
|
144
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
145
|
+
0 && (module.exports = {
|
|
146
|
+
LinkPopover
|
|
147
|
+
});
|
|
148
|
+
//# sourceMappingURL=link-popover.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/components/link-popover/link-popover.tsx"],"sourcesContent":["'use client';\n\nimport {\n\tCornerDownLeft,\n\tExternalLink,\n\tLink as LinkIcon,\n\tTrash2\n} from 'lucide-react';\nimport { forwardRef, useCallback, useEffect, useState } from 'react';\n\nimport { useLinkPopover } from './use-link-popover';\nimport { Button } from '../ui/button';\nimport { Input } from '../ui/input';\nimport { Popover, PopoverContent, PopoverTrigger } from '../ui/popover';\nimport { Separator } from '../ui/separator';\n\nimport type { Editor } from '@tiptap/core';\n\nexport interface LinkPopoverProps extends Omit<\n\tReact.ButtonHTMLAttributes<HTMLButtonElement>,\n\t'type'\n> {\n\teditor: Editor | null;\n}\n\nexport const LinkPopover = forwardRef<HTMLButtonElement, LinkPopoverProps>(\n\t({ editor, ...buttonProps }, ref) => {\n\t\tconst [isOpen, setIsOpen] = useState(false);\n\n\t\tconst { url, setUrl, isActive, canSet, setLink, removeLink, openLink } =\n\t\t\tuseLinkPopover({ editor });\n\n\t\t// Auto-open popover when a link becomes active\n\t\tuseEffect(() => {\n\t\t\tif (isActive) {\n\t\t\t\tsetIsOpen(true);\n\t\t\t}\n\t\t}, [isActive]);\n\n\t\tconst handleSetLink = useCallback(() => {\n\t\t\tsetLink();\n\t\t\tsetIsOpen(false);\n\t\t}, [setLink]);\n\n\t\tconst handleRemoveLink = useCallback(() => {\n\t\t\tremoveLink();\n\t\t\tsetIsOpen(false);\n\t\t}, [removeLink]);\n\n\t\tconst handleKeyDown = useCallback(\n\t\t\t(event: React.KeyboardEvent<HTMLInputElement>) => {\n\t\t\t\tif (event.key === 'Enter') {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\thandleSetLink();\n\t\t\t\t}\n\t\t\t},\n\t\t\t[handleSetLink]\n\t\t);\n\n\t\treturn (\n\t\t\t<Popover open={isOpen} onOpenChange={setIsOpen}>\n\t\t\t\t<PopoverTrigger asChild>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tref={ref}\n\t\t\t\t\t\taria-label=\"Link\"\n\t\t\t\t\t\taria-pressed={isActive}\n\t\t\t\t\t\tdata-active-state={isActive ? 'on' : 'off'}\n\t\t\t\t\t\tdisabled={!canSet}\n\t\t\t\t\t\tsize=\"icon\"\n\t\t\t\t\t\ttabIndex={-1}\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\t\t{...buttonProps}\n\t\t\t\t\t>\n\t\t\t\t\t\t<LinkIcon\n\t\t\t\t\t\t\tclassName={\n\t\t\t\t\t\t\t\tisActive ? 'nt:text-[var(--tt-brand-color-500)]' : undefined\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</Button>\n\t\t\t\t</PopoverTrigger>\n\t\t\t\t<PopoverContent\n\t\t\t\t\talign=\"start\"\n\t\t\t\t\tclassName=\"nt:flex nt:w-auto nt:items-center nt:gap-1 nt:p-1\"\n\t\t\t\t>\n\t\t\t\t\t<Input\n\t\t\t\t\t\tautoFocus\n\t\t\t\t\t\tclassName=\"nt:h-7 nt:min-w-48 nt:border-none nt:shadow-none nt:focus-visible:ring-0\"\n\t\t\t\t\t\tplaceholder=\"Paste a link...\"\n\t\t\t\t\t\ttype=\"url\"\n\t\t\t\t\t\tvalue={url}\n\t\t\t\t\t\tonChange={(e) => setUrl(e.target.value)}\n\t\t\t\t\t\tonKeyDown={handleKeyDown}\n\t\t\t\t\t/>\n\t\t\t\t\t<Button\n\t\t\t\t\t\taria-label=\"Apply link\"\n\t\t\t\t\t\tdisabled={!url && !isActive}\n\t\t\t\t\t\tsize=\"icon-sm\"\n\t\t\t\t\t\ttabIndex={-1}\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\t\tonClick={handleSetLink}\n\t\t\t\t\t>\n\t\t\t\t\t\t<CornerDownLeft />\n\t\t\t\t\t</Button>\n\t\t\t\t\t<Separator className=\"nt:h-5\" orientation=\"vertical\" />\n\t\t\t\t\t<Button\n\t\t\t\t\t\taria-label=\"Open link in new window\"\n\t\t\t\t\t\tsize=\"icon-sm\"\n\t\t\t\t\t\ttabIndex={-1}\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\t\tonClick={openLink}\n\t\t\t\t\t>\n\t\t\t\t\t\t<ExternalLink />\n\t\t\t\t\t</Button>\n\t\t\t\t\t<Button\n\t\t\t\t\t\taria-label=\"Remove link\"\n\t\t\t\t\t\tsize=\"icon-sm\"\n\t\t\t\t\t\ttabIndex={-1}\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\t\tonClick={handleRemoveLink}\n\t\t\t\t\t>\n\t\t\t\t\t\t<Trash2 />\n\t\t\t\t\t</Button>\n\t\t\t\t</PopoverContent>\n\t\t\t</Popover>\n\t\t);\n\t}\n);\n\nLinkPopover.displayName = 'LinkPopover';\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA0EM;AAxEN,0BAKO;AACP,mBAA6D;AAE7D,8BAA+B;AAC/B,oBAAuB;AACvB,mBAAsB;AACtB,qBAAwD;AACxD,uBAA0B;AAWnB,MAAM,kBAAc;AAAA,EAC1B,CAAC,EAAE,QAAQ,GAAG,YAAY,GAAG,QAAQ;AACpC,UAAM,CAAC,QAAQ,SAAS,QAAI,uBAAS,KAAK;AAE1C,UAAM,EAAE,KAAK,QAAQ,UAAU,QAAQ,SAAS,YAAY,SAAS,QACpE,wCAAe,EAAE,OAAO,CAAC;AAG1B,gCAAU,MAAM;AACf,UAAI,UAAU;AACb,kBAAU,IAAI;AAAA,MACf;AAAA,IACD,GAAG,CAAC,QAAQ,CAAC;AAEb,UAAM,oBAAgB,0BAAY,MAAM;AACvC,cAAQ;AACR,gBAAU,KAAK;AAAA,IAChB,GAAG,CAAC,OAAO,CAAC;AAEZ,UAAM,uBAAmB,0BAAY,MAAM;AAC1C,iBAAW;AACX,gBAAU,KAAK;AAAA,IAChB,GAAG,CAAC,UAAU,CAAC;AAEf,UAAM,oBAAgB;AAAA,MACrB,CAAC,UAAiD;AACjD,YAAI,MAAM,QAAQ,SAAS;AAC1B,gBAAM,eAAe;AACrB,wBAAc;AAAA,QACf;AAAA,MACD;AAAA,MACA,CAAC,aAAa;AAAA,IACf;AAEA,WACC,6CAAC,0BAAQ,MAAM,QAAQ,cAAc,WACpC;AAAA,kDAAC,iCAAe,SAAO,MACtB;AAAA,QAAC;AAAA;AAAA,UACA;AAAA,UACA,cAAW;AAAA,UACX,gBAAc;AAAA,UACd,qBAAmB,WAAW,OAAO;AAAA,UACrC,UAAU,CAAC;AAAA,UACX,MAAK;AAAA,UACL,UAAU;AAAA,UACV,MAAK;AAAA,UACL,SAAQ;AAAA,UACP,GAAG;AAAA,UAEJ;AAAA,YAAC,oBAAAA;AAAA,YAAA;AAAA,cACA,WACC,WAAW,wCAAwC;AAAA;AAAA,UAErD;AAAA;AAAA,MACD,GACD;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACA,OAAM;AAAA,UACN,WAAU;AAAA,UAEV;AAAA;AAAA,cAAC;AAAA;AAAA,gBACA,WAAS;AAAA,gBACT,WAAU;AAAA,gBACV,aAAY;AAAA,gBACZ,MAAK;AAAA,gBACL,OAAO;AAAA,gBACP,UAAU,CAAC,MAAM,OAAO,EAAE,OAAO,KAAK;AAAA,gBACtC,WAAW;AAAA;AAAA,YACZ;AAAA,YACA;AAAA,cAAC;AAAA;AAAA,gBACA,cAAW;AAAA,gBACX,UAAU,CAAC,OAAO,CAAC;AAAA,gBACnB,MAAK;AAAA,gBACL,UAAU;AAAA,gBACV,MAAK;AAAA,gBACL,SAAQ;AAAA,gBACR,SAAS;AAAA,gBAET,sDAAC,sCAAe;AAAA;AAAA,YACjB;AAAA,YACA,4CAAC,8BAAU,WAAU,UAAS,aAAY,YAAW;AAAA,YACrD;AAAA,cAAC;AAAA;AAAA,gBACA,cAAW;AAAA,gBACX,MAAK;AAAA,gBACL,UAAU;AAAA,gBACV,MAAK;AAAA,gBACL,SAAQ;AAAA,gBACR,SAAS;AAAA,gBAET,sDAAC,oCAAa;AAAA;AAAA,YACf;AAAA,YACA;AAAA,cAAC;AAAA;AAAA,gBACA,cAAW;AAAA,gBACX,MAAK;AAAA,gBACL,UAAU;AAAA,gBACV,MAAK;AAAA,gBACL,SAAQ;AAAA,gBACR,SAAS;AAAA,gBAET,sDAAC,8BAAO;AAAA;AAAA,YACT;AAAA;AAAA;AAAA,MACD;AAAA,OACD;AAAA,EAEF;AACD;AAEA,YAAY,cAAc;","names":["LinkIcon"]}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import * as react from 'react';
|
|
2
|
+
import { Editor } from '@tiptap/core';
|
|
3
|
+
|
|
4
|
+
interface LinkPopoverProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'type'> {
|
|
5
|
+
editor: Editor | null;
|
|
6
|
+
}
|
|
7
|
+
declare const LinkPopover: react.ForwardRefExoticComponent<LinkPopoverProps & react.RefAttributes<HTMLButtonElement>>;
|
|
8
|
+
|
|
9
|
+
export { LinkPopover, type LinkPopoverProps };
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import * as react from 'react';
|
|
2
|
+
import { Editor } from '@tiptap/core';
|
|
3
|
+
|
|
4
|
+
interface LinkPopoverProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'type'> {
|
|
5
|
+
editor: Editor | null;
|
|
6
|
+
}
|
|
7
|
+
declare const LinkPopover: react.ForwardRefExoticComponent<LinkPopoverProps & react.RefAttributes<HTMLButtonElement>>;
|
|
8
|
+
|
|
9
|
+
export { LinkPopover, type LinkPopoverProps };
|
|
@@ -0,0 +1,129 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
|
+
import {
|
|
4
|
+
CornerDownLeft,
|
|
5
|
+
ExternalLink,
|
|
6
|
+
Link as LinkIcon,
|
|
7
|
+
Trash2
|
|
8
|
+
} from "lucide-react";
|
|
9
|
+
import { forwardRef, useCallback, useEffect, useState } from "react";
|
|
10
|
+
import { useLinkPopover } from "./use-link-popover";
|
|
11
|
+
import { Button } from "../ui/button";
|
|
12
|
+
import { Input } from "../ui/input";
|
|
13
|
+
import { Popover, PopoverContent, PopoverTrigger } from "../ui/popover";
|
|
14
|
+
import { Separator } from "../ui/separator";
|
|
15
|
+
const LinkPopover = forwardRef(
|
|
16
|
+
({ editor, ...buttonProps }, ref) => {
|
|
17
|
+
const [isOpen, setIsOpen] = useState(false);
|
|
18
|
+
const { url, setUrl, isActive, canSet, setLink, removeLink, openLink } = useLinkPopover({ editor });
|
|
19
|
+
useEffect(() => {
|
|
20
|
+
if (isActive) {
|
|
21
|
+
setIsOpen(true);
|
|
22
|
+
}
|
|
23
|
+
}, [isActive]);
|
|
24
|
+
const handleSetLink = useCallback(() => {
|
|
25
|
+
setLink();
|
|
26
|
+
setIsOpen(false);
|
|
27
|
+
}, [setLink]);
|
|
28
|
+
const handleRemoveLink = useCallback(() => {
|
|
29
|
+
removeLink();
|
|
30
|
+
setIsOpen(false);
|
|
31
|
+
}, [removeLink]);
|
|
32
|
+
const handleKeyDown = useCallback(
|
|
33
|
+
(event) => {
|
|
34
|
+
if (event.key === "Enter") {
|
|
35
|
+
event.preventDefault();
|
|
36
|
+
handleSetLink();
|
|
37
|
+
}
|
|
38
|
+
},
|
|
39
|
+
[handleSetLink]
|
|
40
|
+
);
|
|
41
|
+
return /* @__PURE__ */ jsxs(Popover, { open: isOpen, onOpenChange: setIsOpen, children: [
|
|
42
|
+
/* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
|
|
43
|
+
Button,
|
|
44
|
+
{
|
|
45
|
+
ref,
|
|
46
|
+
"aria-label": "Link",
|
|
47
|
+
"aria-pressed": isActive,
|
|
48
|
+
"data-active-state": isActive ? "on" : "off",
|
|
49
|
+
disabled: !canSet,
|
|
50
|
+
size: "icon",
|
|
51
|
+
tabIndex: -1,
|
|
52
|
+
type: "button",
|
|
53
|
+
variant: "ghost",
|
|
54
|
+
...buttonProps,
|
|
55
|
+
children: /* @__PURE__ */ jsx(
|
|
56
|
+
LinkIcon,
|
|
57
|
+
{
|
|
58
|
+
className: isActive ? "nt:text-[var(--tt-brand-color-500)]" : void 0
|
|
59
|
+
}
|
|
60
|
+
)
|
|
61
|
+
}
|
|
62
|
+
) }),
|
|
63
|
+
/* @__PURE__ */ jsxs(
|
|
64
|
+
PopoverContent,
|
|
65
|
+
{
|
|
66
|
+
align: "start",
|
|
67
|
+
className: "nt:flex nt:w-auto nt:items-center nt:gap-1 nt:p-1",
|
|
68
|
+
children: [
|
|
69
|
+
/* @__PURE__ */ jsx(
|
|
70
|
+
Input,
|
|
71
|
+
{
|
|
72
|
+
autoFocus: true,
|
|
73
|
+
className: "nt:h-7 nt:min-w-48 nt:border-none nt:shadow-none nt:focus-visible:ring-0",
|
|
74
|
+
placeholder: "Paste a link...",
|
|
75
|
+
type: "url",
|
|
76
|
+
value: url,
|
|
77
|
+
onChange: (e) => setUrl(e.target.value),
|
|
78
|
+
onKeyDown: handleKeyDown
|
|
79
|
+
}
|
|
80
|
+
),
|
|
81
|
+
/* @__PURE__ */ jsx(
|
|
82
|
+
Button,
|
|
83
|
+
{
|
|
84
|
+
"aria-label": "Apply link",
|
|
85
|
+
disabled: !url && !isActive,
|
|
86
|
+
size: "icon-sm",
|
|
87
|
+
tabIndex: -1,
|
|
88
|
+
type: "button",
|
|
89
|
+
variant: "ghost",
|
|
90
|
+
onClick: handleSetLink,
|
|
91
|
+
children: /* @__PURE__ */ jsx(CornerDownLeft, {})
|
|
92
|
+
}
|
|
93
|
+
),
|
|
94
|
+
/* @__PURE__ */ jsx(Separator, { className: "nt:h-5", orientation: "vertical" }),
|
|
95
|
+
/* @__PURE__ */ jsx(
|
|
96
|
+
Button,
|
|
97
|
+
{
|
|
98
|
+
"aria-label": "Open link in new window",
|
|
99
|
+
size: "icon-sm",
|
|
100
|
+
tabIndex: -1,
|
|
101
|
+
type: "button",
|
|
102
|
+
variant: "ghost",
|
|
103
|
+
onClick: openLink,
|
|
104
|
+
children: /* @__PURE__ */ jsx(ExternalLink, {})
|
|
105
|
+
}
|
|
106
|
+
),
|
|
107
|
+
/* @__PURE__ */ jsx(
|
|
108
|
+
Button,
|
|
109
|
+
{
|
|
110
|
+
"aria-label": "Remove link",
|
|
111
|
+
size: "icon-sm",
|
|
112
|
+
tabIndex: -1,
|
|
113
|
+
type: "button",
|
|
114
|
+
variant: "ghost",
|
|
115
|
+
onClick: handleRemoveLink,
|
|
116
|
+
children: /* @__PURE__ */ jsx(Trash2, {})
|
|
117
|
+
}
|
|
118
|
+
)
|
|
119
|
+
]
|
|
120
|
+
}
|
|
121
|
+
)
|
|
122
|
+
] });
|
|
123
|
+
}
|
|
124
|
+
);
|
|
125
|
+
LinkPopover.displayName = "LinkPopover";
|
|
126
|
+
export {
|
|
127
|
+
LinkPopover
|
|
128
|
+
};
|
|
129
|
+
//# sourceMappingURL=link-popover.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/components/link-popover/link-popover.tsx"],"sourcesContent":["'use client';\n\nimport {\n\tCornerDownLeft,\n\tExternalLink,\n\tLink as LinkIcon,\n\tTrash2\n} from 'lucide-react';\nimport { forwardRef, useCallback, useEffect, useState } from 'react';\n\nimport { useLinkPopover } from './use-link-popover';\nimport { Button } from '../ui/button';\nimport { Input } from '../ui/input';\nimport { Popover, PopoverContent, PopoverTrigger } from '../ui/popover';\nimport { Separator } from '../ui/separator';\n\nimport type { Editor } from '@tiptap/core';\n\nexport interface LinkPopoverProps extends Omit<\n\tReact.ButtonHTMLAttributes<HTMLButtonElement>,\n\t'type'\n> {\n\teditor: Editor | null;\n}\n\nexport const LinkPopover = forwardRef<HTMLButtonElement, LinkPopoverProps>(\n\t({ editor, ...buttonProps }, ref) => {\n\t\tconst [isOpen, setIsOpen] = useState(false);\n\n\t\tconst { url, setUrl, isActive, canSet, setLink, removeLink, openLink } =\n\t\t\tuseLinkPopover({ editor });\n\n\t\t// Auto-open popover when a link becomes active\n\t\tuseEffect(() => {\n\t\t\tif (isActive) {\n\t\t\t\tsetIsOpen(true);\n\t\t\t}\n\t\t}, [isActive]);\n\n\t\tconst handleSetLink = useCallback(() => {\n\t\t\tsetLink();\n\t\t\tsetIsOpen(false);\n\t\t}, [setLink]);\n\n\t\tconst handleRemoveLink = useCallback(() => {\n\t\t\tremoveLink();\n\t\t\tsetIsOpen(false);\n\t\t}, [removeLink]);\n\n\t\tconst handleKeyDown = useCallback(\n\t\t\t(event: React.KeyboardEvent<HTMLInputElement>) => {\n\t\t\t\tif (event.key === 'Enter') {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\thandleSetLink();\n\t\t\t\t}\n\t\t\t},\n\t\t\t[handleSetLink]\n\t\t);\n\n\t\treturn (\n\t\t\t<Popover open={isOpen} onOpenChange={setIsOpen}>\n\t\t\t\t<PopoverTrigger asChild>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tref={ref}\n\t\t\t\t\t\taria-label=\"Link\"\n\t\t\t\t\t\taria-pressed={isActive}\n\t\t\t\t\t\tdata-active-state={isActive ? 'on' : 'off'}\n\t\t\t\t\t\tdisabled={!canSet}\n\t\t\t\t\t\tsize=\"icon\"\n\t\t\t\t\t\ttabIndex={-1}\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\t\t{...buttonProps}\n\t\t\t\t\t>\n\t\t\t\t\t\t<LinkIcon\n\t\t\t\t\t\t\tclassName={\n\t\t\t\t\t\t\t\tisActive ? 'nt:text-[var(--tt-brand-color-500)]' : undefined\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</Button>\n\t\t\t\t</PopoverTrigger>\n\t\t\t\t<PopoverContent\n\t\t\t\t\talign=\"start\"\n\t\t\t\t\tclassName=\"nt:flex nt:w-auto nt:items-center nt:gap-1 nt:p-1\"\n\t\t\t\t>\n\t\t\t\t\t<Input\n\t\t\t\t\t\tautoFocus\n\t\t\t\t\t\tclassName=\"nt:h-7 nt:min-w-48 nt:border-none nt:shadow-none nt:focus-visible:ring-0\"\n\t\t\t\t\t\tplaceholder=\"Paste a link...\"\n\t\t\t\t\t\ttype=\"url\"\n\t\t\t\t\t\tvalue={url}\n\t\t\t\t\t\tonChange={(e) => setUrl(e.target.value)}\n\t\t\t\t\t\tonKeyDown={handleKeyDown}\n\t\t\t\t\t/>\n\t\t\t\t\t<Button\n\t\t\t\t\t\taria-label=\"Apply link\"\n\t\t\t\t\t\tdisabled={!url && !isActive}\n\t\t\t\t\t\tsize=\"icon-sm\"\n\t\t\t\t\t\ttabIndex={-1}\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\t\tonClick={handleSetLink}\n\t\t\t\t\t>\n\t\t\t\t\t\t<CornerDownLeft />\n\t\t\t\t\t</Button>\n\t\t\t\t\t<Separator className=\"nt:h-5\" orientation=\"vertical\" />\n\t\t\t\t\t<Button\n\t\t\t\t\t\taria-label=\"Open link in new window\"\n\t\t\t\t\t\tsize=\"icon-sm\"\n\t\t\t\t\t\ttabIndex={-1}\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\t\tonClick={openLink}\n\t\t\t\t\t>\n\t\t\t\t\t\t<ExternalLink />\n\t\t\t\t\t</Button>\n\t\t\t\t\t<Button\n\t\t\t\t\t\taria-label=\"Remove link\"\n\t\t\t\t\t\tsize=\"icon-sm\"\n\t\t\t\t\t\ttabIndex={-1}\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\t\tonClick={handleRemoveLink}\n\t\t\t\t\t>\n\t\t\t\t\t\t<Trash2 />\n\t\t\t\t\t</Button>\n\t\t\t\t</PopoverContent>\n\t\t\t</Popover>\n\t\t);\n\t}\n);\n\nLinkPopover.displayName = 'LinkPopover';\n"],"mappings":";AA0EM,cAOF,YAPE;AAxEN;AAAA,EACC;AAAA,EACA;AAAA,EACA,QAAQ;AAAA,EACR;AAAA,OACM;AACP,SAAS,YAAY,aAAa,WAAW,gBAAgB;AAE7D,SAAS,sBAAsB;AAC/B,SAAS,cAAc;AACvB,SAAS,aAAa;AACtB,SAAS,SAAS,gBAAgB,sBAAsB;AACxD,SAAS,iBAAiB;AAWnB,MAAM,cAAc;AAAA,EAC1B,CAAC,EAAE,QAAQ,GAAG,YAAY,GAAG,QAAQ;AACpC,UAAM,CAAC,QAAQ,SAAS,IAAI,SAAS,KAAK;AAE1C,UAAM,EAAE,KAAK,QAAQ,UAAU,QAAQ,SAAS,YAAY,SAAS,IACpE,eAAe,EAAE,OAAO,CAAC;AAG1B,cAAU,MAAM;AACf,UAAI,UAAU;AACb,kBAAU,IAAI;AAAA,MACf;AAAA,IACD,GAAG,CAAC,QAAQ,CAAC;AAEb,UAAM,gBAAgB,YAAY,MAAM;AACvC,cAAQ;AACR,gBAAU,KAAK;AAAA,IAChB,GAAG,CAAC,OAAO,CAAC;AAEZ,UAAM,mBAAmB,YAAY,MAAM;AAC1C,iBAAW;AACX,gBAAU,KAAK;AAAA,IAChB,GAAG,CAAC,UAAU,CAAC;AAEf,UAAM,gBAAgB;AAAA,MACrB,CAAC,UAAiD;AACjD,YAAI,MAAM,QAAQ,SAAS;AAC1B,gBAAM,eAAe;AACrB,wBAAc;AAAA,QACf;AAAA,MACD;AAAA,MACA,CAAC,aAAa;AAAA,IACf;AAEA,WACC,qBAAC,WAAQ,MAAM,QAAQ,cAAc,WACpC;AAAA,0BAAC,kBAAe,SAAO,MACtB;AAAA,QAAC;AAAA;AAAA,UACA;AAAA,UACA,cAAW;AAAA,UACX,gBAAc;AAAA,UACd,qBAAmB,WAAW,OAAO;AAAA,UACrC,UAAU,CAAC;AAAA,UACX,MAAK;AAAA,UACL,UAAU;AAAA,UACV,MAAK;AAAA,UACL,SAAQ;AAAA,UACP,GAAG;AAAA,UAEJ;AAAA,YAAC;AAAA;AAAA,cACA,WACC,WAAW,wCAAwC;AAAA;AAAA,UAErD;AAAA;AAAA,MACD,GACD;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACA,OAAM;AAAA,UACN,WAAU;AAAA,UAEV;AAAA;AAAA,cAAC;AAAA;AAAA,gBACA,WAAS;AAAA,gBACT,WAAU;AAAA,gBACV,aAAY;AAAA,gBACZ,MAAK;AAAA,gBACL,OAAO;AAAA,gBACP,UAAU,CAAC,MAAM,OAAO,EAAE,OAAO,KAAK;AAAA,gBACtC,WAAW;AAAA;AAAA,YACZ;AAAA,YACA;AAAA,cAAC;AAAA;AAAA,gBACA,cAAW;AAAA,gBACX,UAAU,CAAC,OAAO,CAAC;AAAA,gBACnB,MAAK;AAAA,gBACL,UAAU;AAAA,gBACV,MAAK;AAAA,gBACL,SAAQ;AAAA,gBACR,SAAS;AAAA,gBAET,8BAAC,kBAAe;AAAA;AAAA,YACjB;AAAA,YACA,oBAAC,aAAU,WAAU,UAAS,aAAY,YAAW;AAAA,YACrD;AAAA,cAAC;AAAA;AAAA,gBACA,cAAW;AAAA,gBACX,MAAK;AAAA,gBACL,UAAU;AAAA,gBACV,MAAK;AAAA,gBACL,SAAQ;AAAA,gBACR,SAAS;AAAA,gBAET,8BAAC,gBAAa;AAAA;AAAA,YACf;AAAA,YACA;AAAA,cAAC;AAAA;AAAA,gBACA,cAAW;AAAA,gBACX,MAAK;AAAA,gBACL,UAAU;AAAA,gBACV,MAAK;AAAA,gBACL,SAAQ;AAAA,gBACR,SAAS;AAAA,gBAET,8BAAC,UAAO;AAAA;AAAA,YACT;AAAA;AAAA;AAAA,MACD;AAAA,OACD;AAAA,EAEF;AACD;AAEA,YAAY,cAAc;","names":[]}
|
|
@@ -0,0 +1,71 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __export = (target, all) => {
|
|
7
|
+
for (var name in all)
|
|
8
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
9
|
+
};
|
|
10
|
+
var __copyProps = (to, from, except, desc) => {
|
|
11
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
12
|
+
for (let key of __getOwnPropNames(from))
|
|
13
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
14
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
15
|
+
}
|
|
16
|
+
return to;
|
|
17
|
+
};
|
|
18
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
|
+
var use_link_popover_exports = {};
|
|
20
|
+
__export(use_link_popover_exports, {
|
|
21
|
+
useLinkPopover: () => useLinkPopover
|
|
22
|
+
});
|
|
23
|
+
module.exports = __toCommonJS(use_link_popover_exports);
|
|
24
|
+
var import_react = require("react");
|
|
25
|
+
function useLinkPopover({ editor }) {
|
|
26
|
+
const [url, setUrl] = (0, import_react.useState)("");
|
|
27
|
+
const [isActive, setIsActive] = (0, import_react.useState)(false);
|
|
28
|
+
const [canSet, setCanSet] = (0, import_react.useState)(false);
|
|
29
|
+
(0, import_react.useEffect)(() => {
|
|
30
|
+
if (!editor) return;
|
|
31
|
+
const handleUpdate = () => {
|
|
32
|
+
const active = editor.isActive("link");
|
|
33
|
+
setIsActive(active);
|
|
34
|
+
setCanSet(editor.isEditable);
|
|
35
|
+
if (active) {
|
|
36
|
+
setUrl(editor.getAttributes("link").href ?? "");
|
|
37
|
+
}
|
|
38
|
+
};
|
|
39
|
+
handleUpdate();
|
|
40
|
+
editor.on("selectionUpdate", handleUpdate);
|
|
41
|
+
editor.on("transaction", handleUpdate);
|
|
42
|
+
return () => {
|
|
43
|
+
editor.off("selectionUpdate", handleUpdate);
|
|
44
|
+
editor.off("transaction", handleUpdate);
|
|
45
|
+
};
|
|
46
|
+
}, [editor]);
|
|
47
|
+
const setLink = (0, import_react.useCallback)(() => {
|
|
48
|
+
if (!editor) return;
|
|
49
|
+
if (!url) {
|
|
50
|
+
editor.chain().focus().extendMarkRange("link").unsetLink().run();
|
|
51
|
+
return;
|
|
52
|
+
}
|
|
53
|
+
editor.chain().focus().extendMarkRange("link").setLink({ href: url }).run();
|
|
54
|
+
}, [editor, url]);
|
|
55
|
+
const removeLink = (0, import_react.useCallback)(() => {
|
|
56
|
+
if (!editor) return;
|
|
57
|
+
editor.chain().focus().extendMarkRange("link").unsetLink().run();
|
|
58
|
+
setUrl("");
|
|
59
|
+
}, [editor]);
|
|
60
|
+
const openLink = (0, import_react.useCallback)(() => {
|
|
61
|
+
if (!url) return;
|
|
62
|
+
const sanitized = /^https?:\/\//i.test(url) ? url : `https://${url}`;
|
|
63
|
+
window.open(sanitized, "_blank", "noopener,noreferrer");
|
|
64
|
+
}, [url]);
|
|
65
|
+
return { url, setUrl, isActive, canSet, setLink, removeLink, openLink };
|
|
66
|
+
}
|
|
67
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
68
|
+
0 && (module.exports = {
|
|
69
|
+
useLinkPopover
|
|
70
|
+
});
|
|
71
|
+
//# sourceMappingURL=use-link-popover.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/components/link-popover/use-link-popover.ts"],"sourcesContent":["import { useCallback, useEffect, useState } from 'react';\n\nimport type { Editor } from '@tiptap/core';\n\nexport interface UseLinkPopoverConfig {\n\teditor: Editor | null;\n}\n\nexport function useLinkPopover({ editor }: UseLinkPopoverConfig) {\n\tconst [url, setUrl] = useState('');\n\tconst [isActive, setIsActive] = useState(false);\n\tconst [canSet, setCanSet] = useState(false);\n\n\tuseEffect(() => {\n\t\tif (!editor) return;\n\n\t\tconst handleUpdate = () => {\n\t\t\tconst active = editor.isActive('link');\n\n\t\t\tsetIsActive(active);\n\t\t\tsetCanSet(editor.isEditable);\n\n\t\t\tif (active) {\n\t\t\t\tsetUrl(editor.getAttributes('link').href ?? '');\n\t\t\t}\n\t\t};\n\n\t\thandleUpdate();\n\n\t\teditor.on('selectionUpdate', handleUpdate);\n\t\teditor.on('transaction', handleUpdate);\n\n\t\treturn () => {\n\t\t\teditor.off('selectionUpdate', handleUpdate);\n\t\t\teditor.off('transaction', handleUpdate);\n\t\t};\n\t}, [editor]);\n\n\tconst setLink = useCallback(() => {\n\t\tif (!editor) return;\n\n\t\tif (!url) {\n\t\t\teditor.chain().focus().extendMarkRange('link').unsetLink().run();\n\n\t\t\treturn;\n\t\t}\n\n\t\teditor.chain().focus().extendMarkRange('link').setLink({ href: url }).run();\n\t}, [editor, url]);\n\n\tconst removeLink = useCallback(() => {\n\t\tif (!editor) return;\n\n\t\teditor.chain().focus().extendMarkRange('link').unsetLink().run();\n\t\tsetUrl('');\n\t}, [editor]);\n\n\tconst openLink = useCallback(() => {\n\t\tif (!url) return;\n\n\t\tconst sanitized = /^https?:\\/\\//i.test(url) ? url : `https://${url}`;\n\n\t\twindow.open(sanitized, '_blank', 'noopener,noreferrer');\n\t}, [url]);\n\n\treturn { url, setUrl, isActive, canSet, setLink, removeLink, openLink };\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAiD;AAQ1C,SAAS,eAAe,EAAE,OAAO,GAAyB;AAChE,QAAM,CAAC,KAAK,MAAM,QAAI,uBAAS,EAAE;AACjC,QAAM,CAAC,UAAU,WAAW,QAAI,uBAAS,KAAK;AAC9C,QAAM,CAAC,QAAQ,SAAS,QAAI,uBAAS,KAAK;AAE1C,8BAAU,MAAM;AACf,QAAI,CAAC,OAAQ;AAEb,UAAM,eAAe,MAAM;AAC1B,YAAM,SAAS,OAAO,SAAS,MAAM;AAErC,kBAAY,MAAM;AAClB,gBAAU,OAAO,UAAU;AAE3B,UAAI,QAAQ;AACX,eAAO,OAAO,cAAc,MAAM,EAAE,QAAQ,EAAE;AAAA,MAC/C;AAAA,IACD;AAEA,iBAAa;AAEb,WAAO,GAAG,mBAAmB,YAAY;AACzC,WAAO,GAAG,eAAe,YAAY;AAErC,WAAO,MAAM;AACZ,aAAO,IAAI,mBAAmB,YAAY;AAC1C,aAAO,IAAI,eAAe,YAAY;AAAA,IACvC;AAAA,EACD,GAAG,CAAC,MAAM,CAAC;AAEX,QAAM,cAAU,0BAAY,MAAM;AACjC,QAAI,CAAC,OAAQ;AAEb,QAAI,CAAC,KAAK;AACT,aAAO,MAAM,EAAE,MAAM,EAAE,gBAAgB,MAAM,EAAE,UAAU,EAAE,IAAI;AAE/D;AAAA,IACD;AAEA,WAAO,MAAM,EAAE,MAAM,EAAE,gBAAgB,MAAM,EAAE,QAAQ,EAAE,MAAM,IAAI,CAAC,EAAE,IAAI;AAAA,EAC3E,GAAG,CAAC,QAAQ,GAAG,CAAC;AAEhB,QAAM,iBAAa,0BAAY,MAAM;AACpC,QAAI,CAAC,OAAQ;AAEb,WAAO,MAAM,EAAE,MAAM,EAAE,gBAAgB,MAAM,EAAE,UAAU,EAAE,IAAI;AAC/D,WAAO,EAAE;AAAA,EACV,GAAG,CAAC,MAAM,CAAC;AAEX,QAAM,eAAW,0BAAY,MAAM;AAClC,QAAI,CAAC,IAAK;AAEV,UAAM,YAAY,gBAAgB,KAAK,GAAG,IAAI,MAAM,WAAW,GAAG;AAElE,WAAO,KAAK,WAAW,UAAU,qBAAqB;AAAA,EACvD,GAAG,CAAC,GAAG,CAAC;AAER,SAAO,EAAE,KAAK,QAAQ,UAAU,QAAQ,SAAS,YAAY,SAAS;AACvE;","names":[]}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import * as react from 'react';
|
|
2
|
+
import { Editor } from '@tiptap/core';
|
|
3
|
+
|
|
4
|
+
interface UseLinkPopoverConfig {
|
|
5
|
+
editor: Editor | null;
|
|
6
|
+
}
|
|
7
|
+
declare function useLinkPopover({ editor }: UseLinkPopoverConfig): {
|
|
8
|
+
url: string;
|
|
9
|
+
setUrl: react.Dispatch<react.SetStateAction<string>>;
|
|
10
|
+
isActive: boolean;
|
|
11
|
+
canSet: boolean;
|
|
12
|
+
setLink: () => void;
|
|
13
|
+
removeLink: () => void;
|
|
14
|
+
openLink: () => void;
|
|
15
|
+
};
|
|
16
|
+
|
|
17
|
+
export { type UseLinkPopoverConfig, useLinkPopover };
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import * as react from 'react';
|
|
2
|
+
import { Editor } from '@tiptap/core';
|
|
3
|
+
|
|
4
|
+
interface UseLinkPopoverConfig {
|
|
5
|
+
editor: Editor | null;
|
|
6
|
+
}
|
|
7
|
+
declare function useLinkPopover({ editor }: UseLinkPopoverConfig): {
|
|
8
|
+
url: string;
|
|
9
|
+
setUrl: react.Dispatch<react.SetStateAction<string>>;
|
|
10
|
+
isActive: boolean;
|
|
11
|
+
canSet: boolean;
|
|
12
|
+
setLink: () => void;
|
|
13
|
+
removeLink: () => void;
|
|
14
|
+
openLink: () => void;
|
|
15
|
+
};
|
|
16
|
+
|
|
17
|
+
export { type UseLinkPopoverConfig, useLinkPopover };
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
import { useCallback, useEffect, useState } from "react";
|
|
2
|
+
function useLinkPopover({ editor }) {
|
|
3
|
+
const [url, setUrl] = useState("");
|
|
4
|
+
const [isActive, setIsActive] = useState(false);
|
|
5
|
+
const [canSet, setCanSet] = useState(false);
|
|
6
|
+
useEffect(() => {
|
|
7
|
+
if (!editor) return;
|
|
8
|
+
const handleUpdate = () => {
|
|
9
|
+
const active = editor.isActive("link");
|
|
10
|
+
setIsActive(active);
|
|
11
|
+
setCanSet(editor.isEditable);
|
|
12
|
+
if (active) {
|
|
13
|
+
setUrl(editor.getAttributes("link").href ?? "");
|
|
14
|
+
}
|
|
15
|
+
};
|
|
16
|
+
handleUpdate();
|
|
17
|
+
editor.on("selectionUpdate", handleUpdate);
|
|
18
|
+
editor.on("transaction", handleUpdate);
|
|
19
|
+
return () => {
|
|
20
|
+
editor.off("selectionUpdate", handleUpdate);
|
|
21
|
+
editor.off("transaction", handleUpdate);
|
|
22
|
+
};
|
|
23
|
+
}, [editor]);
|
|
24
|
+
const setLink = useCallback(() => {
|
|
25
|
+
if (!editor) return;
|
|
26
|
+
if (!url) {
|
|
27
|
+
editor.chain().focus().extendMarkRange("link").unsetLink().run();
|
|
28
|
+
return;
|
|
29
|
+
}
|
|
30
|
+
editor.chain().focus().extendMarkRange("link").setLink({ href: url }).run();
|
|
31
|
+
}, [editor, url]);
|
|
32
|
+
const removeLink = useCallback(() => {
|
|
33
|
+
if (!editor) return;
|
|
34
|
+
editor.chain().focus().extendMarkRange("link").unsetLink().run();
|
|
35
|
+
setUrl("");
|
|
36
|
+
}, [editor]);
|
|
37
|
+
const openLink = useCallback(() => {
|
|
38
|
+
if (!url) return;
|
|
39
|
+
const sanitized = /^https?:\/\//i.test(url) ? url : `https://${url}`;
|
|
40
|
+
window.open(sanitized, "_blank", "noopener,noreferrer");
|
|
41
|
+
}, [url]);
|
|
42
|
+
return { url, setUrl, isActive, canSet, setLink, removeLink, openLink };
|
|
43
|
+
}
|
|
44
|
+
export {
|
|
45
|
+
useLinkPopover
|
|
46
|
+
};
|
|
47
|
+
//# sourceMappingURL=use-link-popover.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/components/link-popover/use-link-popover.ts"],"sourcesContent":["import { useCallback, useEffect, useState } from 'react';\n\nimport type { Editor } from '@tiptap/core';\n\nexport interface UseLinkPopoverConfig {\n\teditor: Editor | null;\n}\n\nexport function useLinkPopover({ editor }: UseLinkPopoverConfig) {\n\tconst [url, setUrl] = useState('');\n\tconst [isActive, setIsActive] = useState(false);\n\tconst [canSet, setCanSet] = useState(false);\n\n\tuseEffect(() => {\n\t\tif (!editor) return;\n\n\t\tconst handleUpdate = () => {\n\t\t\tconst active = editor.isActive('link');\n\n\t\t\tsetIsActive(active);\n\t\t\tsetCanSet(editor.isEditable);\n\n\t\t\tif (active) {\n\t\t\t\tsetUrl(editor.getAttributes('link').href ?? '');\n\t\t\t}\n\t\t};\n\n\t\thandleUpdate();\n\n\t\teditor.on('selectionUpdate', handleUpdate);\n\t\teditor.on('transaction', handleUpdate);\n\n\t\treturn () => {\n\t\t\teditor.off('selectionUpdate', handleUpdate);\n\t\t\teditor.off('transaction', handleUpdate);\n\t\t};\n\t}, [editor]);\n\n\tconst setLink = useCallback(() => {\n\t\tif (!editor) return;\n\n\t\tif (!url) {\n\t\t\teditor.chain().focus().extendMarkRange('link').unsetLink().run();\n\n\t\t\treturn;\n\t\t}\n\n\t\teditor.chain().focus().extendMarkRange('link').setLink({ href: url }).run();\n\t}, [editor, url]);\n\n\tconst removeLink = useCallback(() => {\n\t\tif (!editor) return;\n\n\t\teditor.chain().focus().extendMarkRange('link').unsetLink().run();\n\t\tsetUrl('');\n\t}, [editor]);\n\n\tconst openLink = useCallback(() => {\n\t\tif (!url) return;\n\n\t\tconst sanitized = /^https?:\\/\\//i.test(url) ? url : `https://${url}`;\n\n\t\twindow.open(sanitized, '_blank', 'noopener,noreferrer');\n\t}, [url]);\n\n\treturn { url, setUrl, isActive, canSet, setLink, removeLink, openLink };\n}\n"],"mappings":"AAAA,SAAS,aAAa,WAAW,gBAAgB;AAQ1C,SAAS,eAAe,EAAE,OAAO,GAAyB;AAChE,QAAM,CAAC,KAAK,MAAM,IAAI,SAAS,EAAE;AACjC,QAAM,CAAC,UAAU,WAAW,IAAI,SAAS,KAAK;AAC9C,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAS,KAAK;AAE1C,YAAU,MAAM;AACf,QAAI,CAAC,OAAQ;AAEb,UAAM,eAAe,MAAM;AAC1B,YAAM,SAAS,OAAO,SAAS,MAAM;AAErC,kBAAY,MAAM;AAClB,gBAAU,OAAO,UAAU;AAE3B,UAAI,QAAQ;AACX,eAAO,OAAO,cAAc,MAAM,EAAE,QAAQ,EAAE;AAAA,MAC/C;AAAA,IACD;AAEA,iBAAa;AAEb,WAAO,GAAG,mBAAmB,YAAY;AACzC,WAAO,GAAG,eAAe,YAAY;AAErC,WAAO,MAAM;AACZ,aAAO,IAAI,mBAAmB,YAAY;AAC1C,aAAO,IAAI,eAAe,YAAY;AAAA,IACvC;AAAA,EACD,GAAG,CAAC,MAAM,CAAC;AAEX,QAAM,UAAU,YAAY,MAAM;AACjC,QAAI,CAAC,OAAQ;AAEb,QAAI,CAAC,KAAK;AACT,aAAO,MAAM,EAAE,MAAM,EAAE,gBAAgB,MAAM,EAAE,UAAU,EAAE,IAAI;AAE/D;AAAA,IACD;AAEA,WAAO,MAAM,EAAE,MAAM,EAAE,gBAAgB,MAAM,EAAE,QAAQ,EAAE,MAAM,IAAI,CAAC,EAAE,IAAI;AAAA,EAC3E,GAAG,CAAC,QAAQ,GAAG,CAAC;AAEhB,QAAM,aAAa,YAAY,MAAM;AACpC,QAAI,CAAC,OAAQ;AAEb,WAAO,MAAM,EAAE,MAAM,EAAE,gBAAgB,MAAM,EAAE,UAAU,EAAE,IAAI;AAC/D,WAAO,EAAE;AAAA,EACV,GAAG,CAAC,MAAM,CAAC;AAEX,QAAM,WAAW,YAAY,MAAM;AAClC,QAAI,CAAC,IAAK;AAEV,UAAM,YAAY,gBAAgB,KAAK,GAAG,IAAI,MAAM,WAAW,GAAG;AAElE,WAAO,KAAK,WAAW,UAAU,qBAAqB;AAAA,EACvD,GAAG,CAAC,GAAG,CAAC;AAER,SAAO,EAAE,KAAK,QAAQ,UAAU,QAAQ,SAAS,YAAY,SAAS;AACvE;","names":[]}
|
|
@@ -0,0 +1,73 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
"use client";
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __export = (target, all) => {
|
|
8
|
+
for (var name in all)
|
|
9
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
10
|
+
};
|
|
11
|
+
var __copyProps = (to, from, except, desc) => {
|
|
12
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
13
|
+
for (let key of __getOwnPropNames(from))
|
|
14
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
15
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
16
|
+
}
|
|
17
|
+
return to;
|
|
18
|
+
};
|
|
19
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
20
|
+
var list_dropdown_menu_exports = {};
|
|
21
|
+
__export(list_dropdown_menu_exports, {
|
|
22
|
+
ListDropdownMenu: () => ListDropdownMenu
|
|
23
|
+
});
|
|
24
|
+
module.exports = __toCommonJS(list_dropdown_menu_exports);
|
|
25
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
26
|
+
var import_lucide_react = require("lucide-react");
|
|
27
|
+
var import_react = require("react");
|
|
28
|
+
var import_list_menu_item = require("./list-menu-item");
|
|
29
|
+
var import_use_list = require("./use-list");
|
|
30
|
+
var import_button = require("../ui/button");
|
|
31
|
+
var import_dropdown_menu = require("../ui/dropdown-menu");
|
|
32
|
+
const ListDropdownMenu = (0, import_react.forwardRef)(
|
|
33
|
+
({
|
|
34
|
+
editor,
|
|
35
|
+
types = ["bulletList", "orderedList", "taskList"],
|
|
36
|
+
...buttonProps
|
|
37
|
+
}, ref) => {
|
|
38
|
+
const activeType = (0, import_use_list.useActiveListType)(editor, types);
|
|
39
|
+
const TriggerIcon = (0, import_use_list.getListTriggerIcon)(activeType);
|
|
40
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_dropdown_menu.DropdownMenu, { children: [
|
|
41
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_dropdown_menu.DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
42
|
+
import_button.Button,
|
|
43
|
+
{
|
|
44
|
+
ref,
|
|
45
|
+
"aria-label": "List",
|
|
46
|
+
className: "nt:gap-1 nt:px-2",
|
|
47
|
+
"data-active-state": activeType !== null ? "on" : "off",
|
|
48
|
+
size: "default",
|
|
49
|
+
tabIndex: -1,
|
|
50
|
+
type: "button",
|
|
51
|
+
variant: "ghost",
|
|
52
|
+
...buttonProps,
|
|
53
|
+
children: [
|
|
54
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
55
|
+
TriggerIcon,
|
|
56
|
+
{
|
|
57
|
+
className: activeType !== null ? "nt:text-[var(--tt-brand-color-500)]" : void 0
|
|
58
|
+
}
|
|
59
|
+
),
|
|
60
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.ChevronDown, { className: "nt:size-3" })
|
|
61
|
+
]
|
|
62
|
+
}
|
|
63
|
+
) }),
|
|
64
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_dropdown_menu.DropdownMenuContent, { align: "start", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_dropdown_menu.DropdownMenuGroup, { children: types.map((type) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_list_menu_item.ListMenuItem, { editor, listType: type }, type)) }) })
|
|
65
|
+
] });
|
|
66
|
+
}
|
|
67
|
+
);
|
|
68
|
+
ListDropdownMenu.displayName = "ListDropdownMenu";
|
|
69
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
70
|
+
0 && (module.exports = {
|
|
71
|
+
ListDropdownMenu
|
|
72
|
+
});
|
|
73
|
+
//# sourceMappingURL=list-dropdown-menu.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/components/list-dropdown-menu/list-dropdown-menu.tsx"],"sourcesContent":["'use client';\n\nimport { ChevronDown } from 'lucide-react';\nimport { forwardRef } from 'react';\n\nimport { ListMenuItem } from './list-menu-item';\nimport {\n\tgetListTriggerIcon,\n\tuseActiveListType,\n\ttype ListType\n} from './use-list';\nimport { Button } from '../ui/button';\nimport {\n\tDropdownMenu,\n\tDropdownMenuTrigger,\n\tDropdownMenuContent,\n\tDropdownMenuGroup\n} from '../ui/dropdown-menu';\n\nimport type { Editor } from '@tiptap/core';\nimport type { ComponentProps } from 'react';\n\nexport interface ListDropdownMenuProps extends Omit<\n\tComponentProps<typeof Button>,\n\t'type'\n> {\n\teditor: Editor | null;\n\ttypes?: ListType[];\n}\n\nexport const ListDropdownMenu = forwardRef<\n\tHTMLButtonElement,\n\tListDropdownMenuProps\n>(\n\t(\n\t\t{\n\t\t\teditor,\n\t\t\ttypes = ['bulletList', 'orderedList', 'taskList'],\n\t\t\t...buttonProps\n\t\t},\n\t\tref\n\t) => {\n\t\tconst activeType = useActiveListType(editor, types);\n\t\tconst TriggerIcon = getListTriggerIcon(activeType);\n\n\t\treturn (\n\t\t\t<DropdownMenu>\n\t\t\t\t<DropdownMenuTrigger asChild>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tref={ref}\n\t\t\t\t\t\taria-label=\"List\"\n\t\t\t\t\t\tclassName=\"nt:gap-1 nt:px-2\"\n\t\t\t\t\t\tdata-active-state={activeType !== null ? 'on' : 'off'}\n\t\t\t\t\t\tsize=\"default\"\n\t\t\t\t\t\ttabIndex={-1}\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\t\t{...buttonProps}\n\t\t\t\t\t>\n\t\t\t\t\t\t<TriggerIcon\n\t\t\t\t\t\t\tclassName={\n\t\t\t\t\t\t\t\tactiveType !== null\n\t\t\t\t\t\t\t\t\t? 'nt:text-[var(--tt-brand-color-500)]'\n\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<ChevronDown className=\"nt:size-3\" />\n\t\t\t\t\t</Button>\n\t\t\t\t</DropdownMenuTrigger>\n\t\t\t\t<DropdownMenuContent align=\"start\">\n\t\t\t\t\t<DropdownMenuGroup>\n\t\t\t\t\t\t{types.map((type) => (\n\t\t\t\t\t\t\t<ListMenuItem key={type} editor={editor} listType={type} />\n\t\t\t\t\t\t))}\n\t\t\t\t\t</DropdownMenuGroup>\n\t\t\t\t</DropdownMenuContent>\n\t\t\t</DropdownMenu>\n\t\t);\n\t}\n);\n\nListDropdownMenu.displayName = 'ListDropdownMenu';\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAgDK;AA9CL,0BAA4B;AAC5B,mBAA2B;AAE3B,4BAA6B;AAC7B,sBAIO;AACP,oBAAuB;AACvB,2BAKO;AAaA,MAAM,uBAAmB;AAAA,EAI/B,CACC;AAAA,IACC;AAAA,IACA,QAAQ,CAAC,cAAc,eAAe,UAAU;AAAA,IAChD,GAAG;AAAA,EACJ,GACA,QACI;AACJ,UAAM,iBAAa,mCAAkB,QAAQ,KAAK;AAClD,UAAM,kBAAc,oCAAmB,UAAU;AAEjD,WACC,6CAAC,qCACA;AAAA,kDAAC,4CAAoB,SAAO,MAC3B;AAAA,QAAC;AAAA;AAAA,UACA;AAAA,UACA,cAAW;AAAA,UACX,WAAU;AAAA,UACV,qBAAmB,eAAe,OAAO,OAAO;AAAA,UAChD,MAAK;AAAA,UACL,UAAU;AAAA,UACV,MAAK;AAAA,UACL,SAAQ;AAAA,UACP,GAAG;AAAA,UAEJ;AAAA;AAAA,cAAC;AAAA;AAAA,gBACA,WACC,eAAe,OACZ,wCACA;AAAA;AAAA,YAEL;AAAA,YACA,4CAAC,mCAAY,WAAU,aAAY;AAAA;AAAA;AAAA,MACpC,GACD;AAAA,MACA,4CAAC,4CAAoB,OAAM,SAC1B,sDAAC,0CACC,gBAAM,IAAI,CAAC,SACX,4CAAC,sCAAwB,QAAgB,UAAU,QAAhC,IAAsC,CACzD,GACF,GACD;AAAA,OACD;AAAA,EAEF;AACD;AAEA,iBAAiB,cAAc;","names":[]}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import * as react from 'react';
|
|
2
|
+
import { ComponentProps } from 'react';
|
|
3
|
+
import { ListType } from './use-list.cjs';
|
|
4
|
+
import { Button } from '../ui/button.cjs';
|
|
5
|
+
import { Editor } from '@tiptap/core';
|
|
6
|
+
import 'lucide-react';
|
|
7
|
+
import 'react/jsx-runtime';
|
|
8
|
+
import 'class-variance-authority/types';
|
|
9
|
+
import 'class-variance-authority';
|
|
10
|
+
|
|
11
|
+
interface ListDropdownMenuProps extends Omit<ComponentProps<typeof Button>, 'type'> {
|
|
12
|
+
editor: Editor | null;
|
|
13
|
+
types?: ListType[];
|
|
14
|
+
}
|
|
15
|
+
declare const ListDropdownMenu: react.ForwardRefExoticComponent<Omit<ListDropdownMenuProps, "ref"> & react.RefAttributes<HTMLButtonElement>>;
|
|
16
|
+
|
|
17
|
+
export { ListDropdownMenu, type ListDropdownMenuProps };
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import * as react from 'react';
|
|
2
|
+
import { ComponentProps } from 'react';
|
|
3
|
+
import { ListType } from './use-list.js';
|
|
4
|
+
import { Button } from '../ui/button.js';
|
|
5
|
+
import { Editor } from '@tiptap/core';
|
|
6
|
+
import 'lucide-react';
|
|
7
|
+
import 'react/jsx-runtime';
|
|
8
|
+
import 'class-variance-authority/types';
|
|
9
|
+
import 'class-variance-authority';
|
|
10
|
+
|
|
11
|
+
interface ListDropdownMenuProps extends Omit<ComponentProps<typeof Button>, 'type'> {
|
|
12
|
+
editor: Editor | null;
|
|
13
|
+
types?: ListType[];
|
|
14
|
+
}
|
|
15
|
+
declare const ListDropdownMenu: react.ForwardRefExoticComponent<Omit<ListDropdownMenuProps, "ref"> & react.RefAttributes<HTMLButtonElement>>;
|
|
16
|
+
|
|
17
|
+
export { ListDropdownMenu, type ListDropdownMenuProps };
|