ritext 1.0.15 → 1.0.19

package/dist/extension/history.mjs

@@ -0,0 +1,126 @@
+import {
+  ButtonWithoutActive_default
+} from "../chunk-D47XME55.mjs";
+import "../chunk-7QOFJIQ3.mjs";
+import {
+  __objRest,
+  __spreadProps,
+  __spreadValues
+} from "../chunk-FWCSY2DS.mjs";
+
+// src/extension/History.tsx
+import { Fragment } from "react";
+import { UndoRedo } from "@tiptap/extensions";
+import { useEditorState } from "@tiptap/react";
+
+// src/lib/icon/HistoryIcon.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var Redo2 = (_a) => {
+  var _b = _a, { size = 17, className } = _b, props = __objRest(_b, ["size", "className"]);
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    __spreadProps(__spreadValues({
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: 2,
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      width: size,
+      height: size,
+      className
+    }, props), {
+      children: [
+        /* @__PURE__ */ jsx("path", { d: "m15 14 5-5-5-5" }),
+        /* @__PURE__ */ jsx("path", { d: "M20 9H9.5A5.5 5.5 0 0 0 4 14.5A5.5 5.5 0 0 0 9.5 20H13" })
+      ]
+    })
+  );
+};
+var Undo2 = (_a) => {
+  var _b = _a, { size = 17, className } = _b, props = __objRest(_b, ["size", "className"]);
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    __spreadProps(__spreadValues({
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      width: size,
+      height: size,
+      className
+    }, props), {
+      children: [
+        /* @__PURE__ */ jsx("path", { d: "M9 14 4 9l5-5" }),
+        /* @__PURE__ */ jsx("path", { d: "M4 9h10.5a5.5 5.5 0 0 1 5.5 5.5a5.5 5.5 0 0 1-5.5 5.5H11" })
+      ]
+    })
+  );
+};
+
+// src/extension/History.tsx
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+function HistoryButtons({
+  editor,
+  options,
+  buttonClassName
+}) {
+  const { canUndo, canRedo } = useEditorState({
+    editor,
+    selector: (ctx) => ({
+      canUndo: ctx.editor.can().chain().focus().undo().run(),
+      canRedo: ctx.editor.can().chain().focus().redo().run()
+    })
+  });
+  return /* @__PURE__ */ jsxs2(Fragment, { children: [
+    /* @__PURE__ */ jsx2(
+      ButtonWithoutActive_default,
+      {
+        className: options.className,
+        icon: options.icon,
+        style: options.style,
+        tooltip: options.tooltip,
+        tooltipClassName: options.tooltipClassName,
+        tooltipPlacement: options.tooltipPlacement,
+        _internalIcon: /* @__PURE__ */ jsx2(Undo2, {}),
+        _onToggle: () => editor.chain().focus().undo().run(),
+        _interShortcut: "\u2318 + Z",
+        _tooltipContent: "Undo",
+        _disabled: !canUndo,
+        _buttonClassName: buttonClassName
+      }
+    ),
+    /* @__PURE__ */ jsx2(
+      ButtonWithoutActive_default,
+      {
+        className: options.className,
+        icon: options.icon,
+        style: options.style,
+        tooltip: options.tooltip,
+        tooltipClassName: options.tooltipClassName,
+        tooltipPlacement: options.tooltipPlacement,
+        _internalIcon: /* @__PURE__ */ jsx2(Redo2, {}),
+        _onToggle: () => editor.chain().focus().redo().run(),
+        _interShortcut: "\u21E7 + \u2318 + Z",
+        _tooltipContent: "Redo",
+        _disabled: !canRedo,
+        _buttonClassName: buttonClassName
+      }
+    )
+  ] });
+}
+var History = UndoRedo.extend({
+  addOptions() {
+    var _a;
+    return __spreadProps(__spreadValues({}, (_a = this.parent) == null ? void 0 : _a.call(this)), {
+      component: ({ editor, options, buttonClassName }) => /* @__PURE__ */ jsx2(HistoryButtons, { editor, options, buttonClassName })
+    });
+  }
+});
+export {
+  History
+};

package/dist/extension/italic.d.mts

