@adaptabletools/adaptable 17.0.0-canary.9 → 17.0.0

package/src/components/ExpressionEditor/QueryBuilder/QueryBuilderInputs.js

@@ -11,6 +11,7 @@ const PermittedValuesSelector_1 = require("../../../View/Components/Selectors/Pe
 const CheckBox_1 = require("../../CheckBox");
 const DropdownButton_1 = tslib_1.__importDefault(require("../../DropdownButton"));
 const icons_1 = require("../../icons");
+const InputGroup_1 = require("../../InputGroup");
 const Select_1 = require("../../Select");
 const QueryBuilder_1 = require("./QueryBuilder");
 const utils_1 = require("./utils");
@@ -85,22 +86,25 @@ const PrimiteValueInput = (props) => {
     }
     const options = [
         {
-            label: 'Column',
+            label: (react_1.default.createElement(rebass_1.Flex, null,
+                react_1.default.createElement(icons_1.Icon, { name: "columns" }),
+                react_1.default.createElement(rebass_1.Text, { ml: 2 }, "Column"))),
             icon: 'columns',
             value: 'column-name',
         },
         {
-            label: 'Value',
+            label: (react_1.default.createElement(rebass_1.Flex, null,
+                react_1.default.createElement(icons_1.Icon, { name: "edit" }),
+                react_1.default.createElement(rebass_1.Text, { ml: 2 }, "Value"))),
             icon: 'edit',
             value: 'input-value',
         },
     ];
     const typeOption = options.find((option) => option.value === type);
-    return (react_1.default.createElement(rebass_1.Flex, { "data-id": "query-input-wrapper", mr: 2 },
-        react_1.default.createElement(rebass_1.Flex, null,
-            react_1.default.createElement(Select_1.Select, { rederSingleValue: (value) => {
-                    return (react_1.default.createElement(react_1.default.Fragment, null, typeOption.value === 'column-name' ? react_1.default.createElement(icons_1.Icon, { name: "grid" }) : react_1.default.createElement(icons_1.Icon, { name: "edit" })));
-                }, variant: "raised", value: typeOption.value, options: options, onChange: (value) => handleTypeChange(value) })),
+    return (react_1.default.createElement(InputGroup_1.InputGroup, { Component: rebass_1.Flex, "data-id": "query-input-wrapper", mr: 2 },
+        react_1.default.createElement(Select_1.Select, { rederSingleValue: (value) => {
+                return (react_1.default.createElement(react_1.default.Fragment, null, typeOption.value === 'column-name' ? react_1.default.createElement(icons_1.Icon, { name: "grid" }) : react_1.default.createElement(icons_1.Icon, { name: "edit" })));
+            }, value: typeOption.value, options: options, onChange: (value) => handleTypeChange(value) }),
         editor));
 };
 exports.PrimiteValueInput = PrimiteValueInput;

package/src/components/ExpressionEditor/index.js

@@ -32,6 +32,7 @@ function ExpressionEditor(props) {
     const { type, module } = props;
     const [data, setData] = (0, react_1.useState)(props.initialData);
     const [showColumnIds, setShowColumnIds] = (0, react_1.useState)(false);
+    const [inlineQuery, setInlineQuery] = (0, react_1.useState)(false);
     const [showNamedQueries, setShowNamedQueries] = (0, react_1.useState)(false);
     const baseClassName = `ab-ExpressionEditor`;
     const [selectedFunction, setSelectedFunction] = (0, react_1.useState)(null);
@@ -94,12 +95,8 @@ function ExpressionEditor(props) {
                 setData(updateColValue(data, column, new Date(e.target.value)));
             }, style: { width: '100%' }, disabled: column.readOnly })) : column.dataType === 'Boolean' ? (React.createElement(CheckBox_1.CheckBox, { "data-name": "column-input", "data-value": column.columnId, checked: getColValue(column), onChange: (checked) => setData(updateColValue(data, column, checked)), disabled: column.readOnly })) : null))))));
     const namedQueries = (React.createElement(rebass_1.Flex, { flexDirection: "column", alignItems: "start", style: { marginTop: 2 } },
-        React.createElement(CheckBox_1.CheckBox, { checked: showColumnIds, onChange: (checked) => setShowColumnIds(checked), style: {
-                float: 'right',
-                margin: 0,
-                paddingTop: 'var(--ab-space-1)',
-                paddingBottom: 'var(--ab-space-1)',
-            } }, 'Show Column IDs'),
+        React.createElement(CheckBox_1.CheckBox, { checked: showColumnIds, onChange: (checked) => setShowColumnIds(checked) }, "Show Column IDs"),
+        React.createElement(CheckBox_1.CheckBox, { checked: inlineQuery, onChange: (checked) => setInlineQuery(checked) }, "Inline Query"),
         props.namedQueries.map((namedQuery) => (React.createElement(rebass_1.Flex, { key: namedQuery.Uuid, flexDirection: "column", alignItems: "start", style: {
                 padding: 3,
                 marginTop: 'var(--ab-space-2)',
@@ -110,7 +107,7 @@ function ExpressionEditor(props) {
             React.createElement(EditorButton_1.default, { width: "100%", height: "100%", style: {
                     background: 'var(--ab-color-primary)',
                     cursor: 'grab',
-                }, data: `QUERY("${namedQuery.Name}")`, "data-name": "column", icon: "drag" },
+                }, data: inlineQuery ? namedQuery.BooleanExpression : `QUERY("${namedQuery.Name}")`, "data-name": "column", icon: "drag" },
                 React.createElement(rebass_1.Flex, { flexDirection: "column", alignItems: "start" }, namedQuery.Name)),
             React.createElement(rebass_1.Flex, { alignItems: "start", style: {
                     padding: 5,

package/src/components/InputGroup/InputGroup.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+type InputGroupProps<T extends React.ComponentType<any>> = {
+    Component?: T;
+    children: React.ReactNode;
+} & React.ComponentProps<T>;
+export declare const InputGroup: <T extends React.ComponentType<any>>({ Component, children, ...rest }: InputGroupProps<T>) => JSX.Element;
+export {};

package/src/components/InputGroup/InputGroup.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.InputGroup = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const InputGroup = (_a) => {
+    var _b;
+    var { Component = 'div', children } = _a, rest = tslib_1.__rest(_a, ["Component", "children"]);
+    const Comp = Component;
+    return (React.createElement(Comp, Object.assign({}, rest, { className: `ab-cmp-input-group ${(_b = rest.className) !== null && _b !== void 0 ? _b : ''}` }), children));
+};
+exports.InputGroup = InputGroup;

package/src/components/InputGroup/index.d.ts

@@ -0,0 +1 @@
+export * from './InputGroup';

package/src/components/InputGroup/index.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./InputGroup"), exports);

package/src/components/OverlayTrigger/index.js

@@ -4,6 +4,7 @@ exports.getConstrainRect = exports.getConstrainElement = void 0;
 const tslib_1 = require("tslib");
 const React = tslib_1.__importStar(require("react"));
 const react_1 = require("react");
+const debounce_1 = tslib_1.__importDefault(require("lodash/debounce"));
 const batchUpdate_1 = tslib_1.__importDefault(require("../utils/batchUpdate"));
 const selectParent_1 = tslib_1.__importDefault(require("../utils/selectParent"));
 const useProperty_1 = tslib_1.__importDefault(require("../utils/useProperty"));
@@ -72,7 +73,11 @@ const OverlayTrigger = React.forwardRef((props, ref) => {
     const overlayRef = (0, react_1.useRef)(null);
     const [visible, doSetVisible] = (0, useProperty_1.default)(props, 'visible', false);
     const hideTimeoutRef = (0, react_1.useRef)(null);
-    const setVisible = React.useCallback((visible) => {
+    const setVisible = React.useCallback(
+    // visible state may quickly change from true -> false -> true
+    // when moving the mouse cursor from the trigger to the overlay
+    // for this case we debounce the visible change for a very small amount of time
+    (0, debounce_1.default)((visible) => {
         onVisibleChange === null || onVisibleChange === void 0 ? void 0 : onVisibleChange(visible);
         if (!visible) {
             hideTimeoutRef.current = setTimeout(() => {
@@ -86,7 +91,7 @@ const OverlayTrigger = React.forwardRef((props, ref) => {
             hideTimeoutRef.current = null;
         }
         doSetVisible(true);
-    }, []);
+    }, 50), []);
     const prevVisible = (0, usePrevious_1.default)(visible, false);
     ensurePortalElement();
     const onShow = React.useCallback((event) => {

package/src/components/Select/Select.d.ts

@@ -24,7 +24,6 @@ export type SelectProps<SelectValue extends unknown, IsMulti extends boolean = f
     accessLevel?: AccessLevel;
     style?: React.CSSProperties;
     onInputChange?: (value: string) => void;
-    variant?: 'default' | 'raised';
     size?: 'small' | 'normal';
     isCreatable?: boolean;
 };

package/src/components/Select/Select.js

@@ -138,9 +138,7 @@ const Select = function (props) {
                 state;
                 return Object.assign(Object.assign(Object.assign({}, baseStyle), commonStyles(state)), { 
                     // height: 30,
-                    minHeight: props.size === 'small' ? 0 : 32, boxShadow: state.isFocused ? 'var(--ab-cmp-select-focused__box-shadow)' : 'none', outline: state.isFocused ? 'var(--ab-cmp-select-focused__outline)' : 'none', border: props.variant && props.variant === 'raised'
-                        ? '1px solid transparent'
-                        : 'var(--ab-cmp-select__border)', '&:hover': {
+                    minHeight: props.size === 'small' ? 0 : 32, boxShadow: state.isFocused ? 'var(--ab-cmp-select-focused__box-shadow)' : 'none', outline: state.isFocused ? 'var(--ab-cmp-select-focused__outline)' : 'none', border: 'var(--ab-cmp-select__border)', borderRadius: 'var(--ab-cmp-select__border-radius)', '&:hover': {
                         border: 'var(--ab-cmp-select__border)',
                     } });
             },

package/src/types.d.ts

@@ -127,7 +127,8 @@ export type { GridFilterAppliedInfo } from './Api/Events/GridFilterApplied';
 export type { GridSortedInfo, AdaptableSortState } from './Api/Events/GridSorted';
 export type { AdaptableSearchState } from './Api/Events/AdaptableSearchState';
 export type { DataSetSelectedInfo } from './Api/Events/DataSetSelected';
-export type { SelectionChangedInfo } from './Api/Events/SelectionChanged';
+export type { CellSelectionChangedInfo } from './Api/Events/CellSelectionChanged';
+export type { RowSelectionChangedInfo } from './Api/Events/RowSelectionChanged';
 export type { AdaptableStateReloadedInfo } from './Api/Events/AdaptableStateReloaded';
 export type { ThemeChangedInfo } from './Api/Events/ThemeChanged';
 export type { ThemeEditedInfo } from './Api/Events/ThemeEdited';

package/version.d.ts

@@ -1,2 +1,2 @@
-declare const _default: "17.0.0-canary.9";
+declare const _default: "17.0.0";
 export default _default;

package/version.js

@@ -1,3 +1,3 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = '17.0.0-canary.9'; // PLEASE DONT UPDATE THIS!!! - will be updated at build time with the correct version
+exports.default = '17.0.0'; // PLEASE DONT UPDATE THIS!!! - will be updated at build time with the correct version

package/src/Api/Events/SelectionChanged.d.ts

@@ -1,16 +0,0 @@
-import { SelectedCellInfo } from '../../PredefinedConfig/Selection/SelectedCellInfo';
-import { SelectedRowInfo } from '../../PredefinedConfig/Selection/SelectedRowInfo';
-import { BaseEventInfo } from './BaseEventInfo';
-/**
- * Event Info published by SelectionChanged event
- */
-export interface SelectionChangedInfo extends BaseEventInfo {
-    /**
-     * Details of cells currently selected in the Grid
-     */
-    selectedCellInfo: SelectedCellInfo;
-    /**
-     * Details of rows currently selected in the Grid
-     */
-    selectedRowInfo: SelectedRowInfo;
-}