@antscorp/antsomi-ui 1.3.5-beta.902 → 1.3.5-beta.903

package/es/components/molecules/AddDynamicContent/components/DisplayFormat/DisplayFormat.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { PayloadInfo } from '@antscorp/antsomi-ui/es/types';
 export type TDisplayFormat = 'number' | 'percentage' | 'currency' | 'datetime';
 type DisplayFormatProps = {

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

@@ -22,7 +22,7 @@ import { acceptablePatternChecking, detectURLRegex, getCachedRegex, getPersonali
 import { DETECT_LINK, EMOJI, FORCE_SHOW_TOOLTIP, INVALID_TAG, MESSAGE_TAG, NO_VIEW_TAG, PERSONALIZE_PTN, PROMOTION_CODE, READONLY_TAG, REMOVED_TAG, SHORT_LINK, SHORT_LINK_PTN, defaultCssVariables, tagifyDefaultProps, } from './constants';
 const TagifyInput = forwardRef((props, ref) => {
     // Props
-    const { initialValue, escapeHTML, status, readonly, readonlyTag, disabled, maxLength, maxHeight, minWidth, placeholder, isSingleLineText, acceptableTagPattern, mapAttributes, mapErrorAttributes, maxPersonalizeTags, name, children, cssTagifyVariables, onTagClick, onChange, } = props;
+    const { initialValue, escapeHTML, status, readonly, readonlyTag, realtime, disabled, maxLength, maxHeight, minWidth, placeholder, isSingleLineText, acceptableTagPattern, mapAttributes, mapErrorAttributes, maxPersonalizeTags, name, children, cssTagifyVariables, onTagClick, onChange, } = props;
     // States
     const [isLineBreak, setIsLineBreak] = useState(hasLineBreak(initialValue));
     const [tooltipRefresher, setTooltipRefresher] = useState(1);
@@ -406,15 +406,20 @@ const TagifyInput = forwardRef((props, ref) => {
     // Used to trigger replace URL detection and line break
     const onTagifyTyping = useCallback((event) => {
         if (event.detail) {
-            const { textContent } = event.detail;
+            const { textContent, tagify } = event.detail;
             // Tracking if the tagify input is line break
             setIsLineBreak(hasLineBreak(textContent));
             // Update URL to tag to show hint in the tooltip with tag
             if (textContent) {
                 detectReplaceURLToTag();
             }
+            if (realtime) {
+                const inputValue = tagify.getInputValue();
+                const convertedValue = convertInputStringToOriginal(inputValue);
+                onOutputData(convertedValue);
+            }
         }
-    }, [detectReplaceURLToTag]);
+    }, [realtime, detectReplaceURLToTag, onOutputData]);
     /**
      * Capture to trigger when tagify changed
      */

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

@@ -48,6 +48,7 @@ export const DEFAULT_ACCEPT_TAGS = [
 export const tagifyDefaultProps = {
     initialValue: '',
     name: 'tagifyInput',
+    realtime: true,
     maxHeight: 266,
     placeholder: undefined,
     acceptableTagPattern: DEFAULT_ACCEPT_TAGS,

package/es/components/molecules/TagifyInput/types.d.ts

@@ -20,6 +20,13 @@ export interface TagifyInputProps {
      * Defines whether the input should escape HTML characters.
      */
     escapeHTML?: boolean;
+    /**
+     * Defines whether the input should be in *realtime* mode.
+     * In *realtime* mode, the input is updated as the user stops typing, otherwise only on blur types.
+     *
+     * @default true
+     */
+    realtime?: boolean;
     /**
      * Optional mapping configuration for custom attributes associated with tags.
      * Defines how tag attributes are mapped and processed internally.

package/es/components/template/TemplateListing/Loadable.d.ts

@@ -3,5 +3,4 @@
  * Asynchronously loads the component for TemplateListing
  *
  */
-/// <reference types="react" />
 export declare const TemplateListing: (props: import("./types").TemplateListingProps<{}>) => JSX.Element;

package/package.json

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