@@ -1,5 +1,5 @@
 import { Mark } from '@tiptap/react';
-import { E as ExtButtonOptions } from '../tiptap-ext.type-D61hoEX5.mjs';
+import { E as ExtButtonOptions } from '../tiptap-ext.type-DrneAC5G.mjs';
 import 'react';
 import '@floating-ui/react';
 

package/dist/extension/italic.d.ts

@@ -1,5 +1,5 @@
 import { Mark } from '@tiptap/react';
-import { E as ExtButtonOptions } from '../tiptap-ext.type-D61hoEX5.js';
+import { E as ExtButtonOptions } from '../tiptap-ext.type-DrneAC5G.js';
 import 'react';
 import '@floating-ui/react';
 

package/dist/extension/italic.js

@@ -206,7 +206,7 @@ var ButtonComponent = ({ className, activeClassName, icon, style, tooltip = true
     {
       onClick: _onToggle,
       className: (0, import_tailwind_merge2.twMerge)(
-        "p-1.5 rounded-md",
+        "py-1.5 px-2.5 rounded-md",
         _buttonClassName,
         (editorState == null ? void 0 : editorState.isActive) ? "bg-gray-200/60" : "hover:bg-gray-100",
         className,

package/dist/extension/italic.mjs

@@ -1,12 +1,13 @@
 import {
   ButtonComponent_default
-} from "../chunk-CU67RXD7.mjs";
-import "../chunk-ZLCVIW2P.mjs";
+} from "../chunk-GSHINFPO.mjs";
+import "../chunk-7QOFJIQ3.mjs";
+import "../chunk-VYDH6BZE.mjs";
 import {
   __objRest,
   __spreadProps,
   __spreadValues
-} from "../chunk-TQTCTY3E.mjs";
+} from "../chunk-FWCSY2DS.mjs";
 
 // src/extension/Italic.tsx
 import TiptapItalic from "@tiptap/extension-italic";

package/dist/extension/strike.d.mts

@@ -1,5 +1,5 @@
 import { Mark } from '@tiptap/react';
-import { E as ExtButtonOptions } from '../tiptap-ext.type-D61hoEX5.mjs';
+import { E as ExtButtonOptions } from '../tiptap-ext.type-DrneAC5G.mjs';
 import 'react';
 import '@floating-ui/react';
 

package/dist/extension/strike.d.ts

@@ -1,5 +1,5 @@
 import { Mark } from '@tiptap/react';
-import { E as ExtButtonOptions } from '../tiptap-ext.type-D61hoEX5.js';
+import { E as ExtButtonOptions } from '../tiptap-ext.type-DrneAC5G.js';
 import 'react';
 import '@floating-ui/react';
 

package/dist/extension/strike.js

@@ -206,7 +206,7 @@ var ButtonComponent = ({ className, activeClassName, icon, style, tooltip = true
     {
       onClick: _onToggle,
       className: (0, import_tailwind_merge2.twMerge)(
-        "p-1.5 rounded-md",
+        "py-1.5 px-2.5 rounded-md",
         _buttonClassName,
         (editorState == null ? void 0 : editorState.isActive) ? "bg-gray-200/60" : "hover:bg-gray-100",
         className,

package/dist/extension/strike.mjs

@@ -1,12 +1,13 @@
 import {
   ButtonComponent_default
-} from "../chunk-CU67RXD7.mjs";
-import "../chunk-ZLCVIW2P.mjs";
+} from "../chunk-GSHINFPO.mjs";
+import "../chunk-7QOFJIQ3.mjs";
+import "../chunk-VYDH6BZE.mjs";
 import {
   __objRest,
   __spreadProps,
   __spreadValues
-} from "../chunk-TQTCTY3E.mjs";
+} from "../chunk-FWCSY2DS.mjs";
 
 // src/extension/Strike.tsx
 import TiptapStrike from "@tiptap/extension-strike";

package/dist/extension/subandsuperscript.d.mts

@@ -1,6 +1,6 @@
 import { ReactNode } from 'react';
 import { Extension, Editor } from '@tiptap/react';
-import { a as ExtDropdownOptions } from '../tiptap-ext.type-D61hoEX5.mjs';
+import { a as ExtDropdownOptions } from '../tiptap-ext.type-DrneAC5G.mjs';
 import '@floating-ui/react';
 
 interface ExtSubAndSupOptions extends ExtDropdownOptions {

package/dist/extension/subandsuperscript.d.ts

@@ -1,6 +1,6 @@
 import { ReactNode } from 'react';
 import { Extension, Editor } from '@tiptap/react';
-import { a as ExtDropdownOptions } from '../tiptap-ext.type-D61hoEX5.js';
+import { a as ExtDropdownOptions } from '../tiptap-ext.type-DrneAC5G.js';
 import '@floating-ui/react';
 
 interface ExtSubAndSupOptions extends ExtDropdownOptions {

package/dist/extension/subandsuperscript.js

@@ -300,13 +300,13 @@ var DropdownComponent = ({ children, className, showArrow = true, content, dropd
       "aria-controls": open ? listId : void 0
     })), {
       className: (0, import_tailwind_merge2.twMerge)(
-        "p-1.5 rounded-md hover:bg-gray-100 flex gap-x-px",
+        "p-1.5 rounded-md hover:bg-gray-100 items-center flex gap-x-0.5",
         className
       ),
       style,
       children: [
         /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { children: content != null ? content : _internalContent }),
-        showArrow && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(ArrowIcon_default, { size: 14, className: "text-gray-500 block mt-0.5" })
+        showArrow && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(ArrowIcon_default, { size: 14, className: "text-gray-500 block" })
       ]
     })
   );
@@ -335,7 +335,7 @@ var DropdownComponent = ({ children, className, showArrow = true, content, dropd
         initial: initialMotion,
         animate: animateMotion,
         exit: initialMotion,
-        className: (0, import_tailwind_merge2.twMerge)("bg-white border border-solid border-gray-200 p-2 space-y-1 rounded-lg shadow-sm shadow-gray-200/40", _dropdownClassName, dropdownClassName),
+        className: (0, import_tailwind_merge2.twMerge)("bg-white border border-solid border-gray-200 p-2 space-y-1 rounded-lg shadow-sm shadow-gray-200/40 max-h-125 overflow-auto", _dropdownClassName, dropdownClassName),
         children: enhancedChildren
       })
     ) }) })
