@multiplatform.one/rich-text 6.1.0 → 6.4.0

package/dist/jsx/toolbar/CodeBlockBubble.native.js

@@ -31,9 +31,12 @@ var import_jsx_runtime = require("react/jsx-runtime");
 var import_react = require("react");
 var import_menus = require("@tiptap/react/menus");
 var import_theme = require("@multiplatform.one/theme");
+var import_react2 = require("@phosphor-icons/react");
 var import_tamagui = require("tamagui");
 var import_styled = require("../styled.native.js");
+var import_blockAnchor = require("../editor/blockAnchor.native.js");
 var import_ToolbarButton = require("./ToolbarButton.native.js");
+var import_t = require("../shared/t.native.js");
 var LANGUAGES = [{
   value: null,
   label: "Plain text"
@@ -73,6 +76,12 @@ var LANGUAGES = [{
 }, {
   value: "markdown",
   label: "Markdown"
+}, {
+  value: "math",
+  label: "Math (TeX)"
+}, {
+  value: "mermaid",
+  label: "Mermaid"
 }, {
   value: "php",
   label: "PHP"
@@ -104,35 +113,38 @@ var LANGUAGES = [{
   value: "yaml",
   label: "YAML"
 }];
-function TrashIcon() {
-  return /* @__PURE__ */(0, import_jsx_runtime.jsxs)("svg", {
-    width: "14",
-    height: "14",
-    viewBox: "0 0 24 24",
-    fill: "none",
-    stroke: "currentColor",
-    strokeWidth: "2",
-    children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)("polyline", {
-      points: "3 6 5 6 21 6"
-    }), /* @__PURE__ */(0, import_jsx_runtime.jsx)("path", {
-      d: "M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"
-    })]
-  });
+function getActiveCodeBlockText(editor) {
+  var {
+    $from
+  } = editor.state.selection;
+  for (var depth = $from.depth; depth >= 0; depth--) {
+    var node = $from.node(depth);
+    if (node.type.name === "codeBlock") return node.textContent;
+  }
+  return "";
 }
 function CodeBlockBubble(param) {
   var {
     editor
   } = param;
-  var _ref, _ref1, _ref2;
+  var _ref, _ref1;
   var _editor_getAttributes, _LANGUAGES_find;
   var {
     knobProps
   } = (0, import_theme.useResolvedKnobs)();
   var [langOpen, setLangOpen] = (0, import_react.useState)(false);
+  var [copied, setCopied] = (0, import_react.useState)(false);
+  var copiedTimer = (0, import_react.useRef)(null);
+  (0, import_react.useEffect)(function () {
+    return function () {
+      if (copiedTimer.current) clearTimeout(copiedTimer.current);
+    };
+  }, []);
   var currentLang = (_ref = editor === null || editor === void 0 ? void 0 : (_editor_getAttributes = editor.getAttributes("codeBlock")) === null || _editor_getAttributes === void 0 ? void 0 : _editor_getAttributes.language) !== null && _ref !== void 0 ? _ref : null;
-  var currentLabel = (_ref1 = (_ref2 = (_LANGUAGES_find = LANGUAGES.find(function (l) {
+  var rawLabel = (_ref1 = (_LANGUAGES_find = LANGUAGES.find(function (l) {
     return l.value === currentLang;
-  })) === null || _LANGUAGES_find === void 0 ? void 0 : _LANGUAGES_find.label) !== null && _ref2 !== void 0 ? _ref2 : currentLang) !== null && _ref1 !== void 0 ? _ref1 : "Plain text";
+  })) === null || _LANGUAGES_find === void 0 ? void 0 : _LANGUAGES_find.label) !== null && _ref1 !== void 0 ? _ref1 : currentLang;
+  var currentLabel = currentLang === null ? (0, import_t.t)("Plain text") : rawLabel !== null && rawLabel !== void 0 ? rawLabel : (0, import_t.t)("Plain text");
   var setLanguage = (0, import_react.useCallback)(function (lang) {
     if (!editor) return;
     editor.chain().focus().updateAttributes("codeBlock", {
@@ -140,6 +152,19 @@ function CodeBlockBubble(param) {
     }).run();
     setLangOpen(false);
   }, [editor]);
+  var copyCode = (0, import_react.useCallback)(async function () {
+    if (!editor) return;
+    try {
+      await navigator.clipboard.writeText(getActiveCodeBlockText(editor));
+      setCopied(true);
+      if (copiedTimer.current) clearTimeout(copiedTimer.current);
+      copiedTimer.current = setTimeout(function () {
+        return setCopied(false);
+      }, 1500);
+    } catch (err) {
+      console.warn("[rich-text] copy failed:", err);
+    }
+  }, [editor]);
   var removeCodeBlock = (0, import_react.useCallback)(function () {
     if (!editor) return;
     editor.chain().focus().toggleCodeBlock().run();
@@ -147,14 +172,22 @@ function CodeBlockBubble(param) {
   if (!editor) return null;
   return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_menus.BubbleMenu, {
     editor,
+    className: "rt-bubble-menu",
     shouldShow: function shouldShow(param2) {
       var {
         editor: e
       } = param2;
       return e.isActive("codeBlock");
     },
+    // Anchor to the <pre> rect (not the caret) so the bubble sits above
+    // the block instead of covering its first line, and does not chase
+    // the caret while typing.
+    getReferencedVirtualElement: function getReferencedVirtualElement() {
+      return (0, import_blockAnchor.getBlockVirtualElement)(editor, "codeBlock");
+    },
     options: {
-      placement: "top-start"
+      placement: "top-start",
+      offset: 6
     },
     children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.XStack, {
       backgroundColor: "$background",
@@ -175,14 +208,16 @@ function CodeBlockBubble(param) {
             onPress: function onPress() {
               return setLangOpen(true);
             },
-            "aria-label": "Select language",
+            "aria-label": (0, import_t.t)("Select language"),
             children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Text, {
               fontSize: 12,
               children: currentLabel
             })
           })
         }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Popover.Content, {
-          ...knobProps.panelPadding,
+          // SP-EDGE: container owns only its border — items own all padding.
+          padding: 0,
+          overflow: "hidden",
           backgroundColor: "$background",
           borderWidth: 1,
           borderColor: "$borderColor",
@@ -207,20 +242,31 @@ function CodeBlockBubble(param) {
                 onPress: function onPress() {
                   return setLanguage(lang.value);
                 },
-                "aria-label": lang.label,
+                "aria-label": lang.value === null ? (0, import_t.t)("Plain text") : lang.label,
                 children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Text, {
                   fontSize: 13,
-                  children: lang.label
+                  children: lang.value === null ? (0, import_t.t)("Plain text") : lang.label
                 })
               }, lang.label);
             })
           })
         })]
