@antscorp/antsomi-ui 2.0.92-text-editor-beta.6 → 2.0.93

package/es/components/molecules/EmojiCollections/CommonCollection/index.js

@@ -16,7 +16,7 @@ import { COMMON_TAB_COLLECTION, MIN_VISIBLE_COUNT, SMILEYS_BODY } from './consta
 import { globalToken } from '@antscorp/antsomi-ui/es/constants';
 const { Text } = Typography;
 const emojiListParsed = JSON.parse(JSON.stringify(ICON_EMOJI_COMMON));
-const CommonCollection = ({ onEmojiClick, getPopupContainer }) => {
+const CommonCollection = ({ onEmojiClick }) => {
     // States
     const [visibleCount, setVisibleCount] = useState(MIN_VISIBLE_COUNT);
     const [state, setState] = useImmer({
@@ -93,7 +93,7 @@ const CommonCollection = ({ onEmojiClick, getPopupContainer }) => {
         });
         return (_jsx(Scrollbars, { autoHeight: true, autoHeightMax: 150, onScroll: e => onScroll(e, emojiCollection.length), children: _jsx(Flex, { wrap: "wrap", children: content }) }));
     }, [emojiCollection, visibleCount, onScroll, onEmojiClick]);
-    return (_jsxs(WrapperCollection, { children: [_jsxs(Flex, { gap: 20, justify: "space-between", align: "flex-end", children: [_jsx(Input, { placeholder: "Search...", suffix: _jsx(SearchIcon, { color: globalToken?.bw8 }), styles: { affixWrapper: { minWidth: 280 } }, onChange: handleChangeInput }), _jsx(Select, { placeholder: "Select collection", value: state.collectionActive, style: { width: 200 }, options: collectionOptions, optionRender: renderOption, onChange: handleChangeSelect, getPopupContainer: getPopupContainer })] }), _jsx(EmojiList, { children: renderCommonCollection() })] }));
+    return (_jsxs(WrapperCollection, { children: [_jsxs(Flex, { gap: 20, justify: "space-between", align: "flex-end", children: [_jsx(Input, { placeholder: "Search...", suffix: _jsx(SearchIcon, { color: globalToken?.bw8 }), styles: { affixWrapper: { minWidth: 280 } }, onChange: handleChangeInput }), _jsx(Select, { placeholder: "Select collection", value: state.collectionActive, style: { width: 200 }, options: collectionOptions, optionRender: renderOption, onChange: handleChangeSelect })] }), _jsx(EmojiList, { children: renderCommonCollection() })] }));
 };
 CommonCollection.defaultProps = {
     onEmojiClick: () => { },

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

@@ -1,4 +1,3 @@
 export interface EmojiCollectionProps {
     onEmojiClick: (newEmoji: string) => void;
-    getPopupContainer?: (triggerNode: HTMLElement) => HTMLElement;
 }

package/es/components/molecules/EmojiPopover/EmojiPopover.d.ts

@@ -10,7 +10,6 @@ interface EmojiPopoverProps {
     isForceHide?: boolean;
     children?: React.ReactNode;
     onEmojiClick?: (emoji: string | TagDataCustomize) => void;
-    getPopupContainer?: (triggerNode: HTMLElement) => HTMLElement;
 }
 declare const _default: React.NamedExoticComponent<EmojiPopoverProps>;
 export default _default;

package/es/components/molecules/EmojiPopover/EmojiPopover.js

@@ -11,7 +11,7 @@ import { EMOJI_COLLECTIONS, } from '@antscorp/antsomi-ui/es/components/molecules
 import { EmojiTabs, EmojiPopoverStyled } from './styled';
 // Utils
 import { handleGetTextToReplace } from './utils';
-const EmojiPopover = ({ disabled, collections, isForceHide, children, onEmojiClick, getPopupContainer, }) => {
+const EmojiPopover = ({ disabled, collections, isForceHide, children, onEmojiClick, }) => {
     const [state, setState] = useImmer({
         isOpen: false,
         collectionActive: collections ? collections[0]?.key : EMOJI_COLLECTIONS.COMMON,
@@ -47,16 +47,16 @@ const EmojiPopover = ({ disabled, collections, isForceHide, children, onEmojiCli
     const renderCollection = useCallback((collectionCurrent = '') => {
         switch (collectionCurrent) {
             case EMOJI_COLLECTIONS.VIBER: {
-                return (_jsx(ViberCollection, { onEmojiClick: handleGetCodeEmoji, getPopupContainer: getPopupContainer }));
+                return _jsx(ViberCollection, { onEmojiClick: handleGetCodeEmoji });
             }
             case EMOJI_COLLECTIONS.LINE: {
-                return (_jsx(LineCollection, { onEmojiClick: handleGetCodeEmoji, getPopupContainer: getPopupContainer }));
+                return _jsx(LineCollection, { onEmojiClick: handleGetCodeEmoji });
             }
             default: {
-                return (_jsx(CommonCollection, { onEmojiClick: handleGetCodeEmoji, getPopupContainer: getPopupContainer }));
+                return _jsx(CommonCollection, { onEmojiClick: handleGetCodeEmoji });
             }
         }
-    }, [handleGetCodeEmoji, getPopupContainer]);
+    }, [handleGetCodeEmoji]);
     const emojiCollections = useMemo(() => {
         if (!collections)
             return [];
@@ -66,11 +66,7 @@ const EmojiPopover = ({ disabled, collections, isForceHide, children, onEmojiCli
             children: renderCollection(collection.key),
         }));
     }, [collections, renderCollection]);
-    let content = (_jsx(EmojiTabs, { activeKey: state.collectionActive, onTabClick: handleClickCollection, items: emojiCollections }));
-    if (emojiCollections.length <= 1) {
-        content = emojiCollections.at(0)?.children;
-    }
-    return (_jsx(EmojiPopoverStyled, { content: content, placement: "topLeft", trigger: "click", fresh: false, style: { padding: 15 }, arrow: false, rootClassName: "antsomi-emoji-popover", open: state.isOpen, onOpenChange: handleOpenChange, getPopupContainer: getPopupContainer, children: children || (_jsx(Button, { type: "link", icon: _jsx(EmojiSmileIcon, {}), disabled: disabled, onClick: () => handleOpenChange(true) })) }));
+    return (_jsx(EmojiPopoverStyled, { content: _jsx(EmojiTabs, { activeKey: state.collectionActive, onTabClick: handleClickCollection, items: emojiCollections }), placement: "topLeft", trigger: "click", fresh: false, style: { padding: 15 }, arrow: false, rootClassName: "antsomi-emoji-popover", open: state.isOpen, onOpenChange: handleOpenChange, children: children || (_jsx(Button, { type: "link", icon: _jsx(EmojiSmileIcon, {}), disabled: disabled, onClick: () => handleOpenChange(true) })) }));
 };
 EmojiPopover.defaultProps = {
     disabled: false,

package/es/components/molecules/EmojiPopover/styled.d.ts

@@ -1,9 +1,9 @@
 /// <reference types="react" />
-export declare const EmojiTabs: import("styled-components").StyledComponent<import("react").FC<import("antd").TabsProps> & {
+export declare const EmojiTabs: import("styled-components").StyledComponent<import("react").FC<import("antd/es/tabs").TabsProps> & {
     TabPane: import("react").FC<import("antd").TabPaneProps>;
 }, any, {
     shadow?: boolean | undefined;
 }, never>;
-export declare const EmojiPopoverStyled: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd").PopoverProps & import("react").RefAttributes<unknown>> & {
+export declare const EmojiPopoverStyled: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd/es/popover").PopoverProps & import("react").RefAttributes<unknown>> & {
     _InternalPanelDoNotUseOrYouWillBeFired: import("react").FC<import("antd/es/popover/PurePanel").PurePanelProps>;
 }, any, {}, never>;

package/es/components/molecules/EmojiPopover/styled.js

@@ -1,7 +1,7 @@
 // Libraries
-import { Popover } from 'antd';
 import styled from 'styled-components';
 // Components
+import { Popover } from '@antscorp/antsomi-ui/es/components/atoms';
 import { Tabs as TabsUI } from '@antscorp/antsomi-ui/es/components/molecules';
 export const EmojiTabs = styled(TabsUI) `
   .antsomi-tabs-tab {

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

@@ -7,6 +7,7 @@ import { translate, translations } from '@antscorp/antsomi-locales';
 import { errorWrapper } from './errorWrapper';
 import { isViberEmoji } from './iconsViber';
 import { random } from '@antscorp/antsomi-ui/es/utils';
+import { containsTagType } from './utils';
 // Constants
 import { CONTENT_SOURCE_GROUP, EMOJI, EMOJI_COLLECTIONS, LINE_EMOJI_PTN, PERSONALIZE_PTN, PREFIX_PATTERN_LINE_MESSAGE, PROMOTION_CODE, SHORT_LINK, SHORT_LINK_GENERAL_PTN, SHORT_LINK_INDIVIDUAL_PTN, SHORT_LINK_PTN, SHORT_LINK_TYPE, SHORT_LINK_V2, SHORT_LINK_V2_GENERAL_PTN, SHORT_LINK_V2_INDIVIDUAL_PTN, VIBER_EMOJI_PTN, } from './constants';
 /*
@@ -329,6 +330,15 @@ export const getShortLinkTagInfo = (params) => {
     }
 };
 const createTagPattern = (tagInfo) => `[[${JSON.stringify(tagInfo)}]]`;
+const createUnknownTag = (unknownMergeTag, unknownTagContent) => {
+    const tagData = {
+        label: unknownTagContent,
+        type: 'unknown',
+        value: unknownMergeTag,
+    };
+    const tag = createTagPattern(tagData);
+    return { isValid: true, tag, tagData };
+};
 const generateShortlinkLabel = (params) => {
     const { type } = params;
     switch (type) {
@@ -464,6 +474,8 @@ const handlePersonalizeTagPattern = match => {
     const [personalizeTag, personalizeContent] = match;
     const [tagCode] = personalizeContent.split('||');
     const [type, attributeName, subAttributeName] = tagCode.split('.');
+    if (!containsTagType(personalizeContent))
+        return createUnknownTag(personalizeTag, personalizeContent);
     if (!tagCode || !type) {
         console.error('Invalid personalize pattern detected: ', tagCode);
         return {

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

@@ -76,6 +76,7 @@ export declare function deepUnescape<T = any>(obj: T): T | string;
  * @return boolean
  */
 export declare const isValidTagType: (str: string) => boolean;
+export declare const containsTagType: (text: string) => boolean;
 /**
  * Checks if the string contains line break.
  *

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

@@ -477,6 +477,7 @@ export function deepUnescape(obj) {
  * @return boolean
  */
 export const isValidTagType = (str) => Object.values(TAG_TYPE).includes(str);
+export const containsTagType = (text) => Object.values(TAG_TYPE).some(tagType => text.includes(tagType));
 /**
  * Checks if the string contains line break.
  *

package/es/components/molecules/VirtualizedMenu/VirtualizedMenu.d.ts

@@ -7,16 +7,13 @@ export declare const VirtualizedMenu: React.ForwardRefExoticComponent<Partial<{
     selectable: boolean;
     className: string;
     itemSize: number;
-    selected: string | string[];
+    selected: string[];
     expanded: string[];
     onClick: (args: {
         item: import("./types").ItemType;
-        domEvent?: React.MouseEvent<Element, MouseEvent> | undefined;
-        elKey: "item" | "item-expand-el";
+        pathKey: import("./types").PathKey;
     }) => void;
-    action: React.ReactNode | ((item: import("./types").ItemType, others: {
-        expandEl: React.ReactNode;
-    }) => React.ReactNode);
+    action: React.ReactNode | ((item: import("./types").ItemType) => React.ReactNode);
 }> & {
     mode?: "inline" | undefined;
 } & React.RefAttributes<import("./types").VirtualizedMenuBaseHandle>>;