@gingkoo/pandora-metabase 1.0.150 → 1.0.152
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/cjs/components/dialog/formula-list/index.js +9 -5
- package/lib/cjs/components/modules/summarize/group-by.js +3 -0
- package/lib/cjs/components/right-click-menu.d.ts +1 -1
- package/lib/cjs/components/right-click-menu.js +48 -3
- package/lib/cjs/utils.d.ts +2 -0
- package/lib/cjs/utils.js +4 -4
- package/lib/es/components/dialog/formula-list/index.js +10 -6
- package/lib/es/components/modules/summarize/group-by.js +4 -1
- package/lib/es/components/right-click-menu.d.ts +1 -1
- package/lib/es/components/right-click-menu.js +49 -4
- package/lib/es/utils.d.ts +2 -0
- package/lib/es/utils.js +2 -1
- package/package.json +1 -1
|
@@ -293,7 +293,7 @@ var FormulaList = (0, _react.forwardRef)(function (props, ref) {
|
|
|
293
293
|
return map;
|
|
294
294
|
}, [otherTypes]);
|
|
295
295
|
var normalizedValue = (0, _react.useMemo)(function () {
|
|
296
|
-
return (0, _utils2.normalizeAndOrStructure)(value || []);
|
|
296
|
+
return (0, _utils2.normalizeAndOrStructure)(value || []).map(_utils2.syncAtomQuotes);
|
|
297
297
|
}, [value]);
|
|
298
298
|
var caseList = normalizedValue;
|
|
299
299
|
var initialValueRef = (0, _react.useRef)((0, _cloneDeep["default"])(caseList));
|
|
@@ -406,6 +406,9 @@ var FormulaList = (0, _react.forwardRef)(function (props, ref) {
|
|
|
406
406
|
if (visited.has(v)) return v.quotes || '';
|
|
407
407
|
visited.add(v);
|
|
408
408
|
}
|
|
409
|
+
if (v.type === _types.AtomsTypeEnum.FIELD || v.type === _types.AtomsTypeEnum.EXPRESSION || v.type === _types.AtomsTypeEnum.FORMULA || v.type === _types.AtomsTypeEnum.COLLECTION || v.type === _types.AtomsTypeEnum.CASE_WHEN || v.type === _types.AtomsTypeEnum.AND_OR || v.type === _types.AtomsTypeEnum.SELECT) {
|
|
410
|
+
return (0, _utils2.getAtomDisplayText)(v);
|
|
411
|
+
}
|
|
409
412
|
if (v.quotes) return v.quotes;
|
|
410
413
|
if (v.type === _types.AtomsTypeEnum.FIELD) return getFieldDisplayName(v);
|
|
411
414
|
if (v.fieldName) return v.fieldName;
|
|
@@ -1981,22 +1984,23 @@ var FormulaList = (0, _react.forwardRef)(function (props, ref) {
|
|
|
1981
1984
|
};
|
|
1982
1985
|
}
|
|
1983
1986
|
if (type === _types.AtomsTypeEnum.EXPRESSION) {
|
|
1987
|
+
var quotes = (0, _utils2.getAtomDisplayText)(v);
|
|
1984
1988
|
if (~['早于', '晚于', '在'].indexOf(v.condition) && v.rhs.length > 1) {
|
|
1985
|
-
var
|
|
1989
|
+
var _getAtomDisplayText$s;
|
|
1986
1990
|
var nextList = caseList.slice();
|
|
1987
1991
|
nextList[index].rhs = [nextList[index].rhs[0]];
|
|
1988
|
-
nextList[index].quotes = (
|
|
1992
|
+
nextList[index].quotes = (_getAtomDisplayText$s = (0, _utils2.getAtomDisplayText)(nextList[index]).split(' || ')) === null || _getAtomDisplayText$s === void 0 ? void 0 : _getAtomDisplayText$s[0];
|
|
1989
1993
|
setCaseList(nextList);
|
|
1990
1994
|
}
|
|
1991
1995
|
return {
|
|
1992
1996
|
className: (0, _classnames["default"])('purple-name', {
|
|
1993
|
-
notSelected: !
|
|
1997
|
+
notSelected: !quotes
|
|
1994
1998
|
}),
|
|
1995
1999
|
onClick: function onClick(e) {
|
|
1996
2000
|
return handleExpression(e, index, v);
|
|
1997
2001
|
},
|
|
1998
2002
|
node: (0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
|
|
1999
|
-
children: [
|
|
2003
|
+
children: [quotes || (0, _locale.__)('customColumn.selectExpression'), renderDeleteIcon(v, index, groupType)]
|
|
2000
2004
|
})
|
|
2001
2005
|
};
|
|
2002
2006
|
}
|
|
@@ -32,6 +32,9 @@ var _getSummaryText = function getSummaryText() {
|
|
|
32
32
|
var list = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
|
|
33
33
|
var itemToText = function itemToText(item) {
|
|
34
34
|
if (!item) return '';
|
|
35
|
+
if (item.type === _types.AtomsTypeEnum.FIELD || item.type === _types.AtomsTypeEnum.EXPRESSION || item.type === _types.AtomsTypeEnum.FORMULA || item.type === _types.AtomsTypeEnum.COLLECTION || item.type === _types.AtomsTypeEnum.CASE_WHEN || item.type === _types.AtomsTypeEnum.AND_OR) {
|
|
36
|
+
return (0, _utils.getAtomDisplayText)(item);
|
|
37
|
+
}
|
|
35
38
|
if (item.quotes) return item.quotes;
|
|
36
39
|
if (item.fieldName) return item.fieldAlias || item.fieldName;
|
|
37
40
|
if (item.type === _types.AtomsTypeEnum.FORMULA) {
|
|
@@ -12,5 +12,5 @@ interface SqbRightClickMenuProps {
|
|
|
12
12
|
state?: RightClickMenuState | null;
|
|
13
13
|
setState?: (state: RightClickMenuState | null) => void;
|
|
14
14
|
}
|
|
15
|
-
declare const SqbRightClickMenu: ({ popupZIndex, state, setState }: SqbRightClickMenuProps) => React.
|
|
15
|
+
declare const SqbRightClickMenu: ({ popupZIndex, state, setState }: SqbRightClickMenuProps) => React.ReactPortal | null;
|
|
16
16
|
export default SqbRightClickMenu;
|
|
@@ -7,12 +7,15 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
7
7
|
exports.openSqbRightClickMenu = exports["default"] = void 0;
|
|
8
8
|
var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
|
|
9
9
|
var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/asyncToGenerator"));
|
|
10
|
+
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
|
|
10
11
|
var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/typeof"));
|
|
11
12
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
12
13
|
var _react = require("react");
|
|
14
|
+
var _reactDom = _interopRequireDefault(require("react-dom"));
|
|
13
15
|
var _classnames = _interopRequireDefault(require("classnames"));
|
|
14
16
|
var _utils = require("../utils");
|
|
15
17
|
var _useProvider = require("../hooks/use-provider");
|
|
18
|
+
var MENU_VIEWPORT_GAP = 8;
|
|
16
19
|
var findRightClickTarget = function findRightClickTarget(target) {
|
|
17
20
|
var element = target instanceof HTMLElement ? target : null;
|
|
18
21
|
while (element) {
|
|
@@ -89,6 +92,18 @@ var SqbRightClickMenu = function SqbRightClickMenu(_ref) {
|
|
|
89
92
|
rightClickMenu = _store$rightClickMenu === void 0 ? [] : _store$rightClickMenu;
|
|
90
93
|
var rightClickMenuState = state === undefined ? store.rightClickMenuState : state;
|
|
91
94
|
var setRightClickMenuState = setState || store.setRightClickMenuState;
|
|
95
|
+
var menuRef = (0, _react.useRef)(null);
|
|
96
|
+
var _useState = (0, _react.useState)(null),
|
|
97
|
+
_useState2 = (0, _slicedToArray2["default"])(_useState, 2),
|
|
98
|
+
menuContainer = _useState2[0],
|
|
99
|
+
setMenuContainer = _useState2[1];
|
|
100
|
+
var _useState3 = (0, _react.useState)({
|
|
101
|
+
left: 0,
|
|
102
|
+
top: 0
|
|
103
|
+
}),
|
|
104
|
+
_useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
|
|
105
|
+
menuPosition = _useState4[0],
|
|
106
|
+
setMenuPosition = _useState4[1];
|
|
92
107
|
var handleRightClickMenuItem = function () {
|
|
93
108
|
var _ref2 = (0, _asyncToGenerator2["default"])(_regenerator["default"].mark(function _callee(menuItem) {
|
|
94
109
|
var _store$getRightClickM2;
|
|
@@ -147,12 +162,40 @@ var SqbRightClickMenu = function SqbRightClickMenu(_ref) {
|
|
|
147
162
|
window.removeEventListener('resize', closeRightClickMenu);
|
|
148
163
|
};
|
|
149
164
|
}, [rightClickMenuState]);
|
|
165
|
+
(0, _react.useEffect)(function () {
|
|
166
|
+
if (!rightClickMenuState || typeof document === 'undefined') {
|
|
167
|
+
setMenuContainer(null);
|
|
168
|
+
return;
|
|
169
|
+
}
|
|
170
|
+
var container = document.createElement('div');
|
|
171
|
+
container.setAttribute('data-sqb-right-click-menu-container', 'true');
|
|
172
|
+
document.body.appendChild(container);
|
|
173
|
+
setMenuContainer(container);
|
|
174
|
+
return function () {
|
|
175
|
+
if (document.body.contains(container)) {
|
|
176
|
+
document.body.removeChild(container);
|
|
177
|
+
}
|
|
178
|
+
};
|
|
179
|
+
}, [rightClickMenuState]);
|
|
180
|
+
(0, _react.useLayoutEffect)(function () {
|
|
181
|
+
if (!rightClickMenuState) return;
|
|
182
|
+
var menuElement = menuRef.current;
|
|
183
|
+
var menuWidth = (menuElement === null || menuElement === void 0 ? void 0 : menuElement.offsetWidth) || 0;
|
|
184
|
+
var menuHeight = (menuElement === null || menuElement === void 0 ? void 0 : menuElement.offsetHeight) || 0;
|
|
185
|
+
var maxLeft = Math.max(MENU_VIEWPORT_GAP, window.innerWidth - menuWidth - MENU_VIEWPORT_GAP);
|
|
186
|
+
var maxTop = Math.max(MENU_VIEWPORT_GAP, window.innerHeight - menuHeight - MENU_VIEWPORT_GAP);
|
|
187
|
+
setMenuPosition({
|
|
188
|
+
left: Math.min(Math.max(rightClickMenuState.x, MENU_VIEWPORT_GAP), maxLeft),
|
|
189
|
+
top: Math.min(Math.max(rightClickMenuState.y, MENU_VIEWPORT_GAP), maxTop)
|
|
190
|
+
});
|
|
191
|
+
}, [rightClickMenuState, rightClickMenu.length, menuContainer]);
|
|
150
192
|
if (!rightClickMenuState) return null;
|
|
151
|
-
|
|
193
|
+
var menuNode = (0, _jsxRuntime.jsx)("div", {
|
|
194
|
+
ref: menuRef,
|
|
152
195
|
className: 'Sqb-right-click-menu',
|
|
153
196
|
style: {
|
|
154
|
-
left:
|
|
155
|
-
top:
|
|
197
|
+
left: menuPosition.left,
|
|
198
|
+
top: menuPosition.top,
|
|
156
199
|
zIndex: popupZIndex ? popupZIndex + 10 : 9999
|
|
157
200
|
},
|
|
158
201
|
onClick: function onClick(event) {
|
|
@@ -175,5 +218,7 @@ var SqbRightClickMenu = function SqbRightClickMenu(_ref) {
|
|
|
175
218
|
}, menuItem.value);
|
|
176
219
|
})
|
|
177
220
|
});
|
|
221
|
+
if (!menuContainer) return null;
|
|
222
|
+
return _reactDom["default"].createPortal(menuNode, menuContainer);
|
|
178
223
|
};
|
|
179
224
|
var _default = exports["default"] = SqbRightClickMenu;
|
package/lib/cjs/utils.d.ts
CHANGED
|
@@ -25,7 +25,9 @@ export declare const getHelper: (list: MetaListType[], item: MetaListType) => He
|
|
|
25
25
|
export declare const mergeSubQueryColumns: (columns: MetaData_ColumnsType[], oldColumns?: MetaData_ColumnsType[], isSelectFields?: boolean) => MetaData_ColumnsType[];
|
|
26
26
|
export declare const syncSubQueryFieldReferences: (list: MetaListType[], table: MetaData_TableType, columns: MetaData_ColumnsType[], oldColumns?: MetaData_ColumnsType[]) => MetaListType[];
|
|
27
27
|
export declare const getSubColumns: (metaList: any) => DataType[];
|
|
28
|
+
export declare const getAtomDisplayText: (item?: AtomsItem) => string;
|
|
28
29
|
export declare const normalizeAndOrStructure: <T>(data: T) => T;
|
|
30
|
+
export declare const syncAtomQuotes: (item: AtomsItem) => AtomsItem;
|
|
29
31
|
export declare function isValidSQLAlias(str: string): boolean;
|
|
30
32
|
export declare const changeTableAlias: (list: MetaListType[] | [], curObj: Pick<MetaData_TableType, "tableUuid" | "alias">) => MetaListType[];
|
|
31
33
|
export declare const changeFieldAlias: (list: MetaListType[], curObj: Pick<MetaData_ColumnsType, "fieldUuid" | "fieldAlias"> & Partial<Pick<MetaData_ColumnsType, "id" | "name" | "datasourceId">> & Partial<Pick<MetaSummarize_Group | MetaSummarize_By, "table" | "tableId" | "tableUuid" | "fieldId" | "name">>) => MetaListType[];
|
package/lib/cjs/utils.js
CHANGED
|
@@ -6,12 +6,12 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
});
|
|
7
7
|
exports.changeTableAlias = exports.changeFieldAlias = exports.changeExistsCopyField = exports.changeCopyField = exports.buildSqlQuery = void 0;
|
|
8
8
|
exports.containsSubset = containsSubset;
|
|
9
|
-
exports.isExistsError = exports.isError = exports.isCanPaste = exports.getSubQueryColumnInstanceUuid = exports.getSubColumns = exports.getObjTem = exports.getMetaTabels = exports.getHelper = exports.getColumnsTables = exports.findMetaKey = exports.findIndex = void 0;
|
|
9
|
+
exports.isExistsError = exports.isError = exports.isCanPaste = exports.getSubQueryColumnInstanceUuid = exports.getSubColumns = exports.getObjTem = exports.getMetaTabels = exports.getHelper = exports.getColumnsTables = exports.getAtomDisplayText = exports.findMetaKey = exports.findIndex = void 0;
|
|
10
10
|
exports.isValidSQLAlias = isValidSQLAlias;
|
|
11
11
|
exports.patchData = exports.normalizeLegacySummarizeForSave = exports.normalizeAndOrStructure = exports.metaIsCheck = exports.mergeSubQueryColumns = void 0;
|
|
12
12
|
exports.reassembleByUnion = reassembleByUnion;
|
|
13
13
|
exports.splitByUnion = splitByUnion;
|
|
14
|
-
exports.syncSubQueryFieldReferences = void 0;
|
|
14
|
+
exports.syncSubQueryFieldReferences = exports.syncAtomQuotes = void 0;
|
|
15
15
|
var _createForOfIteratorHelper2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/createForOfIteratorHelper"));
|
|
16
16
|
var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/typeof"));
|
|
17
17
|
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
|
|
@@ -598,7 +598,7 @@ var getSelectAtomText = function getSelectAtomText(item) {
|
|
|
598
598
|
}
|
|
599
599
|
return getOptionText(String(item.val || ''));
|
|
600
600
|
};
|
|
601
|
-
var _getAtomDisplayText = function getAtomDisplayText(item) {
|
|
601
|
+
var _getAtomDisplayText = exports.getAtomDisplayText = function getAtomDisplayText(item) {
|
|
602
602
|
if (!item) return '';
|
|
603
603
|
if (item.type === _types.AtomsTypeEnum.FIELD) {
|
|
604
604
|
if (item.tableId === _helper.SummarizeAlias) {
|
|
@@ -968,7 +968,7 @@ var buildExpressionQuotes = function buildExpressionQuotes(item) {
|
|
|
968
968
|
}
|
|
969
969
|
return normalizeAtomQuotes("".concat(lhsText, " ").concat(getExpressionConditionText(condition), " ").concat(rhsText || firstVal));
|
|
970
970
|
};
|
|
971
|
-
var syncAtomQuotes = function syncAtomQuotes(item) {
|
|
971
|
+
var syncAtomQuotes = exports.syncAtomQuotes = function syncAtomQuotes(item) {
|
|
972
972
|
if (item.type === _types.AtomsTypeEnum.JOIN_DEFAULT) {
|
|
973
973
|
return (0, _objectSpread6["default"])((0, _objectSpread6["default"])({}, item), {}, {
|
|
974
974
|
lhs: syncAtomQuotesList(item.lhs || []),
|
|
@@ -23,7 +23,7 @@ import { AtomsTypeEnum, FormulaTypeEnum } from '../../../store/types';
|
|
|
23
23
|
import { ColumnsPopupThemeEnum } from '../../../store/enum';
|
|
24
24
|
import { Select, Input, Modal2, Modal, InputNumber, Space, Button, Checkbox, Tooltip, Toast, Editor } from '@gingkoo/pandora';
|
|
25
25
|
import cloneDeep from 'lodash/cloneDeep';
|
|
26
|
-
import { buildSqlQuery, isError, changeCopyField, isExistsError, normalizeAndOrStructure } from '../../../utils';
|
|
26
|
+
import { buildSqlQuery, getAtomDisplayText, isError, changeCopyField, isExistsError, normalizeAndOrStructure, syncAtomQuotes } from '../../../utils';
|
|
27
27
|
import Formula from '../formula';
|
|
28
28
|
import { AddIcon, CloseIcon } from '../../icons';
|
|
29
29
|
import { Expression, SelectColumnMultiple } from '../../dialog';
|
|
@@ -284,7 +284,7 @@ var FormulaList = forwardRef(function (props, ref) {
|
|
|
284
284
|
return map;
|
|
285
285
|
}, [otherTypes]);
|
|
286
286
|
var normalizedValue = useMemo(function () {
|
|
287
|
-
return normalizeAndOrStructure(value || []);
|
|
287
|
+
return normalizeAndOrStructure(value || []).map(syncAtomQuotes);
|
|
288
288
|
}, [value]);
|
|
289
289
|
var caseList = normalizedValue;
|
|
290
290
|
var initialValueRef = useRef(cloneDeep(caseList));
|
|
@@ -397,6 +397,9 @@ var FormulaList = forwardRef(function (props, ref) {
|
|
|
397
397
|
if (visited.has(v)) return v.quotes || '';
|
|
398
398
|
visited.add(v);
|
|
399
399
|
}
|
|
400
|
+
if (v.type === AtomsTypeEnum.FIELD || v.type === AtomsTypeEnum.EXPRESSION || v.type === AtomsTypeEnum.FORMULA || v.type === AtomsTypeEnum.COLLECTION || v.type === AtomsTypeEnum.CASE_WHEN || v.type === AtomsTypeEnum.AND_OR || v.type === AtomsTypeEnum.SELECT) {
|
|
401
|
+
return getAtomDisplayText(v);
|
|
402
|
+
}
|
|
400
403
|
if (v.quotes) return v.quotes;
|
|
401
404
|
if (v.type === AtomsTypeEnum.FIELD) return getFieldDisplayName(v);
|
|
402
405
|
if (v.fieldName) return v.fieldName;
|
|
@@ -1972,22 +1975,23 @@ var FormulaList = forwardRef(function (props, ref) {
|
|
|
1972
1975
|
};
|
|
1973
1976
|
}
|
|
1974
1977
|
if (type === AtomsTypeEnum.EXPRESSION) {
|
|
1978
|
+
var quotes = getAtomDisplayText(v);
|
|
1975
1979
|
if (~['早于', '晚于', '在'].indexOf(v.condition) && v.rhs.length > 1) {
|
|
1976
|
-
var
|
|
1980
|
+
var _getAtomDisplayText$s;
|
|
1977
1981
|
var nextList = caseList.slice();
|
|
1978
1982
|
nextList[index].rhs = [nextList[index].rhs[0]];
|
|
1979
|
-
nextList[index].quotes = (
|
|
1983
|
+
nextList[index].quotes = (_getAtomDisplayText$s = getAtomDisplayText(nextList[index]).split(' || ')) === null || _getAtomDisplayText$s === void 0 ? void 0 : _getAtomDisplayText$s[0];
|
|
1980
1984
|
setCaseList(nextList);
|
|
1981
1985
|
}
|
|
1982
1986
|
return {
|
|
1983
1987
|
className: cx('purple-name', {
|
|
1984
|
-
notSelected: !
|
|
1988
|
+
notSelected: !quotes
|
|
1985
1989
|
}),
|
|
1986
1990
|
onClick: function onClick(e) {
|
|
1987
1991
|
return handleExpression(e, index, v);
|
|
1988
1992
|
},
|
|
1989
1993
|
node: _jsxs(_Fragment, {
|
|
1990
|
-
children: [
|
|
1994
|
+
children: [quotes || __('customColumn.selectExpression'), renderDeleteIcon(v, index, groupType)]
|
|
1991
1995
|
})
|
|
1992
1996
|
};
|
|
1993
1997
|
}
|
|
@@ -9,7 +9,7 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
|
|
|
9
9
|
import { useState } from 'react';
|
|
10
10
|
import cx from 'classnames';
|
|
11
11
|
import { __ } from '../../../locale';
|
|
12
|
-
import { findIndex, getHelper } from '../../../utils';
|
|
12
|
+
import { findIndex, getAtomDisplayText, getHelper } from '../../../utils';
|
|
13
13
|
import { TypeEnum, SQL_COLUMN_TYPE } from '../../../store/enum';
|
|
14
14
|
import { MetaSummarize_Enum, AtomsTypeEnum, ChangeType } from '../../../store/types';
|
|
15
15
|
import { Tooltip, Button, Modal, Input, Toast } from '@gingkoo/pandora';
|
|
@@ -26,6 +26,9 @@ var _getSummaryText = function getSummaryText() {
|
|
|
26
26
|
var list = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
|
|
27
27
|
var itemToText = function itemToText(item) {
|
|
28
28
|
if (!item) return '';
|
|
29
|
+
if (item.type === AtomsTypeEnum.FIELD || item.type === AtomsTypeEnum.EXPRESSION || item.type === AtomsTypeEnum.FORMULA || item.type === AtomsTypeEnum.COLLECTION || item.type === AtomsTypeEnum.CASE_WHEN || item.type === AtomsTypeEnum.AND_OR) {
|
|
30
|
+
return getAtomDisplayText(item);
|
|
31
|
+
}
|
|
29
32
|
if (item.quotes) return item.quotes;
|
|
30
33
|
if (item.fieldName) return item.fieldAlias || item.fieldName;
|
|
31
34
|
if (item.type === AtomsTypeEnum.FORMULA) {
|
|
@@ -12,5 +12,5 @@ interface SqbRightClickMenuProps {
|
|
|
12
12
|
state?: RightClickMenuState | null;
|
|
13
13
|
setState?: (state: RightClickMenuState | null) => void;
|
|
14
14
|
}
|
|
15
|
-
declare const SqbRightClickMenu: ({ popupZIndex, state, setState }: SqbRightClickMenuProps) => React.
|
|
15
|
+
declare const SqbRightClickMenu: ({ popupZIndex, state, setState }: SqbRightClickMenuProps) => React.ReactPortal | null;
|
|
16
16
|
export default SqbRightClickMenu;
|
|
@@ -1,11 +1,14 @@
|
|
|
1
1
|
import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
|
|
2
|
+
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
2
3
|
import _typeof from "@babel/runtime/helpers/esm/typeof";
|
|
3
4
|
import _regeneratorRuntime from "@babel/runtime/regenerator";
|
|
4
5
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
5
|
-
import { useEffect } from 'react';
|
|
6
|
+
import { useEffect, useLayoutEffect, useRef, useState } from 'react';
|
|
7
|
+
import ReactDOM from 'react-dom';
|
|
6
8
|
import cx from 'classnames';
|
|
7
9
|
import { normalizeLegacySummarizeForSave, splitByUnion } from '../utils';
|
|
8
10
|
import { useStore } from '../hooks/use-provider';
|
|
11
|
+
var MENU_VIEWPORT_GAP = 8;
|
|
9
12
|
var findRightClickTarget = function findRightClickTarget(target) {
|
|
10
13
|
var element = target instanceof HTMLElement ? target : null;
|
|
11
14
|
while (element) {
|
|
@@ -82,6 +85,18 @@ var SqbRightClickMenu = function SqbRightClickMenu(_ref) {
|
|
|
82
85
|
rightClickMenu = _store$rightClickMenu === void 0 ? [] : _store$rightClickMenu;
|
|
83
86
|
var rightClickMenuState = state === undefined ? store.rightClickMenuState : state;
|
|
84
87
|
var setRightClickMenuState = setState || store.setRightClickMenuState;
|
|
88
|
+
var menuRef = useRef(null);
|
|
89
|
+
var _useState = useState(null),
|
|
90
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
91
|
+
menuContainer = _useState2[0],
|
|
92
|
+
setMenuContainer = _useState2[1];
|
|
93
|
+
var _useState3 = useState({
|
|
94
|
+
left: 0,
|
|
95
|
+
top: 0
|
|
96
|
+
}),
|
|
97
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
98
|
+
menuPosition = _useState4[0],
|
|
99
|
+
setMenuPosition = _useState4[1];
|
|
85
100
|
var handleRightClickMenuItem = function () {
|
|
86
101
|
var _ref2 = _asyncToGenerator(_regeneratorRuntime.mark(function _callee(menuItem) {
|
|
87
102
|
var _store$getRightClickM2;
|
|
@@ -140,12 +155,40 @@ var SqbRightClickMenu = function SqbRightClickMenu(_ref) {
|
|
|
140
155
|
window.removeEventListener('resize', closeRightClickMenu);
|
|
141
156
|
};
|
|
142
157
|
}, [rightClickMenuState]);
|
|
158
|
+
useEffect(function () {
|
|
159
|
+
if (!rightClickMenuState || typeof document === 'undefined') {
|
|
160
|
+
setMenuContainer(null);
|
|
161
|
+
return;
|
|
162
|
+
}
|
|
163
|
+
var container = document.createElement('div');
|
|
164
|
+
container.setAttribute('data-sqb-right-click-menu-container', 'true');
|
|
165
|
+
document.body.appendChild(container);
|
|
166
|
+
setMenuContainer(container);
|
|
167
|
+
return function () {
|
|
168
|
+
if (document.body.contains(container)) {
|
|
169
|
+
document.body.removeChild(container);
|
|
170
|
+
}
|
|
171
|
+
};
|
|
172
|
+
}, [rightClickMenuState]);
|
|
173
|
+
useLayoutEffect(function () {
|
|
174
|
+
if (!rightClickMenuState) return;
|
|
175
|
+
var menuElement = menuRef.current;
|
|
176
|
+
var menuWidth = (menuElement === null || menuElement === void 0 ? void 0 : menuElement.offsetWidth) || 0;
|
|
177
|
+
var menuHeight = (menuElement === null || menuElement === void 0 ? void 0 : menuElement.offsetHeight) || 0;
|
|
178
|
+
var maxLeft = Math.max(MENU_VIEWPORT_GAP, window.innerWidth - menuWidth - MENU_VIEWPORT_GAP);
|
|
179
|
+
var maxTop = Math.max(MENU_VIEWPORT_GAP, window.innerHeight - menuHeight - MENU_VIEWPORT_GAP);
|
|
180
|
+
setMenuPosition({
|
|
181
|
+
left: Math.min(Math.max(rightClickMenuState.x, MENU_VIEWPORT_GAP), maxLeft),
|
|
182
|
+
top: Math.min(Math.max(rightClickMenuState.y, MENU_VIEWPORT_GAP), maxTop)
|
|
183
|
+
});
|
|
184
|
+
}, [rightClickMenuState, rightClickMenu.length, menuContainer]);
|
|
143
185
|
if (!rightClickMenuState) return null;
|
|
144
|
-
|
|
186
|
+
var menuNode = _jsx("div", {
|
|
187
|
+
ref: menuRef,
|
|
145
188
|
className: 'Sqb-right-click-menu',
|
|
146
189
|
style: {
|
|
147
|
-
left:
|
|
148
|
-
top:
|
|
190
|
+
left: menuPosition.left,
|
|
191
|
+
top: menuPosition.top,
|
|
149
192
|
zIndex: popupZIndex ? popupZIndex + 10 : 9999
|
|
150
193
|
},
|
|
151
194
|
onClick: function onClick(event) {
|
|
@@ -168,5 +211,7 @@ var SqbRightClickMenu = function SqbRightClickMenu(_ref) {
|
|
|
168
211
|
}, menuItem.value);
|
|
169
212
|
})
|
|
170
213
|
});
|
|
214
|
+
if (!menuContainer) return null;
|
|
215
|
+
return ReactDOM.createPortal(menuNode, menuContainer);
|
|
171
216
|
};
|
|
172
217
|
export default SqbRightClickMenu;
|
package/lib/es/utils.d.ts
CHANGED
|
@@ -25,7 +25,9 @@ export declare const getHelper: (list: MetaListType[], item: MetaListType) => He
|
|
|
25
25
|
export declare const mergeSubQueryColumns: (columns: MetaData_ColumnsType[], oldColumns?: MetaData_ColumnsType[], isSelectFields?: boolean) => MetaData_ColumnsType[];
|
|
26
26
|
export declare const syncSubQueryFieldReferences: (list: MetaListType[], table: MetaData_TableType, columns: MetaData_ColumnsType[], oldColumns?: MetaData_ColumnsType[]) => MetaListType[];
|
|
27
27
|
export declare const getSubColumns: (metaList: any) => DataType[];
|
|
28
|
+
export declare const getAtomDisplayText: (item?: AtomsItem) => string;
|
|
28
29
|
export declare const normalizeAndOrStructure: <T>(data: T) => T;
|
|
30
|
+
export declare const syncAtomQuotes: (item: AtomsItem) => AtomsItem;
|
|
29
31
|
export declare function isValidSQLAlias(str: string): boolean;
|
|
30
32
|
export declare const changeTableAlias: (list: MetaListType[] | [], curObj: Pick<MetaData_TableType, "tableUuid" | "alias">) => MetaListType[];
|
|
31
33
|
export declare const changeFieldAlias: (list: MetaListType[], curObj: Pick<MetaData_ColumnsType, "fieldUuid" | "fieldAlias"> & Partial<Pick<MetaData_ColumnsType, "id" | "name" | "datasourceId">> & Partial<Pick<MetaSummarize_Group | MetaSummarize_By, "table" | "tableId" | "tableUuid" | "fieldId" | "name">>) => MetaListType[];
|
package/lib/es/utils.js
CHANGED
|
@@ -617,6 +617,7 @@ var _getAtomDisplayText = function getAtomDisplayText(item) {
|
|
|
617
617
|
if (Array.isArray(val)) return val.join(', ');
|
|
618
618
|
return val || val === 0 ? String(val) : '';
|
|
619
619
|
};
|
|
620
|
+
export { _getAtomDisplayText as getAtomDisplayText };
|
|
620
621
|
var buildFormulaQuotes = function buildFormulaQuotes(item) {
|
|
621
622
|
var argsText = (item.args || []).map(_getAtomDisplayText).join(' , ');
|
|
622
623
|
return normalizeAtomQuotes("".concat(item.name || '', " ( ").concat(argsText, " )"));
|
|
@@ -954,7 +955,7 @@ var buildExpressionQuotes = function buildExpressionQuotes(item) {
|
|
|
954
955
|
}
|
|
955
956
|
return normalizeAtomQuotes("".concat(lhsText, " ").concat(getExpressionConditionText(condition), " ").concat(rhsText || firstVal));
|
|
956
957
|
};
|
|
957
|
-
var syncAtomQuotes = function syncAtomQuotes(item) {
|
|
958
|
+
export var syncAtomQuotes = function syncAtomQuotes(item) {
|
|
958
959
|
if (item.type === AtomsTypeEnum.JOIN_DEFAULT) {
|
|
959
960
|
return _objectSpread(_objectSpread({}, item), {}, {
|
|
960
961
|
lhs: syncAtomQuotesList(item.lhs || []),
|