Improve checks to show input placeholder

Author: ChrisUser

lib/ContentEditable.tsx

@@ -278,12 +278,18 @@ const ContentEditable: React.FC<ContentEditableProps> = ({
 
   function handleKeyDown(e: React.KeyboardEvent) {
     if (onKeyDown) onKeyDown(e)
-    if ((e.key === "Delete" || e.key === "Backspace") && isAllTextSelected()) {
+    if (!divRef.current) return
+    if (
+      (["Delete", "Backspace"].includes(e.key) && isAllTextSelected()) ||
+      (e.key === "Backspace" && content.length === 1) ||
+      (e.key === "Delete" &&
+        getCaretPosition(divRef.current) === 0 &&
+        content.length === 1)
+    ) {
       e.preventDefault()
-      if (divRef.current) {
-        divRef.current.innerText = ""
-        setContent("")
-      }
+
+      divRef.current.innerText = ""
+      setContent("")
     }
   }
 

package.json

@@ -40,21 +40,21 @@
     "react-dom": "^18.2.0"
   },
   "devDependencies": {
-    "@types/node": "^22.10.2",
-    "@types/react": "^19.0.2",
-    "@types/react-dom": "^19.0.2",
-    "@typescript-eslint/eslint-plugin": "^8.18.2",
-    "@typescript-eslint/parser": "^8.18.2",
-    "@vitejs/plugin-react-swc": "^3.7.2",
+    "@types/node": "^22.13.4",
+    "@types/react": "^19.0.8",
+    "@types/react-dom": "^19.0.3",
+    "@typescript-eslint/eslint-plugin": "^8.24.0",
+    "@typescript-eslint/parser": "^8.24.0",
+    "@vitejs/plugin-react-swc": "^3.8.0",
     "eslint": "^8.56.0",
     "eslint-plugin-react-hooks": "^4.6.0",
     "eslint-plugin-react-refresh": "^0.4.16",
-    "glob": "^11.0.0",
+    "glob": "^11.0.1",
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
-    "typescript": "^5.7.2",
-    "vite": "^6.0.9",
-    "vite-plugin-dts": "^4.4.0"
+    "typescript": "^5.7.3",
+    "vite": "^6.1.0",
+    "vite-plugin-dts": "^4.5.0"
   },
   "bugs": {
     "url": "https://github.com/ChrisUser/react-basic-contenteditable/issues"