@@ -359,11 +359,11 @@ var useEditor = () => {
 // src/lib/components/DropdownItemComponent.tsx
 var import_react8 = require("@tiptap/react");
 var import_jsx_runtime8 = require("react/jsx-runtime");
-var DropdownItemComponent = ({ item, onSelect, activeClassName, itemClassName, _itemClassName }) => {
+var DropdownItemComponent = ({ item, onSelect, activeClassName, itemClassName, _itemClassName, showKeyShortcutText = true, spClass }) => {
   const { editor } = useEditor();
   const editorState = (0, import_react8.useEditorState)({
     editor,
-    selector: ({ editor: editor2 }) => ({ isActive: (editor2 == null ? void 0 : editor2.isActive(item.id)) || false })
+    selector: ({ editor: editor2 }) => ({ isActive: (editor2 == null ? void 0 : editor2.isActive(item.name, item.ext ? { level: item.ext } : void 0)) || false })
   });
   return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: (0, import_tailwind_merge3.twMerge)(
     "flex items-center gap-x-2.5 transition-all duration-100 cursor-pointer select-none px-2 py-1.5 rounded-md",
@@ -373,8 +373,8 @@ var DropdownItemComponent = ({ item, onSelect, activeClassName, itemClassName, _
     (editorState == null ? void 0 : editorState.isActive) ? activeClassName : "hover:bg-gray-100"
   ), onClick: onSelect, children: [
     item.icon,
-    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "flex-1", children: item.text }),
-    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "ml-6 text-gray-400", children: item.keyBind })
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: (0, import_tailwind_merge3.twMerge)("flex-1 text-base", spClass), style: item.style, children: item.text }),
+    showKeyShortcutText && item.keyBind && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "ml-6 text-gray-400", children: item.keyBind })
   ] });
 };
 var DropdownItemComponent_default = DropdownItemComponent;