+      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_ToolbarButton.ToolbarButton, {
+        onPress: copyCode,
+        "aria-label": copied ? (0, import_t.t)("Copied") : (0, import_t.t)("Copy code"),
+        tooltip: copied ? (0, import_t.t)("Copied") : (0, import_t.t)("Copy code"),
+        children: copied ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react2.CheckIcon, {
+          size: 14
+        }) : /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react2.CopyIcon, {
+          size: 14
+        })
       }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_ToolbarButton.ToolbarButton, {
         onPress: removeCodeBlock,
-        "aria-label": "Remove code block",
-        tooltip: "Remove code block",
-        children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(TrashIcon, {})
+        "aria-label": (0, import_t.t)("Remove code block"),
+        tooltip: (0, import_t.t)("Remove code block"),
+        children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react2.TrashIcon, {
+          size: 14
+        })
       })]
     })
   });

package/dist/jsx/toolbar/CodeBlockBubble.native.js.map

@@ -1 +1 @@
-{"version":3,"names":["__defProp","Object","defineProperty","__getOwnPropDesc","getOwnPropertyDescriptor","__getOwnPropNames","getOwnPropertyNames","__hasOwnProp","prototype","hasOwnProperty","__export","target","all","name","get","enumerable","__copyProps","to","from","except","desc","key","call","__toCommonJS","mod","value","CodeBlockBubble_exports","CodeBlockBubble","module","exports","import_jsx_runtime","require","import_react","import_menus","import_theme","import_tamagui","import_styled","import_ToolbarButton","LANGUAGES","label","TrashIcon","jsxs"],"sources":["../../../src/toolbar/CodeBlockBubble.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["__defProp","Object","defineProperty","__getOwnPropDesc","getOwnPropertyDescriptor","__getOwnPropNames","getOwnPropertyNames","__hasOwnProp","prototype","hasOwnProperty","__export","target","all","name","get","enumerable","__copyProps","to","from","except","desc","key","call","__toCommonJS","mod","value","CodeBlockBubble_exports","CodeBlockBubble","module","exports","import_jsx_runtime","require","import_react","import_menus","import_theme","import_react2","import_tamagui","import_styled","import_blockAnchor","import_ToolbarButton","import_t","LANGUAGES","label","getActiveCodeBlockText","editor","$from","state","selection","depth","node","type","textContent","param","_ref","_ref1","_editor_getAttributes","_LANGUAGES_find","knobProps","useResolvedKnobs","langOpen","setLangOpen","useState","copied","setCopied","copiedTimer","useRef","useEffect","current","clearTimeout","currentLang","getAttributes","language","rawLabel","find","l","currentLabel","t"],"sources":["../../../src/toolbar/CodeBlockBubble.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}

package/dist/jsx/toolbar/ColorPicker.mjs

@@ -1,45 +1,12 @@
 import { useCallback, useState } from "react";
+import { PresetSwatches } from "@multiplatform.one/forms";
 import { useResolvedKnobs } from "@multiplatform.one/theme";
-import { Popover, Text, View, XStack, YStack } from "tamagui";
-import { TEXT_COLORS, HIGHLIGHT_COLORS } from "../constants.mjs";
+import { Popover, Text, YStack, useThemeName } from "tamagui";
+import { TEXT_COLORS, TEXT_COLORS_DARK, HIGHLIGHT_COLORS } from "../constants.mjs";
 import { ToolbarButton } from "./ToolbarButton.mjs";
 import { TextColorIcon, HighlightIcon } from "./icons.mjs";
+import { t } from "../shared/t.mjs";
 import { jsx, jsxs } from "react/jsx-runtime";
-function ColorSwatch({
-  color,
-  isSelected,
-  onPress,
-  isNone
-}) {
-  return /* @__PURE__ */jsx(View, {
-    width: 24,
-    height: 24,
-    borderRadius: 4,
-    backgroundColor: color || "$background",
-    borderWidth: isSelected ? 2 : 1,
-    borderColor: isSelected ? "$blue10" : "$color6",
-    cursor: "pointer",
-    hoverStyle: {
-      opacity: 0.8
-    },
-    pressStyle: {
-      scale: 0.95
-    },
-    onPress,
-    alignItems: "center",
-    justifyContent: "center",
-    "aria-label": isNone ? "Remove color" : `Color ${color}`,
-    children: isNone && /* @__PURE__ */jsx(View, {
-      position: "absolute",
-      width: 20,
-      height: 2,
-      backgroundColor: "$red10",
-      transform: [{
-        rotate: "45deg"
-      }]
-    })
-  });
-}
 function ColorGrid({
   title,
   colors,
@@ -56,16 +23,14 @@ function ColorGrid({
       fontSize: knobProps.sizeToken,
       fontWeight: "600",
       children: title
-    }), /* @__PURE__ */jsx(XStack, {
-      flexWrap: "wrap",
-      gap: "$1",
-      maxWidth,
-      children: colors.map(c => /* @__PURE__ */jsx(ColorSwatch, {
-        color: c.value,
-        isSelected: selectedColor === c.value,
-        isNone: c.value === null,
-        onPress: () => onSelect(c.value)
-      }, c.name))
+    }), /* @__PURE__ */jsx(PresetSwatches, {
+      presetColors: colors.map(c => ({
+        ...c,
+        name: t(c.name)
+      })),
+      selectedColor,
+      onSelect,
+      width: maxWidth
     })]
   });
 }
