@gingkoo/pandora-metabase 1.0.145 → 1.0.147

package/lib/cjs/types.d.ts

@@ -26,6 +26,20 @@ export interface FormulaDiffCodeParams {
     oldCode: AtomsItem[];
     newCode: AtomsItem[];
 }
+export interface MetabaseRightClickMenuItem {
+    label: React.ReactNode;
+    value: React.Key;
+    disabled?: boolean;
+    [key: string]: any;
+}
+export interface MetabaseRightClickMenuClickParams {
+    item: any;
+    itemText: string;
+    menuValue: React.Key;
+    menuItem: MetabaseRightClickMenuItem;
+    data: MetaListType[];
+    target?: HTMLElement;
+}
 export interface MetabaseProps {
     loading?: boolean;
     btnText?: string;
@@ -69,6 +83,9 @@ export interface MetabaseProps {
     moduleCopy?: boolean;
     showFormulaSql?: boolean;
     showFormulaDiff?: boolean;
+    matchBrackets?: boolean;
+    rightClickMenu?: MetabaseRightClickMenuItem[];
+    onRightClickMenuClick?: (params: MetabaseRightClickMenuClickParams) => boolean | void | Promise<boolean | void>;
     joinAliasConflictCheck?: boolean;
     getModuleDiffCode?: (obj: {
         oldCode: MetaListType;

package/lib/es/common/Loading/index.d.ts

@@ -1,6 +1,7 @@
 import './index.less';
+import React from 'react';
 declare const Loading: ({ show, msg }: {
     show: boolean;
     msg?: string;
-}) => import("react/jsx-runtime").JSX.Element | null;
+}) => React.JSX.Element | null;
 export default Loading;

package/lib/es/components/dialog/custom-column/dialog/function-tip.d.ts

@@ -1,7 +1,8 @@
 import './function-tip.less';
+import React from 'react';
 interface PropsType {
     funcName: string;
     didUpdate?: Function;
 }
-declare const FunctionTip: ({ funcName }: PropsType) => import("react/jsx-runtime").JSX.Element | null;
+declare const FunctionTip: ({ funcName }: PropsType) => React.JSX.Element | null;
 export default FunctionTip;

package/lib/es/components/dialog/custom-column/dialog/select-list.d.ts

@@ -1,4 +1,5 @@
 import './select-list.less';
+import React from 'react';
 import { OptionsTypeEnum } from '../expressions/suggest';
 export interface ListProps {
     type: OptionsTypeEnum;
@@ -10,5 +11,5 @@ export interface PropsType {
     onSelect: (type: OptionsTypeEnum, val: string) => any;
     didUpdate?: Function;
 }
-declare const SelectList: ({ data, onSelect }: PropsType) => import("react/jsx-runtime").JSX.Element;
+declare const SelectList: ({ data, onSelect }: PropsType) => React.JSX.Element;
 export default SelectList;

package/lib/es/components/dialog/custom-column/expression-editor.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import { MetaData_ColumnsType } from '../../../store/types';
 interface PropsType {
     store?: any;
@@ -5,5 +6,5 @@ interface PropsType {
     expression: string;
     onChange: (formula: string) => void;
 }
-declare const ExpressionEditor: (props: PropsType) => import("react/jsx-runtime").JSX.Element;
+declare const ExpressionEditor: (props: PropsType) => React.JSX.Element;
 export default ExpressionEditor;

package/lib/es/components/dialog/custom-column/index.d.ts

@@ -1,4 +1,5 @@
 import './index.less';
+import React from 'react';
 import { MetaCustom_Item, MetaData_ColumnsType } from '../../../store/types';
 interface PropsType {
     value: MetaCustom_Item;
@@ -6,5 +7,5 @@ interface PropsType {
     onChange: (record: MetaCustom_Item) => void;
     onClose: Function;
 }
-declare const CustomColumn: ({ value, data, onChange, onClose }: PropsType) => import("react/jsx-runtime").JSX.Element;
+declare const CustomColumn: ({ value, data, onChange, onClose }: PropsType) => React.JSX.Element;
 export default CustomColumn;

package/lib/es/components/dialog/custom-column/tokenized-expression.d.ts

@@ -5,6 +5,6 @@ interface PropsType {
     source: string;
 }
 export default class TokenizedExpression extends React.Component<PropsType> {
-    render(): import("react/jsx-runtime").JSX.Element;
+    render(): React.JSX.Element;
 }
 export {};

package/lib/es/components/dialog/custom-editor/index.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import './index.less';
 import { MetaCustom_Item } from '../../../store/types';
 interface PropsType {
@@ -7,5 +8,5 @@ interface PropsType {
     onOk: Function;
     onCancel: Function;
 }
-declare const CaseEditor: (props: PropsType) => import("react/jsx-runtime").JSX.Element;
+declare const CaseEditor: (props: PropsType) => React.JSX.Element;
 export default CaseEditor;

package/lib/es/components/dialog/expression/index.d.ts

@@ -1,4 +1,5 @@
 import './index.less';
+import React from 'react';
 import { AtomsExpression } from '../../../store/types';
 import { DataType } from '../select-column-multiple';
 interface PropsType {
@@ -11,5 +12,5 @@ interface PropsType {
     filterCustomType?: boolean;
     parentPopupChannel?: 'primary' | 'secondary';
 }
-declare const _default: (props: PropsType) => import("react/jsx-runtime").JSX.Element;
+declare const _default: (props: PropsType) => React.JSX.Element;
 export default _default;

package/lib/es/components/dialog/formula/index.js

@@ -19,6 +19,8 @@ import { Select, Button } from '@gingkoo/pandora';
 import cloneDeep from 'lodash/cloneDeep';
 import { useStore } from '../../../hooks/use-provider';
 import { getTopLayerZIndex } from '../../../utils/helper-dom';
+import { useRightClickValue } from '../../right-click-value';
+import SqbRightClickMenu, { openSqbRightClickMenu } from '../../right-click-menu';
 var VisualBox = Styled.div.attrs({
   className: 'visual-box scroller'
 })(_templateObject || (_templateObject = _taggedTemplateLiteral([""])));
@@ -71,6 +73,11 @@ var CaseEditor = React.forwardRef(function (props, ref) {
     });
   }, [currentFormulaKey, currentFormulaTemplate, effectiveArity]);
   var _ref = useRef(null);
+  var formulaRightClickValueId = useRightClickValue(fun);
+  var _useState5 = useState(null),
+    _useState6 = _slicedToArray(_useState5, 2),
+    rightClickMenuState = _useState6[0],
+    setRightClickMenuState = _useState6[1];
   var usable = useMemo(function () {
     return fun.name && isOk(fun.args);
   }, [fun]);
@@ -119,6 +126,9 @@ var CaseEditor = React.forwardRef(function (props, ref) {
     className: cx(props.className, 'function-box'),
     ref: ref,
     children: [_jsx(VisualBox, {
+      onContextMenu: function onContextMenu(e) {
+        return openSqbRightClickMenu(store, e, setRightClickMenuState);
+      },
       children: _jsx("div", {
         className: "Sqb-item Sqb-case-editor mb-2 mt-2",
         children: _jsxs("div", {
@@ -150,6 +160,7 @@ var CaseEditor = React.forwardRef(function (props, ref) {
                       className: cx("Sqb-TableName Sqb-TableName-OPERATOR", {
                         notSelected: !fun.name
                       }),
+                      "data-right-click-id": formulaRightClickValueId,
                       children: formulaName(fun, formulaList) || __('customColumn.selectFormula')
                     });
                   },
@@ -237,6 +248,10 @@ var CaseEditor = React.forwardRef(function (props, ref) {
           })]
         })
       })
+    }), _jsx(SqbRightClickMenu, {
+      popupZIndex: getTopLayerZIndex() + 10,
+      state: rightClickMenuState,
+      setState: setRightClickMenuState
     }), _jsx("div", {
       className: "btns p-4",
       children: _jsxs("div", {

package/lib/es/components/dialog/formula-list/CaseWhenGroup.d.ts

@@ -24,5 +24,5 @@ type Props = {
     activeRegionKey?: string | null;
     onActivateRegion?: (key: string) => void;
 };
-declare const CaseWhenGroup: ({ caseAtomsContent, whenClauses, elseContent, onAddBranch, onAddElse, onRemoveElse, onZoomCase, onDeleteCase, showTools, isNested, useBranchScrollInner, caseRegionKey, elseRegionKey, activeRegionKey, onActivateRegion, }: Props) => import("react/jsx-runtime").JSX.Element;
+declare const CaseWhenGroup: ({ caseAtomsContent, whenClauses, elseContent, onAddBranch, onAddElse, onRemoveElse, onZoomCase, onDeleteCase, showTools, isNested, useBranchScrollInner, caseRegionKey, elseRegionKey, activeRegionKey, onActivateRegion, }: Props) => React.JSX.Element;
 export default CaseWhenGroup;

package/lib/es/components/dialog/formula-list/LogicGroup.d.ts

@@ -9,5 +9,5 @@ type Props = {
     onDeleteItem: (operatorIndex: number, side: 'left' | 'right') => void;
     onDelete: (e: any) => void;
 };
-declare const LogicGroup: ({ items, onChangeOperator, onAddItem, onDeleteItem, onDelete, }: Props) => import("react/jsx-runtime").JSX.Element;
+declare const LogicGroup: ({ items, onChangeOperator, onAddItem, onDeleteItem, onDelete, }: Props) => React.JSX.Element;
 export default LogicGroup;

package/lib/es/components/dialog/formula-list/index.js

@@ -21,7 +21,7 @@ import isEqual from 'lodash/isEqual';
 import { getObjTem, getQuotes, formulaIsError } from '../formula/utils';
 import { AtomsTypeEnum, FormulaTypeEnum } from '../../../store/types';
 import { ColumnsPopupThemeEnum } from '../../../store/enum';
-import { Select, Input, Modal2, Modal, InputNumber, Space, Button, Checkbox, Tooltip, Code, Toast } from '@gingkoo/pandora';
+import { Select, Input, Modal2, Modal, InputNumber, Space, Button, Checkbox, Tooltip, Toast, Editor } from '@gingkoo/pandora';
 import cloneDeep from 'lodash/cloneDeep';
 import { buildSqlQuery, isError, changeCopyField, isExistsError, normalizeAndOrStructure } from '../../../utils';
 import Formula from '../formula';
@@ -32,6 +32,7 @@ import SelectList from '../../dialog/select-list';
 import arrow from './arrow.svg';
 import { useStore, Provider } from '../../../hooks/use-provider';
 import ItemName from '../../modules/components/item-name';
+import RightClickValue from '../../right-click-value';
 import DiffViewer from '../diff-viewer';
 import storage from '../../../utils/storage';
 import { getTopLayerZIndex } from '../../../utils/helper-dom';
@@ -576,12 +577,18 @@ var FormulaList = forwardRef(function (props, ref) {
             openChildModal({
               title: '查看SQL',
               transparentMask: true,
+              className: 'Sqb-FormulaSqlPreviewModal',
               content: _jsx("div", {
-                className: 'Sqb-FormulaSqlPreview  scroller',
-                children: _jsx(Code, {
-                  mode: 'code',
+                className: 'Sqb-FormulaSqlPreview ',
+                children: _jsx(Editor, {
+                  showFull: false,
+                  className: 'Sqb-FormulaSqlPreviewEditor',
                   language: 'sql',
-                  children: sql
+                  height: '100%',
+                  fullscreen: true,
+                  value: sql,
+                  showLanguage: false,
+                  matchBrackets: store.matchBrackets
                 })
               }),
               onClose: function onClose() {}
@@ -2165,13 +2172,16 @@ var FormulaList = forwardRef(function (props, ref) {
             openCheck: isCheck && !isCompositeAtom
           }),
           children: itemContent.raw ? itemContent.node : _jsx(ItemName, _objectSpread(_objectSpread({}, getItemNameProps(v)), {}, {
-            children: _jsx("div", _objectSpread(_objectSpread({
-              className: cx('Sqb-TableName', itemContent.className),
-              onClick: itemContent.onClick,
-              style: getTokenStyleByClassName(itemContent.className, itemContent.style)
-            }, itemContent.attrs || {}), {}, {
-              children: itemContent.node
-            }))
+            children: _jsx(RightClickValue, {
+              value: v,
+              children: _jsx("div", _objectSpread(_objectSpread({
+                className: cx('Sqb-TableName', itemContent.className),
+                onClick: itemContent.onClick,
+                style: getTokenStyleByClassName(itemContent.className, itemContent.style)
+              }, itemContent.attrs || {}), {}, {
+                children: itemContent.node
+              }))
+            })
           }))
         }), showAfterArrow && selectOperator({
           triggerElement: function triggerElement(value) {

package/lib/es/components/dialog/formula-list/index.less

@@ -29,8 +29,14 @@
 }
 
 .Sqb-FormulaSqlPreview {
-  max-height: 100%;
-  overflow: auto;
+  height: 100%;
+  min-height: 0;
+  // display: flex;
+
+  // &Editor {
+  //   flex: 1;
+  //   min-height: 0;
+  // }
 }
 
 .Sqb-Filter-item {

package/lib/es/components/dialog/select-column/index.d.ts

@@ -1,4 +1,5 @@
 import './index.less';
+import React from 'react';
 import { MetaData_ColumnsType, MetaData_TableType } from '../../../store/types';
 interface PropsType {
     data: MetaData_ColumnsType[];
@@ -7,5 +8,5 @@ interface PropsType {
     groupIndex: number;
     onChange: (record: MetaData_ColumnsType[], newMetaList?: any[]) => void;
 }
-declare const SelectColumn: ({ data, table, metaIndex, groupIndex, onChange }: PropsType) => import("react/jsx-runtime").JSX.Element;
+declare const SelectColumn: ({ data, table, metaIndex, groupIndex, onChange }: PropsType) => React.JSX.Element;
 export default SelectColumn;

package/lib/es/components/dialog/select-column-multiple/index.d.ts

@@ -1,4 +1,5 @@
 import './index.less';
+import React from 'react';
 import { ColumnsPopupThemeEnum, SQL_COLUMN_TYPE } from '../../../store/enum';
 import { MetaData_ColumnsType, MetaJoin_TalbeType, AtomsField } from '../../../store/types';
 import { DatasourceType } from '../../../types';
@@ -42,5 +43,5 @@ interface PropsType {
     nextBtnText?: string;
     onNextStep?: () => void;
 }
-declare const SelectJoinColumn: ({ data, value: _value, theme, onSelect, isGroup, onGroup, didUpdate, multiple, showNextBtn, nextBtnText, onNextStep, }: PropsType) => import("react/jsx-runtime").JSX.Element;
+declare const SelectJoinColumn: ({ data, value: _value, theme, onSelect, isGroup, onGroup, didUpdate, multiple, showNextBtn, nextBtnText, onNextStep, }: PropsType) => React.JSX.Element;
 export default SelectJoinColumn;

package/lib/es/components/dialog/select-join/index.d.ts

@@ -1,8 +1,9 @@
 import './index.less';
+import React from 'react';
 import { JoinEnum } from '../../../store/enum';
 interface PropsType {
     value: JoinEnum;
     onChange: (type: JoinEnum) => void;
 }
-declare const SelectJoin: ({ value, onChange }: PropsType) => import("react/jsx-runtime").JSX.Element;
+declare const SelectJoin: ({ value, onChange }: PropsType) => React.JSX.Element;
 export default SelectJoin;

package/lib/es/components/dialog/select-join-column/index.d.ts

@@ -1,4 +1,5 @@
 import './index.less';
+import React from 'react';
 import { ColumnsPopupThemeEnum, SQL_COLUMN_TYPE } from '../../../store/enum';
 import { MetaData_ColumnsType, MetaJoin_TalbeType } from '../../../store/types';
 import { DatasourceType } from '../../../types';
@@ -45,5 +46,5 @@ interface PropsType {
     didUpdate?: Function;
     multiple?: boolean;
 }
-declare const SelectJoinColumn: ({ data, value: _value, theme, onSelect, isGroup, onGroup, didUpdate, multiple, }: PropsType) => import("react/jsx-runtime").JSX.Element;
+declare const SelectJoinColumn: ({ data, value: _value, theme, onSelect, isGroup, onGroup, didUpdate, multiple, }: PropsType) => React.JSX.Element;
 export default SelectJoinColumn;

package/lib/es/components/dialog/select-join-column-multiple/index.d.ts

@@ -1,4 +1,5 @@
 import './index.less';
+import React from 'react';
 import { ColumnsPopupThemeEnum, SQL_COLUMN_TYPE } from '../../../store/enum';
 import { MetaData_ColumnsType, MetaJoin_TalbeType, MetaJoin_Field } from '../../../store/types';
 import { DatasourceType } from '../../../types';
@@ -44,5 +45,5 @@ interface PropsType {
     didUpdate?: Function;
     multiple?: boolean;
 }
-declare const SelectJoinColumn: ({ data, tableInfo: tableInfo, value: _value, theme, onSelect, isGroup, onGroup, didUpdate, multiple, }: PropsType) => import("react/jsx-runtime").JSX.Element;
+declare const SelectJoinColumn: ({ data, tableInfo: tableInfo, value: _value, theme, onSelect, isGroup, onGroup, didUpdate, multiple, }: PropsType) => React.JSX.Element;
 export default SelectJoinColumn;

package/lib/es/components/dialog/select-list/index.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import './index.less';
 import { OptionItem } from '../../../types';
 interface PropsType {
@@ -6,5 +7,5 @@ interface PropsType {
     list: OptionItem[];
     onChange: (type: any) => void;
 }
-declare const SelectList: ({ value, onChange, list, className }: PropsType) => import("react/jsx-runtime").JSX.Element;
+declare const SelectList: ({ value, onChange, list, className }: PropsType) => React.JSX.Element;
 export default SelectList;

package/lib/es/components/dialog/select-permission-table/index.d.ts

@@ -1,4 +1,5 @@
 import './index.less';
+import React from 'react';
 import { MetaData_TableType } from '../../../store/types';
 interface PropsType {
     data: MetaData_TableType[];
@@ -7,5 +8,5 @@ interface PropsType {
     didUpdate?: Function;
     tableEnableAlias: boolean;
 }
-declare const SelectPermissionTable: ({ data, value, onChange, didUpdate, tableEnableAlias, }: PropsType) => import("react/jsx-runtime").JSX.Element;
+declare const SelectPermissionTable: ({ data, value, onChange, didUpdate, tableEnableAlias, }: PropsType) => React.JSX.Element;
 export default SelectPermissionTable;

package/lib/es/components/dialog/select-summarize/index.d.ts

@@ -1,4 +1,5 @@
 import './index.less';
+import React from 'react';
 import { DataType, ColumnType } from '../select-column-multiple';
 import { AtomsItem } from '../../../store/types';
 export type ValueType = Partial<ColumnType> & {
@@ -17,5 +18,5 @@ interface PropsType {
     didUpdate?: Function;
     ignoreGroupByType?: boolean;
 }
-declare const SelectSummarize: ({ data, value, onChange, didUpdate, ignoreGroupByType }: PropsType) => import("react/jsx-runtime").JSX.Element;
+declare const SelectSummarize: ({ data, value, onChange, didUpdate, ignoreGroupByType }: PropsType) => React.JSX.Element;
 export default SelectSummarize;

package/lib/es/components/dialog/select-table/index.d.ts

@@ -1,4 +1,5 @@
 import './index.less';
+import React from 'react';
 import { MetaData_TableType } from '../../../store/types';
 import { DatasourceType } from '../../../types';
 interface PropsType {
@@ -9,5 +10,5 @@ interface PropsType {
     didUpdate?: Function;
     tableFlat?: boolean;
 }
-declare const SelectTable: ({ data, sourceTable, value, onChange, didUpdate, tableFlat, }: PropsType) => import("react/jsx-runtime").JSX.Element;
+declare const SelectTable: ({ data, sourceTable, value, onChange, didUpdate, tableFlat, }: PropsType) => React.JSX.Element;
 export default SelectTable;

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

@@ -1,35 +1,36 @@
+import React from 'react';
 type IconProps = {
     width?: number;
     height?: number;
     style?: object;
 };
-export declare const CloseIcon2: (reset: any) => import("react/jsx-runtime").JSX.Element;
-export declare const FilterIcon: ({ width, height }: IconProps) => import("react/jsx-runtime").JSX.Element;
-export declare const SummarizeIcon: ({ width, height }: IconProps) => import("react/jsx-runtime").JSX.Element;
-export declare const JoinDataIcon: ({ width, height }: IconProps) => import("react/jsx-runtime").JSX.Element;
-export declare const GroupIcon: ({ width, height }: IconProps) => import("react/jsx-runtime").JSX.Element;
-export declare const PermissionTableIcon: ({ width, height }: IconProps) => import("react/jsx-runtime").JSX.Element;
-export declare const CustomColumnIcon: ({ width, height }: IconProps) => import("react/jsx-runtime").JSX.Element;
-export declare const SortIcon: ({ width, height }: IconProps) => import("react/jsx-runtime").JSX.Element;
-export declare const RowLimitIcon: ({ width, height }: IconProps) => import("react/jsx-runtime").JSX.Element;
-export declare const LeftJoinIcon: ({ width, height, style }: IconProps) => import("react/jsx-runtime").JSX.Element;
-export declare const InnerJoinIcon: ({ width, height, style }: IconProps) => import("react/jsx-runtime").JSX.Element;
-export declare const UpArrowIcon: ({ width, height }: IconProps) => import("react/jsx-runtime").JSX.Element;
-export declare const DownArrowIcon: ({ width, height }: IconProps) => import("react/jsx-runtime").JSX.Element;
-export declare const CloseIcon: ({ width, height }: IconProps) => import("react/jsx-runtime").JSX.Element;
-export declare const AddIcon: ({ width, height }: IconProps) => import("react/jsx-runtime").JSX.Element;
-export declare const TableIcon: ({ width, height }: IconProps) => import("react/jsx-runtime").JSX.Element;
-export declare const SearchIcon: ({ width, height }: IconProps) => import("react/jsx-runtime").JSX.Element;
-export declare const NotSelectIcon: () => import("react/jsx-runtime").JSX.Element;
-export declare const SelectIcon: () => import("react/jsx-runtime").JSX.Element;
-export declare const CircleIcon: () => import("react/jsx-runtime").JSX.Element;
-export declare const LetterAaIcon: () => import("react/jsx-runtime").JSX.Element;
-export declare const CalendarIcon: () => import("react/jsx-runtime").JSX.Element;
-export declare const WellIcon: () => import("react/jsx-runtime").JSX.Element;
-export declare const ForeignKeyIcon: () => import("react/jsx-runtime").JSX.Element;
-export declare const UpArrowIcon2: () => import("react/jsx-runtime").JSX.Element;
-export declare const DownArrowIcon2: () => import("react/jsx-runtime").JSX.Element;
-export declare const LeftArrowIcon: () => import("react/jsx-runtime").JSX.Element;
-export declare const RightArrowIcon: () => import("react/jsx-runtime").JSX.Element;
-export declare const DataSourceIcon: () => import("react/jsx-runtime").JSX.Element;
+export declare const CloseIcon2: (reset: any) => React.JSX.Element;
+export declare const FilterIcon: ({ width, height }: IconProps) => React.JSX.Element;
+export declare const SummarizeIcon: ({ width, height }: IconProps) => React.JSX.Element;
+export declare const JoinDataIcon: ({ width, height }: IconProps) => React.JSX.Element;
+export declare const GroupIcon: ({ width, height }: IconProps) => React.JSX.Element;
+export declare const PermissionTableIcon: ({ width, height }: IconProps) => React.JSX.Element;
+export declare const CustomColumnIcon: ({ width, height }: IconProps) => React.JSX.Element;
+export declare const SortIcon: ({ width, height }: IconProps) => React.JSX.Element;
+export declare const RowLimitIcon: ({ width, height }: IconProps) => React.JSX.Element;
+export declare const LeftJoinIcon: ({ width, height, style }: IconProps) => React.JSX.Element;
+export declare const InnerJoinIcon: ({ width, height, style }: IconProps) => React.JSX.Element;
+export declare const UpArrowIcon: ({ width, height }: IconProps) => React.JSX.Element;
+export declare const DownArrowIcon: ({ width, height }: IconProps) => React.JSX.Element;
+export declare const CloseIcon: ({ width, height }: IconProps) => React.JSX.Element;
+export declare const AddIcon: ({ width, height }: IconProps) => React.JSX.Element;
+export declare const TableIcon: ({ width, height }: IconProps) => React.JSX.Element;
+export declare const SearchIcon: ({ width, height }: IconProps) => React.JSX.Element;
+export declare const NotSelectIcon: () => React.JSX.Element;
+export declare const SelectIcon: () => React.JSX.Element;
+export declare const CircleIcon: () => React.JSX.Element;
+export declare const LetterAaIcon: () => React.JSX.Element;
+export declare const CalendarIcon: () => React.JSX.Element;
+export declare const WellIcon: () => React.JSX.Element;
+export declare const ForeignKeyIcon: () => React.JSX.Element;
+export declare const UpArrowIcon2: () => React.JSX.Element;
+export declare const DownArrowIcon2: () => React.JSX.Element;
+export declare const LeftArrowIcon: () => React.JSX.Element;
+export declare const RightArrowIcon: () => React.JSX.Element;
+export declare const DataSourceIcon: () => React.JSX.Element;
 export {};

package/lib/es/components/metabase/index.d.ts

@@ -1,4 +1,5 @@
 import './index.less';
+import React from 'react';
 import type { MetabaseProps } from '../../types';
-declare const Metabase: (props: MetabaseProps) => import("react/jsx-runtime").JSX.Element;
+declare const Metabase: (props: MetabaseProps) => React.JSX.Element;
 export default Metabase;

package/lib/es/components/metabase/index.js

@@ -5,7 +5,7 @@ var _templateObject;
 import _regeneratorRuntime from "@babel/runtime/regenerator";
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import './index.less';
-import { useMemo, useState } from 'react';
+import { useEffect, useMemo, useState } from 'react';
 import cx from 'classnames';
 import { Button, Modal, Toast, Space, Tooltip } from '@gingkoo/pandora';
 import Styled from 'styled-components';
@@ -16,6 +16,7 @@ import modulesMap from '../modules';
 import Popup from '../popup';
 import { useStore } from '../../hooks/use-provider';
 import storage from '../../utils/storage';
+import SqbRightClickMenu, { openSqbRightClickMenu } from '../right-click-menu';
 var VisualBox = Styled.div.attrs({
   className: 'visual-box scroller'
 })(_templateObject || (_templateObject = _taggedTemplateLiteral([""])));
@@ -27,7 +28,10 @@ var Metabase = function Metabase(props) {
     onOk = props.onOk,
     metabaseCopy = props.metabaseCopy,
     moduleCopy = props.moduleCopy,
-    popupZIndex = props.popupZIndex;
+    popupZIndex = props.popupZIndex,
+    _props$rightClickMenu = props.rightClickMenu,
+    rightClickMenu = _props$rightClickMenu === void 0 ? [] : _props$rightClickMenu,
+    onRightClickMenuClick = props.onRightClickMenuClick;
   var store = useStore();
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
@@ -144,6 +148,10 @@ var Metabase = function Metabase(props) {
       return _ref.apply(this, arguments);
     };
   }();
+  useEffect(function () {
+    store.setRightClickMenu(rightClickMenu || []);
+    store.setRightClickMenuClick(onRightClickMenuClick);
+  }, [rightClickMenu, onRightClickMenuClick]);
   var copy = function copy() {
     return _jsxs(Space, {
       children: [moduleCopy && _jsx(_Fragment, {
@@ -206,6 +214,9 @@ var Metabase = function Metabase(props) {
   };
   return _jsx(VisualBox, {
     ref: store.popupContainer,
+    onContextMenu: function onContextMenu(e) {
+      return openSqbRightClickMenu(store, e);
+    },
     children: _jsxs("div", {
       className: 'Sqb',
       children: [_jsx("div", {
@@ -267,6 +278,8 @@ var Metabase = function Metabase(props) {
           });
         },
         children: popupContent2
+      }), _jsx(SqbRightClickMenu, {
+        popupZIndex: popupZIndex
       })]
     })
   });

package/lib/es/components/metabase/index.less

@@ -13,6 +13,40 @@
 .Sqb {
   padding: 0 20px 50px;
   position: relative;
+  &-right-click-menu {
+    position: fixed;
+    min-width: 140px;
+    padding: 4px;
+    border: 1px solid #d9dee8;
+    border-radius: 6px;
+    background: #fff;
+    box-shadow: 0 8px 24px rgba(31, 35, 41, 0.16);
+  }
+  &-right-click-menu-item {
+    display: block;
+    width: 100%;
+    min-height: 32px;
+    padding: 6px 10px;
+    border: 0;
+    border-radius: 4px;
+    background: transparent;
+    color: #1f2329;
+    font-size: 14px;
+    line-height: 20px;
+    text-align: left;
+    cursor: pointer;
+
+    &:hover {
+      background: #f4f6f8;
+    }
+
+    &.disabled,
+    &:disabled {
+      color: #b8bbc3;
+      cursor: not-allowed;
+      background: transparent;
+    }
+  }
   &-fun-btns {
     position: absolute;
     left: 0;

package/lib/es/components/modules/components/Wrapper.d.ts

@@ -3,5 +3,5 @@ interface WrapperType {
     children: React.ReactElement;
     className: string;
 }
-declare const Wrapper: ({ children, className }: WrapperType) => import("react/jsx-runtime").JSX.Element;
+declare const Wrapper: ({ children, className }: WrapperType) => React.JSX.Element;
 export default Wrapper;

package/lib/es/components/modules/components/header.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 interface HeaderProps {
     title: string;
     className?: string;
@@ -8,5 +9,5 @@ interface HeaderProps {
     meta?: any;
     isDataModule?: boolean;
 }
-declare const Header: (props: HeaderProps) => import("react/jsx-runtime").JSX.Element;
+declare const Header: (props: HeaderProps) => React.JSX.Element;
 export default Header;

package/lib/es/components/modules/components/item-name.d.ts

@@ -4,5 +4,5 @@ interface HeaderProps {
     isError: boolean;
     message?: string;
 }
-declare const ItemName: (props: HeaderProps) => import("react/jsx-runtime").JSX.Element;
+declare const ItemName: (props: HeaderProps) => React.JSX.Element;
 export default ItemName;

package/lib/es/components/modules/components/item-wrapper.d.ts

@@ -5,5 +5,5 @@ interface HeaderProps {
     meta?: any;
     children?: React.ReactNode;
 }
-declare const ItemWrapper: (props: HeaderProps) => string | number | boolean | Iterable<React.ReactNode> | import("react/jsx-runtime").JSX.Element | null | undefined;
+declare const ItemWrapper: (props: HeaderProps) => string | number | boolean | Iterable<React.ReactNode> | React.JSX.Element | null | undefined;
 export default ItemWrapper;

package/lib/es/components/modules/components/meta-icon.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import { TypeEnum } from '../../../store/enum';
 import { MetaListType } from '../../../store/types';
 interface PropsType {
@@ -11,5 +12,5 @@ type IconInfoType = {
 };
 export declare const IconTypeMap: Map<TypeEnum, IconInfoType>;
 export declare const findNextIcon: (store: any, props: PropsType) => TypeEnum[];
-declare const NextDom: (props: PropsType) => import("react/jsx-runtime").JSX.Element | null;
+declare const NextDom: (props: PropsType) => React.JSX.Element | null;
 export default NextDom;

package/lib/es/components/modules/custom-column.d.ts

@@ -1,8 +1,9 @@
+import React from 'react';
 import { MetaCustom } from '../../store/types';
 interface PropsType {
     store?: any;
     meta: MetaCustom;
     groupIndex: number;
 }
-declare const CustomColumn: (props: PropsType) => import("react/jsx-runtime").JSX.Element;
+declare const CustomColumn: (props: PropsType) => React.JSX.Element;
 export default CustomColumn;