@antscorp/antsomi-ui 1.3.10 → 1.3.11

package/es/components/molecules/ResizeGrid/ResizeGrid.js

@@ -34,7 +34,7 @@ const defaultProps = {
     selectColor: '#2f79bf80',
 };
 export const ResizeGrid = props => {
-    const { containerStyle, cellBorder, cellStyle, cellActiveStyle, isPreview, renderCell, grid: initGrid, image, imageSize, imagePosition, isCompact, onChange, delayUpdate, selectColor, } = props;
+    const { containerStyle, cellBorder, cellStyle, cellActiveStyle, isPreview, renderCell, grid: initGrid, image, imageSize, imagePosition, isCompact, onChange, delayUpdate, selectColor, reCalculateFlag, } = props;
     const [grid, setGrid] = useState(buildGrid(initGrid || GRID_TEMPLATE.GRID_2_3));
     const startRef = useRef(null);
     const startCellRef = useRef(null);
@@ -106,7 +106,7 @@ export const ResizeGrid = props => {
     useEffect(() => {
         handleChangeGrid();
         // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [grid]);
+    }, [grid, reCalculateFlag]);
     useDeepCompareEffect(() => {
         // console.log('changed grid', initGrid, acceptUpdateRef.current, initGrid?.rows, initGrid?.cols)
         // console.log(initRef.current < 2,!initDoneRef.current, acceptUpdateRef.current)
@@ -560,11 +560,15 @@ export const ResizeGrid = props => {
     };
     const downSelect = (idx, cell) => {
         // console.log('dow select', idx, cell);
+        if (isPreview)
+            return;
         !cell.active && activeCell({ idx });
         selectRef.current = { idx, cell };
         gridRef.current = grid;
     };
     const unMerge = (cell, idx) => {
+        if (isPreview)
+            return;
         const { colStart, colEnd, rowStart, rowEnd } = cell;
         if (colStart + 1 === colEnd && rowStart + 1 === rowEnd) {
             return;
@@ -604,6 +608,8 @@ export const ResizeGrid = props => {
         });
     }
     const upSelect = (idx, cell) => {
+        if (isPreview)
+            return;
         // console.log('up select', idx, cell);
         if (selectRef.current &&
             selectEndRef.current &&
@@ -634,6 +640,8 @@ export const ResizeGrid = props => {
         selectEndRef.current = null;
     };
     const hoverSelect = (idx, cell) => {
+        if (isPreview)
+            return;
         if (selectRef.current && gridRef.current) {
             // console.log('hover select', idx, cell);
             const { cell: cellStart, idx: idxStart } = selectRef.current;

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

@@ -136,6 +136,7 @@ export interface IResizeGridProps {
     containerStyle?: React.CSSProperties;
     isCompact?: boolean;
     delayUpdate?: number;
+    reCalculateFlag?: number | boolean;
 }
 export type TCordinate = {
     x: number;

package/es/components/molecules/RichMenu/RichMenuBlock/RichMenuBlock.d.ts

@@ -9,5 +9,6 @@ export interface RichMenuBlockProps {
     cellActiveIdx?: number;
     onClickCell?: (cellIdx: number) => void;
     onChange?: (richMenu: RichMenu, source?: 'user' | 'system') => void;
+    reCalculateFlag?: boolean | number;
 }
 export declare const RichMenuBlock: React.FC<RichMenuBlockProps>;

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

@@ -8,7 +8,7 @@ import { RichMenuCell } from './RichMenuCell';
 import { tryCatchWrapper } from '@antscorp/antsomi-ui/es/utils';
 const PATH = 'src/app/modules/Dashboard/containers/RichMenu/containers/Design/components/Workspace/components/RichMenuBlock/index.tsx';
 export const RichMenuBlock = props => {
-    const { richMenu, layerActive, cellActiveIdx, isPreview, isActionLink = false, onClickCell, onChange, } = props;
+    const { richMenu, layerActive, cellActiveIdx, isPreview, isActionLink = false, onClickCell, onChange, reCalculateFlag, } = props;
     const { gridTemplateCols = [], gridTemplateRows = [], cells = [], uploadMode, image, layoutType, rows, cols, } = richMenu || {};
     const { imageUrl, imageStyles } = image || {};
     const grid = {
@@ -45,7 +45,7 @@ export const RichMenuBlock = props => {
         }
     }, PATH);
     const renderCell = (cellInfo, ctx) => (React.createElement(RichMenuCell, { context: ctx, isActionLink: isActionLink, isPreview: isPreview, layerActive: layerActive, cellActiveIdx: cellActiveIdx, cell: cellInfo, isSingleMode: isSingleUploadMode, onClick: handleClickCell }));
-    return (React.createElement(ResizeGrid, Object.assign({ grid: grid, isPreview: isPreview, containerStyle: imageStyles, isCompact: layoutType === 'compact', renderCell: renderCell, cellActiveStyle: { background: 'rgba(0, 95, 184, 0.5)' }, cellBorder: isSingleUploadMode ? '1px solid rgba(0, 95, 184, 1)' : '1px dotted #000000', onChange: handleGridChange }, Object.assign({}, (isSingleUploadMode && {
+    return (React.createElement(ResizeGrid, Object.assign({ grid: grid, isPreview: isPreview, containerStyle: imageStyles, isCompact: layoutType === 'compact', renderCell: renderCell, cellActiveStyle: { background: 'rgba(0, 95, 184, 0.5)' }, cellBorder: isSingleUploadMode ? '1px solid rgba(0, 95, 184, 1)' : '1px dotted #000000', onChange: handleGridChange, reCalculateFlag: reCalculateFlag }, Object.assign({}, (isSingleUploadMode && {
         image: imageUrl,
         imagePosition: imageStyles === null || imageStyles === void 0 ? void 0 : imageStyles.objectPosition,
         imageSize: imageStyles === null || imageStyles === void 0 ? void 0 : imageStyles.objectFit,

package/es/components/molecules/RichMenu/RichMenuMobileView/RichMenuMobileView.d.ts

@@ -5,6 +5,7 @@ interface RichMenuMobileViewProps extends React.HTMLAttributes<HTMLDivElement> {
     isPreview?: boolean;
     onChangeRichMenu?: (richMenu: RichMenu, source?: 'user' | 'system') => void;
     onClickCell?: (cellIndex: number) => void;
+    reCalculateFlag?: boolean | number;
 }
 export declare const RichMenuMobileView: React.FC<RichMenuMobileViewProps>;
 export {};

package/es/components/molecules/RichMenu/RichMenuMobileView/RichMenuMobileView.js

@@ -20,7 +20,7 @@ import { RichMenuBlock } from '../RichMenuBlock';
 // Styles
 import { MobileContent, RichMenuWrapper, TopBar } from './styled';
 export const RichMenuMobileView = props => {
-    const { richMenu, className, isPreview, onChangeRichMenu, onClickCell } = props, restOfProps = __rest(props, ["richMenu", "className", "isPreview", "onChangeRichMenu", "onClickCell"]);
+    const { richMenu, className, isPreview, onChangeRichMenu, onClickCell, reCalculateFlag } = props, restOfProps = __rest(props, ["richMenu", "className", "isPreview", "onChangeRichMenu", "onClickCell", "reCalculateFlag"]);
     // State
     const [state, setState] = useState({
         showRichMenu: true,
@@ -32,6 +32,6 @@ export const RichMenuMobileView = props => {
     return (React.createElement(MobileFrame, Object.assign({ className: `ants-mx-auto ${className}` }, restOfProps),
         isPreview && React.createElement(TopBar, { src: IphoneTopBar, width: "100%", height: "auto" }),
         React.createElement(MobileContent, null,
-            React.createElement(RichMenuWrapper, { "$showRichMenu": showRichMenu && !showTypingChat, "$isPreview": !!isPreview }, richMenu && (React.createElement(RichMenuBlock, { richMenu: richMenu, isPreview: isPreview, onChange: onChangeRichMenu, onClickCell: onClickCell }))),
+            React.createElement(RichMenuWrapper, { "$showRichMenu": showRichMenu && !showTypingChat, "$isPreview": !!isPreview }, richMenu && (React.createElement(RichMenuBlock, { richMenu: richMenu, isPreview: isPreview, onChange: onChangeRichMenu, onClickCell: onClickCell, reCalculateFlag: reCalculateFlag }))),
             React.createElement(RichMenuChatBar, { disabled: !isPreview, label: richMenu === null || richMenu === void 0 ? void 0 : richMenu.chatBar.label, showRichMenu: showRichMenu, showTypingChat: showTypingChat, onToggleRichMenu: showRichMenu => setState(prevState => (Object.assign(Object.assign({}, prevState), { showRichMenu: !!showRichMenu }))), onToggleTypingChat: showTypingChat => setState(prevState => (Object.assign(Object.assign({}, prevState), { showTypingChat: !!showTypingChat }))) }))));
 };

package/package.json

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