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.
Files changed (221) hide show
  1. package/README.md +4 -8
  2. package/dist/components/blockquote-button/blockquote-button.cjs +91 -0
  3. package/dist/components/blockquote-button/blockquote-button.cjs.map +1 -0
  4. package/dist/components/blockquote-button/blockquote-button.d.cts +9 -0
  5. package/dist/components/blockquote-button/blockquote-button.d.ts +9 -0
  6. package/dist/components/blockquote-button/blockquote-button.mjs +67 -0
  7. package/dist/components/blockquote-button/blockquote-button.mjs.map +1 -0
  8. package/dist/components/code-block-button/code-block-button.cjs +91 -0
  9. package/dist/components/code-block-button/code-block-button.cjs.map +1 -0
  10. package/dist/components/code-block-button/code-block-button.d.cts +9 -0
  11. package/dist/components/code-block-button/code-block-button.d.ts +9 -0
  12. package/dist/components/code-block-button/code-block-button.mjs +67 -0
  13. package/dist/components/code-block-button/code-block-button.mjs.map +1 -0
  14. package/dist/components/code-block-view.cjs +39 -0
  15. package/dist/components/code-block-view.cjs.map +1 -0
  16. package/dist/components/code-block-view.d.cts +12 -0
  17. package/dist/components/code-block-view.d.ts +12 -0
  18. package/dist/components/code-block-view.mjs +17 -0
  19. package/dist/components/code-block-view.mjs.map +1 -0
  20. package/dist/components/copy-button.cjs +49 -0
  21. package/dist/components/copy-button.cjs.map +1 -0
  22. package/dist/components/copy-button.d.cts +9 -0
  23. package/dist/components/copy-button.d.ts +9 -0
  24. package/dist/components/copy-button.mjs +25 -0
  25. package/dist/components/copy-button.mjs.map +1 -0
  26. package/dist/components/heading-dropdown-menu/heading-dropdown-menu.cjs +67 -0
  27. package/dist/components/heading-dropdown-menu/heading-dropdown-menu.cjs.map +1 -0
  28. package/dist/components/heading-dropdown-menu/heading-dropdown-menu.d.cts +17 -0
  29. package/dist/components/heading-dropdown-menu/heading-dropdown-menu.d.ts +17 -0
  30. package/dist/components/heading-dropdown-menu/heading-dropdown-menu.mjs +51 -0
  31. package/dist/components/heading-dropdown-menu/heading-dropdown-menu.mjs.map +1 -0
  32. package/dist/components/heading-dropdown-menu/heading-menu-item.cjs +56 -0
  33. package/dist/components/heading-dropdown-menu/heading-menu-item.cjs.map +1 -0
  34. package/dist/components/heading-dropdown-menu/heading-menu-item.d.cts +12 -0
  35. package/dist/components/heading-dropdown-menu/heading-menu-item.d.ts +12 -0
  36. package/dist/components/heading-dropdown-menu/heading-menu-item.mjs +32 -0
  37. package/dist/components/heading-dropdown-menu/heading-menu-item.mjs.map +1 -0
  38. package/dist/components/heading-dropdown-menu/use-heading.cjs +109 -0
  39. package/dist/components/heading-dropdown-menu/use-heading.cjs.map +1 -0
  40. package/dist/components/heading-dropdown-menu/use-heading.d.cts +19 -0
  41. package/dist/components/heading-dropdown-menu/use-heading.d.ts +19 -0
  42. package/dist/components/heading-dropdown-menu/use-heading.mjs +83 -0
  43. package/dist/components/heading-dropdown-menu/use-heading.mjs.map +1 -0
  44. package/dist/components/link-popover/link-popover.cjs +148 -0
  45. package/dist/components/link-popover/link-popover.cjs.map +1 -0
  46. package/dist/components/link-popover/link-popover.d.cts +9 -0
  47. package/dist/components/link-popover/link-popover.d.ts +9 -0
  48. package/dist/components/link-popover/link-popover.mjs +129 -0
  49. package/dist/components/link-popover/link-popover.mjs.map +1 -0
  50. package/dist/components/link-popover/use-link-popover.cjs +71 -0
  51. package/dist/components/link-popover/use-link-popover.cjs.map +1 -0
  52. package/dist/components/link-popover/use-link-popover.d.cts +17 -0
  53. package/dist/components/link-popover/use-link-popover.d.ts +17 -0
  54. package/dist/components/link-popover/use-link-popover.mjs +47 -0
  55. package/dist/components/link-popover/use-link-popover.mjs.map +1 -0
  56. package/dist/components/list-dropdown-menu/list-dropdown-menu.cjs +73 -0
  57. package/dist/components/list-dropdown-menu/list-dropdown-menu.cjs.map +1 -0
  58. package/dist/components/list-dropdown-menu/list-dropdown-menu.d.cts +17 -0
  59. package/dist/components/list-dropdown-menu/list-dropdown-menu.d.ts +17 -0
  60. package/dist/components/list-dropdown-menu/list-dropdown-menu.mjs +57 -0
  61. package/dist/components/list-dropdown-menu/list-dropdown-menu.mjs.map +1 -0
  62. package/dist/components/list-dropdown-menu/list-menu-item.cjs +56 -0
  63. package/dist/components/list-dropdown-menu/list-menu-item.cjs.map +1 -0
  64. package/dist/components/list-dropdown-menu/list-menu-item.d.cts +12 -0
  65. package/dist/components/list-dropdown-menu/list-menu-item.d.ts +12 -0
  66. package/dist/components/list-dropdown-menu/list-menu-item.mjs +32 -0
  67. package/dist/components/list-dropdown-menu/list-menu-item.mjs.map +1 -0
  68. package/dist/components/list-dropdown-menu/use-list.cjs +111 -0
  69. package/dist/components/list-dropdown-menu/use-list.cjs.map +1 -0
  70. package/dist/components/list-dropdown-menu/use-list.d.cts +19 -0
  71. package/dist/components/list-dropdown-menu/use-list.d.ts +19 -0
  72. package/dist/components/list-dropdown-menu/use-list.mjs +85 -0
  73. package/dist/components/list-dropdown-menu/use-list.mjs.map +1 -0
  74. package/dist/components/mark-button/mark-button.cjs +72 -0
  75. package/dist/components/mark-button/mark-button.cjs.map +1 -0
  76. package/dist/components/mark-button/mark-button.d.cts +12 -0
  77. package/dist/components/mark-button/mark-button.d.ts +12 -0
  78. package/dist/components/mark-button/mark-button.mjs +48 -0
  79. package/dist/components/mark-button/mark-button.mjs.map +1 -0
  80. package/dist/components/mark-button/use-mark.cjs +71 -0
  81. package/dist/components/mark-button/use-mark.cjs.map +1 -0
  82. package/dist/components/mark-button/use-mark.d.cts +17 -0
  83. package/dist/components/mark-button/use-mark.d.ts +17 -0
  84. package/dist/components/mark-button/use-mark.mjs +47 -0
  85. package/dist/components/mark-button/use-mark.mjs.map +1 -0
  86. package/dist/components/toolbar/toolbar.cjs +77 -0
  87. package/dist/components/toolbar/toolbar.cjs.map +1 -0
  88. package/dist/components/toolbar/toolbar.d.cts +14 -0
  89. package/dist/components/toolbar/toolbar.d.ts +14 -0
  90. package/dist/components/toolbar/toolbar.mjs +51 -0
  91. package/dist/components/toolbar/toolbar.mjs.map +1 -0
  92. package/dist/components/ui/button.cjs +82 -0
  93. package/dist/components/ui/button.cjs.map +1 -0
  94. package/dist/components/ui/button.d.cts +14 -0
  95. package/dist/components/ui/button.d.ts +14 -0
  96. package/dist/components/ui/button.mjs +57 -0
  97. package/dist/components/ui/button.mjs.map +1 -0
  98. package/dist/components/ui/dropdown-menu.cjs +290 -0
  99. package/dist/components/ui/dropdown-menu.cjs.map +1 -0
  100. package/dist/components/ui/dropdown-menu.d.cts +32 -0
  101. package/dist/components/ui/dropdown-menu.d.ts +32 -0
  102. package/dist/components/ui/dropdown-menu.mjs +252 -0
  103. package/dist/components/ui/dropdown-menu.mjs.map +1 -0
  104. package/dist/components/ui/input.cjs +44 -0
  105. package/dist/components/ui/input.cjs.map +1 -0
  106. package/dist/components/ui/input.d.cts +6 -0
  107. package/dist/components/ui/input.d.ts +6 -0
  108. package/dist/components/ui/input.mjs +20 -0
  109. package/dist/components/ui/input.mjs.map +1 -0
  110. package/dist/components/ui/popover.cjs +72 -0
  111. package/dist/components/ui/popover.cjs.map +1 -0
  112. package/dist/components/ui/popover.d.cts +10 -0
  113. package/dist/components/ui/popover.d.ts +10 -0
  114. package/dist/components/ui/popover.mjs +45 -0
  115. package/dist/components/ui/popover.mjs.map +1 -0
  116. package/dist/components/ui/separator.cjs +51 -0
  117. package/dist/components/ui/separator.cjs.map +1 -0
  118. package/dist/components/ui/separator.d.cts +7 -0
  119. package/dist/components/ui/separator.d.ts +7 -0
  120. package/dist/components/ui/separator.mjs +27 -0
  121. package/dist/components/ui/separator.mjs.map +1 -0
  122. package/dist/components/ui/spacer.cjs +32 -0
  123. package/dist/components/ui/spacer.cjs.map +1 -0
  124. package/dist/components/ui/spacer.d.cts +5 -0
  125. package/dist/components/ui/spacer.d.ts +5 -0
  126. package/dist/components/ui/spacer.mjs +8 -0
  127. package/dist/components/ui/spacer.mjs.map +1 -0
  128. package/dist/components/undo-redo-button/undo-redo-button.cjs +63 -0
  129. package/dist/components/undo-redo-button/undo-redo-button.cjs.map +1 -0
  130. package/dist/components/undo-redo-button/undo-redo-button.d.cts +12 -0
  131. package/dist/components/undo-redo-button/undo-redo-button.d.ts +12 -0
  132. package/dist/components/undo-redo-button/undo-redo-button.mjs +39 -0
  133. package/dist/components/undo-redo-button/undo-redo-button.mjs.map +1 -0
  134. package/dist/components/undo-redo-button/use-undo-redo.cjs +68 -0
  135. package/dist/components/undo-redo-button/use-undo-redo.cjs.map +1 -0
  136. package/dist/components/undo-redo-button/use-undo-redo.d.cts +17 -0
  137. package/dist/components/undo-redo-button/use-undo-redo.d.ts +17 -0
  138. package/dist/components/undo-redo-button/use-undo-redo.mjs +44 -0
  139. package/dist/components/undo-redo-button/use-undo-redo.mjs.map +1 -0
  140. package/dist/extensions/code-block.cjs +46 -0
  141. package/dist/extensions/code-block.cjs.map +1 -0
  142. package/dist/extensions/code-block.d.cts +6 -0
  143. package/dist/extensions/code-block.d.ts +6 -0
  144. package/dist/extensions/code-block.mjs +12 -0
  145. package/dist/extensions/code-block.mjs.map +1 -0
  146. package/dist/extensions/editor.cjs +53 -0
  147. package/dist/extensions/editor.cjs.map +1 -0
  148. package/dist/extensions/editor.d.cts +9 -0
  149. package/dist/extensions/editor.d.ts +9 -0
  150. package/dist/extensions/editor.mjs +19 -0
  151. package/dist/extensions/editor.mjs.map +1 -0
  152. package/dist/extensions/index.cjs +32 -0
  153. package/dist/extensions/index.cjs.map +1 -0
  154. package/dist/extensions/index.d.cts +7 -0
  155. package/dist/extensions/index.d.ts +7 -0
  156. package/dist/extensions/index.mjs +7 -0
  157. package/dist/extensions/index.mjs.map +1 -0
  158. package/dist/extensions/shared.cjs +64 -0
  159. package/dist/extensions/shared.cjs.map +1 -0
  160. package/dist/extensions/shared.d.cts +8 -0
  161. package/dist/extensions/shared.d.ts +8 -0
  162. package/dist/extensions/shared.mjs +29 -0
  163. package/dist/extensions/shared.mjs.map +1 -0
  164. package/dist/hooks/use-copy-to-clipboard.cjs +50 -0
  165. package/dist/hooks/use-copy-to-clipboard.cjs.map +1 -0
  166. package/dist/hooks/use-copy-to-clipboard.d.cts +10 -0
  167. package/dist/hooks/use-copy-to-clipboard.d.ts +10 -0
  168. package/dist/hooks/use-copy-to-clipboard.mjs +26 -0
  169. package/dist/hooks/use-copy-to-clipboard.mjs.map +1 -0
  170. package/dist/hooks/use-markdown-editor.cjs +80 -0
  171. package/dist/hooks/use-markdown-editor.cjs.map +1 -0
  172. package/dist/hooks/use-markdown-editor.d.cts +13 -0
  173. package/dist/hooks/use-markdown-editor.d.ts +13 -0
  174. package/dist/hooks/use-markdown-editor.mjs +56 -0
  175. package/dist/hooks/use-markdown-editor.mjs.map +1 -0
  176. package/dist/icons/redo-icon.cjs +54 -0
  177. package/dist/icons/redo-icon.cjs.map +1 -0
  178. package/dist/icons/redo-icon.d.cts +7 -0
  179. package/dist/icons/redo-icon.d.ts +7 -0
  180. package/dist/icons/redo-icon.mjs +30 -0
  181. package/dist/icons/redo-icon.mjs.map +1 -0
  182. package/dist/icons/undo-icon.cjs +54 -0
  183. package/dist/icons/undo-icon.cjs.map +1 -0
  184. package/dist/icons/undo-icon.d.cts +7 -0
  185. package/dist/icons/undo-icon.d.ts +7 -0
  186. package/dist/icons/undo-icon.mjs +30 -0
  187. package/dist/icons/undo-icon.mjs.map +1 -0
  188. package/dist/index.cjs +24 -1322
  189. package/dist/index.cjs.map +1 -1
  190. package/dist/index.d.cts +22 -105
  191. package/dist/index.d.ts +22 -105
  192. package/dist/index.mjs +14 -1301
  193. package/dist/index.mjs.map +1 -1
  194. package/dist/lib/utils.cjs +33 -0
  195. package/dist/lib/utils.cjs.map +1 -0
  196. package/dist/lib/utils.d.cts +5 -0
  197. package/dist/lib/utils.d.ts +5 -0
  198. package/dist/lib/utils.mjs +9 -0
  199. package/dist/lib/utils.mjs.map +1 -0
  200. package/dist/notra-editor.cjs +88 -0
  201. package/dist/notra-editor.cjs.map +1 -0
  202. package/dist/notra-editor.d.cts +17 -0
  203. package/dist/notra-editor.d.ts +17 -0
  204. package/dist/notra-editor.mjs +68 -0
  205. package/dist/notra-editor.mjs.map +1 -0
  206. package/dist/notra-reader.cjs +47 -0
  207. package/dist/notra-reader.cjs.map +1 -0
  208. package/dist/notra-reader.d.cts +11 -0
  209. package/dist/notra-reader.d.ts +11 -0
  210. package/dist/notra-reader.mjs +23 -0
  211. package/dist/notra-reader.mjs.map +1 -0
  212. package/dist/styles/globals.css +29 -0
  213. package/dist/themes/default/editor.css +2 -0
  214. package/dist/themes/default/reader.css +2 -0
  215. package/dist/utils/markdown-to-json.cjs +50 -0
  216. package/dist/utils/markdown-to-json.cjs.map +1 -0
  217. package/dist/utils/markdown-to-json.d.cts +7 -0
  218. package/dist/utils/markdown-to-json.d.ts +7 -0
  219. package/dist/utils/markdown-to-json.mjs +26 -0
  220. package/dist/utils/markdown-to-json.mjs.map +1 -0
  221. package/package.json +2 -1
