@antscorp/antsomi-ui 1.3.5-beta.877 → 1.3.5-beta.878

package/es/components/atoms/SlideBar/SlideBar.js

@@ -270,7 +270,9 @@ export const SlideBar = props => {
                     fontSize: `${BTN_ADD_SIZE}px`,
                     cursor: disabledAdd ? 'not-allowed' : 'pointer',
                     color: disabledAdd ? THEME.token?.colorTextDisabled : THEME.token?.colorPrimary,
-                }, onClick: (e) => {
+                }, 
+                // disabled={disabledAdd}
+                onClick: (e) => {
                     e.stopPropagation();
                     if (!disabledAdd) {
                         handleAddSlide();

package/es/components/atoms/Slider/index.js

@@ -10,16 +10,11 @@ export const Slider = memo(props => {
     const { range, value, min = 0, max = 0, className, tooltipVisible = false } = props;
     const isNegative = useMemo(() => !!(!range && min < 0), [range, min]);
     const calculateWidth = useMemo(() => ((value || 0) * 100) / (Math.abs(max) + Math.abs(min) || 1), [min, max, value]);
-    // const restProps = tooltipVisible === 'default' ? omit(props, ['tooltipVisible']) : props;
-    const restProps = omit(props, ['tooltipVisible']);
+    const restProps = tooltipVisible === 'default' ? omit(props, ['tooltipVisible']) : props;
     if (isNegative) {
-        return (_jsx(SliderWrapper, { isNegative: true, width: calculateWidth, className: className, children: _jsx(AntdSlider, { ...omit(restProps, ['marks', 'className']), tooltip: tooltipVisible !== 'default' && {
-                    open: tooltipVisible,
-                }, marks: {
+        return (_jsx(SliderWrapper, { isNegative: true, width: calculateWidth, className: className, children: _jsx(AntdSlider, { ...omit(restProps, ['marks', 'className']), marks: {
                     0: ' ',
                 } }) }));
     }
-    return (_jsx(SliderWrapper, { className: className, children: _jsx(AntdSlider, { ...restProps, tooltip: tooltipVisible !== 'default' && {
-                open: tooltipVisible,
-            } }) }));
+    return (_jsx(SliderWrapper, { className: className, children: _jsx(AntdSlider, { ...restProps }) }));
 });

package/es/components/atoms/index.d.ts

@@ -46,7 +46,6 @@ export * from './RateV2';
 export * from './Popover';
 export * from './Iframe';
 export * from './Avatar';
-export * from './NotificationStatus';
 export type { SliderProps } from './Slider';
 export type { PaginationProps } from './Pagination';
 export type { InputDynamicProps } from './InputDynamic';

package/es/components/atoms/index.js

@@ -46,4 +46,3 @@ export * from './RateV2';
 export * from './Popover';
 export * from './Iframe';
 export * from './Avatar';
-export * from './NotificationStatus';

package/es/components/icons/LazyIcon/LazyIcon.d.ts

@@ -208,7 +208,6 @@ export declare const LazyIcon: {
     InteractiveIcon: import("react").LazyExoticComponent<import("react").ForwardRefExoticComponent<import("../types").IconProps & import("react").RefAttributes<SVGSVGElement>>>;
     InvisibleIcon: import("react").LazyExoticComponent<import("react").ForwardRefExoticComponent<import("../types").IconProps & import("react").RefAttributes<SVGSVGElement>>>;
     InvitePeopleIcon: import("react").LazyExoticComponent<import("react").ForwardRefExoticComponent<import("../types").IconProps & import("react").RefAttributes<SVGSVGElement>>>;
-    IpRestrictionIcon: import("react").LazyExoticComponent<import("react").ForwardRefExoticComponent<import("../types").IconProps & import("react").RefAttributes<SVGSVGElement>>>;
     IssueBugIcon: import("react").LazyExoticComponent<import("react").ForwardRefExoticComponent<import("../types").IconProps & import("react").RefAttributes<SVGSVGElement>>>;
     ItemRecommendationIcon: import("react").LazyExoticComponent<import("react").ForwardRefExoticComponent<import("../types").IconProps & import("react").RefAttributes<SVGSVGElement>>>;
     JourneyTactic30Icon: import("react").LazyExoticComponent<import("react").ForwardRefExoticComponent<import("../types").IconProps & import("react").RefAttributes<SVGSVGElement>>>;

package/es/components/icons/LazyIcon/LazyIcon.js

@@ -214,7 +214,6 @@ export const LazyIcon = {
     InteractiveIcon: lazy(() => import('../InteractiveIcon').then(m => ({ default: m.InteractiveIcon }))),
     InvisibleIcon: lazy(() => import('../InvisibleIcon').then(m => ({ default: m.InvisibleIcon }))),
     InvitePeopleIcon: lazy(() => import('../InvitePeopleIcon').then(m => ({ default: m.InvitePeopleIcon }))),
-    IpRestrictionIcon: lazy(() => import('../IpRestrictionIcon').then(m => ({ default: m.IpRestrictionIcon }))),
     IssueBugIcon: lazy(() => import('../IssueBugIcon').then(m => ({ default: m.IssueBugIcon }))),
     ItemRecommendationIcon: lazy(() => import('../ItemRecommendationIcon').then(m => ({ default: m.ItemRecommendationIcon }))),
     JourneyTactic30Icon: lazy(() => import('../JourneyTactic30Icon').then(m => ({ default: m.JourneyTactic30Icon }))),

package/es/components/icons/index.d.ts

@@ -206,7 +206,6 @@ export { Integration30Icon } from './Integration30Icon';
 export { InteractiveIcon } from './InteractiveIcon';
 export { InvisibleIcon } from './InvisibleIcon';
 export { InvitePeopleIcon } from './InvitePeopleIcon';
-export { IpRestrictionIcon } from './IpRestrictionIcon';
 export { IssueBugIcon } from './IssueBugIcon';
 export { ItemRecommendationIcon } from './ItemRecommendationIcon';
 export { JourneyTactic30Icon } from './JourneyTactic30Icon';

package/es/components/icons/index.js

@@ -206,7 +206,6 @@ export { Integration30Icon } from './Integration30Icon';
 export { InteractiveIcon } from './InteractiveIcon';
 export { InvisibleIcon } from './InvisibleIcon';
 export { InvitePeopleIcon } from './InvitePeopleIcon';
-export { IpRestrictionIcon } from './IpRestrictionIcon';
 export { IssueBugIcon } from './IssueBugIcon';
 export { ItemRecommendationIcon } from './ItemRecommendationIcon';
 export { JourneyTactic30Icon } from './JourneyTactic30Icon';

package/es/components/molecules/AccountSelection/AccountListing.js

@@ -33,7 +33,7 @@ export const AccountListing = React.forwardRef((props, ref) => {
     }, 
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [onChange, recentData]);
-    return (_jsxs(AccountSelectionStyled, { className: className, children: [_jsx(Input, { placeholder: "Search", suffix: _jsx(Icon, { type: "icon-ants-search-2", style: { fontSize: '24px', color: THEME.token?.bw8 } }), value: searchValue, onChange: event => setSearchValue(event.target.value) }), _jsx("div", { className: "account-list", children: _jsx("ul", { children: _jsxs(Scrollbars, { style: { width: '100%', height: showAllAccount ? '364px' : '410px' }, children: [recentData?.value?.length && recentData?.value?.length > 0 ? (_jsxs(_Fragment, { children: [_jsx(Text, { className: "recent-text", children: "Recent" }), recentData?.value
+    return (_jsxs(AccountSelectionStyled, { className: className, children: [_jsx(Input, { placeholder: "Search", suffix: _jsx(Icon, { type: "icon-ants-search-2", style: { fontSize: '24px', color: THEME.token?.bw8 } }), value: searchValue, onChange: event => setSearchValue(event.target.value) }), _jsx("div", { className: "account-list", children: _jsx("ul", { children: _jsxs(Scrollbars, { style: { width: '100%', height: showAllAccount ? '364px' : '410px' }, children: [recentData?.value?.length ? (_jsxs(_Fragment, { children: [_jsx(Text, { className: "recent-text", children: "Recent" }), recentData?.value
                                         .map(accountId => accountData?.find(account => account.userId === accountId))
                                         .filter((accountId, index, self) => Boolean(accountId) && index === self.indexOf(accountId))
                                         .map(account => (_jsx(AccountItem, { userName: account.userName, userId: account.userId, onClick: handleSelectAccount, isSelected: +currentAccount === account.userId }, account.userId))), _jsx(Divider, { style: { margin: '8px 0', color: THEME.token?.bw3 } })] })) : null, accountData

package/es/components/molecules/AccountSelection/index.d.ts

@@ -1,3 +1,4 @@
 export { AccountSelection, type AccountSelectionProps } from './AccountSelection';
-export { AccountListing, type AccountListingHandle } from './AccountListing';
+export { AccountListing } from './AccountListing';
+export type { AccountListingHandle } from './AccountListing';
 export { useAccountSelection } from './hooks';

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

@@ -1,3 +1,4 @@
+/// <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/CalendarSelection/CalendarSelection.js

@@ -10,15 +10,16 @@ import { LOCAL_TIMEZONE, RANGE_LIMIT } from './constants';
 import { initState, resetValue } from './actions';
 import { useTriggerOut } from './hooks/useTriggerOut';
 export const CalendarSelection = props => {
-    const initialized = useRef(false);
+    const initialed = useRef(false);
     const { value, rangeLimit = RANGE_LIMIT, timezone = LOCAL_TIMEZONE, timeDisplayProps, popoverProps, rangePickerProps, onChange, } = props;
     const [state, dispatch] = useReducer(reducer, INITIAL_STATE);
     useLayoutEffect(() => {
-        if (!value || initialized.current)
+        if (!value)
             return;
-        const needTriggerOut = !initialized.current;
+        const needTriggerOut = !initialed.current;
+        // console.log({ needTriggerOut });
         dispatch(initState(value, needTriggerOut));
-        initialized.current = true;
+        initialed.current = true;
     }, [value]);
     useLayoutEffect(() => {
         if (!state.open) {

package/es/components/molecules/ColorPicker/CustomPicker/index.js

@@ -42,7 +42,7 @@ const styleContainAlpha = {
 };
 const CustomPicker = props => {
     // Props
-    const { className, style, children, isHideAlpha, onChange, onChangeComplete, presetColors, ...restOf } = props;
+    const { className, style, children, onChange, onChangeComplete, presetColors, ...restOf } = props;
     // State
     const [isShowRgbaInput, setShowRgbaInput] = useState(true);
     const onChangeRgbaColor = (key, value) => {
@@ -68,7 +68,7 @@ const CustomPicker = props => {
                                     width: '100%',
                                     height: 12,
                                     marginTop: 10,
-                                }, children: _jsx(Alpha, { ...restOf, pointer: HuePointer, onChange: onChange }) })] })] }), _jsxs("div", { style: { ...wrapperStyling, paddingBottom: 15 }, children: [_jsx(Icon, { type: "icon-ants-unfold-more", style: { cursor: 'pointer', fontSize: '20px' }, onClick: () => setShowRgbaInput(!isShowRgbaInput) }), isShowRgbaInput ? (_jsxs("div", { style: rgbaInputStyling, children: [_jsxs("div", { style: rgbaStyling, children: [_jsx(InputNumberWrapper, { value: props.rgb?.r, controls: false, onChange: value => onChangeRgbaColor('r', value) }), _jsx(Text, { style: { position: 'absolute', bottom: '-20px' }, children: "R" })] }), _jsxs("div", { style: rgbaStyling, children: [_jsx(InputNumberWrapper, { value: props.rgb?.g, controls: false, onChange: value => onChangeRgbaColor('g', value) }), _jsx(Text, { style: { position: 'absolute', bottom: '-20px' }, children: "G" })] }), _jsxs("div", { style: rgbaStyling, children: [_jsx(InputNumberWrapper, { value: props.rgb?.b, controls: false, onChange: value => onChangeRgbaColor('b', value) }), _jsx(Text, { style: { position: 'absolute', bottom: '-20px' }, children: "B" })] }), !isHideAlpha && (_jsxs("div", { style: rgbaStyling, children: [_jsx(InputNumberWrapper, { value: props.rgb?.a, controls: false, onChange: value => onChangeRgbaColor('a', value) }), _jsx(Text, { style: { position: 'absolute', bottom: '-20px' }, children: "A" })] }))] })) : (_jsxs(EditableInputWrapper, { children: [_jsx(EditableInput, { value: props.color, onChange: onChange }), _jsx(Text, { style: { position: 'absolute', bottom: '-20px' }, children: "HEX" })] })), _jsx(Button, { onClick: () => {
+                                }, children: _jsx(Alpha, { ...restOf, pointer: HuePointer, onChange: onChange }) })] })] }), _jsxs("div", { style: { ...wrapperStyling, paddingBottom: 15 }, children: [_jsx(Icon, { type: "icon-ants-unfold-more", style: { cursor: 'pointer', fontSize: '20px' }, onClick: () => setShowRgbaInput(!isShowRgbaInput) }), isShowRgbaInput ? (_jsxs("div", { style: rgbaInputStyling, children: [_jsxs("div", { style: rgbaStyling, children: [_jsx(InputNumberWrapper, { value: props.rgb?.r, controls: false, onChange: value => onChangeRgbaColor('r', value) }), _jsx(Text, { style: { position: 'absolute', bottom: '-20px' }, children: "R" })] }), _jsxs("div", { style: rgbaStyling, children: [_jsx(InputNumberWrapper, { value: props.rgb?.g, controls: false, onChange: value => onChangeRgbaColor('g', value) }), _jsx(Text, { style: { position: 'absolute', bottom: '-20px' }, children: "G" })] }), _jsxs("div", { style: rgbaStyling, children: [_jsx(InputNumberWrapper, { value: props.rgb?.b, controls: false, onChange: value => onChangeRgbaColor('b', value) }), _jsx(Text, { style: { position: 'absolute', bottom: '-20px' }, children: "B" })] }), _jsxs("div", { style: rgbaStyling, children: [_jsx(InputNumberWrapper, { value: props.rgb?.a, controls: false, onChange: value => onChangeRgbaColor('a', value) }), _jsx(Text, { style: { position: 'absolute', bottom: '-20px' }, children: "A" })] })] })) : (_jsxs(EditableInputWrapper, { children: [_jsx(EditableInput, { value: props.color, onChange: onChange }), _jsx(Text, { style: { position: 'absolute', bottom: '-20px' }, children: "HEX" })] })), _jsx(Button, { onClick: () => {
                             setShowRgbaInput(true);
                             onChange('rgba(0, 0, 0, 0)');
                         }, children: "Clear" })] }), presetColors ? (_jsxs("div", { children: [_jsx(Divider, {}), presetColors] })) : null] }));

package/es/components/molecules/ColorPicker/index.d.ts

@@ -3,7 +3,6 @@ export interface ColorPickerProps {
     className?: string;
     color?: string;
     presetColors?: any[] | ReactNode;
-    isHideAlpha?: boolean;
     defaultColor?: string;
     icon?: React.ReactNode | string;
     onChange?: (color: string) => void;

package/es/components/molecules/ColorPicker/index.js

@@ -22,7 +22,7 @@ const styleBtnColor = {
 };
 export const ColorPicker = props => {
     // Props
-    const { className = '', defaultColor = '#000000', presetColors, positionInput = 'left', icon, showInput = true, style = {}, isHideAlpha, } = props;
+    const { className = '', defaultColor = '#000000', presetColors, positionInput = 'left', icon, showInput = true, style = {}, } = props;
     const { onChange = () => { } } = props;
     // States
     const [color, setColor] = useState(defaultColor);
@@ -71,7 +71,7 @@ export const ColorPicker = props => {
     const onPopoverVisibleChange = visible => {
         setPopoverVisible(visible);
     };
-    return (_jsxs(ColorPickerWrapper, { className: `antsomi-color-picker ${className || ''}`, style: style, children: [showInput && positionInput === 'left' && (_jsx(Input, { style: { textTransform: 'uppercase' }, value: color, onChange: onChangeColorInput })), _jsx(Popover, { arrow: true, content: _jsx(CustomPicker, { color: color, presetColors: presetColors, isHideAlpha: isHideAlpha, onChange: onChangeColorPicker, onChangeComplete: onChangeComplete }), trigger: "click", open: popoverVisible, getPopupContainer: triggerNode => triggerNode, onOpenChange: onPopoverVisibleChange, children: _jsx("div", { className: "antsomi-popover-button", style: styleBtnColor, children: iconNode || (_jsx("span", { style: {
+    return (_jsxs(ColorPickerWrapper, { className: `antsomi-color-picker ${className || ''}`, style: style, children: [showInput && positionInput === 'left' && (_jsx(Input, { style: { textTransform: 'uppercase' }, value: color, onChange: onChangeColorInput })), _jsx(Popover, { arrow: true, content: _jsx(CustomPicker, { color: color, presetColors: presetColors, onChange: onChangeColorPicker, onChangeComplete: onChangeComplete }), trigger: "click", open: popoverVisible, getPopupContainer: triggerNode => triggerNode, onOpenChange: onPopoverVisibleChange, children: _jsx("div", { className: "antsomi-popover-button", style: styleBtnColor, children: iconNode || (_jsx("span", { style: {
                             backgroundColor: color,
                             display: 'block',
                             width: 20,
@@ -83,7 +83,6 @@ ColorPicker.defaultProps = {
     className: '',
     color: '#000000',
     defaultColor: '#000000',
-    isHideAlpha: false,
     onChange: () => { },
     showInput: true,
     positionInput: 'left',

package/es/components/molecules/DrawerDetail/DrawerDetail.js

@@ -16,7 +16,7 @@ import { safeParseJson } from '@antscorp/antsomi-ui/es/utils';
 import { POST_MESSAGE_TYPES } from '@antscorp/antsomi-ui/es/constants';
 export const DrawerDetail = props => {
     // Props
-    const { width, fullScreen: fullScreenProp = false, children, menuProps, closeIconProps, maxWidth, minWidth, defaultSize = 'max', headerProps, name, destroyOnClose = true, mask = false, onToggleCollapse, ...restProps } = props;
+    const { width, fullScreen: fullScreenProp = false, children, menuProps, closeIconProps, maxWidth, minWidth, defaultSize = 'max', headerProps, name, destroyOnClose = true, onToggleCollapse, ...restProps } = props;
     const { show: showMenu = true, showExpandButton = true, showClose = true, items, selectedKeys, footer, onClick = () => { }, } = menuProps || {};
     const { children: headerChildren, ...restOfHeaderProps } = headerProps || {};
     const { onClose = () => { } } = props;
@@ -120,7 +120,7 @@ export const DrawerDetail = props => {
             motionAppear: false,
             motionEnter: false,
             motionLeave: false,
-        }, mask: mask, classNames: {
+        }, classNames: {
             body: 'drawer-detail-body',
         }, contentWrapperStyle: {
             transition: 'none',
@@ -131,5 +131,5 @@ export const DrawerDetail = props => {
                     onClose(e);
                 }, children: _jsx(Icon, { type: "icon-ants-remove-slim", size: 14 }) })), showExpandButton && !fullScreen && (_jsx(ToggleDrawerSizeButton, { style: {
                     ...(!showMenu && { background: '#ffffff' }),
-                }, onClick: () => handleToggleDrawerSize(), collapse: collapseDrawer })), showMenu && (_jsxs(LeftMenu, { "data-test": "left-menu", className: "animate__animated animate__fadeIn", children: [_jsxs("div", { children: [showClose && (_jsx(CloseBtn, { "data-test": "close-btn", onClick: onClose, children: _jsx(Icon, { type: "icon-ants-remove-slim", size: 14 }) })), _jsx(Flex, { vertical: true, gap: 10, align: "center", justify: "center", children: items?.map((item) => (_jsx(Tooltip, { title: item?.label, mouseEnterDelay: 0.3, placement: "right", children: _jsx(MenuItem, { className: selectedKeys?.includes(item.key) ? 'active' : '', onClick: () => onClick && onClick(item), children: item.icon }, item?.key) }, item?.key))) })] }), _jsx(MenuFooter, { children: footer })] })), _jsxs(Content, { className: "drawer-detail-content", children: [headerProps?.children && (_jsx(DrawerHeader, { align: "center", ...restOfHeaderProps, children: headerChildren })), children] })] }));
+                }, onClick: () => handleToggleDrawerSize(), collapse: collapseDrawer })), showMenu && (_jsxs(LeftMenu, { className: "animate__animated animate__fadeIn", children: [_jsxs("div", { children: [showClose && (_jsx(CloseBtn, { onClick: onClose, children: _jsx(Icon, { type: "icon-ants-remove-slim", size: 14 }) })), _jsx(Flex, { vertical: true, gap: 10, align: "center", justify: "center", children: items?.map((item) => (_jsx(Tooltip, { title: item?.label, mouseEnterDelay: 0.3, placement: "right", children: _jsx(MenuItem, { className: selectedKeys?.includes(item.key) ? 'active' : '', onClick: () => onClick && onClick(item), children: item.icon }, item?.key) }, item?.key))) })] }), _jsx(MenuFooter, { children: footer })] })), _jsxs(Content, { className: "drawer-detail-content", children: [headerProps?.children && (_jsx(DrawerHeader, { align: "center", ...restOfHeaderProps, children: headerChildren })), children] })] }));
 };

package/es/components/molecules/EditableName/EditableName.js

@@ -52,7 +52,7 @@ export const EditableName = React.forwardRef((props, ref) => {
             inputRefElement?.input?.removeEventListener('wheel', preventWheel);
         };
     }, []);
-    return (_jsxs(InputWrapperStyled, { "data-test": props['data-test'] || 'editable-name', className: className || '', style: style, ref: componentInViewRef, children: [_jsx(Tooltip, { title: value || internalValue, children: _jsx(Input, { readOnly: readonly, ref: inputRef, style: { width: inputWidth + 2 }, defaultValue: defaultValue.current, value: value, onChange: event => {
+    return (_jsxs(InputWrapperStyled, { className: className || '', style: style, ref: componentInViewRef, children: [_jsx(Tooltip, { title: value || internalValue, children: _jsx(Input, { readOnly: readonly, ref: inputRef, style: { width: inputWidth + 2 }, defaultValue: defaultValue.current, value: value, onChange: event => {
                         const newValue = event.target.value;
                         if (spanRef.current)
                             spanRef.current.innerText = newValue;

package/es/components/molecules/FontSetting/index.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import React, { useMemo } from 'react';
+import { useMemo } from 'react';
 /* Components */
 import { Space } from '@antscorp/antsomi-ui/es/components/atoms/Space';
 import { Switch } from '@antscorp/antsomi-ui/es/components/atoms/Switch';
@@ -35,7 +35,7 @@ export const FontSettingEdit = ({ settings, styles, showSettings, onChange, }) =
     [settings]);
     const filteredSetting = useMemo(() => {
         if (!showSettings || showSettings?.length === 0) {
-            return Object.keys(settingMap).map(keySetting => (_jsx(React.Fragment, { children: settingMap[keySetting] }, keySetting)));
+            return Object.keys(settingMap).map(keySetting => settingMap[keySetting]);
         }
         return showSettings.map(keySetting => settingMap[keySetting]);
     }, [showSettings, settingMap]);

package/es/components/molecules/MatchAnySelect/MatchesAnySelect.js

@@ -54,11 +54,7 @@ export function MatchesAny(props) {
         threshold: 0,
         initialIsIntersecting: false,
         onChange(isIntersecting) {
-            // Only load more items if the search input is empty and not in external search mode.
-            // This prevents loading more items when the user is searching for something specific.
-            const isNoNeedToLoadMore = !!searchValue && !isExternalSearch;
-            if (isIntersecting && !isNoNeedToLoadMore) {
-                // Load more items when the user reaches the end of the list.
+            if (isIntersecting) {
                 onLoadMore();
             }
         },
@@ -383,5 +379,5 @@ export function MatchesAnySelect(props) {
                         ...dropdownStyle,
                         display: 'none',
                         padding: 0,
-                    }, loading: loading, status: props.status || (error ? 'error' : undefined), ...restProps }), !!error && (_jsx(Text, { className: "ant-form-item-explain-error", type: "danger", children: error }))] }) }));
+                    }, loading: loading, status: props.status || (error ? 'error' : undefined), ...restProps }), !!error && _jsx(Text, { className: 'ant-form-item-explain-error', type: 'danger', children: error })] }) }));
 }

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

@@ -1,6 +1,5 @@
 import React from 'react';
 interface RequestAccessProps {
-    fullscreen?: boolean;
     className?: string;
     placeholder?: string;
     deniedTitle?: string;

package/es/components/molecules/RequestAccess/RequestAccess.js

@@ -1,12 +1,15 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { useRef, useState } from 'react';
 import { Button, Flex, TextArea, Typography } from '@antscorp/antsomi-ui/es/components';
-import { translate as t, translations } from '@antscorp/antsomi-locales';
 // Styled
 import { RequestAccessStyled } from './styled';
+// Translate
+import i18nInstance from '@antscorp/antsomi-ui/es/locales/i18n';
+import { translations } from '@antscorp/antsomi-ui/es/locales/translations';
 import { BlockIcon } from '../../icons';
+const { t } = i18nInstance;
 export const RequestAccess = props => {
-    const { fullscreen, className, placeholder = t(translations.requestAccess.placeholder), deniedTitle = t(translations.requestAccess.deniedTitle), deniedSubTitle = t(translations.requestAccess.deniedSubTitle), sentTitle = t(translations.requestAccess.sentTitle), sentSubTitle = t(translations.requestAccess.sentSubTitle), requestText = t(translations.requestAccess.requestText), switchAccountText = t(translations.requestAccess.switchAccountText), onRequest, onSwitchAccount, } = props;
+    const { className, placeholder = t(translations.requestAccess.placeholder), deniedTitle = t(translations.requestAccess.deniedTitle), deniedSubTitle = t(translations.requestAccess.deniedSubTitle), sentTitle = t(translations.requestAccess.sentTitle), sentSubTitle = t(translations.requestAccess.sentSubTitle), requestText = t(translations.requestAccess.requestText), switchAccountText = t(translations.requestAccess.switchAccountText), onRequest, onSwitchAccount, } = props;
     const [isSentRequest, setIsSentRequest] = useState(false);
     const [isLoading, setIsLoading] = useState(false);
     const messageRef = useRef(null);
@@ -16,8 +19,10 @@ export const RequestAccess = props => {
             try {
                 setIsLoading(true);
                 onRequest(message)
-                    .then(() => {
-                    setIsSentRequest(true);
+                    .then(data => {
+                    if (data) {
+                        setIsSentRequest(true);
+                    }
                 })
                     .finally(() => setIsLoading(false));
             }
@@ -31,5 +36,5 @@ export const RequestAccess = props => {
         if (onSwitchAccount)
             onSwitchAccount();
     };
-    return (_jsx(RequestAccessStyled, { className: `antsomi-request-access ${className || ''}`, style: fullscreen ? { inset: 0, height: '100vh' } : {}, children: _jsxs(Flex, { vertical: true, gap: 20, children: [_jsxs(Flex, { vertical: true, gap: 5, children: [_jsx(Typography.Text, { className: "denied-title", children: isSentRequest ? (sentTitle) : (_jsxs(_Fragment, { children: [deniedTitle, _jsx(BlockIcon, {})] })) }), _jsx(Typography.Text, { className: "denied-sub-title", children: isSentRequest ? sentSubTitle : deniedSubTitle })] }), !isSentRequest ? (_jsx(TextArea, { style: { resize: 'none' }, placeholder: placeholder, ref: messageRef })) : null, _jsxs(Flex, { className: "action-buttons", gap: 10, children: [isSentRequest ? null : (_jsx(Button, { onClick: handleClickRequest, type: "primary", loading: isLoading, children: requestText })), _jsx(Button, { onClick: handleSwitchAccount, children: switchAccountText })] })] }) }));
+    return (_jsx(RequestAccessStyled, { className: `antsomi-request-access ${className || ''}`, children: _jsxs(Flex, { vertical: true, gap: 20, children: [_jsxs(Flex, { vertical: true, gap: 5, children: [_jsx(Typography.Text, { className: "denied-title", children: isSentRequest ? (sentTitle) : (_jsxs(_Fragment, { children: [deniedTitle, _jsx(BlockIcon, {})] })) }), _jsx(Typography.Text, { className: "denied-sub-title", children: isSentRequest ? sentSubTitle : deniedSubTitle })] }), !isSentRequest ? (_jsx(TextArea, { style: { resize: 'none' }, placeholder: placeholder, ref: messageRef })) : null, _jsxs(Flex, { className: "action-buttons", gap: 10, children: [isSentRequest ? null : (_jsx(Button, { onClick: handleClickRequest, type: "primary", loading: isLoading, children: requestText })), _jsx(Button, { onClick: handleSwitchAccount, children: switchAccountText })] })] }) }));
 };

package/es/components/molecules/RichMenu/RichMenuBlock/constants.js

@@ -721,7 +721,7 @@ export const SAMPLE_RICHMENU = {
         displayDefault: true,
     },
     image: {
-        imageUrl: 'https://s.cystack.net/portal/organizations/487b0f9dd9d8543312dc25e32ac71e4f/logo.jpg',
+        imageUrl: 'https://sandbox-st-media-template.antsomi.com/upload/2024/01/04/8d8cf39a-748f-435c-b6c6-b71b5facc739.gif',
         imageStyles: {
             borderTopLeftRadius: '0px',
             borderTopRightRadius: '0px',

package/es/components/molecules/SearchPopover/components/PopoverSelect/PopoverSelect.js

@@ -2,7 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 import { useEffect, useMemo, useRef, useState } from 'react';
 import { SearchPopover } from '../../SearchPopover';
 import './styles.scss';
-import { Button, Checkbox, Typography } from '../../../../atoms';
+import { Button, Checkbox } from '../../../../atoms';
 import { StyledAction, StyledFooter, StyledListFieldsWrapper } from './styled';
 import { EmptyData } from '../../../EmptyData';
 import i18nInstance from '@antscorp/antsomi-ui/es/locales/i18n';
@@ -103,9 +103,7 @@ export const PopoverSelect = (props) => {
         if (typeof option.label === 'function') {
             return option.label({ selected: selectedKeys.has(option.key) });
         }
-        return (_jsx(Typography.Text, { ellipsis: {
-                tooltip: option.label,
-            }, style: { maxWidth: 310 }, children: option.label }));
+        return option.label;
     };
     const items = filteredOptions.map(opt => ({
         key: opt.key,

package/es/components/molecules/SelectAccount/ButtonViewAll.js

@@ -1,28 +1,20 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // Libraries
-import { useContext, useState } from 'react';
+import { useContext } from 'react';
 // Context
 import { SelectAccountContext } from './context';
 // Components
 import { ButtonViewAllStyled, ViewAllWrapper } from './styled';
-import { Icon, Input, Popover } from '../../atoms';
+import { Popover } from '../../atoms';
 import AccountChip from './AccountChip';
-import { searchStringQuery } from '@antscorp/antsomi-ui/es/utils';
 const ButtonViewAll = () => {
     const { state, dispatch } = useContext(SelectAccountContext);
-    const { usersSelected, nameKey, userIdKey, users, styles, showSearchViewAll } = state;
-    const [search, setSearch] = useState('');
-    const searchedUsers = showSearchViewAll
-        ? usersSelected.filter(id => {
-            const user = users.find(u => u?.[userIdKey] === id);
-            return searchStringQuery(user?.[nameKey], search);
-        })
-        : usersSelected;
+    const { usersSelected, nameKey, userIdKey, users, styles } = state;
     const handleRemove = ({ userId, index }) => {
         dispatch({ type: 'REMOVE_USER', payload: { userId, index } });
     };
-    const contentViewAll = () => (_jsxs(ViewAllWrapper, { children: [showSearchViewAll && (_jsx(Input, { value: search, placeholder: "Search", suffix: _jsx(Icon, { type: "icon-ants-search-2" }), onAfterChange: value => setSearch(value), debounce: 500 })), state.showOwnerDefault && _jsx(AccountChip, { label: "Owner", user: {}, value: "owner", disabled: true }), state.type === 'group'
-                ? searchedUsers?.map((id, index) => {
+    const contentViewAll = () => (_jsxs(ViewAllWrapper, { children: [state.showOwnerDefault && _jsx(AccountChip, { label: "Owner", user: {}, value: "owner", disabled: true }), state.type === 'group'
+                ? usersSelected?.map((id, index) => {
                     const group = state.listAccountGroup.find(u => u?.[state?.groupIdKey] === id);
                     if (!group) {
                         const user = users.find(u => u?.[userIdKey] === id);
@@ -32,7 +24,7 @@ const ButtonViewAll = () => {
                     }
                     return (_jsx(AccountChip, { user: group, value: group?.[state.groupIdKey], label: group?.[state?.groupNameKey], onRemove: () => handleRemove({ userId: group?.[state.groupIdKey], index }) }, group?.[state.groupIdKey]));
                 })
-                : searchedUsers?.map((id, index) => {
+                : usersSelected?.map((id, index) => {
                     const user = users.find(u => u?.[userIdKey] === id);
                     return (_jsx(AccountChip, { user: user, value: user?.[userIdKey], label: user?.[nameKey], onRemove: () => handleRemove({ userId: user?.[userIdKey], index }) }, user?.[userIdKey]));
                 })] }));

package/es/components/molecules/SelectAccount/Content.js

@@ -10,11 +10,10 @@ import ButtonAdd from './ButtonAdd';
 import ButtonViewAll from './ButtonViewAll';
 export const Content = () => {
     const { state, dispatch } = useContext(SelectAccountContext);
-    const { usersSelected, nameKey, userIdKey, users, disabled, className, styles, hideAddButton } = state;
+    const { usersSelected, nameKey, userIdKey, users, disabled, className, styles } = state;
     const handleRemove = ({ userId, index }) => {
         dispatch({ type: 'REMOVE_USER', payload: { userId, index } });
     };
-    const isHideAddButton = hideAddButton || state?.isViewMode || (state?.onlyOne && usersSelected?.length);
     return (_jsxs(Wrapper, { className: `select-account ${className}`, style: { ...(styles?.wrapper || {}) }, disabled: !!disabled, children: [state.showOwnerDefault && _jsx(AccountChip, { label: "Owner", user: {}, value: "owner", disabled: true }), state.type === 'group'
                 ? usersSelected?.map((id, index) => {
                     if (index >= state?.limitShow)
@@ -35,5 +34,5 @@ export const Content = () => {
                     if (!user)
                         return null;
                     return (_jsx(AccountChip, { user: user, value: user?.[userIdKey], label: user?.[nameKey], onRemove: () => handleRemove({ userId: user?.[userIdKey], index }) }, user?.[userIdKey]));
-                }), state?.usersSelected?.length > state?.limitShow && _jsx(ButtonViewAll, {}), isHideAddButton ? null : _jsx(ButtonAdd, {})] }));
+                }), state?.usersSelected?.length > state?.limitShow && _jsx(ButtonViewAll, {}), !state?.isViewMode && (!state?.onlyOne || !usersSelected?.length) && _jsx(ButtonAdd, {})] }));
 };

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

@@ -136,10 +136,6 @@ export const ViewAllWrapper = styled.div `
   flex-wrap: wrap;
   max-width: 300px;
   padding: 15px;
-
-  .input__wrapper {
-    width: 100%;
-  }
 `;
 export const ItemOnlyOne = styled.div `
   padding: 8px 10px;

package/es/components/molecules/SelectAccount/type.d.ts

@@ -31,8 +31,6 @@ export type SelectAccountProps = {
     disabledAccount?: any[];
     limit?: number;
     limitShow?: number;
-    hideAddButton?: boolean;
-    showSearchViewAll?: boolean;
     className?: string;
     styles?: {
         wrapper?: React.CSSProperties;