payload-intl 0.0.2 → 0.0.4

package/dist/components/inputs/toolbar/LinkEditor.js

@@ -1,205 +1,217 @@
-import { IconLink as A, IconCornerDownLeft as I, IconExternalLink as N, IconLinkOff as P } from "@tabler/icons-react";
-import { useEditorState as W } from "@tiptap/react";
-import { Popover as k, Toolbar as p } from "radix-ui";
-import { useState as v, useCallback as d, useEffect as h } from "react";
-import { cn as B } from "../../../utils/cn.js";
-function q({
+import { jsxs as v, jsx as l } from "react/jsx-runtime";
+import { IconLink as N, IconCornerDownLeft as j, IconExternalLink as P, IconLinkOff as W } from "@tabler/icons-react";
+import { useEditorState as B } from "@tiptap/react";
+import { Popover as g, Toolbar as m } from "radix-ui";
+import { useState as L, useCallback as p, useEffect as k } from "react";
+import { cn as M } from "../../../utils/cn.js";
+function Q({
   editor: e,
-  hideWhenUnavailable: t = !1,
-  onSetLink: n,
-  onOpenChange: a,
-  autoOpenOnLinkActive: c = !0,
-  onClick: u,
-  className: f,
-  ...r
+  hideWhenUnavailable: n = !1,
+  onSetLink: t,
+  onOpenChange: i,
+  autoOpenOnLinkActive: u = !0,
+  onClick: f,
+  className: d,
+  ...o
 }) {
-  const [o, i] = v(!0), { canSet: l, isActive: m, url: b, setUrl: w, setLink: E, removeLink: g, openLink: y } = M({
+  const [r, s] = L(!0), { canSet: a, isActive: h, url: b, setUrl: C, setLink: x, removeLink: w, openLink: z } = T({
     editor: e,
-    hideWhenUnavailable: t,
-    onSetLink: n
-  }), S = d(
-    (s) => {
-      i(s), a?.(s);
+    hideWhenUnavailable: n,
+    onSetLink: t
+  }), A = p(
+    (c) => {
+      s(c), i?.(c);
     },
-    [a]
-  ), R = d(() => {
-    E(), i(!1);
-  }, [E]), U = d(() => {
-    g(), i(!1);
-  }, [g]), C = d(
-    (s) => {
-      u?.(s), !s.defaultPrevented && i(!o);
+    [i]
+  ), y = p(() => {
+    x(), s(!1);
+  }, [x]), E = p(() => {
+    w(), s(!1);
+  }, [w]), I = p(
+    (c) => {
+      f?.(c), !c.defaultPrevented && s(!r);
     },
-    [u, o]
-  ), z = (s) => {
-    s.key === "Enter" && (s.preventDefault(), R());
+    [f, r]
+  ), R = (c) => {
+    c.key === "Enter" && (c.preventDefault(), y());
   };
-  return h(() => {
-    c && m && i(!0);
-  }, [c, m]), /* @__PURE__ */ React.createElement(k.Root, { open: o, onOpenChange: S }, /* @__PURE__ */ React.createElement(k.Trigger, { asChild: !0 }, /* @__PURE__ */ React.createElement(
-    p.Button,
-    {
-      className: B(f, {
-        "bg-elevation-600 text-elevation-0": m
-      }),
-      disabled: !l,
-      onClick: C,
-      "aria-label": "Link",
-      ...r
-    },
-    /* @__PURE__ */ React.createElement(A, { size: 16 })
-  )), /* @__PURE__ */ React.createElement(
-    k.Content,
-    {
-      className: "z-50 rounded-md border border-border bg-elevation-100 p-2 shadow-md",
-      sideOffset: 8,
-      align: "end"
-    },
-    /* @__PURE__ */ React.createElement(p.Root, { className: "flex items-center gap-2" }, /* @__PURE__ */ React.createElement("div", { className: "flex items-center overflow-hidden rounded-md border border-border focus-within:border-elevation-600" }, /* @__PURE__ */ React.createElement(
-      "input",
+  return k(() => {
+    u && h && s(!0);
+  }, [u, h]), /* @__PURE__ */ v(g.Root, { open: r, onOpenChange: A, children: [
+    /* @__PURE__ */ l(g.Trigger, { asChild: !0, children: /* @__PURE__ */ l(
+      m.Button,
       {
-        type: "url",
-        placeholder: "Paste a link...",
-        autoComplete: "off",
-        autoCorrect: "off",
-        autoCapitalize: "off",
-        value: b,
-        onChange: (s) => w(s.target.value),
-        onKeyDown: z,
-        className: "h-10 flex-1 border-none bg-input px-2 py-1 focus:outline-none",
-        "aria-label": "Link URL",
-        style: { minWidth: "200px" }
+        className: M(d, {
+          "bg-elevation-600 text-elevation-0": h
+        }),
+        disabled: !a,
+        onClick: I,
+        "aria-label": "Link",
+        ...o,
+        children: /* @__PURE__ */ l(N, { size: 16 })
       }
-    ), /* @__PURE__ */ React.createElement(
-      p.Button,
-      {
-        type: "button",
-        title: "Apply link",
-        disabled: !b && !m,
-        className: "flex size-10 items-center justify-center !rounded-none border-none bg-elevation-800 p-0 text-elevation-0 hover:bg-elevation-600 disabled:bg-transparent disabled:text-elevation-250",
-        onClick: R
-      },
-      /* @__PURE__ */ React.createElement(I, { size: 16 })
-    )), /* @__PURE__ */ React.createElement(p.Separator, { className: "mx-1 h-10 w-px bg-border" }), /* @__PURE__ */ React.createElement(
-      p.Button,
-      {
-        type: "button",
-        className: "flex size-10 items-center justify-center rounded-md border-none bg-transparent p-0 hover:bg-elevation-250",
-        title: "Open in new window",
-        disabled: !b && !m,
-        onClick: () => y()
-      },
-      /* @__PURE__ */ React.createElement(N, { size: 16 })
-    ), /* @__PURE__ */ React.createElement(
-      p.Button,
+    ) }),
+    /* @__PURE__ */ l(
+      g.Content,
       {
-        type: "button",
-        title: "Remove link",
-        className: "flex size-10 items-center justify-center rounded-md border-none bg-transparent p-0 hover:bg-elevation-250",
-        disabled: !b && !m,
-        onClick: U
-      },
-      /* @__PURE__ */ React.createElement(P, { size: 16 })
-    ))
-  ));
+        className: "z-50 rounded-md border border-border bg-elevation-100 p-2 shadow-md",
+        sideOffset: 8,
+        align: "end",
+        children: /* @__PURE__ */ v(m.Root, { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ v("div", { className: "flex items-center overflow-hidden rounded-md border border-border focus-within:border-elevation-600", children: [
+            /* @__PURE__ */ l(
+              "input",
+              {
+                type: "url",
+                placeholder: "Paste a link...",
+                autoComplete: "off",
+                autoCorrect: "off",
+                autoCapitalize: "off",
+                value: b,
+                onChange: (c) => C(c.target.value),
+                onKeyDown: R,
+                className: "h-10 flex-1 border-none bg-input px-2 py-1 focus:outline-none",
+                "aria-label": "Link URL",
+                style: { minWidth: "200px" }
+              }
+            ),
+            /* @__PURE__ */ l(
+              m.Button,
+              {
+                type: "button",
+                title: "Apply link",
+                disabled: !b && !h,
+                className: "flex size-10 items-center justify-center !rounded-none border-none bg-elevation-800 p-0 text-elevation-0 hover:bg-elevation-600 disabled:bg-transparent disabled:text-elevation-250",
+                onClick: y,
+                children: /* @__PURE__ */ l(j, { size: 16 })
+              }
+            )
+          ] }),
+          /* @__PURE__ */ l(m.Separator, { className: "mx-1 h-10 w-px bg-border" }),
+          /* @__PURE__ */ l(
+            m.Button,
+            {
+              type: "button",
+              className: "flex size-10 items-center justify-center rounded-md border-none bg-transparent p-0 hover:bg-elevation-250",
+              title: "Open in new window",
+              disabled: !b && !h,
+              onClick: () => z(),
+              children: /* @__PURE__ */ l(P, { size: 16 })
+            }
+          ),
+          /* @__PURE__ */ l(
+            m.Button,
+            {
+              type: "button",
+              title: "Remove link",
+              className: "flex size-10 items-center justify-center rounded-md border-none bg-transparent p-0 hover:bg-elevation-250",
+              disabled: !b && !h,
+              onClick: E,
+              children: /* @__PURE__ */ l(W, { size: 16 })
+            }
+          )
+        ] })
+      }
+    )
+  ] });
 }
-function M(e) {
-  const { editor: t, hideWhenUnavailable: n = !1, onSetLink: a } = e || {}, { isVisible: c, canSet: u, isActive: f } = L({
-    editor: t || null,
-    hideWhenUnavailable: n
-  }), r = D({
-    editor: t || null,
-    onSetLink: a
+function T(e) {
+  const { editor: n, hideWhenUnavailable: t = !1, onSetLink: i } = e || {}, { isVisible: u, canSet: f, isActive: d } = S({
+    editor: n || null,
+    hideWhenUnavailable: t
+  }), o = H({
+    editor: n || null,
+    onSetLink: i
   });
   return {
-    isVisible: c,
-    canSet: u,
-    isActive: f,
-    ...r
+    isVisible: u,
+    canSet: f,
+    isActive: d,
+    ...o
   };
 }
-function L(e) {
-  const { editor: t, hideWhenUnavailable: n = !1 } = e, a = x(t), c = W({
-    editor: t,
-    selector: (r) => r.editor?.isEditable && r?.editor?.isActive("link")
-  }) ?? !1, [u, f] = v(!1);
-  return h(() => {
-    if (!t) return;
-    const r = () => {
-      f(
-        T({
-          editor: t,
-          hideWhenUnavailable: n
+function S(e) {
+  const { editor: n, hideWhenUnavailable: t = !1 } = e, i = U(n), u = B({
+    editor: n,
+    selector: (o) => o.editor?.isEditable && o?.editor?.isActive("link")
+  }) ?? !1, [f, d] = L(!1);
+  return k(() => {
+    if (!n) return;
+    const o = () => {
+      d(
+        D({
+          editor: n,
+          hideWhenUnavailable: t
         })
       );
     };
-    return r(), t.on("selectionUpdate", r), () => {
-      t.off("selectionUpdate", r);
+    return o(), n.on("selectionUpdate", o), () => {
+      n.off("selectionUpdate", o);
     };
-  }, [t, n]), {
-    isVisible: u,
-    canSet: a,
-    isActive: c
+  }, [n, t]), {
+    isVisible: f,
+    canSet: i,
+    isActive: u
   };
 }
-function x(e) {
+function U(e) {
   return !e || !e.isEditable ? !1 : e.can().setMark("link");
 }
-function T(e) {
-  const { editor: t, hideWhenUnavailable: n } = e;
-  return !j("link", t) || !t ? !1 : n && !t.isActive("code") ? x(t) : !0;
+function D(e) {
+  const { editor: n, hideWhenUnavailable: t } = e;
+  return !O("link", n) || !n ? !1 : t && !n.isActive("code") ? U(n) : !0;
 }
-const j = (e, t) => t?.schema ? t.schema.spec.marks.get(e) !== void 0 : !1;
-function D({ editor: e, onSetLink: t }) {
-  const [n, a] = v(null), { isActive: c } = L({ editor: e, hideWhenUnavailable: !1 });
-  h(() => {
+const O = (e, n) => n?.schema ? n.schema.spec.marks.get(e) !== void 0 : !1;
+function H({ editor: e, onSetLink: n }) {
+  const [t, i] = L(null), { isActive: u } = S({ editor: e, hideWhenUnavailable: !1 });
+  k(() => {
     if (!e) return;
-    const { href: o } = e.getAttributes("link");
-    c && n === null && a(o || "");
-  }, [e, n, c]), h(() => {
+    const { href: r } = e.getAttributes("link");
+    u && t === null && i(r || "");
+  }, [e, t, u]), k(() => {
     if (!e) return;
-    const o = () => {
-      const { href: i } = e.getAttributes("link");
-      a(i || "");
+    const r = () => {
+      const { href: s } = e.getAttributes("link");
+      i(s || "");
     };
-    return e.on("selectionUpdate", o), () => {
-      e.off("selectionUpdate", o);
+    return e.on("selectionUpdate", r), () => {
+      e.off("selectionUpdate", r);
     };
   }, [e]);
-  const u = d(() => {
-    if (!n || !e) return;
-    const { selection: o } = e.state, i = o.empty;
-    let l = e.chain().focus();
-    l = l.extendMarkRange("link").setLink({ href: n }), i && (l = l.insertContent({ type: "text", text: n })), l.run(), a(null), t?.();
-  }, [e, t, n]), f = d(() => {
-    e && (e.chain().focus().extendMarkRange("link").unsetLink().setMeta("preventAutolink", !0).run(), a(""));
-  }, [e]), r = d(
-    (o = "_blank", i = "noopener,noreferrer") => {
-      if (!n) return;
-      const l = O(n, window.location.href);
-      l !== "#" && window.open(l, o, i);
+  const f = p(() => {
+    if (!t || !e) return;
+    const { selection: r } = e.state, s = r.empty;
+    let a = e.chain().focus();
+    a = a.extendMarkRange("link").setLink({ href: t }), s && (a = a.insertContent({ type: "text", text: t })), a.run(), i(null), n?.();
+  }, [e, n, t]), d = p(() => {
+    e && (e.chain().focus().extendMarkRange("link").unsetLink().setMeta("preventAutolink", !0).run(), i(""));
+  }, [e]), o = p(
+    (r = "_blank", s = "noopener,noreferrer") => {
+      if (!t) return;
+      const a = V(t, window.location.href);
+      a !== "#" && window.open(a, r, s);
     },
-    [n]
+    [t]
   );
   return {
-    url: n || "",
-    setUrl: a,
-    setLink: u,
-    removeLink: f,
-    openLink: r
+    url: t || "",
+    setUrl: i,
+    setLink: f,
+    removeLink: d,
+    openLink: o
   };
 }
-function O(e, t, n) {
+function V(e, n, t) {
   try {
-    const a = new URL(e, t);
-    if (H(a.href, n))
-      return a.href;
+    const i = new URL(e, n);
+    if (K(i.href, t))
+      return i.href;
   } catch {
   }
   return "#";
 }
-function H(e, t) {
-  const n = [
+function K(e, n) {
+  const t = [
     "http",
     "https",
     "ftp",
@@ -210,21 +222,21 @@ function H(e, t) {
     "sms",
     "cid",
     "xmpp"
-  ], a = (
+  ], i = (
     // eslint-disable-next-line no-control-regex
     /[\u0000-\u0020\u00A0\u1680\u180E\u2000-\u2029\u205F\u3000]/g
   );
-  return !e || e.replace(a, "").match(
+  return !e || e.replace(i, "").match(
     new RegExp(
       // eslint-disable-next-line no-useless-escape, regexp/no-obscure-range
-      `^(?:(?:${n.join("|")}):|[^a-z]|[a-z0-9+.-]+(?:[^a-z+.-:]|$))`,
+      `^(?:(?:${t.join("|")}):|[^a-z]|[a-z0-9+.-]+(?:[^a-z+.-:]|$))`,
       "i"
     )
   );
 }
 export {
-  q as LinkEditor,
-  j as isMarkInSchema,
-  D as useLinkHandler
+  Q as LinkEditor,
+  O as isMarkInSchema,
+  H as useLinkHandler
 };
 //# sourceMappingURL=LinkEditor.js.map

package/dist/components/inputs/toolbar/LinkEditor.js.map

@@ -1 +1 @@
-{"version":3,"file":"LinkEditor.js","sources":["../../../../src/components/inputs/toolbar/LinkEditor.tsx"],"sourcesContent":["import type { Editor } from \"@tiptap/react\";\nimport {\n  IconCornerDownLeft,\n  IconExternalLink,\n  IconLink,\n  IconLinkOff,\n} from \"@tabler/icons-react\";\nimport { useEditorState } from \"@tiptap/react\";\nimport { Popover, Toolbar } from \"radix-ui\";\nimport { useCallback, useEffect, useState } from \"react\";\n\nimport { cn } from \"@/utils/cn\";\n\nexport interface LinkEditorProps\n  extends Omit<React.HTMLAttributes<HTMLButtonElement>, \"type\" | \"children\">,\n    UseLinkPopoverConfig {\n  /**\n   * Callback for when the popover opens or closes.\n   */\n  onOpenChange?: (isOpen: boolean) => void;\n  /**\n   * Whether to automatically open the popover when a link is active.\n   * @default true\n   */\n  autoOpenOnLinkActive?: boolean;\n}\n\nexport function LinkEditor({\n  editor,\n  hideWhenUnavailable = false,\n  onSetLink,\n  onOpenChange,\n  autoOpenOnLinkActive = true,\n  onClick,\n  className,\n  ...buttonProps\n}: LinkEditorProps) {\n  const [isOpen, setIsOpen] = useState(true);\n\n  const { canSet, isActive, url, setUrl, setLink, removeLink, openLink } =\n    useLinkPopover({\n      editor,\n      hideWhenUnavailable,\n      onSetLink,\n    });\n\n  const handleOnOpenChange = useCallback(\n    (nextIsOpen: boolean) => {\n      setIsOpen(nextIsOpen);\n      onOpenChange?.(nextIsOpen);\n    },\n    [onOpenChange],\n  );\n\n  const handleSetLink = useCallback(() => {\n    setLink();\n    setIsOpen(false);\n  }, [setLink]);\n\n  const handleRemoveLink = useCallback(() => {\n    removeLink();\n    setIsOpen(false);\n  }, [removeLink]);\n\n  const handleClick = useCallback(\n    (event: React.MouseEvent<HTMLButtonElement>) => {\n      onClick?.(event);\n      if (event.defaultPrevented) return;\n      setIsOpen(!isOpen);\n    },\n    [onClick, isOpen],\n  );\n\n  const handleIputKeyDown = (event: React.KeyboardEvent) => {\n    if (event.key === \"Enter\") {\n      event.preventDefault();\n      handleSetLink();\n    }\n  };\n\n  useEffect(() => {\n    if (autoOpenOnLinkActive && isActive) {\n      setIsOpen(true);\n    }\n  }, [autoOpenOnLinkActive, isActive]);\n\n  return (\n    <Popover.Root open={isOpen} onOpenChange={handleOnOpenChange}>\n      <Popover.Trigger asChild>\n        <Toolbar.Button\n          className={cn(className, {\n            \"bg-elevation-600 text-elevation-0\": isActive,\n          })}\n          disabled={!canSet}\n          onClick={handleClick}\n          aria-label=\"Link\"\n          {...buttonProps}\n        >\n          <IconLink size={16} />\n        </Toolbar.Button>\n      </Popover.Trigger>\n\n      <Popover.Content\n        className=\"z-50 rounded-md border border-border bg-elevation-100 p-2 shadow-md\"\n        sideOffset={8}\n        align=\"end\"\n      >\n        <Toolbar.Root className=\"flex items-center gap-2\">\n          <div className=\"flex items-center overflow-hidden rounded-md border border-border focus-within:border-elevation-600\">\n            <input\n              type=\"url\"\n              placeholder=\"Paste a link...\"\n              autoComplete=\"off\"\n              autoCorrect=\"off\"\n              autoCapitalize=\"off\"\n              value={url}\n              onChange={(e) => setUrl(e.target.value)}\n              onKeyDown={handleIputKeyDown}\n              className=\"h-10 flex-1 border-none bg-input px-2 py-1 focus:outline-none\"\n              aria-label=\"Link URL\"\n              style={{ minWidth: \"200px\" }}\n            />\n\n            <Toolbar.Button\n              type=\"button\"\n              title=\"Apply link\"\n              disabled={!url && !isActive}\n              className=\"flex size-10 items-center justify-center !rounded-none border-none bg-elevation-800 p-0 text-elevation-0 hover:bg-elevation-600 disabled:bg-transparent disabled:text-elevation-250\"\n              onClick={handleSetLink}\n            >\n              <IconCornerDownLeft size={16} />\n            </Toolbar.Button>\n          </div>\n\n          <Toolbar.Separator className=\"mx-1 h-10 w-px bg-border\" />\n\n          <Toolbar.Button\n            type=\"button\"\n            className=\"flex size-10 items-center justify-center rounded-md border-none bg-transparent p-0 hover:bg-elevation-250\"\n            title=\"Open in new window\"\n            disabled={!url && !isActive}\n            onClick={() => openLink()}\n          >\n            <IconExternalLink size={16} />\n          </Toolbar.Button>\n\n          <Toolbar.Button\n            type=\"button\"\n            title=\"Remove link\"\n            className=\"flex size-10 items-center justify-center rounded-md border-none bg-transparent p-0 hover:bg-elevation-250\"\n            disabled={!url && !isActive}\n            onClick={handleRemoveLink}\n          >\n            <IconLinkOff size={16} />\n          </Toolbar.Button>\n        </Toolbar.Root>\n      </Popover.Content>\n    </Popover.Root>\n  );\n}\n\n// TODO this was mostly copied from the tiptap starter template, pretty sure it can be simplified\n\n/**\n * Configuration for the link popover functionality\n */\nexport interface UseLinkPopoverConfig {\n  /**\n   * The Tiptap editor instance.\n   */\n  editor?: Editor | null;\n  /**\n   * Whether to hide the link popover when not available.\n   * @default false\n   */\n  hideWhenUnavailable?: boolean;\n  /**\n   * Callback function called when the link is set.\n   */\n  onSetLink?: () => void;\n}\n\n/**\n * Main hook that provides link popover functionality for Tiptap editor\n */\nfunction useLinkPopover(config?: UseLinkPopoverConfig) {\n  const { editor, hideWhenUnavailable = false, onSetLink } = config || {};\n\n  const { isVisible, canSet, isActive } = useLinkState({\n    editor: editor || null,\n    hideWhenUnavailable,\n  });\n\n  const linkHandler = useLinkHandler({\n    editor: editor || null,\n    onSetLink,\n  });\n\n  return {\n    isVisible,\n    canSet,\n    isActive,\n    ...linkHandler,\n  };\n}\n\nfunction useLinkState(props: {\n  editor: Editor | null;\n  hideWhenUnavailable: boolean;\n}) {\n  const { editor, hideWhenUnavailable = false } = props;\n\n  const canSet = canSetLink(editor);\n  const isActive =\n    useEditorState({\n      editor,\n      selector: (state) =>\n        state.editor?.isEditable && state?.editor?.isActive(\"link\"),\n    }) ?? false;\n\n  const [isVisible, setIsVisible] = useState(false);\n\n  useEffect(() => {\n    if (!editor) return;\n\n    const handleSelectionUpdate = () => {\n      setIsVisible(\n        shouldShowLinkButton({\n          editor,\n          hideWhenUnavailable,\n        }),\n      );\n    };\n\n    handleSelectionUpdate();\n\n    editor.on(\"selectionUpdate\", handleSelectionUpdate);\n\n    return () => {\n      editor.off(\"selectionUpdate\", handleSelectionUpdate);\n    };\n  }, [editor, hideWhenUnavailable]);\n\n  return {\n    isVisible,\n    canSet,\n    isActive,\n  };\n}\n\n/**\n * Checks if a link can be set in the current editor state\n */\nfunction canSetLink(editor: Editor | null): boolean {\n  if (!editor || !editor.isEditable) return false;\n  return editor.can().setMark(\"link\");\n}\n\n/**\n * Determines if the link button should be shown\n */\nfunction shouldShowLinkButton(props: {\n  editor: Editor | null;\n  hideWhenUnavailable: boolean;\n}): boolean {\n  const { editor, hideWhenUnavailable } = props;\n\n  const linkInSchema = isMarkInSchema(\"link\", editor);\n\n  if (!linkInSchema || !editor) {\n    return false;\n  }\n\n  if (hideWhenUnavailable && !editor.isActive(\"code\")) {\n    return canSetLink(editor);\n  }\n\n  return true;\n}\n\n/**\n * Checks if a mark exists in the editor schema\n */\nexport const isMarkInSchema = (\n  markName: string,\n  editor: Editor | null,\n): boolean => {\n  if (!editor?.schema) return false;\n  return editor.schema.spec.marks.get(markName) !== undefined;\n};\n\n/**\n * Configuration for the link handler functionality\n */\nexport interface LinkHandlerProps {\n  /**\n   * The Tiptap editor instance.\n   */\n  editor: Editor | null;\n  /**\n   * Callback function called when the link is set.\n   */\n  onSetLink?: () => void;\n}\n\n/**\n * Custom hook for handling link operations in a Tiptap editor\n */\nexport function useLinkHandler({ editor, onSetLink }: LinkHandlerProps) {\n  const [url, setUrl] = useState<string | null>(null);\n  const { isActive } = useLinkState({ editor, hideWhenUnavailable: false });\n\n  useEffect(() => {\n    if (!editor) return;\n\n    // Get URL immediately on mount\n    const { href } = editor.getAttributes(\"link\");\n\n    if (isActive && url === null) {\n      setUrl(href || \"\");\n    }\n  }, [editor, url, isActive]);\n\n  useEffect(() => {\n    if (!editor) return;\n\n    const updateLinkState = () => {\n      const { href } = editor.getAttributes(\"link\");\n      setUrl(href || \"\");\n    };\n\n    editor.on(\"selectionUpdate\", updateLinkState);\n    return () => {\n      editor.off(\"selectionUpdate\", updateLinkState);\n    };\n  }, [editor]);\n\n  const setLink = useCallback(() => {\n    if (!url || !editor) return;\n\n    const { selection } = editor.state;\n    const isEmpty = selection.empty;\n\n    let chain = editor.chain().focus();\n\n    chain = chain.extendMarkRange(\"link\").setLink({ href: url });\n\n    if (isEmpty) {\n      chain = chain.insertContent({ type: \"text\", text: url });\n    }\n\n    chain.run();\n\n    setUrl(null);\n\n    onSetLink?.();\n  }, [editor, onSetLink, url]);\n\n  const removeLink = useCallback(() => {\n    if (!editor) return;\n    editor\n      .chain()\n      .focus()\n      .extendMarkRange(\"link\")\n      .unsetLink()\n      .setMeta(\"preventAutolink\", true)\n      .run();\n    setUrl(\"\");\n  }, [editor]);\n\n  const openLink = useCallback(\n    (target: string = \"_blank\", features: string = \"noopener,noreferrer\") => {\n      if (!url) return;\n\n      const safeUrl = sanitizeUrl(url, window.location.href);\n      if (safeUrl !== \"#\") {\n        window.open(safeUrl, target, features);\n      }\n    },\n    [url],\n  );\n\n  return {\n    url: url || \"\",\n    setUrl,\n    setLink,\n    removeLink,\n    openLink,\n  };\n}\n\ntype ProtocolOptions = {\n  /**\n   * The protocol scheme to be registered.\n   * @default '''\n   * @example 'ftp'\n   * @example 'git'\n   */\n  scheme: string;\n\n  /**\n   * If enabled, it allows optional slashes after the protocol.\n   * @default false\n   * @example true\n   */\n  optionalSlashes?: boolean;\n};\n\ntype ProtocolConfig = Array<ProtocolOptions | string>;\n\nfunction sanitizeUrl(\n  inputUrl: string,\n  baseUrl: string,\n  protocols?: ProtocolConfig,\n): string {\n  try {\n    const url = new URL(inputUrl, baseUrl);\n\n    if (isAllowedUri(url.href, protocols)) {\n      return url.href;\n    }\n  } catch {\n    // If URL creation fails, it's considered invalid\n  }\n  return \"#\";\n}\n\nfunction isAllowedUri(uri: string | undefined, protocols?: ProtocolConfig) {\n  const allowedProtocols: string[] = [\n    \"http\",\n    \"https\",\n    \"ftp\",\n    \"ftps\",\n    \"mailto\",\n    \"tel\",\n    \"callto\",\n    \"sms\",\n    \"cid\",\n    \"xmpp\",\n  ];\n\n  if (protocols) {\n    protocols.forEach((protocol) => {\n      const nextProtocol =\n        typeof protocol === \"string\" ? protocol : protocol.scheme;\n\n      if (nextProtocol) {\n        allowedProtocols.push(nextProtocol);\n      }\n    });\n  }\n\n  const ATTR_WHITESPACE =\n    // eslint-disable-next-line no-control-regex\n    /[\\u0000-\\u0020\\u00A0\\u1680\\u180E\\u2000-\\u2029\\u205F\\u3000]/g;\n\n  return (\n    !uri ||\n    uri.replace(ATTR_WHITESPACE, \"\").match(\n      new RegExp(\n        // eslint-disable-next-line no-useless-escape, regexp/no-obscure-range\n        `^(?:(?:${allowedProtocols.join(\"|\")}):|[^a-z]|[a-z0-9+.\\-]+(?:[^a-z+.\\-:]|$))`,\n        \"i\",\n      ),\n    )\n  );\n}\n"],"names":["LinkEditor","editor","hideWhenUnavailable","onSetLink","onOpenChange","autoOpenOnLinkActive","onClick","className","buttonProps","isOpen","setIsOpen","useState","canSet","isActive","url","setUrl","setLink","removeLink","openLink","useLinkPopover","handleOnOpenChange","useCallback","nextIsOpen","handleSetLink","handleRemoveLink","handleClick","event","handleIputKeyDown","useEffect","Popover","Toolbar","cn","IconLink","e","IconCornerDownLeft","IconExternalLink","IconLinkOff","config","isVisible","useLinkState","linkHandler","useLinkHandler","props","canSetLink","useEditorState","state","setIsVisible","handleSelectionUpdate","shouldShowLinkButton","isMarkInSchema","markName","href","updateLinkState","selection","isEmpty","chain","target","features","safeUrl","sanitizeUrl","inputUrl","baseUrl","protocols","isAllowedUri","uri","allowedProtocols","ATTR_WHITESPACE"],"mappings":"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"}
+{"version":3,"file":"LinkEditor.js","sources":["../../../../src/components/inputs/toolbar/LinkEditor.tsx"],"sourcesContent":["import type { Editor } from \"@tiptap/react\";\nimport {\n  IconCornerDownLeft,\n  IconExternalLink,\n  IconLink,\n  IconLinkOff,\n} from \"@tabler/icons-react\";\nimport { useEditorState } from \"@tiptap/react\";\nimport { Popover, Toolbar } from \"radix-ui\";\nimport { useCallback, useEffect, useState } from \"react\";\n\nimport { cn } from \"@/utils/cn\";\n\nexport interface LinkEditorProps\n  extends Omit<React.HTMLAttributes<HTMLButtonElement>, \"type\" | \"children\">,\n    UseLinkPopoverConfig {\n  /**\n   * Callback for when the popover opens or closes.\n   */\n  onOpenChange?: (isOpen: boolean) => void;\n  /**\n   * Whether to automatically open the popover when a link is active.\n   * @default true\n   */\n  autoOpenOnLinkActive?: boolean;\n}\n\nexport function LinkEditor({\n  editor,\n  hideWhenUnavailable = false,\n  onSetLink,\n  onOpenChange,\n  autoOpenOnLinkActive = true,\n  onClick,\n  className,\n  ...buttonProps\n}: LinkEditorProps) {\n  const [isOpen, setIsOpen] = useState(true);\n\n  const { canSet, isActive, url, setUrl, setLink, removeLink, openLink } =\n    useLinkPopover({\n      editor,\n      hideWhenUnavailable,\n      onSetLink,\n    });\n\n  const handleOnOpenChange = useCallback(\n    (nextIsOpen: boolean) => {\n      setIsOpen(nextIsOpen);\n      onOpenChange?.(nextIsOpen);\n    },\n    [onOpenChange],\n  );\n\n  const handleSetLink = useCallback(() => {\n    setLink();\n    setIsOpen(false);\n  }, [setLink]);\n\n  const handleRemoveLink = useCallback(() => {\n    removeLink();\n    setIsOpen(false);\n  }, [removeLink]);\n\n  const handleClick = useCallback(\n    (event: React.MouseEvent<HTMLButtonElement>) => {\n      onClick?.(event);\n      if (event.defaultPrevented) return;\n      setIsOpen(!isOpen);\n    },\n    [onClick, isOpen],\n  );\n\n  const handleIputKeyDown = (event: React.KeyboardEvent) => {\n    if (event.key === \"Enter\") {\n      event.preventDefault();\n      handleSetLink();\n    }\n  };\n\n  useEffect(() => {\n    if (autoOpenOnLinkActive && isActive) {\n      setIsOpen(true);\n    }\n  }, [autoOpenOnLinkActive, isActive]);\n\n  return (\n    <Popover.Root open={isOpen} onOpenChange={handleOnOpenChange}>\n      <Popover.Trigger asChild>\n        <Toolbar.Button\n          className={cn(className, {\n            \"bg-elevation-600 text-elevation-0\": isActive,\n          })}\n          disabled={!canSet}\n          onClick={handleClick}\n          aria-label=\"Link\"\n          {...buttonProps}\n        >\n          <IconLink size={16} />\n        </Toolbar.Button>\n      </Popover.Trigger>\n\n      <Popover.Content\n        className=\"z-50 rounded-md border border-border bg-elevation-100 p-2 shadow-md\"\n        sideOffset={8}\n        align=\"end\"\n      >\n        <Toolbar.Root className=\"flex items-center gap-2\">\n          <div className=\"flex items-center overflow-hidden rounded-md border border-border focus-within:border-elevation-600\">\n            <input\n              type=\"url\"\n              placeholder=\"Paste a link...\"\n              autoComplete=\"off\"\n              autoCorrect=\"off\"\n              autoCapitalize=\"off\"\n              value={url}\n              onChange={(e) => setUrl(e.target.value)}\n              onKeyDown={handleIputKeyDown}\n              className=\"h-10 flex-1 border-none bg-input px-2 py-1 focus:outline-none\"\n              aria-label=\"Link URL\"\n              style={{ minWidth: \"200px\" }}\n            />\n\n            <Toolbar.Button\n              type=\"button\"\n              title=\"Apply link\"\n              disabled={!url && !isActive}\n              className=\"flex size-10 items-center justify-center !rounded-none border-none bg-elevation-800 p-0 text-elevation-0 hover:bg-elevation-600 disabled:bg-transparent disabled:text-elevation-250\"\n              onClick={handleSetLink}\n            >\n              <IconCornerDownLeft size={16} />\n            </Toolbar.Button>\n          </div>\n\n          <Toolbar.Separator className=\"mx-1 h-10 w-px bg-border\" />\n\n          <Toolbar.Button\n            type=\"button\"\n            className=\"flex size-10 items-center justify-center rounded-md border-none bg-transparent p-0 hover:bg-elevation-250\"\n            title=\"Open in new window\"\n            disabled={!url && !isActive}\n            onClick={() => openLink()}\n          >\n            <IconExternalLink size={16} />\n          </Toolbar.Button>\n\n          <Toolbar.Button\n            type=\"button\"\n            title=\"Remove link\"\n            className=\"flex size-10 items-center justify-center rounded-md border-none bg-transparent p-0 hover:bg-elevation-250\"\n            disabled={!url && !isActive}\n            onClick={handleRemoveLink}\n          >\n            <IconLinkOff size={16} />\n          </Toolbar.Button>\n        </Toolbar.Root>\n      </Popover.Content>\n    </Popover.Root>\n  );\n}\n\n// TODO this was mostly copied from the tiptap starter template, pretty sure it can be simplified\n\n/**\n * Configuration for the link popover functionality\n */\nexport interface UseLinkPopoverConfig {\n  /**\n   * The Tiptap editor instance.\n   */\n  editor?: Editor | null;\n  /**\n   * Whether to hide the link popover when not available.\n   * @default false\n   */\n  hideWhenUnavailable?: boolean;\n  /**\n   * Callback function called when the link is set.\n   */\n  onSetLink?: () => void;\n}\n\n/**\n * Main hook that provides link popover functionality for Tiptap editor\n */\nfunction useLinkPopover(config?: UseLinkPopoverConfig) {\n  const { editor, hideWhenUnavailable = false, onSetLink } = config || {};\n\n  const { isVisible, canSet, isActive } = useLinkState({\n    editor: editor || null,\n    hideWhenUnavailable,\n  });\n\n  const linkHandler = useLinkHandler({\n    editor: editor || null,\n    onSetLink,\n  });\n\n  return {\n    isVisible,\n    canSet,\n    isActive,\n    ...linkHandler,\n  };\n}\n\nfunction useLinkState(props: {\n  editor: Editor | null;\n  hideWhenUnavailable: boolean;\n}) {\n  const { editor, hideWhenUnavailable = false } = props;\n\n  const canSet = canSetLink(editor);\n  const isActive =\n    useEditorState({\n      editor,\n      selector: (state) =>\n        state.editor?.isEditable && state?.editor?.isActive(\"link\"),\n    }) ?? false;\n\n  const [isVisible, setIsVisible] = useState(false);\n\n  useEffect(() => {\n    if (!editor) return;\n\n    const handleSelectionUpdate = () => {\n      setIsVisible(\n        shouldShowLinkButton({\n          editor,\n          hideWhenUnavailable,\n        }),\n      );\n    };\n\n    handleSelectionUpdate();\n\n    editor.on(\"selectionUpdate\", handleSelectionUpdate);\n\n    return () => {\n      editor.off(\"selectionUpdate\", handleSelectionUpdate);\n    };\n  }, [editor, hideWhenUnavailable]);\n\n  return {\n    isVisible,\n    canSet,\n    isActive,\n  };\n}\n\n/**\n * Checks if a link can be set in the current editor state\n */\nfunction canSetLink(editor: Editor | null): boolean {\n  if (!editor || !editor.isEditable) return false;\n  return editor.can().setMark(\"link\");\n}\n\n/**\n * Determines if the link button should be shown\n */\nfunction shouldShowLinkButton(props: {\n  editor: Editor | null;\n  hideWhenUnavailable: boolean;\n}): boolean {\n  const { editor, hideWhenUnavailable } = props;\n\n  const linkInSchema = isMarkInSchema(\"link\", editor);\n\n  if (!linkInSchema || !editor) {\n    return false;\n  }\n\n  if (hideWhenUnavailable && !editor.isActive(\"code\")) {\n    return canSetLink(editor);\n  }\n\n  return true;\n}\n\n/**\n * Checks if a mark exists in the editor schema\n */\nexport const isMarkInSchema = (\n  markName: string,\n  editor: Editor | null,\n): boolean => {\n  if (!editor?.schema) return false;\n  return editor.schema.spec.marks.get(markName) !== undefined;\n};\n\n/**\n * Configuration for the link handler functionality\n */\nexport interface LinkHandlerProps {\n  /**\n   * The Tiptap editor instance.\n   */\n  editor: Editor | null;\n  /**\n   * Callback function called when the link is set.\n   */\n  onSetLink?: () => void;\n}\n\n/**\n * Custom hook for handling link operations in a Tiptap editor\n */\nexport function useLinkHandler({ editor, onSetLink }: LinkHandlerProps) {\n  const [url, setUrl] = useState<string | null>(null);\n  const { isActive } = useLinkState({ editor, hideWhenUnavailable: false });\n\n  useEffect(() => {\n    if (!editor) return;\n\n    // Get URL immediately on mount\n    const { href } = editor.getAttributes(\"link\");\n\n    if (isActive && url === null) {\n      setUrl(href || \"\");\n    }\n  }, [editor, url, isActive]);\n\n  useEffect(() => {\n    if (!editor) return;\n\n    const updateLinkState = () => {\n      const { href } = editor.getAttributes(\"link\");\n      setUrl(href || \"\");\n    };\n\n    editor.on(\"selectionUpdate\", updateLinkState);\n    return () => {\n      editor.off(\"selectionUpdate\", updateLinkState);\n    };\n  }, [editor]);\n\n  const setLink = useCallback(() => {\n    if (!url || !editor) return;\n\n    const { selection } = editor.state;\n    const isEmpty = selection.empty;\n\n    let chain = editor.chain().focus();\n\n    chain = chain.extendMarkRange(\"link\").setLink({ href: url });\n\n    if (isEmpty) {\n      chain = chain.insertContent({ type: \"text\", text: url });\n    }\n\n    chain.run();\n\n    setUrl(null);\n\n    onSetLink?.();\n  }, [editor, onSetLink, url]);\n\n  const removeLink = useCallback(() => {\n    if (!editor) return;\n    editor\n      .chain()\n      .focus()\n      .extendMarkRange(\"link\")\n      .unsetLink()\n      .setMeta(\"preventAutolink\", true)\n      .run();\n    setUrl(\"\");\n  }, [editor]);\n\n  const openLink = useCallback(\n    (target: string = \"_blank\", features: string = \"noopener,noreferrer\") => {\n      if (!url) return;\n\n      const safeUrl = sanitizeUrl(url, window.location.href);\n      if (safeUrl !== \"#\") {\n        window.open(safeUrl, target, features);\n      }\n    },\n    [url],\n  );\n\n  return {\n    url: url || \"\",\n    setUrl,\n    setLink,\n    removeLink,\n    openLink,\n  };\n}\n\ntype ProtocolOptions = {\n  /**\n   * The protocol scheme to be registered.\n   * @default '''\n   * @example 'ftp'\n   * @example 'git'\n   */\n  scheme: string;\n\n  /**\n   * If enabled, it allows optional slashes after the protocol.\n   * @default false\n   * @example true\n   */\n  optionalSlashes?: boolean;\n};\n\ntype ProtocolConfig = Array<ProtocolOptions | string>;\n\nfunction sanitizeUrl(\n  inputUrl: string,\n  baseUrl: string,\n  protocols?: ProtocolConfig,\n): string {\n  try {\n    const url = new URL(inputUrl, baseUrl);\n\n    if (isAllowedUri(url.href, protocols)) {\n      return url.href;\n    }\n  } catch {\n    // If URL creation fails, it's considered invalid\n  }\n  return \"#\";\n}\n\nfunction isAllowedUri(uri: string | undefined, protocols?: ProtocolConfig) {\n  const allowedProtocols: string[] = [\n    \"http\",\n    \"https\",\n    \"ftp\",\n    \"ftps\",\n    \"mailto\",\n    \"tel\",\n    \"callto\",\n    \"sms\",\n    \"cid\",\n    \"xmpp\",\n  ];\n\n  if (protocols) {\n    protocols.forEach((protocol) => {\n      const nextProtocol =\n        typeof protocol === \"string\" ? protocol : protocol.scheme;\n\n      if (nextProtocol) {\n        allowedProtocols.push(nextProtocol);\n      }\n    });\n  }\n\n  const ATTR_WHITESPACE =\n    // eslint-disable-next-line no-control-regex\n    /[\\u0000-\\u0020\\u00A0\\u1680\\u180E\\u2000-\\u2029\\u205F\\u3000]/g;\n\n  return (\n    !uri ||\n    uri.replace(ATTR_WHITESPACE, \"\").match(\n      new RegExp(\n        // eslint-disable-next-line no-useless-escape, regexp/no-obscure-range\n        `^(?:(?:${allowedProtocols.join(\"|\")}):|[^a-z]|[a-z0-9+.\\-]+(?:[^a-z+.\\-:]|$))`,\n        \"i\",\n      ),\n    )\n  );\n}\n"],"names":["LinkEditor","editor","hideWhenUnavailable","onSetLink","onOpenChange","autoOpenOnLinkActive","onClick","className","buttonProps","isOpen","setIsOpen","useState","canSet","isActive","url","setUrl","setLink","removeLink","openLink","useLinkPopover","handleOnOpenChange","useCallback","nextIsOpen","handleSetLink","handleRemoveLink","handleClick","event","handleIputKeyDown","useEffect","Popover","jsx","Toolbar","cn","IconLink","jsxs","e","IconCornerDownLeft","IconExternalLink","IconLinkOff","config","isVisible","useLinkState","linkHandler","useLinkHandler","props","canSetLink","useEditorState","state","setIsVisible","handleSelectionUpdate","shouldShowLinkButton","isMarkInSchema","markName","href","updateLinkState","selection","isEmpty","chain","target","features","safeUrl","sanitizeUrl","inputUrl","baseUrl","protocols","isAllowedUri","uri","allowedProtocols","ATTR_WHITESPACE"],"mappings":"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"}

package/dist/components/inputs/toolbar/MarkControls.d.ts

@@ -2,4 +2,4 @@ import { Editor } from '@tiptap/react';
 export interface MarkControlsProps {
     editor: Editor | null;
 }
-export declare function MarkControls({ editor }: MarkControlsProps): import("react").JSX.Element;
+export declare function MarkControls({ editor }: MarkControlsProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/inputs/toolbar/MarkControls.js

@@ -1,47 +1,48 @@
-import { IconBold as r, IconItalic as c, IconStrikethrough as u, IconUnderline as s, IconHighlight as h } from "@tabler/icons-react";
-import { useEditorState as g } from "@tiptap/react";
-import { Toolbar as t } from "radix-ui";
-function b({ editor: l }) {
-  const n = g({
+import { jsx as t } from "react/jsx-runtime";
+import { IconBold as u, IconItalic as c, IconStrikethrough as s, IconUnderline as h, IconHighlight as g } from "@tabler/icons-react";
+import { useEditorState as d } from "@tiptap/react";
+import { Toolbar as n } from "radix-ui";
+function p({ editor: l }) {
+  const r = d({
     editor: l,
     selector: (e) => {
       const i = new Array();
       return e.editor?.isActive("bold") && i.push("bold"), e.editor?.isActive("italic") && i.push("italic"), e.editor?.isActive("strike") && i.push("strikethrough"), e.editor?.isActive("underline") && i.push("underline"), e.editor?.isActive("highlight") && i.push("highlight"), i;
     }
-  }), o = (e) => {
+  }), a = (e) => {
     if (l)
-      for (const i of a)
+      for (const i of o)
         e.includes(i.value) ? l.chain().focus().setMark(i.value).run() : l.chain().focus().unsetMark(i.value).run();
   };
-  return /* @__PURE__ */ React.createElement(
-    t.ToggleGroup,
+  return /* @__PURE__ */ t(
+    n.ToggleGroup,
     {
       type: "multiple",
       className: "flex items-center gap-0.5",
       "aria-label": "Text formatting",
-      value: n ?? [],
-      onValueChange: o
-    },
-    a.map((e) => /* @__PURE__ */ React.createElement(
-      t.ToggleItem,
-      {
-        key: e.value,
-        className: "inline-flex h-7 flex-shrink-0 flex-grow-0 basis-auto cursor-pointer items-center justify-center rounded border-none bg-transparent px-2 leading-none hover:bg-elevation-250 focus:relative focus:outline data-[state=on]:bg-elevation-600 data-[state=on]:text-elevation-0",
-        value: e.value,
-        "aria-label": e.label
-      },
-      /* @__PURE__ */ React.createElement(e.icon, { size: 16 })
-    ))
+      value: r ?? [],
+      onValueChange: a,
+      children: o.map((e) => /* @__PURE__ */ t(
+        n.ToggleItem,
+        {
+          className: "inline-flex h-7 flex-shrink-0 flex-grow-0 basis-auto cursor-pointer items-center justify-center rounded border-none bg-transparent px-2 leading-none hover:bg-elevation-250 focus:relative focus:outline data-[state=on]:bg-elevation-600 data-[state=on]:text-elevation-0",
+          value: e.value,
+          "aria-label": e.label,
+          children: /* @__PURE__ */ t(e.icon, { size: 16 })
+        },
+        e.value
+      ))
+    }
   );
 }
-const a = [
-  { value: "bold", label: "Bold", icon: r },
+const o = [
+  { value: "bold", label: "Bold", icon: u },
   { value: "italic", label: "Italic", icon: c },
-  { value: "strike", label: "Strikethrough", icon: u },
-  { value: "underline", label: "Underline", icon: s },
-  { value: "highlight", label: "Highlight", icon: h }
+  { value: "strike", label: "Strikethrough", icon: s },
+  { value: "underline", label: "Underline", icon: h },
+  { value: "highlight", label: "Highlight", icon: g }
 ];
 export {
-  b as MarkControls
+  p as MarkControls
 };
 //# sourceMappingURL=MarkControls.js.map

package/dist/components/inputs/toolbar/MarkControls.js.map

@@ -1 +1 @@
-{"version":3,"file":"MarkControls.js","sources":["../../../../src/components/inputs/toolbar/MarkControls.tsx"],"sourcesContent":["import type { IconProps } from \"@tabler/icons-react\";\nimport type { Editor } from \"@tiptap/react\";\nimport {\n  IconBold,\n  IconHighlight,\n  IconItalic,\n  IconStrikethrough,\n  IconUnderline,\n} from \"@tabler/icons-react\";\nimport { useEditorState } from \"@tiptap/react\";\nimport { Toolbar } from \"radix-ui\";\n\nexport interface MarkControlsProps {\n  editor: Editor | null;\n}\n\nexport function MarkControls({ editor }: MarkControlsProps) {\n  const value = useEditorState<string[]>({\n    editor,\n    selector: (state) => {\n      const selected = new Array<string>();\n\n      if (state.editor?.isActive(\"bold\")) selected.push(\"bold\");\n      if (state.editor?.isActive(\"italic\")) selected.push(\"italic\");\n      if (state.editor?.isActive(\"strike\")) selected.push(\"strikethrough\");\n      if (state.editor?.isActive(\"underline\")) selected.push(\"underline\");\n      if (state.editor?.isActive(\"highlight\")) selected.push(\"highlight\");\n      return selected;\n    },\n  });\n\n  const handleChange = (value: string[]) => {\n    if (!editor) return;\n    for (const option of FORMAT_OPTIONS) {\n      if (value.includes(option.value)) {\n        editor.chain().focus().setMark(option.value).run();\n      } else {\n        editor.chain().focus().unsetMark(option.value).run();\n      }\n    }\n  };\n\n  return (\n    <Toolbar.ToggleGroup\n      type=\"multiple\"\n      className=\"flex items-center gap-0.5\"\n      aria-label=\"Text formatting\"\n      value={value ?? []}\n      onValueChange={handleChange}\n    >\n      {FORMAT_OPTIONS.map((option) => (\n        <Toolbar.ToggleItem\n          key={option.value}\n          className=\"inline-flex h-7 flex-shrink-0 flex-grow-0 basis-auto cursor-pointer items-center justify-center rounded border-none bg-transparent px-2 leading-none hover:bg-elevation-250 focus:relative focus:outline data-[state=on]:bg-elevation-600 data-[state=on]:text-elevation-0\"\n          value={option.value}\n          aria-label={option.label}\n        >\n          <option.icon size={16} />\n        </Toolbar.ToggleItem>\n      ))}\n    </Toolbar.ToggleGroup>\n  );\n}\n\n// MARK: Options\n\ntype FormatType = \"bold\" | \"italic\" | \"strike\" | \"underline\" | \"highlight\";\nconst FORMAT_OPTIONS: {\n  value: FormatType;\n  label: string;\n  icon: React.FunctionComponent<IconProps>;\n}[] = [\n  { value: \"bold\", label: \"Bold\", icon: IconBold },\n  { value: \"italic\", label: \"Italic\", icon: IconItalic },\n  { value: \"strike\", label: \"Strikethrough\", icon: IconStrikethrough },\n  { value: \"underline\", label: \"Underline\", icon: IconUnderline },\n  { value: \"highlight\", label: \"Highlight\", icon: IconHighlight },\n];\n"],"names":["MarkControls","editor","value","useEditorState","state","selected","handleChange","option","FORMAT_OPTIONS","Toolbar","IconBold","IconItalic","IconStrikethrough","IconUnderline","IconHighlight"],"mappings":";;;AAgBO,SAASA,EAAa,EAAE,QAAAC,KAA6B;AAC1D,QAAMC,IAAQC,EAAyB;AAAA,IACrC,QAAAF;AAAA,IACA,UAAU,CAACG,MAAU;AACnB,YAAMC,IAAW,IAAI,MAAA;AAErB,aAAID,EAAM,QAAQ,SAAS,MAAM,KAAGC,EAAS,KAAK,MAAM,GACpDD,EAAM,QAAQ,SAAS,QAAQ,KAAGC,EAAS,KAAK,QAAQ,GACxDD,EAAM,QAAQ,SAAS,QAAQ,KAAGC,EAAS,KAAK,eAAe,GAC/DD,EAAM,QAAQ,SAAS,WAAW,KAAGC,EAAS,KAAK,WAAW,GAC9DD,EAAM,QAAQ,SAAS,WAAW,KAAGC,EAAS,KAAK,WAAW,GAC3DA;AAAA,IACT;AAAA,EAAA,CACD,GAEKC,IAAe,CAACJ,MAAoB;AACxC,QAAKD;AACL,iBAAWM,KAAUC;AACnB,QAAIN,EAAM,SAASK,EAAO,KAAK,IAC7BN,EAAO,MAAA,EAAQ,MAAA,EAAQ,QAAQM,EAAO,KAAK,EAAE,IAAA,IAE7CN,EAAO,MAAA,EAAQ,MAAA,EAAQ,UAAUM,EAAO,KAAK,EAAE,IAAA;AAAA,EAGrD;AAEA,SACE,sBAAA;AAAA,IAACE,EAAQ;AAAA,IAAR;AAAA,MACC,MAAK;AAAA,MACL,WAAU;AAAA,MACV,cAAW;AAAA,MACX,OAAOP,KAAS,CAAA;AAAA,MAChB,eAAeI;AAAA,IAAA;AAAA,IAEdE,EAAe,IAAI,CAACD,MACnB,sBAAA;AAAA,MAACE,EAAQ;AAAA,MAAR;AAAA,QACC,KAAKF,EAAO;AAAA,QACZ,WAAU;AAAA,QACV,OAAOA,EAAO;AAAA,QACd,cAAYA,EAAO;AAAA,MAAA;AAAA,MAEnB,sBAAA,cAACA,EAAO,MAAP,EAAY,MAAM,GAAA,CAAI;AAAA,IAAA,CAE1B;AAAA,EAAA;AAGP;AAKA,MAAMC,IAIA;AAAA,EACJ,EAAE,OAAO,QAAQ,OAAO,QAAQ,MAAME,EAAA;AAAA,EACtC,EAAE,OAAO,UAAU,OAAO,UAAU,MAAMC,EAAA;AAAA,EAC1C,EAAE,OAAO,UAAU,OAAO,iBAAiB,MAAMC,EAAA;AAAA,EACjD,EAAE,OAAO,aAAa,OAAO,aAAa,MAAMC,EAAA;AAAA,EAChD,EAAE,OAAO,aAAa,OAAO,aAAa,MAAMC,EAAA;AAClD;"}
+{"version":3,"file":"MarkControls.js","sources":["../../../../src/components/inputs/toolbar/MarkControls.tsx"],"sourcesContent":["import type { IconProps } from \"@tabler/icons-react\";\nimport type { Editor } from \"@tiptap/react\";\nimport {\n  IconBold,\n  IconHighlight,\n  IconItalic,\n  IconStrikethrough,\n  IconUnderline,\n} from \"@tabler/icons-react\";\nimport { useEditorState } from \"@tiptap/react\";\nimport { Toolbar } from \"radix-ui\";\n\nexport interface MarkControlsProps {\n  editor: Editor | null;\n}\n\nexport function MarkControls({ editor }: MarkControlsProps) {\n  const value = useEditorState<string[]>({\n    editor,\n    selector: (state) => {\n      const selected = new Array<string>();\n\n      if (state.editor?.isActive(\"bold\")) selected.push(\"bold\");\n      if (state.editor?.isActive(\"italic\")) selected.push(\"italic\");\n      if (state.editor?.isActive(\"strike\")) selected.push(\"strikethrough\");\n      if (state.editor?.isActive(\"underline\")) selected.push(\"underline\");\n      if (state.editor?.isActive(\"highlight\")) selected.push(\"highlight\");\n      return selected;\n    },\n  });\n\n  const handleChange = (value: string[]) => {\n    if (!editor) return;\n    for (const option of FORMAT_OPTIONS) {\n      if (value.includes(option.value)) {\n        editor.chain().focus().setMark(option.value).run();\n      } else {\n        editor.chain().focus().unsetMark(option.value).run();\n      }\n    }\n  };\n\n  return (\n    <Toolbar.ToggleGroup\n      type=\"multiple\"\n      className=\"flex items-center gap-0.5\"\n      aria-label=\"Text formatting\"\n      value={value ?? []}\n      onValueChange={handleChange}\n    >\n      {FORMAT_OPTIONS.map((option) => (\n        <Toolbar.ToggleItem\n          key={option.value}\n          className=\"inline-flex h-7 flex-shrink-0 flex-grow-0 basis-auto cursor-pointer items-center justify-center rounded border-none bg-transparent px-2 leading-none hover:bg-elevation-250 focus:relative focus:outline data-[state=on]:bg-elevation-600 data-[state=on]:text-elevation-0\"\n          value={option.value}\n          aria-label={option.label}\n        >\n          <option.icon size={16} />\n        </Toolbar.ToggleItem>\n      ))}\n    </Toolbar.ToggleGroup>\n  );\n}\n\n// MARK: Options\n\ntype FormatType = \"bold\" | \"italic\" | \"strike\" | \"underline\" | \"highlight\";\nconst FORMAT_OPTIONS: {\n  value: FormatType;\n  label: string;\n  icon: React.FunctionComponent<IconProps>;\n}[] = [\n  { value: \"bold\", label: \"Bold\", icon: IconBold },\n  { value: \"italic\", label: \"Italic\", icon: IconItalic },\n  { value: \"strike\", label: \"Strikethrough\", icon: IconStrikethrough },\n  { value: \"underline\", label: \"Underline\", icon: IconUnderline },\n  { value: \"highlight\", label: \"Highlight\", icon: IconHighlight },\n];\n"],"names":["MarkControls","editor","value","useEditorState","state","selected","handleChange","option","FORMAT_OPTIONS","jsx","Toolbar","IconBold","IconItalic","IconStrikethrough","IconUnderline","IconHighlight"],"mappings":";;;;AAgBO,SAASA,EAAa,EAAE,QAAAC,KAA6B;AAC1D,QAAMC,IAAQC,EAAyB;AAAA,IACrC,QAAAF;AAAA,IACA,UAAU,CAACG,MAAU;AACnB,YAAMC,IAAW,IAAI,MAAA;AAErB,aAAID,EAAM,QAAQ,SAAS,MAAM,KAAGC,EAAS,KAAK,MAAM,GACpDD,EAAM,QAAQ,SAAS,QAAQ,KAAGC,EAAS,KAAK,QAAQ,GACxDD,EAAM,QAAQ,SAAS,QAAQ,KAAGC,EAAS,KAAK,eAAe,GAC/DD,EAAM,QAAQ,SAAS,WAAW,KAAGC,EAAS,KAAK,WAAW,GAC9DD,EAAM,QAAQ,SAAS,WAAW,KAAGC,EAAS,KAAK,WAAW,GAC3DA;AAAA,IACT;AAAA,EAAA,CACD,GAEKC,IAAe,CAACJ,MAAoB;AACxC,QAAKD;AACL,iBAAWM,KAAUC;AACnB,QAAIN,EAAM,SAASK,EAAO,KAAK,IAC7BN,EAAO,MAAA,EAAQ,MAAA,EAAQ,QAAQM,EAAO,KAAK,EAAE,IAAA,IAE7CN,EAAO,MAAA,EAAQ,MAAA,EAAQ,UAAUM,EAAO,KAAK,EAAE,IAAA;AAAA,EAGrD;AAEA,SACE,gBAAAE;AAAA,IAACC,EAAQ;AAAA,IAAR;AAAA,MACC,MAAK;AAAA,MACL,WAAU;AAAA,MACV,cAAW;AAAA,MACX,OAAOR,KAAS,CAAA;AAAA,MAChB,eAAeI;AAAA,MAEd,UAAAE,EAAe,IAAI,CAACD,MACnB,gBAAAE;AAAA,QAACC,EAAQ;AAAA,QAAR;AAAA,UAEC,WAAU;AAAA,UACV,OAAOH,EAAO;AAAA,UACd,cAAYA,EAAO;AAAA,UAEnB,UAAA,gBAAAE,EAACF,EAAO,MAAP,EAAY,MAAM,GAAA,CAAI;AAAA,QAAA;AAAA,QALlBA,EAAO;AAAA,MAAA,CAOf;AAAA,IAAA;AAAA,EAAA;AAGP;AAKA,MAAMC,IAIA;AAAA,EACJ,EAAE,OAAO,QAAQ,OAAO,QAAQ,MAAMG,EAAA;AAAA,EACtC,EAAE,OAAO,UAAU,OAAO,UAAU,MAAMC,EAAA;AAAA,EAC1C,EAAE,OAAO,UAAU,OAAO,iBAAiB,MAAMC,EAAA;AAAA,EACjD,EAAE,OAAO,aAAa,OAAO,aAAa,MAAMC,EAAA;AAAA,EAChD,EAAE,OAAO,aAAa,OAAO,aAAa,MAAMC,EAAA;AAClD;"}

package/dist/components/inputs/toolbar/RichTextToolbar.d.ts

@@ -3,4 +3,4 @@ export interface RichTextToolbarProps {
     editor: Editor | null;
     className?: string;
 }
-export declare function RichTextToolbar({ editor, className }: RichTextToolbarProps): import("react").JSX.Element;
+export declare function RichTextToolbar({ editor, className }: RichTextToolbarProps): import("react/jsx-runtime").JSX.Element;