@livepreso/react-plugin-textfield 0.4.4 → 0.5.0

package/CHANGELOG.json

@@ -1,6 +1,18 @@
 {
   "name": "@livepreso/react-plugin-textfield",
   "entries": [
+    {
+      "version": "0.5.0",
+      "tag": "@livepreso/react-plugin-textfield_v0.5.0",
+      "date": "Mon, 27 Jul 2026 04:05:41 GMT",
+      "comments": {
+        "minor": [
+          {
+            "comment": "Add placeholder property"
+          }
+        ]
+      }
+    },
     {
       "version": "0.4.4",
       "tag": "@livepreso/react-plugin-textfield_v0.4.4",

package/CHANGELOG.md

@@ -1,6 +1,13 @@
 # Change Log - @livepreso/react-plugin-textfield
 
-This log was last generated on Wed, 06 May 2026 23:36:35 GMT and should not be manually modified.
+This log was last generated on Mon, 27 Jul 2026 04:05:41 GMT and should not be manually modified.
+
+## 0.5.0
+Mon, 27 Jul 2026 04:05:41 GMT
+
+### Minor changes
+
+- Add placeholder property
 
 ## 0.4.4
 Wed, 06 May 2026 23:36:35 GMT

package/index.js

@@ -19,6 +19,7 @@ import Document from "@tiptap/extension-document";
 import HardBreak from "@tiptap/extension-hard-break";
 import Paragraph from "@tiptap/extension-paragraph";
 import Text from "@tiptap/extension-text";
+import { Placeholder } from "@tiptap/extensions";
 import {
 	EditorContent,
 	EditorContext,
@@ -64,6 +65,9 @@ function EditableTextField({
 	disableSpellcheck = false,
 	mode,
 	tokenConfig = {},
+	// Faint prompt shown while the field is empty and editable. Destructured here
+	// so it drives the Placeholder extension rather than landing on the DOM node.
+	placeholder,
 	// TODO implement an equivalent to the EditableText handler
 	// for editables inside tab handlers / accordion headers etc
 	// stopPropagation = false,
@@ -150,6 +154,17 @@ function EditableTextField({
 			...baseExtensions,
 			...toolbarAddedExtensions,
 			...otherExtensions,
+			...(placeholder
+				? [
+						Placeholder.configure({
+							placeholder,
+							// only while editable (present/PDF stay blank); show on any
+							// empty field, not just the focused one
+							showOnlyWhenEditable: true,
+							showOnlyCurrent: false,
+						}),
+					]
+				: []),
 		],
 		editable: isEditable,
 		autofocus: false,

package/index.module.scss

@@ -68,6 +68,18 @@
 				cursor: ew-resize;
 				cursor: col-resize;
 			}
+
+			// Placeholder text (from the Placeholder extension, active only when a
+			// `placeholder` prop is set). Faint and derived from the field's own
+			// text colour so it reads correctly on any background.
+			.is-editor-empty:first-child::before {
+				content: attr(data-placeholder);
+				color: currentColor;
+				opacity: 0.4;
+				float: left;
+				height: 0;
+				pointer-events: none;
+			}
 		}
 
 		.tableWrapper {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@livepreso/react-plugin-textfield",
-  "version": "0.4.4",
+  "version": "0.5.0",
   "description": "",
   "main": "index.js",
   "publishConfig": {