@@ -77,12 +42,13 @@ function TextColorPicker({
   const {
     knobProps
   } = useResolvedKnobs();
+  const themeName = useThemeName();
+  const textColors = String(themeName).startsWith("dark") ? TEXT_COLORS_DARK : TEXT_COLORS;
   const [open, setOpen] = useState(false);
   const handleSelect = useCallback(color => {
     editorRef.current?.executeCommand("textColor", {
       color
     });
-    setOpen(false);
   }, [editorRef]);
   return /* @__PURE__ */jsxs(Popover, {
     open,
@@ -94,8 +60,8 @@ function TextColorPicker({
         active: !!state.textColor,
         disabled,
         onPress: () => setOpen(true),
-        "aria-label": "Text Color",
-        tooltip: "Text Color",
+        "aria-label": t("Text Color"),
+        tooltip: t("Text Color"),
         children: /* @__PURE__ */jsx(TextColorIcon, {
           color: state.textColor
         })
@@ -119,8 +85,8 @@ function TextColorPicker({
         borderColor: "$borderColor",
         backgroundColor: "$background"
       }), /* @__PURE__ */jsx(ColorGrid, {
-        title: "Text Color",
-        colors: TEXT_COLORS,
+        title: t("Text Color"),
+        colors: textColors,
         selectedColor: state.textColor,
         onSelect: handleSelect,
         maxWidth: 160
@@ -141,7 +107,6 @@ function HighlightColorPicker({
     editorRef.current?.executeCommand("highlight", {
       color
     });
-    setOpen(false);
   }, [editorRef]);
   return /* @__PURE__ */jsxs(Popover, {
     open,
@@ -153,8 +118,8 @@ function HighlightColorPicker({
         active: !!state.highlightColor,
         disabled,
         onPress: () => setOpen(true),
-        "aria-label": "Highlight Color",
-        tooltip: "Highlight",
+        "aria-label": t("Highlight Color"),
+        tooltip: t("Highlight"),
         children: /* @__PURE__ */jsx(HighlightIcon, {
           color: state.highlightColor
         })
@@ -178,7 +143,7 @@ function HighlightColorPicker({
         borderColor: "$borderColor",
         backgroundColor: "$background"
       }), /* @__PURE__ */jsx(ColorGrid, {
-        title: "Highlight",
+        title: t("Highlight"),
         colors: HIGHLIGHT_COLORS,
         selectedColor: state.highlightColor,
         onSelect: handleSelect,

package/dist/jsx/toolbar/ColorPicker.mjs.map

@@ -1 +1 @@
-{"version":3,"names":["useCallback","useState","useResolvedKnobs","Popover","Text","View","XStack","YStack","TEXT_COLORS","HIGHLIGHT_COLORS","ToolbarButton","TextColorIcon","HighlightIcon","jsx","jsxs","ColorSwatch","color","isSelected","onPress","isNone","width","height","borderRadius","backgroundColor","borderWidth","borderColor","cursor","hoverStyle","opacity","pressStyle","scale","alignItems","justifyContent","children","position","transform","rotate","ColorGrid","title","colors","selectedColor","onSelect","maxWidth","knobProps","gap","fontSize","sizeToken","fontWeight","flexWrap","map","c","value","name","TextColorPicker","editorRef","state","disabled","open","setOpen","handleSelect","current","executeCommand","onOpenChange","placement","Trigger","asChild","active","textColor","tooltip","Content","panelPadding","elevation","enterStyle","y","exitStyle","Arrow","HighlightColorPicker","highlightColor"],"sources":["../../../src/toolbar/ColorPicker.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["useCallback","useState","PresetSwatches","useResolvedKnobs","Popover","Text","YStack","useThemeName","TEXT_COLORS","TEXT_COLORS_DARK","HIGHLIGHT_COLORS","ToolbarButton","TextColorIcon","HighlightIcon","t","jsx","jsxs","ColorGrid","title","colors","selectedColor","onSelect","maxWidth","knobProps","gap","children","fontSize","sizeToken","fontWeight","presetColors","map","c","name","width","TextColorPicker","editorRef","state","disabled","themeName","textColors","String","startsWith","open","setOpen","handleSelect","color","current","executeCommand","onOpenChange","placement","Trigger","asChild","active","textColor","onPress","tooltip","Content","panelPadding","backgroundColor","borderWidth","borderColor","borderRadius","elevation","enterStyle","opacity","y","exitStyle","Arrow","HighlightColorPicker","highlightColor"],"sources":["../../../src/toolbar/ColorPicker.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}