@@ -0,0 +1,67 @@
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 heading_dropdown_menu_exports = {};
21
+ __export(heading_dropdown_menu_exports, {
22
+ HeadingDropdownMenu: () => HeadingDropdownMenu
23
+ });
24
+ module.exports = __toCommonJS(heading_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_heading_menu_item = require("./heading-menu-item");
29
+ var import_use_heading = require("./use-heading");
30
+ var import_button = require("../ui/button");
31
+ var import_dropdown_menu = require("../ui/dropdown-menu");
32
+ const HeadingDropdownMenu = (0, import_react.forwardRef)(({ editor, levels = [1, 2, 3, 4], ...buttonProps }, ref) => {
33
+ const activeLevel = (0, import_use_heading.useActiveHeadingLevel)(editor, levels);
34
+ const TriggerIcon = (0, import_use_heading.getHeadingTriggerIcon)(activeLevel);
35
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_dropdown_menu.DropdownMenu, { children: [
36
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_dropdown_menu.DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
37
+ import_button.Button,
38
+ {
39
+ ref,
40
+ "aria-label": "Heading",
41
+ className: "nt:gap-1 nt:px-2",
42
+ "data-active-state": activeLevel !== null ? "on" : "off",
43
+ size: "default",
44
+ tabIndex: -1,
45
+ type: "button",
46
+ variant: "ghost",
47
+ ...buttonProps,
48
+ children: [
49
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
50
+ TriggerIcon,
51
+ {
52
+ className: activeLevel !== null ? "nt:text-[var(--tt-brand-color-500)]" : void 0
53
+ }
54
+ ),
55
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.ChevronDown, { className: "nt:size-3" })
56
+ ]
57
+ }
58
+ ) }),
59
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_dropdown_menu.DropdownMenuContent, { align: "start", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_dropdown_menu.DropdownMenuGroup, { children: levels.map((level) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_heading_menu_item.HeadingMenuItem, { editor, level }, level)) }) })
60
+ ] });
61
+ });
62
+ HeadingDropdownMenu.displayName = "HeadingDropdownMenu";
63
+ // Annotate the CommonJS export names for ESM import in node:
64
+ 0 && (module.exports = {
65
+ HeadingDropdownMenu
66
+ });
67
+ //# sourceMappingURL=heading-dropdown-menu.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../src/components/heading-dropdown-menu/heading-dropdown-menu.tsx"],"sourcesContent":["'use client';\n\nimport { ChevronDown } from 'lucide-react';\nimport { forwardRef } from 'react';\n\nimport { HeadingMenuItem } from './heading-menu-item';\nimport {\n\tgetHeadingTriggerIcon,\n\tuseActiveHeadingLevel,\n\ttype HeadingLevel\n} from './use-heading';\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 HeadingDropdownMenuProps extends Omit<\n\tComponentProps<typeof Button>,\n\t'type'\n> {\n\teditor: Editor | null;\n\tlevels?: HeadingLevel[];\n}\n\nexport const HeadingDropdownMenu = forwardRef<\n\tHTMLButtonElement,\n\tHeadingDropdownMenuProps\n>(({ editor, levels = [1, 2, 3, 4], ...buttonProps }, ref) => {\n\tconst activeLevel = useActiveHeadingLevel(editor, levels);\n\tconst TriggerIcon = getHeadingTriggerIcon(activeLevel);\n\n\treturn (\n\t\t<DropdownMenu>\n\t\t\t<DropdownMenuTrigger asChild>\n\t\t\t\t<Button\n\t\t\t\t\tref={ref}\n\t\t\t\t\taria-label=\"Heading\"\n\t\t\t\t\tclassName=\"nt:gap-1 nt:px-2\"\n\t\t\t\t\tdata-active-state={activeLevel !== null ? 'on' : 'off'}\n\t\t\t\t\tsize=\"default\"\n\t\t\t\t\ttabIndex={-1}\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\t{...buttonProps}\n\t\t\t\t>\n\t\t\t\t\t<TriggerIcon\n\t\t\t\t\t\tclassName={\n\t\t\t\t\t\t\tactiveLevel !== null\n\t\t\t\t\t\t\t\t? 'nt:text-[var(--tt-brand-color-500)]'\n\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t\t<ChevronDown className=\"nt:size-3\" />\n\t\t\t\t</Button>\n\t\t\t</DropdownMenuTrigger>\n\t\t\t<DropdownMenuContent align=\"start\">\n\t\t\t\t<DropdownMenuGroup>\n\t\t\t\t\t{levels.map((level) => (\n\t\t\t\t\t\t<HeadingMenuItem key={level} editor={editor} level={level} />\n\t\t\t\t\t))}\n\t\t\t\t</DropdownMenuGroup>\n\t\t\t</DropdownMenuContent>\n\t\t</DropdownMenu>\n\t);\n});\n\nHeadingDropdownMenu.displayName = 'HeadingDropdownMenu';\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAwCI;AAtCJ,0BAA4B;AAC5B,mBAA2B;AAE3B,+BAAgC;AAChC,yBAIO;AACP,oBAAuB;AACvB,2BAKO;AAaA,MAAM,0BAAsB,yBAGjC,CAAC,EAAE,QAAQ,SAAS,CAAC,GAAG,GAAG,GAAG,CAAC,GAAG,GAAG,YAAY,GAAG,QAAQ;AAC7D,QAAM,kBAAc,0CAAsB,QAAQ,MAAM;AACxD,QAAM,kBAAc,0CAAsB,WAAW;AAErD,SACC,6CAAC,qCACA;AAAA,gDAAC,4CAAoB,SAAO,MAC3B;AAAA,MAAC;AAAA;AAAA,QACA;AAAA,QACA,cAAW;AAAA,QACX,WAAU;AAAA,QACV,qBAAmB,gBAAgB,OAAO,OAAO;AAAA,QACjD,MAAK;AAAA,QACL,UAAU;AAAA,QACV,MAAK;AAAA,QACL,SAAQ;AAAA,QACP,GAAG;AAAA,QAEJ;AAAA;AAAA,YAAC;AAAA;AAAA,cACA,WACC,gBAAgB,OACb,wCACA;AAAA;AAAA,UAEL;AAAA,UACA,4CAAC,mCAAY,WAAU,aAAY;AAAA;AAAA;AAAA,IACpC,GACD;AAAA,IACA,4CAAC,4CAAoB,OAAM,SAC1B,sDAAC,0CACC,iBAAO,IAAI,CAAC,UACZ,4CAAC,4CAA4B,QAAgB,SAAvB,KAAqC,CAC3D,GACF,GACD;AAAA,KACD;AAEF,CAAC;AAED,oBAAoB,cAAc;","names":[]}
@@ -0,0 +1,17 @@
1
+ import * as react from 'react';
2
+ import { ComponentProps } from 'react';
3
+ import { HeadingLevel } from './use-heading.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 HeadingDropdownMenuProps extends Omit<ComponentProps<typeof Button>, 'type'> {
12
+ editor: Editor | null;
13
+ levels?: HeadingLevel[];
14
+ }
15
+ declare const HeadingDropdownMenu: react.ForwardRefExoticComponent<Omit<HeadingDropdownMenuProps, "ref"> & react.RefAttributes<HTMLButtonElement>>;
16
+
17
+ export { HeadingDropdownMenu, type HeadingDropdownMenuProps };
@@ -0,0 +1,17 @@
1
+ import * as react from 'react';
2
+ import { ComponentProps } from 'react';
3
+ import { HeadingLevel } from './use-heading.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 HeadingDropdownMenuProps extends Omit<ComponentProps<typeof Button>, 'type'> {
12
+ editor: Editor | null;
13
+ levels?: HeadingLevel[];
14
+ }
15
+ declare const HeadingDropdownMenu: react.ForwardRefExoticComponent<Omit<HeadingDropdownMenuProps, "ref"> & react.RefAttributes<HTMLButtonElement>>;
16
+
17
+ export { HeadingDropdownMenu, type HeadingDropdownMenuProps };
@@ -0,0 +1,51 @@
1
+ "use client";
2
+ import { jsx, jsxs } from "react/jsx-runtime";
3
+ import { ChevronDown } from "lucide-react";
4
+ import { forwardRef } from "react";
5
+ import { HeadingMenuItem } from "./heading-menu-item";
6
+ import {
7
+ getHeadingTriggerIcon,
8
+ useActiveHeadingLevel
9
+ } from "./use-heading";
10
+ import { Button } from "../ui/button";
11
+ import {
12
+ DropdownMenu,
13
+ DropdownMenuTrigger,
14
+ DropdownMenuContent,
15
+ DropdownMenuGroup
16
+ } from "../ui/dropdown-menu";
17
+ const HeadingDropdownMenu = forwardRef(({ editor, levels = [1, 2, 3, 4], ...buttonProps }, ref) => {
18
+ const activeLevel = useActiveHeadingLevel(editor, levels);
19
+ const TriggerIcon = getHeadingTriggerIcon(activeLevel);
20
+ return /* @__PURE__ */ jsxs(DropdownMenu, { children: [
21
+ /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
22
+ Button,
23
+ {
24
+ ref,
25
+ "aria-label": "Heading",
26
+ className: "nt:gap-1 nt:px-2",
27
+ "data-active-state": activeLevel !== null ? "on" : "off",
28
+ size: "default",
29
+ tabIndex: -1,
30
+ type: "button",
31
+ variant: "ghost",
32
+ ...buttonProps,
33
+ children: [
34
+ /* @__PURE__ */ jsx(
35
+ TriggerIcon,
36
+ {
37
+ className: activeLevel !== null ? "nt:text-[var(--tt-brand-color-500)]" : void 0
38
+ }
39
+ ),
40
+ /* @__PURE__ */ jsx(ChevronDown, { className: "nt:size-3" })
41
+ ]
42
+ }
43
+ ) }),
44
+ /* @__PURE__ */ jsx(DropdownMenuContent, { align: "start", children: /* @__PURE__ */ jsx(DropdownMenuGroup, { children: levels.map((level) => /* @__PURE__ */ jsx(HeadingMenuItem, { editor, level }, level)) }) })
45
+ ] });
46
+ });
47
+ HeadingDropdownMenu.displayName = "HeadingDropdownMenu";
48
+ export {
49
+ HeadingDropdownMenu
50
+ };
51
+ //# sourceMappingURL=heading-dropdown-menu.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../src/components/heading-dropdown-menu/heading-dropdown-menu.tsx"],"sourcesContent":["'use client';\n\nimport { ChevronDown } from 'lucide-react';\nimport { forwardRef } from 'react';\n\nimport { HeadingMenuItem } from './heading-menu-item';\nimport {\n\tgetHeadingTriggerIcon,\n\tuseActiveHeadingLevel,\n\ttype HeadingLevel\n} from './use-heading';\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 HeadingDropdownMenuProps extends Omit<\n\tComponentProps<typeof Button>,\n\t'type'\n> {\n\teditor: Editor | null;\n\tlevels?: HeadingLevel[];\n}\n\nexport const HeadingDropdownMenu = forwardRef<\n\tHTMLButtonElement,\n\tHeadingDropdownMenuProps\n>(({ editor, levels = [1, 2, 3, 4], ...buttonProps }, ref) => {\n\tconst activeLevel = useActiveHeadingLevel(editor, levels);\n\tconst TriggerIcon = getHeadingTriggerIcon(activeLevel);\n\n\treturn (\n\t\t<DropdownMenu>\n\t\t\t<DropdownMenuTrigger asChild>\n\t\t\t\t<Button\n\t\t\t\t\tref={ref}\n\t\t\t\t\taria-label=\"Heading\"\n\t\t\t\t\tclassName=\"nt:gap-1 nt:px-2\"\n\t\t\t\t\tdata-active-state={activeLevel !== null ? 'on' : 'off'}\n\t\t\t\t\tsize=\"default\"\n\t\t\t\t\ttabIndex={-1}\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\t{...buttonProps}\n\t\t\t\t>\n\t\t\t\t\t<TriggerIcon\n\t\t\t\t\t\tclassName={\n\t\t\t\t\t\t\tactiveLevel !== null\n\t\t\t\t\t\t\t\t? 'nt:text-[var(--tt-brand-color-500)]'\n\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t\t<ChevronDown className=\"nt:size-3\" />\n\t\t\t\t</Button>\n\t\t\t</DropdownMenuTrigger>\n\t\t\t<DropdownMenuContent align=\"start\">\n\t\t\t\t<DropdownMenuGroup>\n\t\t\t\t\t{levels.map((level) => (\n\t\t\t\t\t\t<HeadingMenuItem key={level} editor={editor} level={level} />\n\t\t\t\t\t))}\n\t\t\t\t</DropdownMenuGroup>\n\t\t\t</DropdownMenuContent>\n\t\t</DropdownMenu>\n\t);\n});\n\nHeadingDropdownMenu.displayName = 'HeadingDropdownMenu';\n"],"mappings":";AAwCI,SAWC,KAXD;AAtCJ,SAAS,mBAAmB;AAC5B,SAAS,kBAAkB;AAE3B,SAAS,uBAAuB;AAChC;AAAA,EACC;AAAA,EACA;AAAA,OAEM;AACP,SAAS,cAAc;AACvB;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACM;AAaA,MAAM,sBAAsB,WAGjC,CAAC,EAAE,QAAQ,SAAS,CAAC,GAAG,GAAG,GAAG,CAAC,GAAG,GAAG,YAAY,GAAG,QAAQ;AAC7D,QAAM,cAAc,sBAAsB,QAAQ,MAAM;AACxD,QAAM,cAAc,sBAAsB,WAAW;AAErD,SACC,qBAAC,gBACA;AAAA,wBAAC,uBAAoB,SAAO,MAC3B;AAAA,MAAC;AAAA;AAAA,QACA;AAAA,QACA,cAAW;AAAA,QACX,WAAU;AAAA,QACV,qBAAmB,gBAAgB,OAAO,OAAO;AAAA,QACjD,MAAK;AAAA,QACL,UAAU;AAAA,QACV,MAAK;AAAA,QACL,SAAQ;AAAA,QACP,GAAG;AAAA,QAEJ;AAAA;AAAA,YAAC;AAAA;AAAA,cACA,WACC,gBAAgB,OACb,wCACA;AAAA;AAAA,UAEL;AAAA,UACA,oBAAC,eAAY,WAAU,aAAY;AAAA;AAAA;AAAA,IACpC,GACD;AAAA,IACA,oBAAC,uBAAoB,OAAM,SAC1B,8BAAC,qBACC,iBAAO,IAAI,CAAC,UACZ,oBAAC,mBAA4B,QAAgB,SAAvB,KAAqC,CAC3D,GACF,GACD;AAAA,KACD;AAEF,CAAC;AAED,oBAAoB,cAAc;","names":[]}
@@ -0,0 +1,56 @@
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 heading_menu_item_exports = {};
20
+ __export(heading_menu_item_exports, {
21
+ HeadingMenuItem: () => HeadingMenuItem
22
+ });
23
+ module.exports = __toCommonJS(heading_menu_item_exports);
24
+ var import_jsx_runtime = require("react/jsx-runtime");
25
+ var import_react = require("react");
26
+ var import_use_heading = require("./use-heading");
27
+ var import_dropdown_menu = require("../ui/dropdown-menu");
28
+ const HeadingMenuItem = (0, import_react.forwardRef)(
29
+ ({ editor, level }, ref) => {
30
+ const { isActive, canToggle, handleToggle, label, Icon } = (0, import_use_heading.useHeading)({
31
+ editor,
32
+ level
33
+ });
34
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
35
+ import_dropdown_menu.DropdownMenuItem,
36
+ {
37
+ ref,
38
+ "aria-label": label,
39
+ className: "nt:data-[active-state=on]:bg-accent nt:data-[active-state=on]:text-[var(--tt-brand-color-500)]",
40
+ "data-active-state": isActive ? "on" : "off",
41
+ disabled: !canToggle,
42
+ onSelect: handleToggle,
43
+ children: [
44
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Icon, {}),
45
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: label })
46
+ ]
47
+ }
48
+ );
49
+ }
50
+ );
51
+ HeadingMenuItem.displayName = "HeadingMenuItem";
52
+ // Annotate the CommonJS export names for ESM import in node:
53
+ 0 && (module.exports = {
54
+ HeadingMenuItem
55
+ });
56
+ //# sourceMappingURL=heading-menu-item.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../src/components/heading-dropdown-menu/heading-menu-item.tsx"],"sourcesContent":["import { forwardRef } from 'react';\n\nimport { useHeading, type HeadingLevel } from './use-heading';\nimport { DropdownMenuItem } from '../ui/dropdown-menu';\n\nimport type { Editor } from '@tiptap/core';\n\nexport interface HeadingMenuItemProps {\n\teditor: Editor | null;\n\tlevel: HeadingLevel;\n}\n\nexport const HeadingMenuItem = forwardRef<HTMLDivElement, HeadingMenuItemProps>(\n\t({ editor, level }, ref) => {\n\t\tconst { isActive, canToggle, handleToggle, label, Icon } = useHeading({\n\t\t\teditor,\n\t\t\tlevel\n\t\t});\n\n\t\treturn (\n\t\t\t<DropdownMenuItem\n\t\t\t\tref={ref}\n\t\t\t\taria-label={label}\n\t\t\t\tclassName=\"nt:data-[active-state=on]:bg-accent nt:data-[active-state=on]:text-[var(--tt-brand-color-500)]\"\n\t\t\t\tdata-active-state={isActive ? 'on' : 'off'}\n\t\t\t\tdisabled={!canToggle}\n\t\t\t\tonSelect={handleToggle}\n\t\t\t>\n\t\t\t\t<Icon />\n\t\t\t\t<span>{label}</span>\n\t\t\t</DropdownMenuItem>\n\t\t);\n\t}\n);\n\nHeadingMenuItem.displayName = 'HeadingMenuItem';\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAoBG;AApBH,mBAA2B;AAE3B,yBAA8C;AAC9C,2BAAiC;AAS1B,MAAM,sBAAkB;AAAA,EAC9B,CAAC,EAAE,QAAQ,MAAM,GAAG,QAAQ;AAC3B,UAAM,EAAE,UAAU,WAAW,cAAc,OAAO,KAAK,QAAI,+BAAW;AAAA,MACrE;AAAA,MACA;AAAA,IACD,CAAC;AAED,WACC;AAAA,MAAC;AAAA;AAAA,QACA;AAAA,QACA,cAAY;AAAA,QACZ,WAAU;AAAA,QACV,qBAAmB,WAAW,OAAO;AAAA,QACrC,UAAU,CAAC;AAAA,QACX,UAAU;AAAA,QAEV;AAAA,sDAAC,QAAK;AAAA,UACN,4CAAC,UAAM,iBAAM;AAAA;AAAA;AAAA,IACd;AAAA,EAEF;AACD;AAEA,gBAAgB,cAAc;","names":[]}
@@ -0,0 +1,12 @@
1
+ import * as react from 'react';
2
+ import { HeadingLevel } from './use-heading.cjs';
3
+ import { Editor } from '@tiptap/core';
4
+ import 'lucide-react';
5
+
6
+ interface HeadingMenuItemProps {
7
+ editor: Editor | null;
8
+ level: HeadingLevel;
9
+ }
10
+ declare const HeadingMenuItem: react.ForwardRefExoticComponent<HeadingMenuItemProps & react.RefAttributes<HTMLDivElement>>;
11
+
12
+ export { HeadingMenuItem, type HeadingMenuItemProps };
@@ -0,0 +1,12 @@
1
+ import * as react from 'react';
2
+ import { HeadingLevel } from './use-heading.js';
3
+ import { Editor } from '@tiptap/core';
4
+ import 'lucide-react';
5
+
6
+ interface HeadingMenuItemProps {
7
+ editor: Editor | null;
8
+ level: HeadingLevel;
9
+ }
10
+ declare const HeadingMenuItem: react.ForwardRefExoticComponent<HeadingMenuItemProps & react.RefAttributes<HTMLDivElement>>;
11
+
12
+ export { HeadingMenuItem, type HeadingMenuItemProps };
@@ -0,0 +1,32 @@
1
+ import { jsx, jsxs } from "react/jsx-runtime";
2
+ import { forwardRef } from "react";
3
+ import { useHeading } from "./use-heading";
4
+ import { DropdownMenuItem } from "../ui/dropdown-menu";
5
+ const HeadingMenuItem = forwardRef(
6
+ ({ editor, level }, ref) => {
7
+ const { isActive, canToggle, handleToggle, label, Icon } = useHeading({
8
+ editor,
9
+ level
10
+ });
11
+ return /* @__PURE__ */ jsxs(
12
+ DropdownMenuItem,
13
+ {
14
+ ref,
15
+ "aria-label": label,
16
+ className: "nt:data-[active-state=on]:bg-accent nt:data-[active-state=on]:text-[var(--tt-brand-color-500)]",
17
+ "data-active-state": isActive ? "on" : "off",
18
+ disabled: !canToggle,
19
+ onSelect: handleToggle,
20
+ children: [
21
+ /* @__PURE__ */ jsx(Icon, {}),
22
+ /* @__PURE__ */ jsx("span", { children: label })
23
+ ]
24
+ }
25
+ );
26
+ }
27
+ );
28
+ HeadingMenuItem.displayName = "HeadingMenuItem";
29
+ export {
30
+ HeadingMenuItem
31
+ };
32
+ //# sourceMappingURL=heading-menu-item.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../src/components/heading-dropdown-menu/heading-menu-item.tsx"],"sourcesContent":["import { forwardRef } from 'react';\n\nimport { useHeading, type HeadingLevel } from './use-heading';\nimport { DropdownMenuItem } from '../ui/dropdown-menu';\n\nimport type { Editor } from '@tiptap/core';\n\nexport interface HeadingMenuItemProps {\n\teditor: Editor | null;\n\tlevel: HeadingLevel;\n}\n\nexport const HeadingMenuItem = forwardRef<HTMLDivElement, HeadingMenuItemProps>(\n\t({ editor, level }, ref) => {\n\t\tconst { isActive, canToggle, handleToggle, label, Icon } = useHeading({\n\t\t\teditor,\n\t\t\tlevel\n\t\t});\n\n\t\treturn (\n\t\t\t<DropdownMenuItem\n\t\t\t\tref={ref}\n\t\t\t\taria-label={label}\n\t\t\t\tclassName=\"nt:data-[active-state=on]:bg-accent nt:data-[active-state=on]:text-[var(--tt-brand-color-500)]\"\n\t\t\t\tdata-active-state={isActive ? 'on' : 'off'}\n\t\t\t\tdisabled={!canToggle}\n\t\t\t\tonSelect={handleToggle}\n\t\t\t>\n\t\t\t\t<Icon />\n\t\t\t\t<span>{label}</span>\n\t\t\t</DropdownMenuItem>\n\t\t);\n\t}\n);\n\nHeadingMenuItem.displayName = 'HeadingMenuItem';\n"],"mappings":"AAoBG,SAQC,KARD;AApBH,SAAS,kBAAkB;AAE3B,SAAS,kBAAqC;AAC9C,SAAS,wBAAwB;AAS1B,MAAM,kBAAkB;AAAA,EAC9B,CAAC,EAAE,QAAQ,MAAM,GAAG,QAAQ;AAC3B,UAAM,EAAE,UAAU,WAAW,cAAc,OAAO,KAAK,IAAI,WAAW;AAAA,MACrE;AAAA,MACA;AAAA,IACD,CAAC;AAED,WACC;AAAA,MAAC;AAAA;AAAA,QACA;AAAA,QACA,cAAY;AAAA,QACZ,WAAU;AAAA,QACV,qBAAmB,WAAW,OAAO;AAAA,QACrC,UAAU,CAAC;AAAA,QACX,UAAU;AAAA,QAEV;AAAA,8BAAC,QAAK;AAAA,UACN,oBAAC,UAAM,iBAAM;AAAA;AAAA;AAAA,IACd;AAAA,EAEF;AACD;AAEA,gBAAgB,cAAc;","names":[]}
@@ -0,0 +1,109 @@
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_heading_exports = {};
20
+ __export(use_heading_exports, {
21
+ getHeadingTriggerIcon: () => getHeadingTriggerIcon,
22
+ useActiveHeadingLevel: () => useActiveHeadingLevel,
23
+ useHeading: () => useHeading
24
+ });
25
+ module.exports = __toCommonJS(use_heading_exports);
26
+ var import_lucide_react = require("lucide-react");
27
+ var import_react = require("react");
28
+ const headingIcons = {
29
+ 1: import_lucide_react.Heading1,
30
+ 2: import_lucide_react.Heading2,
31
+ 3: import_lucide_react.Heading3,
32
+ 4: import_lucide_react.Heading4
33
+ };
34
+ const headingLabels = {
35
+ 1: "Heading 1",
36
+ 2: "Heading 2",
37
+ 3: "Heading 3",
38
+ 4: "Heading 4"
39
+ };
40
+ function canToggleHeading(editor, level) {
41
+ if (!editor || !editor.isEditable) return false;
42
+ return editor.can().setNode("heading", { level }) || editor.can().clearNodes();
43
+ }
44
+ function useHeading({
45
+ editor,
46
+ level
47
+ }) {
48
+ const [isActive, setIsActive] = (0, import_react.useState)(false);
49
+ const [canToggle, setCanToggle] = (0, import_react.useState)(false);
50
+ (0, import_react.useEffect)(() => {
51
+ if (!editor) return;
52
+ const handleUpdate = () => {
53
+ setIsActive(editor.isActive("heading", { level }));
54
+ setCanToggle(canToggleHeading(editor, level));
55
+ };
56
+ handleUpdate();
57
+ editor.on("selectionUpdate", handleUpdate);
58
+ editor.on("transaction", handleUpdate);
59
+ return () => {
60
+ editor.off("selectionUpdate", handleUpdate);
61
+ editor.off("transaction", handleUpdate);
62
+ };
63
+ }, [editor, level]);
64
+ const handleToggle = (0, import_react.useCallback)(() => {
65
+ if (!editor || !editor.isEditable) return false;
66
+ if (editor.isActive("heading", { level })) {
67
+ return editor.chain().focus().setNode("paragraph").run();
68
+ }
69
+ return editor.chain().focus().clearNodes().setNode("heading", { level }).run();
70
+ }, [editor, level]);
71
+ return {
72
+ isActive,
73
+ canToggle,
74
+ handleToggle,
75
+ label: headingLabels[level],
76
+ Icon: headingIcons[level]
77
+ };
78
+ }
79
+ function useActiveHeadingLevel(editor, levels) {
80
+ const [activeLevel, setActiveLevel] = (0, import_react.useState)(null);
81
+ (0, import_react.useEffect)(() => {
82
+ if (!editor) return;
83
+ const handleUpdate = () => {
84
+ const found = levels.find(
85
+ (level) => editor.isActive("heading", { level })
86
+ );
87
+ setActiveLevel(found ?? null);
88
+ };
89
+ handleUpdate();
90
+ editor.on("selectionUpdate", handleUpdate);
91
+ editor.on("transaction", handleUpdate);
92
+ return () => {
93
+ editor.off("selectionUpdate", handleUpdate);
94
+ editor.off("transaction", handleUpdate);
95
+ };
96
+ }, [editor, levels]);
97
+ return activeLevel;
98
+ }
99
+ function getHeadingTriggerIcon(activeLevel) {
100
+ if (activeLevel === null) return import_lucide_react.Heading;
101
+ return headingIcons[activeLevel];
102
+ }
103
+ // Annotate the CommonJS export names for ESM import in node:
104
+ 0 && (module.exports = {
105
+ getHeadingTriggerIcon,
106
+ useActiveHeadingLevel,
107
+ useHeading
108
+ });
109
+ //# sourceMappingURL=use-heading.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../src/components/heading-dropdown-menu/use-heading.ts"],"sourcesContent":["import { Heading, Heading1, Heading2, Heading3, Heading4 } from 'lucide-react';\nimport { useCallback, useEffect, useState } from 'react';\n\nimport type { Editor } from '@tiptap/core';\nimport type { LucideIcon } from 'lucide-react';\n\nexport type HeadingLevel = 1 | 2 | 3 | 4;\n\ntype IconComponent = LucideIcon;\n\nconst headingIcons: Record<HeadingLevel, IconComponent> = {\n\t1: Heading1,\n\t2: Heading2,\n\t3: Heading3,\n\t4: Heading4\n};\n\nconst headingLabels: Record<HeadingLevel, string> = {\n\t1: 'Heading 1',\n\t2: 'Heading 2',\n\t3: 'Heading 3',\n\t4: 'Heading 4'\n};\n\nfunction canToggleHeading(editor: Editor | null, level: HeadingLevel): boolean {\n\tif (!editor || !editor.isEditable) return false;\n\n\treturn (\n\t\teditor.can().setNode('heading', { level }) || editor.can().clearNodes()\n\t);\n}\n\nexport function useHeading({\n\teditor,\n\tlevel\n}: {\n\teditor: Editor | null;\n\tlevel: HeadingLevel;\n}) {\n\tconst [isActive, setIsActive] = useState(false);\n\tconst [canToggle, setCanToggle] = useState(false);\n\n\tuseEffect(() => {\n\t\tif (!editor) return;\n\n\t\tconst handleUpdate = () => {\n\t\t\tsetIsActive(editor.isActive('heading', { level }));\n\t\t\tsetCanToggle(canToggleHeading(editor, level));\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, level]);\n\n\tconst handleToggle = useCallback(() => {\n\t\tif (!editor || !editor.isEditable) return false;\n\n\t\tif (editor.isActive('heading', { level })) {\n\t\t\treturn editor.chain().focus().setNode('paragraph').run();\n\t\t}\n\n\t\t// clearNodes first to convert any block type to paragraph,\n\t\t// then set heading\n\t\treturn editor\n\t\t\t.chain()\n\t\t\t.focus()\n\t\t\t.clearNodes()\n\t\t\t.setNode('heading', { level })\n\t\t\t.run();\n\t}, [editor, level]);\n\n\treturn {\n\t\tisActive,\n\t\tcanToggle,\n\t\thandleToggle,\n\t\tlabel: headingLabels[level],\n\t\tIcon: headingIcons[level]\n\t};\n}\n\nexport function useActiveHeadingLevel(\n\teditor: Editor | null,\n\tlevels: HeadingLevel[]\n): HeadingLevel | null {\n\tconst [activeLevel, setActiveLevel] = useState<HeadingLevel | null>(null);\n\n\tuseEffect(() => {\n\t\tif (!editor) return;\n\n\t\tconst handleUpdate = () => {\n\t\t\tconst found = levels.find((level) =>\n\t\t\t\teditor.isActive('heading', { level })\n\t\t\t);\n\n\t\t\tsetActiveLevel(found ?? null);\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, levels]);\n\n\treturn activeLevel;\n}\n\nexport function getHeadingTriggerIcon(\n\tactiveLevel: HeadingLevel | null\n): IconComponent {\n\tif (activeLevel === null) return Heading;\n\n\treturn headingIcons[activeLevel];\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0BAAgE;AAChE,mBAAiD;AASjD,MAAM,eAAoD;AAAA,EACzD,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACJ;AAEA,MAAM,gBAA8C;AAAA,EACnD,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACJ;AAEA,SAAS,iBAAiB,QAAuB,OAA8B;AAC9E,MAAI,CAAC,UAAU,CAAC,OAAO,WAAY,QAAO;AAE1C,SACC,OAAO,IAAI,EAAE,QAAQ,WAAW,EAAE,MAAM,CAAC,KAAK,OAAO,IAAI,EAAE,WAAW;AAExE;AAEO,SAAS,WAAW;AAAA,EAC1B;AAAA,EACA;AACD,GAGG;AACF,QAAM,CAAC,UAAU,WAAW,QAAI,uBAAS,KAAK;AAC9C,QAAM,CAAC,WAAW,YAAY,QAAI,uBAAS,KAAK;AAEhD,8BAAU,MAAM;AACf,QAAI,CAAC,OAAQ;AAEb,UAAM,eAAe,MAAM;AAC1B,kBAAY,OAAO,SAAS,WAAW,EAAE,MAAM,CAAC,CAAC;AACjD,mBAAa,iBAAiB,QAAQ,KAAK,CAAC;AAAA,IAC7C;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,QAAQ,KAAK,CAAC;AAElB,QAAM,mBAAe,0BAAY,MAAM;AACtC,QAAI,CAAC,UAAU,CAAC,OAAO,WAAY,QAAO;AAE1C,QAAI,OAAO,SAAS,WAAW,EAAE,MAAM,CAAC,GAAG;AAC1C,aAAO,OAAO,MAAM,EAAE,MAAM,EAAE,QAAQ,WAAW,EAAE,IAAI;AAAA,IACxD;AAIA,WAAO,OACL,MAAM,EACN,MAAM,EACN,WAAW,EACX,QAAQ,WAAW,EAAE,MAAM,CAAC,EAC5B,IAAI;AAAA,EACP,GAAG,CAAC,QAAQ,KAAK,CAAC;AAElB,SAAO;AAAA,IACN;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO,cAAc,KAAK;AAAA,IAC1B,MAAM,aAAa,KAAK;AAAA,EACzB;AACD;AAEO,SAAS,sBACf,QACA,QACsB;AACtB,QAAM,CAAC,aAAa,cAAc,QAAI,uBAA8B,IAAI;AAExE,8BAAU,MAAM;AACf,QAAI,CAAC,OAAQ;AAEb,UAAM,eAAe,MAAM;AAC1B,YAAM,QAAQ,OAAO;AAAA,QAAK,CAAC,UAC1B,OAAO,SAAS,WAAW,EAAE,MAAM,CAAC;AAAA,MACrC;AAEA,qBAAe,SAAS,IAAI;AAAA,IAC7B;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,QAAQ,MAAM,CAAC;AAEnB,SAAO;AACR;AAEO,SAAS,sBACf,aACgB;AAChB,MAAI,gBAAgB,KAAM,QAAO;AAEjC,SAAO,aAAa,WAAW;AAChC;","names":[]}
@@ -0,0 +1,19 @@
1
+ import { Editor } from '@tiptap/core';
2
+ import { LucideIcon } from 'lucide-react';
3
+
4
+ type HeadingLevel = 1 | 2 | 3 | 4;
5
+ type IconComponent = LucideIcon;
6
+ declare function useHeading({ editor, level }: {
7
+ editor: Editor | null;
8
+ level: HeadingLevel;
9
+ }): {
10
+ isActive: boolean;
11
+ canToggle: boolean;
12
+ handleToggle: () => boolean;
13
+ label: string;
14
+ Icon: LucideIcon;
15
+ };
16
+ declare function useActiveHeadingLevel(editor: Editor | null, levels: HeadingLevel[]): HeadingLevel | null;
17
+ declare function getHeadingTriggerIcon(activeLevel: HeadingLevel | null): IconComponent;
18
+
19
+ export { type HeadingLevel, getHeadingTriggerIcon, useActiveHeadingLevel, useHeading };
@@ -0,0 +1,19 @@
1
+ import { Editor } from '@tiptap/core';
2
+ import { LucideIcon } from 'lucide-react';
3
+
4
+ type HeadingLevel = 1 | 2 | 3 | 4;
5
+ type IconComponent = LucideIcon;
6
+ declare function useHeading({ editor, level }: {
7
+ editor: Editor | null;
8
+ level: HeadingLevel;
9
+ }): {
10
+ isActive: boolean;
11
+ canToggle: boolean;
12
+ handleToggle: () => boolean;
13
+ label: string;
14
+ Icon: LucideIcon;
15
+ };
16
+ declare function useActiveHeadingLevel(editor: Editor | null, levels: HeadingLevel[]): HeadingLevel | null;
17
+ declare function getHeadingTriggerIcon(activeLevel: HeadingLevel | null): IconComponent;
18
+
19
+ export { type HeadingLevel, getHeadingTriggerIcon, useActiveHeadingLevel, useHeading };
@@ -0,0 +1,83 @@
1
+ import { Heading, Heading1, Heading2, Heading3, Heading4 } from "lucide-react";
2
+ import { useCallback, useEffect, useState } from "react";
3
+ const headingIcons = {
4
+ 1: Heading1,
5
+ 2: Heading2,
6
+ 3: Heading3,
7
+ 4: Heading4
8
+ };
9
+ const headingLabels = {
10
+ 1: "Heading 1",
11
+ 2: "Heading 2",
12
+ 3: "Heading 3",
13
+ 4: "Heading 4"
14
+ };
15
+ function canToggleHeading(editor, level) {
16
+ if (!editor || !editor.isEditable) return false;
17
+ return editor.can().setNode("heading", { level }) || editor.can().clearNodes();
18
+ }
19
+ function useHeading({
20
+ editor,
21
+ level
22
+ }) {
23
+ const [isActive, setIsActive] = useState(false);
24
+ const [canToggle, setCanToggle] = useState(false);
25
+ useEffect(() => {
26
+ if (!editor) return;
27
+ const handleUpdate = () => {
28
+ setIsActive(editor.isActive("heading", { level }));
29
+ setCanToggle(canToggleHeading(editor, level));
30
+ };
31
+ handleUpdate();
32
+ editor.on("selectionUpdate", handleUpdate);
33
+ editor.on("transaction", handleUpdate);
34
+ return () => {
35
+ editor.off("selectionUpdate", handleUpdate);
36
+ editor.off("transaction", handleUpdate);
37
+ };
38
+ }, [editor, level]);
39
+ const handleToggle = useCallback(() => {
40
+ if (!editor || !editor.isEditable) return false;
41
+ if (editor.isActive("heading", { level })) {
42
+ return editor.chain().focus().setNode("paragraph").run();
43
+ }
44
+ return editor.chain().focus().clearNodes().setNode("heading", { level }).run();
45
+ }, [editor, level]);
46
+ return {
47
+ isActive,
48
+ canToggle,
49
+ handleToggle,
50
+ label: headingLabels[level],
51
+ Icon: headingIcons[level]
52
+ };
53
+ }
54
+ function useActiveHeadingLevel(editor, levels) {
55
+ const [activeLevel, setActiveLevel] = useState(null);
56
+ useEffect(() => {
57
+ if (!editor) return;
58
+ const handleUpdate = () => {
59
+ const found = levels.find(
60
+ (level) => editor.isActive("heading", { level })
61
+ );
62
+ setActiveLevel(found ?? null);
63
+ };
64
+ handleUpdate();
65
+ editor.on("selectionUpdate", handleUpdate);
66
+ editor.on("transaction", handleUpdate);
67
+ return () => {
68
+ editor.off("selectionUpdate", handleUpdate);
69
+ editor.off("transaction", handleUpdate);
70
+ };
71
+ }, [editor, levels]);
72
+ return activeLevel;
73
+ }
74
+ function getHeadingTriggerIcon(activeLevel) {
75
+ if (activeLevel === null) return Heading;
76
+ return headingIcons[activeLevel];
77
+ }
78
+ export {
79
+ getHeadingTriggerIcon,
80
+ useActiveHeadingLevel,
81
+ useHeading
82
+ };
83
+ //# sourceMappingURL=use-heading.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../src/components/heading-dropdown-menu/use-heading.ts"],"sourcesContent":["import { Heading, Heading1, Heading2, Heading3, Heading4 } from 'lucide-react';\nimport { useCallback, useEffect, useState } from 'react';\n\nimport type { Editor } from '@tiptap/core';\nimport type { LucideIcon } from 'lucide-react';\n\nexport type HeadingLevel = 1 | 2 | 3 | 4;\n\ntype IconComponent = LucideIcon;\n\nconst headingIcons: Record<HeadingLevel, IconComponent> = {\n\t1: Heading1,\n\t2: Heading2,\n\t3: Heading3,\n\t4: Heading4\n};\n\nconst headingLabels: Record<HeadingLevel, string> = {\n\t1: 'Heading 1',\n\t2: 'Heading 2',\n\t3: 'Heading 3',\n\t4: 'Heading 4'\n};\n\nfunction canToggleHeading(editor: Editor | null, level: HeadingLevel): boolean {\n\tif (!editor || !editor.isEditable) return false;\n\n\treturn (\n\t\teditor.can().setNode('heading', { level }) || editor.can().clearNodes()\n\t);\n}\n\nexport function useHeading({\n\teditor,\n\tlevel\n}: {\n\teditor: Editor | null;\n\tlevel: HeadingLevel;\n}) {\n\tconst [isActive, setIsActive] = useState(false);\n\tconst [canToggle, setCanToggle] = useState(false);\n\n\tuseEffect(() => {\n\t\tif (!editor) return;\n\n\t\tconst handleUpdate = () => {\n\t\t\tsetIsActive(editor.isActive('heading', { level }));\n\t\t\tsetCanToggle(canToggleHeading(editor, level));\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, level]);\n\n\tconst handleToggle = useCallback(() => {\n\t\tif (!editor || !editor.isEditable) return false;\n\n\t\tif (editor.isActive('heading', { level })) {\n\t\t\treturn editor.chain().focus().setNode('paragraph').run();\n\t\t}\n\n\t\t// clearNodes first to convert any block type to paragraph,\n\t\t// then set heading\n\t\treturn editor\n\t\t\t.chain()\n\t\t\t.focus()\n\t\t\t.clearNodes()\n\t\t\t.setNode('heading', { level })\n\t\t\t.run();\n\t}, [editor, level]);\n\n\treturn {\n\t\tisActive,\n\t\tcanToggle,\n\t\thandleToggle,\n\t\tlabel: headingLabels[level],\n\t\tIcon: headingIcons[level]\n\t};\n}\n\nexport function useActiveHeadingLevel(\n\teditor: Editor | null,\n\tlevels: HeadingLevel[]\n): HeadingLevel | null {\n\tconst [activeLevel, setActiveLevel] = useState<HeadingLevel | null>(null);\n\n\tuseEffect(() => {\n\t\tif (!editor) return;\n\n\t\tconst handleUpdate = () => {\n\t\t\tconst found = levels.find((level) =>\n\t\t\t\teditor.isActive('heading', { level })\n\t\t\t);\n\n\t\t\tsetActiveLevel(found ?? null);\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, levels]);\n\n\treturn activeLevel;\n}\n\nexport function getHeadingTriggerIcon(\n\tactiveLevel: HeadingLevel | null\n): IconComponent {\n\tif (activeLevel === null) return Heading;\n\n\treturn headingIcons[activeLevel];\n}\n"],"mappings":"AAAA,SAAS,SAAS,UAAU,UAAU,UAAU,gBAAgB;AAChE,SAAS,aAAa,WAAW,gBAAgB;AASjD,MAAM,eAAoD;AAAA,EACzD,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACJ;AAEA,MAAM,gBAA8C;AAAA,EACnD,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACJ;AAEA,SAAS,iBAAiB,QAAuB,OAA8B;AAC9E,MAAI,CAAC,UAAU,CAAC,OAAO,WAAY,QAAO;AAE1C,SACC,OAAO,IAAI,EAAE,QAAQ,WAAW,EAAE,MAAM,CAAC,KAAK,OAAO,IAAI,EAAE,WAAW;AAExE;AAEO,SAAS,WAAW;AAAA,EAC1B;AAAA,EACA;AACD,GAGG;AACF,QAAM,CAAC,UAAU,WAAW,IAAI,SAAS,KAAK;AAC9C,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,KAAK;AAEhD,YAAU,MAAM;AACf,QAAI,CAAC,OAAQ;AAEb,UAAM,eAAe,MAAM;AAC1B,kBAAY,OAAO,SAAS,WAAW,EAAE,MAAM,CAAC,CAAC;AACjD,mBAAa,iBAAiB,QAAQ,KAAK,CAAC;AAAA,IAC7C;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,QAAQ,KAAK,CAAC;AAElB,QAAM,eAAe,YAAY,MAAM;AACtC,QAAI,CAAC,UAAU,CAAC,OAAO,WAAY,QAAO;AAE1C,QAAI,OAAO,SAAS,WAAW,EAAE,MAAM,CAAC,GAAG;AAC1C,aAAO,OAAO,MAAM,EAAE,MAAM,EAAE,QAAQ,WAAW,EAAE,IAAI;AAAA,IACxD;AAIA,WAAO,OACL,MAAM,EACN,MAAM,EACN,WAAW,EACX,QAAQ,WAAW,EAAE,MAAM,CAAC,EAC5B,IAAI;AAAA,EACP,GAAG,CAAC,QAAQ,KAAK,CAAC;AAElB,SAAO;AAAA,IACN;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO,cAAc,KAAK;AAAA,IAC1B,MAAM,aAAa,KAAK;AAAA,EACzB;AACD;AAEO,SAAS,sBACf,QACA,QACsB;AACtB,QAAM,CAAC,aAAa,cAAc,IAAI,SAA8B,IAAI;AAExE,YAAU,MAAM;AACf,QAAI,CAAC,OAAQ;AAEb,UAAM,eAAe,MAAM;AAC1B,YAAM,QAAQ,OAAO;AAAA,QAAK,CAAC,UAC1B,OAAO,SAAS,WAAW,EAAE,MAAM,CAAC;AAAA,MACrC;AAEA,qBAAe,SAAS,IAAI;AAAA,IAC7B;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,QAAQ,MAAM,CAAC;AAEnB,SAAO;AACR;AAEO,SAAS,sBACf,aACgB;AAChB,MAAI,gBAAgB,KAAM,QAAO;AAEjC,SAAO,aAAa,WAAW;AAChC;","names":[]}