@underverse-ui/underverse 2.0.15 → 2.0.17

package/api-reference.json

@@ -1,6 +1,6 @@
 {
   "package": "@underverse-ui/underverse",
-  "version": "2.0.15",
+  "version": "2.0.17",
   "sourceEntry": "src/index.ts",
   "totalExports": 257,
   "exports": [

package/dist/{chunk-WEGE3MZ5.js → chunk-23VKHYEB.js}

@@ -3444,6 +3444,8 @@ var EditorToolbar = ({
   const [showImageInput, setShowImageInput] = useState4(false);
   const [showLinkInput, setShowLinkInput] = useState4(false);
   const [isTableMenuOpen, setIsTableMenuOpen] = useState4(false);
+  const [fontSizeDraft, setFontSizeDraft] = useState4("");
+  const [isEditingFontSize, setIsEditingFontSize] = useState4(false);
   const fileInputRef = useRef4(null);
   const [isUploadingImage, setIsUploadingImage] = useState4(false);
   const [imageUploadError, setImageUploadError] = useState4(null);
@@ -3473,7 +3475,7 @@ var EditorToolbar = ({
   const availableLetterSpacings = React7.useMemo(() => letterSpacings ?? getDefaultLetterSpacings(), [letterSpacings]);
   const currentFontFamilyDisplayValue = currentFontFamily.split(",")[0]?.trim() ?? currentFontFamily;
   const currentFontFamilyLabel = availableFontFamilies.find((option) => normalizeStyleValue(option.value) === currentFontFamily)?.label ?? (currentFontFamilyDisplayValue || t("toolbar.fontDefault"));
-  const currentFontSizeLabel = availableFontSizes.find((option) => normalizeStyleValue(option.value) === currentFontSize)?.label ?? "13";
+  const currentFontSizeLabel = availableFontSizes.find((option) => normalizeStyleValue(option.value) === currentFontSize)?.label ?? (currentFontSize.replace(/px$/i, "") || "13");
   const currentLineHeightLabel = availableLineHeights.find((option) => normalizeStyleValue(option.value) === currentLineHeight)?.label ?? t("toolbar.lineHeightDefault");
   const currentLetterSpacingLabel = availableLetterSpacings.find((option) => normalizeStyleValue(option.value) === currentLetterSpacing)?.label ?? t("toolbar.letterSpacingDefault");
   const defaultFontFamilyOption = availableFontFamilies.find((opt) => normalizeStyleValue(opt.value) === normalizeStyleValue(defaultFontFamily)) ?? availableFontFamilies[0];
@@ -3485,6 +3487,12 @@ var EditorToolbar = ({
   const isMedium = variant === "medium";
   const isMediumFull = variant === "medium-full";
   const isFull = variant === "default" || variant === "full" || variant === "notion" || !variant;
+  const applyFontSizeDraft = () => {
+    const parsed = Number.parseFloat(fontSizeDraft);
+    if (!Number.isFinite(parsed)) return;
+    editor.chain().focus().setFontSize(`${parsed}px`).run();
+    setFontSizeDraft(String(parsed));
+  };
   const insertImageFiles = async (files) => {
     if (files.length === 0) return;
     setIsUploadingImage(true);
@@ -3653,25 +3661,47 @@ var EditorToolbar = ({
         (isMediumFull || isFull) && /* @__PURE__ */ jsx7(
           DropdownMenu,
           {
-            trigger: /* @__PURE__ */ jsxs5(
-              ToolbarButton,
-              {
-                onClick: () => {
-                },
-                title: t("toolbar.fontSize"),
-                className: "h-7 w-14 justify-between gap-1 border border-[rgba(196,197,213,0.6)] bg-white px-2 text-[#404040] shadow-[0_1px_2px_rgba(0,0,0,0.07)] hover:bg-white hover:text-[#404040] dark:bg-background dark:text-foreground",
-                children: [
-                  /* @__PURE__ */ jsx7("span", { className: "text-xs font-normal leading-none", children: displayedFontSizeLabel }),
-                  /* @__PURE__ */ jsx7(FigmaChevronDownIcon, { className: "h-3 w-3 shrink-0 text-[#7B8184]" })
-                ]
-              }
-            ),
+            trigger: /* @__PURE__ */ jsxs5("div", { className: "flex h-7 w-14 items-center rounded-md border border-[rgba(196,197,213,0.6)] bg-white text-[#404040] shadow-[0_1px_2px_rgba(0,0,0,0.07)] dark:bg-background dark:text-foreground", children: [
+              /* @__PURE__ */ jsx7(
+                "input",
+                {
+                  type: "number",
+                  step: 1,
+                  value: isEditingFontSize ? fontSizeDraft : displayedFontSizeLabel,
+                  onFocus: () => {
+                    setFontSizeDraft(displayedFontSizeLabel);
+                    setIsEditingFontSize(true);
+                  },
+                  onChange: (event) => setFontSizeDraft(event.target.value),
+                  onBlur: () => {
+                    applyFontSizeDraft();
+                    setIsEditingFontSize(false);
+                  },
+                  onMouseDown: (event) => event.stopPropagation(),
+                  onClick: (event) => event.stopPropagation(),
+                  onKeyDown: (event) => {
+                    event.stopPropagation();
+                    if (event.key === "Enter") {
+                      event.preventDefault();
+                      applyFontSizeDraft();
+                      setIsEditingFontSize(false);
+                    }
+                  },
+                  "aria-label": t("toolbar.fontSize"),
+                  className: "min-w-0 flex-1 bg-transparent px-2 text-xs font-normal leading-none outline-none [appearance:textfield] [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none"
+                }
+              ),
+              /* @__PURE__ */ jsx7("button", { type: "button", "aria-label": t("toolbar.fontSize"), title: t("toolbar.fontSize"), className: "px-1 text-[#7B8184]", children: /* @__PURE__ */ jsx7(FigmaChevronDownIcon, { className: "h-3 w-3" }) })
+            ] }),
             contentClassName: "max-h-80 overflow-y-auto min-w-32 p-2",
             children: availableFontSizes.map((option) => /* @__PURE__ */ jsx7(
               DropdownMenuItem,
               {
                 label: option.label,
-                onClick: () => editor.chain().focus().setFontSize(option.value).run(),
+                onClick: () => {
+                  editor.chain().focus().setFontSize(option.value).run();
+                  setFontSizeDraft(option.label);
+                },
                 active: normalizeStyleValue(option.value) === activeFontSize
               },
               option.value
@@ -4628,4 +4658,4 @@ export {
   EditorToolbar,
   UEDITOR_PROSEMIRROR_CLASS_NAME
 };
-//# sourceMappingURL=chunk-WEGE3MZ5.js.map
+//# sourceMappingURL=chunk-23VKHYEB.js.map