@elementor/editor-site-navigation 0.19.8 → 0.19.9

package/CHANGELOG.md

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.19.9](https://github.com/elementor/elementor-packages/compare/@elementor/editor-site-navigation@0.19.8...@elementor/editor-site-navigation@0.19.9) (2023-11-19)
+
+
+### Bug Fixes
+
+* **editor-site-navigation:** wrong state handling in edit mode [ED-12814] ([#146](https://github.com/elementor/elementor-packages/issues/146)) ([5bee3ee](https://github.com/elementor/elementor-packages/commit/5bee3eed17d8f6589c5cddd87ace012dcc9549ce))
+
+
+
+
+
 ## [0.19.8](https://github.com/elementor/elementor-packages/compare/@elementor/editor-site-navigation@0.19.7...@elementor/editor-site-navigation@0.19.8) (2023-11-07)
 
 **Note:** Version bump only for package @elementor/editor-site-navigation

package/dist/index.js

@@ -507,7 +507,7 @@ var import_ui7 = require("@elementor/ui");
 var import_icons6 = require("@elementor/icons");
 var import_i18n4 = require("@wordpress/i18n");
 function EditModeTemplate({ postTitle, isLoading, callback }) {
-  const inputRef = (0, import_react6.useRef)();
+  const [title, setTitle] = (0, import_react6.useState)(postTitle);
   const [inputError, setInputError] = (0, import_react6.useState)("");
   const closeButton = (0, import_react6.useRef)();
   const onBlur = (e) => {
@@ -522,7 +522,7 @@ function EditModeTemplate({ postTitle, isLoading, callback }) {
   };
   const validateInput = () => {
     let isValid = true;
-    if (inputRef.current?.value === "") {
+    if (title.trim() === "") {
       isValid = false;
       setInputError((0, import_i18n4.__)("Name is required", "elementor"));
     }
@@ -532,7 +532,7 @@ function EditModeTemplate({ postTitle, isLoading, callback }) {
     if (!validateInput()) {
       return;
     }
-    callback(inputRef.current?.value || "");
+    callback(title);
   };
   return /* @__PURE__ */ React8.createElement(
     import_ui7.ListItem,
@@ -545,8 +545,8 @@ function EditModeTemplate({ postTitle, isLoading, callback }) {
       {
         autoFocus: true,
         fullWidth: true,
-        ref: inputRef,
-        defaultValue: postTitle,
+        value: title,
+        onChange: (e) => setTitle(e.target.value),
         disabled: isLoading,
         error: !!inputError,
         onBlur,

package/dist/index.mjs

@@ -495,7 +495,7 @@ import {
 import { XIcon } from "@elementor/icons";
 import { __ as __4 } from "@wordpress/i18n";
 function EditModeTemplate({ postTitle, isLoading, callback }) {
-  const inputRef = useRef();
+  const [title, setTitle] = useState5(postTitle);
   const [inputError, setInputError] = useState5("");
   const closeButton = useRef();
   const onBlur = (e) => {
@@ -510,7 +510,7 @@ function EditModeTemplate({ postTitle, isLoading, callback }) {
   };
   const validateInput = () => {
     let isValid = true;
-    if (inputRef.current?.value === "") {
+    if (title.trim() === "") {
       isValid = false;
       setInputError(__4("Name is required", "elementor"));
     }
@@ -520,7 +520,7 @@ function EditModeTemplate({ postTitle, isLoading, callback }) {
     if (!validateInput()) {
       return;
     }
-    callback(inputRef.current?.value || "");
+    callback(title);
   };
   return /* @__PURE__ */ React8.createElement(
     ListItem2,
@@ -533,8 +533,8 @@ function EditModeTemplate({ postTitle, isLoading, callback }) {
       {
         autoFocus: true,
         fullWidth: true,
-        ref: inputRef,
-        defaultValue: postTitle,
+        value: title,
+        onChange: (e) => setTitle(e.target.value),
         disabled: isLoading,
         error: !!inputError,
         onBlur,

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@elementor/editor-site-navigation",
-	"version": "0.19.8",
+	"version": "0.19.9",
 	"private": false,
 	"author": "Elementor Team",
 	"homepage": "https://elementor.com/",
@@ -49,5 +49,5 @@
 	"elementor": {
 		"type": "extension"
 	},
-	"gitHead": "020375ae889f6e0e237c34421cef7445b704b273"
+	"gitHead": "bf6f15fca29b0ed3fc9e5f0a7a801ab31264553a"
 }

package/src/components/panel/posts-list/list-items/edit-mode-template.tsx

@@ -18,7 +18,7 @@ type Props = {
 }
 
 export default function EditModeTemplate( { postTitle, isLoading, callback }: Props ) {
-	const inputRef = useRef<HTMLInputElement>();
+	const [ title, setTitle ] = useState( postTitle );
 	const [ inputError, setInputError ] = useState( '' );
 	const closeButton = useRef<HTMLButtonElement>();
 
@@ -38,7 +38,7 @@ export default function EditModeTemplate( { postTitle, isLoading, callback }: Pr
 	const validateInput = () => {
 		let isValid = true;
 
-		if ( inputRef.current?.value === '' ) {
+		if ( title.trim() === '' ) {
 			isValid = false;
 			setInputError( __( 'Name is required', 'elementor' ) );
 		}
@@ -51,7 +51,7 @@ export default function EditModeTemplate( { postTitle, isLoading, callback }: Pr
 			return;
 		}
 
-		callback( inputRef.current?.value || '' );
+		callback( title );
 	};
 
 	return (
@@ -63,8 +63,8 @@ export default function EditModeTemplate( { postTitle, isLoading, callback }: Pr
 				<TextField
 					autoFocus // eslint-disable-line jsx-a11y/no-autofocus
 					fullWidth
-					ref={ inputRef }
-					defaultValue={ postTitle }
+					value={ title }
+					onChange={ ( e: React.ChangeEvent<{value: string}> ) => setTitle( e.target.value ) }
 					disabled={ isLoading }
 					error={ !! inputError }
 					onBlur={ onBlur }