@antscorp/antsomi-ui 1.3.7-beta.13 → 1.3.7-beta.15

package/es/components/molecules/TagifyInput/TagifyInput.js

@@ -17,7 +17,7 @@ import '@yaireo/tagify/dist/tagify.css';
 // Styled
 import { TagTextArea, TagifyWrapper, WrapperPlaceHolder } from './styled';
 // Utils
-import { parseTagStringToTagify, convertInputStringToOriginal, emojiManufacturer, getEmojiTag, isPersonalizeTagType, generateTagContent, unescapeString, hasLineBreak, selectRange, isTagClickable, findURLInTextNodes, getAttributesString, isAnchorNodeChildOfElement, isShortLinkTagType, isCustomTagType, sanitizeTagAttributes, getTagAttributes, applyTagAttributes, getTagContentAttributes, isCaretAtEndOfTextNodeWithNextTag, getCurrentSelectionAndCloneRange, handleEnterWithNextTag, handleTextNodeBackspace, extractTagValues, removeInvisibleChars, } from './utils';
+import { parseTagStringToTagify, convertInputStringToOriginal, emojiManufacturer, getEmojiTag, isPersonalizeTagType, generateTagContent, unescapeString, hasLineBreak, selectRange, isTagClickable, findURLInTextNodes, getAttributesString, isAnchorNodeChildOfElement, isShortLinkTagType, isCustomTagType, sanitizeTagAttributes, getTagAttributes, applyTagAttributes, getTagContentAttributes, isCaretAtEndOfTextNodeWithNextTag, getCurrentSelectionAndCloneRange, handleEnterWithNextTag, handleTextNodeBackspace, extractTagValues, } from './utils';
 import { acceptablePatternChecking, detectURLRegex, getCachedRegex, getCustomTagId, getPersonalizeTagInfo, getShortLinkTagInfo, patternHandlers, } from './patternHandlers';
 // Constants
 import { DETECT_LINK, EMOJI, PERSONALIZE_PTN, SHORT_LINK, SHORT_LINK_PTN, SHORT_LINK_V2, TAG_TYPE, UNSUBSCRIBE_WHATSAPP, defaultCssVariables, tagifyDefaultProps, TAG_CUSTOM_ATTRIBUTES, } from './constants';
@@ -778,14 +778,16 @@ const TagifyInput = forwardRef((props, ref) => {
                 return;
             const { classList } = DOM?.scope;
             const { classNames } = settings;
+            // Set the input to editable if the input value is empty and readonlyWhenNotEmpty is enabled
+            if (readonlyWhenNotEmpty) {
+                const isInputEmpty = classList.contains(classNames.empty);
+                DOM.input.setAttribute('contenteditable', isInputEmpty ? 'true' : 'false');
+                // Not focus the input if the input value is not empty and readonlyWhenNotEmpty is enabled
+                if (!isInputEmpty)
+                    return;
+            }
             if (!classList.contains(classNames.focus) && DOM?.input) {
                 try {
-                    if (readonlyWhenNotEmpty) {
-                        const cleanValue = removeInvisibleChars(tagifyRef.current.getInputValue().trim());
-                        // Set the input to editable if the input value is empty
-                        DOM.input.setAttribute('contenteditable', !cleanValue.length ? 'true' : 'false');
-                        return;
-                    }
                     const { lastChild } = DOM?.input;
                     const isValidLastBRTag = lastChild && lastChild.nodeName === 'BR';
                     const hasEmptyCls = classList.contains(classNames.empty);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antscorp/antsomi-ui",
-  "version": "1.3.7-beta.13",
+  "version": "1.3.7-beta.15",
   "description": "An enterprise-class UI design language and React UI library.",
   "sideEffects": [
     "dist/*",