@@ -387,19 +387,28 @@ var SubAndSuperscript = import_react9.Extension.create({
     var _a;
     return __spreadProps(__spreadValues({}, (_a = this.parent) == null ? void 0 : _a.call(this)), {
       component: ({ options, editor, dropdownContainerClassName, dropdownItemClassName }) => {
-        const list = [{
-          icon: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(SubIcon_default, {}),
-          text: "Subscript",
-          onClick: () => editor.chain().focus().toggleSubscript().run(),
-          keyBind: "\u2318 .",
-          id: "subscript"
-        }, {
-          icon: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(SupIcon_default, {}),
-          text: "Superscript",
-          onClick: () => editor.chain().focus().toggleSuperscript().run(),
-          keyBind: "\u2318 ,",
-          id: "superscript"
-        }];
+        var _a2, _b;
+        const list = [];
+        if (options.subscript !== false) {
+          list.push({
+            id: crypto.randomUUID(),
+            icon: (_a2 = options.subscriptIcon) != null ? _a2 : /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(SubIcon_default, {}),
+            text: typeof options.subscript === "string" ? options.subscript : "Subscript",
+            onClick: () => editor.chain().focus().toggleSubscript().run(),
+            keyBind: "\u2318 .",
+            name: "subscript"
+          });
+        }
+        if (options.superscript !== false) {
+          list.push({
+            id: crypto.randomUUID(),
+            icon: (_b = options.superscriptIcon) != null ? _b : /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(SupIcon_default, {}),
+            text: typeof options.superscript === "string" ? options.superscript : "Superscript",
+            onClick: () => editor.chain().focus().toggleSuperscript().run(),
+            keyBind: "\u2318 ,",
+            name: "superscript"
+          });
+        }
         return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
           DropdownComponent_default,
           {
@@ -411,7 +420,7 @@ var SubAndSuperscript = import_react9.Extension.create({
             tooltip: options.tooltip,
             tooltipClassName: options.tooltipClassName,
             tooltipPlacement: options.tooltipPlacement,
-            _tooltipContent: "More text styles",
+            _tooltipContent: "Sub & Superscript",
             _internalContent: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(SubAndSupIcon_default, {}),
             _dropdownClassName: dropdownContainerClassName,
             children: list.map((item) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(

package/dist/extension/subandsuperscript.mjs

@@ -1,18 +1,20 @@
+import {
+  DropdownComponent_default,
+  DropdownItemComponent_default
+} from "../chunk-2YUUKIIT.mjs";
 import {
   SubIcon_default
-} from "../chunk-LO4RJXQF.mjs";
+} from "../chunk-MBF77NHS.mjs";
 import {
   SupIcon_default
-} from "../chunk-E4PPKAVK.mjs";
-import {
-  Tooltip_default
-} from "../chunk-ZLCVIW2P.mjs";
+} from "../chunk-LMOTHRGQ.mjs";
+import "../chunk-7QOFJIQ3.mjs";
+import "../chunk-VYDH6BZE.mjs";
 import {
   __objRest,
   __spreadProps,
-  __spreadValues,
-  useEditor
-} from "../chunk-TQTCTY3E.mjs";
+  __spreadValues
+} from "../chunk-FWCSY2DS.mjs";
 
 // src/extension/SubAndSuperscript.tsx
 import { Extension } from "@tiptap/react";
@@ -47,161 +49,37 @@ var SubAndSupIcon = (_a) => {
 };
 var SubAndSupIcon_default = SubAndSupIcon;
 
-// src/lib/components/DropdownComponent.tsx
-import { useState, Fragment, useId, Children, isValidElement, cloneElement } from "react";
-import { twMerge } from "tailwind-merge";
-import { useFloating, offset, flip, shift, autoUpdate, useInteractions, useClick, useDismiss, FloatingPortal } from "@floating-ui/react";
-
-// src/lib/icon/ArrowIcon.tsx
-import { jsx as jsx2 } from "react/jsx-runtime";
-var ArrowIcon = (_a) => {
-  var _b = _a, { size = 17, className } = _b, props = __objRest(_b, ["size", "className"]);
-  return /* @__PURE__ */ jsx2(
-    "svg",
-    __spreadProps(__spreadValues({
-      xmlns: "http://www.w3.org/2000/svg",
-      viewBox: "0 0 48 48",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: 2,
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      width: size,
-      height: size,
-      className
-    }, props), {
-      children: /* @__PURE__ */ jsx2("path", { fill: "currentColor", stroke: "currentColor", strokeLinejoin: "round", strokeWidth: "4", d: "M36 19L24 31L12 19z" })
-    })
-  );
-};
-var ArrowIcon_default = ArrowIcon;
-
-// src/lib/components/DropdownComponent.tsx
-import { AnimatePresence, motion } from "motion/react";
-import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
-var DropdownComponent = ({ children, className, showArrow = true, content, dropdownClassName, style, tooltip, tooltipClassName, tooltipPlacement, _tooltipContent, _internalContent, _dropdownClassName }) => {
-  const [open, setOpen] = useState(false);
-  const { x, y, refs, strategy, context } = useFloating({
-    open,
-    onOpenChange: setOpen,
-    placement: "bottom",
-    middleware: [offset(4), flip(), shift({ padding: 8 })],
-    whileElementsMounted: autoUpdate
-  });
-  const click = useClick(context);
-  const dismiss = useDismiss(context);
-  const { getReferenceProps, getFloatingProps } = useInteractions([click, dismiss]);
-  const listId = useId();
-  const tooltipContent = /* @__PURE__ */ jsx3("p", { children: typeof tooltip === "string" ? tooltip : _tooltipContent });
-  const initialMotion = { opacity: 0, scale: 0.95 };
-  const animateMotion = { opacity: 1, scale: 1 };
-  const enhancedChildren = Children.map(children, (child) => {
-    if (!isValidElement(child)) return child;
-    if (!("onSelect" in child.props)) return child;
-    const prevOnSelect = child.props.onSelect;
-    const combinedOnSelect = () => {
-      prevOnSelect == null ? void 0 : prevOnSelect();
-      setOpen(false);
-    };
-    return cloneElement(child, { onSelect: combinedOnSelect });
-  });
-  const btn = /* @__PURE__ */ jsxs2(
-    "button",
-    __spreadProps(__spreadValues({}, getReferenceProps({
-      ref: refs.setReference,
-      type: "button",
-      "aria-controls": open ? listId : void 0
-    })), {
-      className: twMerge(
-        "p-1.5 rounded-md hover:bg-gray-100 flex gap-x-px",
-        className
-      ),
-      style,
-      children: [
-        /* @__PURE__ */ jsx3("span", { children: content != null ? content : _internalContent }),
-        showArrow && /* @__PURE__ */ jsx3(ArrowIcon_default, { size: 14, className: "text-gray-500 block mt-0.5" })
-      ]
-    })
-  );
-  return /* @__PURE__ */ jsxs2(Fragment, { children: [
-    tooltip === false ? btn : /* @__PURE__ */ jsx3(
-      Tooltip_default,
-      {
-        content: tooltipContent,
-        className: tooltipClassName,
-        placement: tooltipPlacement,
-        children: btn
-      }
-    ),
-    /* @__PURE__ */ jsx3(FloatingPortal, { children: /* @__PURE__ */ jsx3(AnimatePresence, { children: open && /* @__PURE__ */ jsx3(
-      motion.div,
-      __spreadProps(__spreadValues({}, getFloatingProps({
-        ref: refs.setFloating,
-        style: {
-          position: strategy,
-          top: y != null ? y : 0,
-          left: x != null ? x : 0
-        },
-        role: "listbox",
-        id: listId
-      })), {
-        initial: initialMotion,
-        animate: animateMotion,
-        exit: initialMotion,
-        className: twMerge("bg-white border border-solid border-gray-200 p-2 space-y-1 rounded-lg shadow-sm shadow-gray-200/40", _dropdownClassName, dropdownClassName),
-        children: enhancedChildren
-      })
-    ) }) })
-  ] });
-};
-var DropdownComponent_default = DropdownComponent;
-
-// src/lib/components/DropdownItemComponent.tsx
-import { twMerge as twMerge2 } from "tailwind-merge";
-import { useEditorState } from "@tiptap/react";
-import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
-var DropdownItemComponent = ({ item, onSelect, activeClassName, itemClassName, _itemClassName }) => {
-  const { editor } = useEditor();
-  const editorState = useEditorState({
-    editor,
-    selector: ({ editor: editor2 }) => ({ isActive: (editor2 == null ? void 0 : editor2.isActive(item.id)) || false })
-  });
-  return /* @__PURE__ */ jsxs3("div", { className: twMerge2(
-    "flex items-center gap-x-2.5 transition-all duration-100 cursor-pointer select-none px-2 py-1.5 rounded-md",
-    _itemClassName,
-    (editorState == null ? void 0 : editorState.isActive) ? "bg-gray-200/60" : "hover:bg-gray-100",
-    itemClassName,
-    (editorState == null ? void 0 : editorState.isActive) ? activeClassName : "hover:bg-gray-100"
-  ), onClick: onSelect, children: [
-    item.icon,
-    /* @__PURE__ */ jsx4("span", { className: "flex-1", children: item.text }),
-    /* @__PURE__ */ jsx4("span", { className: "ml-6 text-gray-400", children: item.keyBind })
-  ] });
-};
-var DropdownItemComponent_default = DropdownItemComponent;
-
 // src/extension/SubAndSuperscript.tsx
-import { jsx as jsx5 } from "react/jsx-runtime";
+import { jsx as jsx2 } from "react/jsx-runtime";
 var SubAndSuperscript = Extension.create({
   name: "subAndSuperScript",
   addOptions() {
     var _a;
     return __spreadProps(__spreadValues({}, (_a = this.parent) == null ? void 0 : _a.call(this)), {
       component: ({ options, editor, dropdownContainerClassName, dropdownItemClassName }) => {
-        const list = [{
-          icon: /* @__PURE__ */ jsx5(SubIcon_default, {}),
-          text: "Subscript",
-          onClick: () => editor.chain().focus().toggleSubscript().run(),
-          keyBind: "\u2318 .",
-          id: "subscript"
-        }, {
-          icon: /* @__PURE__ */ jsx5(SupIcon_default, {}),
-          text: "Superscript",
-          onClick: () => editor.chain().focus().toggleSuperscript().run(),
-          keyBind: "\u2318 ,",
-          id: "superscript"
-        }];
-        return /* @__PURE__ */ jsx5(
+        var _a2, _b;
+        const list = [];
+        if (options.subscript !== false) {
+          list.push({
+            id: crypto.randomUUID(),
+            icon: (_a2 = options.subscriptIcon) != null ? _a2 : /* @__PURE__ */ jsx2(SubIcon_default, {}),
+            text: typeof options.subscript === "string" ? options.subscript : "Subscript",
+            onClick: () => editor.chain().focus().toggleSubscript().run(),
+            keyBind: "\u2318 .",
+            name: "subscript"
+          });
+        }
+        if (options.superscript !== false) {
+          list.push({
+            id: crypto.randomUUID(),
+            icon: (_b = options.superscriptIcon) != null ? _b : /* @__PURE__ */ jsx2(SupIcon_default, {}),
+            text: typeof options.superscript === "string" ? options.superscript : "Superscript",
+            onClick: () => editor.chain().focus().toggleSuperscript().run(),
+            keyBind: "\u2318 ,",
+            name: "superscript"
+          });
+        }
+        return /* @__PURE__ */ jsx2(
           DropdownComponent_default,
           {
             className: options.className,
@@ -212,10 +90,10 @@ var SubAndSuperscript = Extension.create({
             tooltip: options.tooltip,
             tooltipClassName: options.tooltipClassName,
             tooltipPlacement: options.tooltipPlacement,
-            _tooltipContent: "More text styles",
-            _internalContent: /* @__PURE__ */ jsx5(SubAndSupIcon_default, {}),
+            _tooltipContent: "Sub & Superscript",
+            _internalContent: /* @__PURE__ */ jsx2(SubAndSupIcon_default, {}),
             _dropdownClassName: dropdownContainerClassName,
-            children: list.map((item) => /* @__PURE__ */ jsx5(
+            children: list.map((item) => /* @__PURE__ */ jsx2(
               DropdownItemComponent_default,
               {
                 onSelect: item.onClick,

package/dist/extension/subscript.d.mts

@@ -1,5 +1,5 @@
 import { Mark } from '@tiptap/react';
-import { E as ExtButtonOptions } from '../tiptap-ext.type-D61hoEX5.mjs';
+import { E as ExtButtonOptions } from '../tiptap-ext.type-DrneAC5G.mjs';
 import 'react';
 import '@floating-ui/react';
 

package/dist/extension/subscript.d.ts

@@ -1,5 +1,5 @@
 import { Mark } from '@tiptap/react';
-import { E as ExtButtonOptions } from '../tiptap-ext.type-D61hoEX5.js';
+import { E as ExtButtonOptions } from '../tiptap-ext.type-DrneAC5G.js';
 import 'react';
 import '@floating-ui/react';
 

package/dist/extension/subscript.js

@@ -206,7 +206,7 @@ var ButtonComponent = ({ className, activeClassName, icon, style, tooltip = true
     {
       onClick: _onToggle,
       className: (0, import_tailwind_merge2.twMerge)(
-        "p-1.5 rounded-md",
+        "py-1.5 px-2.5 rounded-md",
         _buttonClassName,
         (editorState == null ? void 0 : editorState.isActive) ? "bg-gray-200/60" : "hover:bg-gray-100",
         className,

package/dist/extension/subscript.mjs

@@ -1,14 +1,15 @@
 import {
   ButtonComponent_default
-} from "../chunk-CU67RXD7.mjs";
+} from "../chunk-GSHINFPO.mjs";
 import {
   SubIcon_default
-} from "../chunk-LO4RJXQF.mjs";
-import "../chunk-ZLCVIW2P.mjs";
+} from "../chunk-MBF77NHS.mjs";
+import "../chunk-7QOFJIQ3.mjs";
+import "../chunk-VYDH6BZE.mjs";
 import {
   __spreadProps,
   __spreadValues
-} from "../chunk-TQTCTY3E.mjs";
+} from "../chunk-FWCSY2DS.mjs";
 
 // src/extension/Subscript.tsx
 import TiptapSubscript from "@tiptap/extension-subscript";

package/dist/extension/superscript.d.mts

@@ -1,5 +1,5 @@
 import { Mark } from '@tiptap/react';
-import { E as ExtButtonOptions } from '../tiptap-ext.type-D61hoEX5.mjs';
+import { E as ExtButtonOptions } from '../tiptap-ext.type-DrneAC5G.mjs';
 import 'react';
 import '@floating-ui/react';
 

package/dist/extension/superscript.d.ts

@@ -1,5 +1,5 @@
 import { Mark } from '@tiptap/react';
-import { E as ExtButtonOptions } from '../tiptap-ext.type-D61hoEX5.js';
+import { E as ExtButtonOptions } from '../tiptap-ext.type-DrneAC5G.js';
 import 'react';
 import '@floating-ui/react';
 

package/dist/extension/superscript.js

@@ -206,7 +206,7 @@ var ButtonComponent = ({ className, activeClassName, icon, style, tooltip = true
     {
       onClick: _onToggle,
       className: (0, import_tailwind_merge2.twMerge)(
-        "p-1.5 rounded-md",
+        "py-1.5 px-2.5 rounded-md",
         _buttonClassName,
         (editorState == null ? void 0 : editorState.isActive) ? "bg-gray-200/60" : "hover:bg-gray-100",
         className,

package/dist/extension/superscript.mjs

@@ -1,14 +1,15 @@
 import {
   ButtonComponent_default
-} from "../chunk-CU67RXD7.mjs";
+} from "../chunk-GSHINFPO.mjs";
 import {
   SupIcon_default
-} from "../chunk-E4PPKAVK.mjs";
-import "../chunk-ZLCVIW2P.mjs";
+} from "../chunk-LMOTHRGQ.mjs";
+import "../chunk-7QOFJIQ3.mjs";
+import "../chunk-VYDH6BZE.mjs";
 import {
   __spreadProps,
   __spreadValues
-} from "../chunk-TQTCTY3E.mjs";
+} from "../chunk-FWCSY2DS.mjs";
 
 // src/extension/Superscript.tsx
 import TiptapSuperscript from "@tiptap/extension-superscript";