@adaptabletools/adaptable 24.0.0-canary.7 → 24.0.0-canary.8
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/index.css +7 -0
- package/package.json +1 -1
- package/src/AdaptableOptions/DefaultAdaptableOptions.js +6 -0
- package/src/AdaptableOptions/UserInterfaceOptions.d.ts +81 -0
- package/src/View/Filter/ColumnFilter/ColumnFilterNew.js +14 -9
- package/src/components/ColorField/index.d.ts +2 -3
- package/src/components/ColorField/index.js +22 -2
- package/src/components/aql/QueryBuilder/GroupEditor.js +1 -1
- package/src/components/aql/QueryBuilder/QueryBuilder.d.ts +5 -0
- package/src/components/aql/QueryBuilder/QueryBuilder.js +1 -1
- package/src/components/aql/QueryBuilder/context.d.ts +7 -0
- package/src/components/aql/QueryBuilder/context.js +3 -1
- package/src/env.js +2 -2
- package/src/types.d.ts +1 -1
- package/tsconfig.esm.tsbuildinfo +1 -1
- package/vendor/components/ColorField/index.d.ts +12 -2
- package/vendor/components/ColorField/index.d.ts.map +1 -1
- package/vendor/components/ColorField/index.js +3 -4
- package/vendor/components/ColorField/index.js.map +1 -1
- package/vendor/components/ColorPicker/index.d.ts +50 -11
- package/vendor/components/ColorPicker/index.d.ts.map +1 -1
- package/vendor/components/ColorPicker/index.js +172 -54
- package/vendor/components/ColorPicker/index.js.map +1 -1
- package/vendor/components/ColorPicker/themeColors.d.ts +42 -1
- package/vendor/components/ColorPicker/themeColors.d.ts.map +1 -1
- package/vendor/components/ColorPicker/themeColors.js +131 -1
- package/vendor/components/ColorPicker/themeColors.js.map +1 -1
- package/vendor/components/index.css +6 -0
- package/vendor/components/index.d.ts +2 -2
- package/vendor/components/index.d.ts.map +1 -1
- package/vendor/components/index.js +1 -1
- package/vendor/components/index.js.map +1 -1
package/index.css
CHANGED
|
@@ -1026,6 +1026,9 @@
|
|
|
1026
1026
|
.twa\:max-w-3xl {
|
|
1027
1027
|
max-width: var(--twa-container-3xl);
|
|
1028
1028
|
}
|
|
1029
|
+
.twa\:max-w-28 {
|
|
1030
|
+
max-width: calc(var(--ab-base-space) * 28);
|
|
1031
|
+
}
|
|
1029
1032
|
.twa\:max-w-50 {
|
|
1030
1033
|
max-width: calc(var(--ab-base-space) * 50);
|
|
1031
1034
|
}
|
|
@@ -9521,6 +9524,10 @@
|
|
|
9521
9524
|
min-width: 0;
|
|
9522
9525
|
max-width: none;
|
|
9523
9526
|
width: 100%;
|
|
9527
|
+
--ab-color-input-background: var(--ab-color-primarylight);
|
|
9528
|
+
}
|
|
9529
|
+
.ab--theme-dark .ab-AgGridColumnFilter-host--tool-panel, .ab--theme-dark .ab-ColumnFilter--tool-panel {
|
|
9530
|
+
--ab-color-input-background: unset;
|
|
9524
9531
|
}
|
|
9525
9532
|
.ab-IconSelector__Popup {
|
|
9526
9533
|
color: var(--ab-cmp-icon-selector__popup__color);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@adaptabletools/adaptable",
|
|
3
|
-
"version": "24.0.0-canary.
|
|
3
|
+
"version": "24.0.0-canary.8",
|
|
4
4
|
"description": "Powerful AG Grid extension which provides advanced, cutting-edge functionality to meet all DataGrid requirements",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"web-components",
|
|
@@ -334,6 +334,12 @@ const DefaultAdaptableOptions = {
|
|
|
334
334
|
showOutsideDays: true,
|
|
335
335
|
datepickerButtons: ['close', 'today'],
|
|
336
336
|
},
|
|
337
|
+
colourPickerOptions: {
|
|
338
|
+
tabs: ['Custom', 'Palette'],
|
|
339
|
+
orderPaletteColours: true,
|
|
340
|
+
removeDuplicates: true,
|
|
341
|
+
showGroupLabels: false,
|
|
342
|
+
},
|
|
337
343
|
editableCellStyle: undefined,
|
|
338
344
|
readOnlyCellStyle: undefined,
|
|
339
345
|
editedCellStyle: undefined,
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { AdaptableIcon } from '../AdaptableState/Common/AdaptableIcon';
|
|
2
|
+
import { AdaptableModule } from '../AdaptableState/Common/Types';
|
|
2
3
|
import { DateInputOptions } from './DateInputOptions';
|
|
3
4
|
import { AdaptableObjectTag } from '../AdaptableState/Common/AdaptableObject';
|
|
4
5
|
import { AdaptableStyle } from '../AdaptableState/Common/AdaptableStyle';
|
|
@@ -29,6 +30,10 @@ export interface UserInterfaceOptions<TData = any> {
|
|
|
29
30
|
*
|
|
30
31
|
*/
|
|
31
32
|
dateInputOptions?: DateInputOptions;
|
|
33
|
+
/**
|
|
34
|
+
* Options for the Colour Picker, including which colours to display
|
|
35
|
+
*/
|
|
36
|
+
colourPickerOptions?: ColourPickerOptions;
|
|
32
37
|
/**
|
|
33
38
|
* Style to set for editable Cells
|
|
34
39
|
*/
|
|
@@ -130,6 +135,82 @@ export interface LoadingScreenOptions<TData = any> {
|
|
|
130
135
|
*/
|
|
131
136
|
loadingScreenText?: string;
|
|
132
137
|
}
|
|
138
|
+
/**
|
|
139
|
+
* Options for the Colour Picker.
|
|
140
|
+
*/
|
|
141
|
+
export interface ColourPickerOptions {
|
|
142
|
+
/**
|
|
143
|
+
* Colour Picker tabs to display in order provided; `Custom`, `Palette`, or both
|
|
144
|
+
*
|
|
145
|
+
* @defaultValue ['Custom', 'Palette']
|
|
146
|
+
*/
|
|
147
|
+
tabs?: ColourPickerTab[];
|
|
148
|
+
/**
|
|
149
|
+
* Orders Palette swatches around the colour wheel; if `false`, each colour stays the order supplied
|
|
150
|
+
*
|
|
151
|
+
* @defaultValue true
|
|
152
|
+
*/
|
|
153
|
+
orderPaletteColours?: boolean;
|
|
154
|
+
/**
|
|
155
|
+
* Leave out duplicates of swatches already displayed
|
|
156
|
+
*
|
|
157
|
+
* @defaultValue true
|
|
158
|
+
*/
|
|
159
|
+
removeDuplicates?: boolean;
|
|
160
|
+
/**
|
|
161
|
+
* Chooses which of the supplied colours (theme & colour palette) the Palette tab shows
|
|
162
|
+
*/
|
|
163
|
+
filterColours?: (context: ColourPickerFilterContext) => ColourPickerFilterResult | void;
|
|
164
|
+
/**
|
|
165
|
+
* Show **Theme** and **Palette** headings on the Palette tab (if both have colours)
|
|
166
|
+
*
|
|
167
|
+
* @defaultValue false
|
|
168
|
+
*/
|
|
169
|
+
showGroupLabels?: boolean;
|
|
170
|
+
}
|
|
171
|
+
/**
|
|
172
|
+
* Colour Picker tabs: `Custom` is free colour picker, `Palette` is list of swatches
|
|
173
|
+
*/
|
|
174
|
+
export type ColourPickerTab = 'Custom' | 'Palette';
|
|
175
|
+
/**
|
|
176
|
+
* A colour the Colour Picker can offer. `value` is what gets stored
|
|
177
|
+
*/
|
|
178
|
+
export interface ColourPickerColour {
|
|
179
|
+
/**
|
|
180
|
+
* The CSS value that gets stored, e.g. `var(--ab-color-success)`.
|
|
181
|
+
*/
|
|
182
|
+
value: string;
|
|
183
|
+
/** The name shown for the colour, e.g. "Success" or "Palette 3". */
|
|
184
|
+
label: string;
|
|
185
|
+
/**
|
|
186
|
+
* The colour as the active theme paints it
|
|
187
|
+
*/
|
|
188
|
+
hex?: string;
|
|
189
|
+
}
|
|
190
|
+
/**
|
|
191
|
+
* Colours available when Colour Picker opens, and module being edited.
|
|
192
|
+
*/
|
|
193
|
+
export interface ColourPickerFilterContext {
|
|
194
|
+
/**
|
|
195
|
+
* Available Theme colours
|
|
196
|
+
*/
|
|
197
|
+
themeColours: ColourPickerColour[];
|
|
198
|
+
/**
|
|
199
|
+
* Available Palette colours
|
|
200
|
+
*/
|
|
201
|
+
paletteColours: ColourPickerColour[];
|
|
202
|
+
/**
|
|
203
|
+
* Module being edited
|
|
204
|
+
*/
|
|
205
|
+
module?: AdaptableModule;
|
|
206
|
+
}
|
|
207
|
+
/**
|
|
208
|
+
* Colours to show - must be in list provided (otherwise ignored)
|
|
209
|
+
*/
|
|
210
|
+
export interface ColourPickerFilterResult {
|
|
211
|
+
themeColours: ColourPickerColour[];
|
|
212
|
+
paletteColours: ColourPickerColour[];
|
|
213
|
+
}
|
|
133
214
|
/**
|
|
134
215
|
* Context used when evaluating Object Tags
|
|
135
216
|
*/
|
|
@@ -32,8 +32,17 @@ export const ColumnFilterComponentNew = (props) => {
|
|
|
32
32
|
}, [api, props.columnId]);
|
|
33
33
|
const seededGroup = React.useMemo(() => foldInFilterFunctionsForEditing(props.columnId, props.qlGroup, operatorDefs), [props.columnId, resetNonce, operatorDefs]);
|
|
34
34
|
const pendingGroupRef = React.useRef(null);
|
|
35
|
+
const clearAllFilters = React.useCallback(() => {
|
|
36
|
+
pendingGroupRef.current = null;
|
|
37
|
+
props.onClear();
|
|
38
|
+
setResetNonce((n) => n + 1);
|
|
39
|
+
}, [props.onClear]);
|
|
35
40
|
const handlePredicateChange = (predicate) => {
|
|
36
41
|
const group = unfoldInFilterFunctionsFromEditing(props.columnId, asColumnFilterGroup(predicate), operatorDefs);
|
|
42
|
+
if (group.children.length === 0) {
|
|
43
|
+
clearAllFilters();
|
|
44
|
+
return;
|
|
45
|
+
}
|
|
37
46
|
if (manuallyApplyColumnFilter) {
|
|
38
47
|
pendingGroupRef.current = group;
|
|
39
48
|
api.eventApi.internalApi.fireColumnFilterChangedEvent({
|
|
@@ -57,14 +66,10 @@ export const ColumnFilterComponentNew = (props) => {
|
|
|
57
66
|
pendingGroupRef.current = null;
|
|
58
67
|
setResetNonce((n) => n + 1);
|
|
59
68
|
};
|
|
60
|
-
const
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
};
|
|
65
|
-
const showClear = props.location !== 'filterForm';
|
|
66
|
-
const showActions = !props.hideActionButtons && (showClear || manuallyApplyColumnFilter);
|
|
67
|
-
return (_jsx(ColumnFilterOverlayHost, { location: props.location, children: _jsxs("div", { ref: rootRef, onKeyDown: handleFocusTrap, className: "twa:contents", children: [showActions && (_jsxs(Flex, { className: cn('ab-ColumnFilter-actions twa:m-2', {
|
|
69
|
+
const clearAllOnCombinatorRow = props.location === 'columnMenu' || props.location === 'filtersToolPanel';
|
|
70
|
+
const rootHeaderEnd = React.useMemo(() => clearAllOnCombinatorRow ? (_jsx(SimpleButton, { "aria-label": "Clear All Filters", "data-name": "column-filter-clear-all", onClick: clearAllFilters, children: "Clear All" })) : undefined, [clearAllOnCombinatorRow, clearAllFilters]);
|
|
71
|
+
const showActions = !props.hideActionButtons && manuallyApplyColumnFilter;
|
|
72
|
+
return (_jsx(ColumnFilterOverlayHost, { location: props.location, children: _jsxs("div", { ref: rootRef, onKeyDown: handleFocusTrap, className: "twa:contents", children: [showActions && (_jsx(Flex, { className: cn('ab-ColumnFilter-actions twa:m-2', {
|
|
68
73
|
'twa:mb-2': isEmbeddedColumnFilterLocation(props.location),
|
|
69
|
-
}), justifyContent: "space-between", children:
|
|
74
|
+
}), justifyContent: "space-between", children: manuallyApplyColumnFilter && (_jsxs(_Fragment, { children: [_jsx(Box, { className: "twa:flex-1", "data-name": "spacer" }), _jsx(Box, { className: "ab-ColumnFilter-action-reset twa:mr-2", children: _jsx(SimpleButton, { "aria-label": "Reset All", tone: "neutral", variant: "raised", onClick: resetFilter, children: "Reset" }) }), _jsx(Box, { className: "ab-ColumnFilter-action-apply", children: _jsx(SimpleButton, { "aria-label": "Apply Filter", tone: "accent", variant: "raised", onClick: applyFilter, children: "Apply" }) })] })) })), _jsx(Box, { style: props.wrapperProps?.style, className: twMerge('ab-ColumnFilter twa:flex-1 twa:min-h-0 twa:overflow-auto twa:overflow-x-hidden twa:p-0.5 twa:gap-1 twa:flex twa:flex-col', props.location === 'filtersToolPanel' && 'ab-ColumnFilter--tool-panel', props.disabled ? 'twa:opacity-60 twa:pointer-events-none' : '', props.wrapperProps?.className), children: _jsx(QueryBuilder, { module: ModuleConstants.ColumnFilterModuleId, query: "", initialPredicate: seededGroup, onChange: noop, onPredicateChange: handlePredicateChange, getColumns: getColumns, getFields: getFields, subject: { mode: 'locked', columnId: props.columnId }, hideExpressionPreview: true, hideInlineAdd: true, hideAddGroup: true, hideLockedSubject: true, hideDragHandles: true, layout: getColumnFilterQueryBuilderLayout(props.location), rootHeaderEnd: rootHeaderEnd }, `${props.columnId}:${resetNonce}`) })] }) }));
|
|
70
75
|
};
|
|
@@ -1,6 +1,5 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
1
|
import { type ColorFieldProps as SharedColorFieldProps } from "../../../vendor/components/ColorField";
|
|
3
|
-
export type ColorFieldProps = Omit<SharedColorFieldProps, 'onChange' | 'clearable' | 'data-name'> & {
|
|
2
|
+
export type ColorFieldProps = Omit<SharedColorFieldProps, 'onChange' | 'clearable' | 'data-name' | 'filterColours'> & {
|
|
4
3
|
'data-name'?: string;
|
|
5
4
|
} & ({
|
|
6
5
|
clearable?: true;
|
|
@@ -11,4 +10,4 @@ export type ColorFieldProps = Omit<SharedColorFieldProps, 'onChange' | 'clearabl
|
|
|
11
10
|
onChange: (color: string) => void;
|
|
12
11
|
});
|
|
13
12
|
/** The shared colour field with AdapTable's defaults. */
|
|
14
|
-
export declare const ColorField: (props: ColorFieldProps) =>
|
|
13
|
+
export declare const ColorField: (props: ColorFieldProps) => import("react").JSX.Element;
|
|
@@ -1,6 +1,26 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
import { ColorField as SharedColorField, } from "../../../vendor/components/ColorField";
|
|
3
|
+
import { useAdaptable } from '../../View/AdaptableContext';
|
|
4
|
+
import { useOnePageAdaptableWizardContext } from '../../View/Wizard/OnePageAdaptableWizard';
|
|
5
|
+
function useEditedModule() {
|
|
6
|
+
const wizard = useOnePageAdaptableWizardContext();
|
|
7
|
+
const adaptable = useAdaptable();
|
|
8
|
+
const fromWizard = wizard.moduleInfo?.ModuleName;
|
|
9
|
+
if (fromWizard) {
|
|
10
|
+
return fromWizard;
|
|
11
|
+
}
|
|
12
|
+
const screenPopup = adaptable?.adaptableStore?.TheStore.getState().Popup.ScreenPopup;
|
|
13
|
+
return screenPopup?.ShowScreenPopup ? screenPopup.ComponentModule : undefined;
|
|
14
|
+
}
|
|
15
|
+
const DEFAULT_TABS = ['Custom', 'Palette'];
|
|
16
|
+
const showAllColours = () => undefined;
|
|
3
17
|
export const ColorField = (props) => {
|
|
4
|
-
const
|
|
5
|
-
|
|
18
|
+
const adaptable = useAdaptable();
|
|
19
|
+
const module = useEditedModule();
|
|
20
|
+
const paletteOptions = adaptable?.api.optionsApi.getUserInterfaceOptions().colourPickerOptions;
|
|
21
|
+
const filterColours = paletteOptions?.filterColours;
|
|
22
|
+
const { onChange, tabs, orderPaletteColours, removeDuplicates, showGroupLabels, 'data-name': dataName = 'color-field', ...rest } = props;
|
|
23
|
+
return (_jsx(SharedColorField, { ...rest, "data-name": dataName, tabs: tabs ?? paletteOptions?.tabs ?? DEFAULT_TABS, orderPaletteColours: orderPaletteColours ?? paletteOptions?.orderPaletteColours, removeDuplicates: removeDuplicates ?? paletteOptions?.removeDuplicates, showGroupLabels: showGroupLabels ?? paletteOptions?.showGroupLabels, filterColours: filterColours
|
|
24
|
+
? (colours) => filterColours({ ...colours, module })
|
|
25
|
+
: showAllColours, onChange: onChange }));
|
|
6
26
|
};
|
|
@@ -31,7 +31,7 @@ export const GroupEditor = ({ node, path, isRoot, dispatch, hideDelete, }) => {
|
|
|
31
31
|
};
|
|
32
32
|
return (_jsxs(Box, { className: cn('ab-QueryBuilder__group twa:my-1', !isRoot &&
|
|
33
33
|
'twa:pl-3 twa:border-l twa:rounded-md twa:py-1 twa:pr-1 ' +
|
|
34
|
-
'twa:bg-(--ab-cmp-query-builder-group__background)'), children: [showHeader && (_jsxs(Flex, { alignItems: "center", className: "twa:gap-2 twa:my-1", children: [showCombinator && (_jsx(CombinatorSelector, { value: node.combinator, onChange: (combinator) => dispatch({ type: 'setCombinator', groupPath: path, combinator }) })), _jsx(Box, { className: "twa:flex-1" }), showGroupDelete && (_jsx(RowActions, { rail: qb.hideInlineAdd ? 'compact' : 'full', hideAdd: true, onDelete: () => dispatch({ type: 'delete', path }) }))] })), isEmpty ? (_jsx(PrimitiveEditor, { node: emptyQlPrimitive(), path: [...path, 0], dispatch: seedDispatch, hideAdd: true, hideDelete: true })) : (_jsxs(_Fragment, { children: [hideDragHandles ? (_jsx("div", { className: "ab-QueryBuilder__group-children", children: node.children.map((child, index) => (_jsx(Flex, { className: "ab-QueryBuilder__row", alignItems: "center", children: _jsx(Box, { className: "ab-QueryBuilder__row-body twa:flex-1 twa:min-w-0", children: _jsx(NodeEditor, { node: child, path: [...path, index], dispatch: dispatch }) }) }, `${listId}/${index}`))) })) : (_jsx(DragList, { dragListId: listId, orientation: "vertical", onDrop: handleDrop, onDragProxyMove: defaultDragProxyMove, children: (listDomProps) => (_jsx("div", { ...listDomProps, className: cn('ab-QueryBuilder__group-children', listDomProps.className), children: node.children.map((child, index) => {
|
|
34
|
+
'twa:bg-(--ab-cmp-query-builder-group__background)'), children: [showHeader && (_jsxs(Flex, { alignItems: "center", className: "twa:gap-2 twa:my-1 twa:w-full", children: [showCombinator && (_jsx(CombinatorSelector, { value: node.combinator, onChange: (combinator) => dispatch({ type: 'setCombinator', groupPath: path, combinator }) })), _jsx(Box, { className: "twa:flex-1" }), showGroupDelete && (_jsx(RowActions, { rail: qb.hideInlineAdd ? 'compact' : 'full', hideAdd: true, onDelete: () => dispatch({ type: 'delete', path }) })), isRoot && showCombinator && qb.rootHeaderEnd] })), isEmpty ? (_jsx(PrimitiveEditor, { node: emptyQlPrimitive(), path: [...path, 0], dispatch: seedDispatch, hideAdd: true, hideDelete: true })) : (_jsxs(_Fragment, { children: [hideDragHandles ? (_jsx("div", { className: "ab-QueryBuilder__group-children", children: node.children.map((child, index) => (_jsx(Flex, { className: "ab-QueryBuilder__row", alignItems: "center", children: _jsx(Box, { className: "ab-QueryBuilder__row-body twa:flex-1 twa:min-w-0", children: _jsx(NodeEditor, { node: child, path: [...path, index], dispatch: dispatch }) }) }, `${listId}/${index}`))) })) : (_jsx(DragList, { dragListId: listId, orientation: "vertical", onDrop: handleDrop, onDragProxyMove: defaultDragProxyMove, children: (listDomProps) => (_jsx("div", { ...listDomProps, className: cn('ab-QueryBuilder__group-children', listDomProps.className), children: node.children.map((child, index) => {
|
|
35
35
|
const childId = `${listId}/${index}`;
|
|
36
36
|
return (_jsx(DragList.DraggableItem, { id: childId, children: (itemDomProps) => {
|
|
37
37
|
const { onPointerDown, ...rest } = itemDomProps;
|
|
@@ -88,5 +88,10 @@ export interface QueryBuilderProps {
|
|
|
88
88
|
* @defaultValue 'auto'
|
|
89
89
|
*/
|
|
90
90
|
layout?: QueryBuilderLayoutMode;
|
|
91
|
+
/**
|
|
92
|
+
* Extra control on the right of the root AND/OR row, once there are
|
|
93
|
+
* two or more conditions. Hidden while the editor has a single condition.
|
|
94
|
+
*/
|
|
95
|
+
rootHeaderEnd?: React.ReactNode;
|
|
91
96
|
}
|
|
92
97
|
export declare const QueryBuilder: React.FunctionComponent<QueryBuilderProps>;
|
|
@@ -104,7 +104,7 @@ export const QueryBuilder = (props) => {
|
|
|
104
104
|
: 'query-builder2-invalid-expression', className: "twa:my-2 twa:w-full twa:max-w-full twa:text-2 twa:leading-snug twa:bg-background twa:text-foreground", children: _jsxs(Flex, { flexDirection: "column", className: "twa:gap-3", alignItems: "flex-start", children: [_jsxs(Flex, { flexDirection: "column", className: "twa:gap-2", children: [_jsx(Box, { children: primaryLine }), typeMismatchMessages.map((message) => (_jsx(Box, { children: message }, message))), _jsx(Box, { children: "Please edit the Expression in the Expression Editor." })] }), clearExpressionButton] }) }));
|
|
105
105
|
}
|
|
106
106
|
else if (!isQlPredicateError(root) && isQlGroup(root)) {
|
|
107
|
-
body = (_jsx(QueryBuilderProvider, { module: props.module, columnScope: props.columnScope, getColumns: props.getColumns, getFields: props.getFields, subject: props.subject, hideInlineAdd: props.hideInlineAdd ?? true, hideAddGroup: props.hideAddGroup, hideLockedSubject: props.hideLockedSubject, hideDragHandles: props.hideDragHandles, layout: props.layout ?? 'auto', children: props.hideDragHandles ? (_jsx(Box, { "data-name": "query-builder2-editor", className: "twa:my-2", children: _jsx(NodeEditor, { node: root, path: [], isRoot: true, dispatch: dispatch }) })) : (_jsx(DragDropProvider, { children: _jsx(Box, { "data-name": "query-builder2-editor", className: "twa:my-2", children: _jsx(NodeEditor, { node: root, path: [], isRoot: true, dispatch: dispatch }) }) })) }));
|
|
107
|
+
body = (_jsx(QueryBuilderProvider, { module: props.module, columnScope: props.columnScope, getColumns: props.getColumns, getFields: props.getFields, subject: props.subject, hideInlineAdd: props.hideInlineAdd ?? true, hideAddGroup: props.hideAddGroup, hideLockedSubject: props.hideLockedSubject, hideDragHandles: props.hideDragHandles, layout: props.layout ?? 'auto', rootHeaderEnd: props.rootHeaderEnd, children: props.hideDragHandles ? (_jsx(Box, { "data-name": "query-builder2-editor", className: "twa:my-2", children: _jsx(NodeEditor, { node: root, path: [], isRoot: true, dispatch: dispatch }) })) : (_jsx(DragDropProvider, { children: _jsx(Box, { "data-name": "query-builder2-editor", className: "twa:my-2", children: _jsx(NodeEditor, { node: root, path: [], isRoot: true, dispatch: dispatch }) }) })) }));
|
|
108
108
|
}
|
|
109
109
|
return (_jsxs(Box, { className: twMerge(QUERY_BUILDER_CLASSNAME, QUERY_BUILDER_LAYOUT_CLASS[props.layout ?? 'auto']), children: [body, !props.hideExpressionPreview && (_jsxs(Card, { shadow: false, className: "twa:mt-12", children: [_jsxs(Card.Title, { className: "twa:justify-between twa:gap-2", children: [_jsxs(Flex, { flexDirection: "column", className: "twa:min-w-0 twa:gap-0.5", children: [_jsx(Box, { className: "twa:font-medium", children: "Output Expression" }), _jsx(Box, { className: "twa:text-xs twa:opacity-70 twa:font-normal", children: cannotDisplayInQueryBuilder
|
|
110
110
|
? 'Readonly view of the current Expression'
|
|
@@ -109,6 +109,12 @@ export interface QueryBuilderContextValue {
|
|
|
109
109
|
* narrow (container query).
|
|
110
110
|
*/
|
|
111
111
|
layout?: QueryBuilderLayoutMode;
|
|
112
|
+
/**
|
|
113
|
+
* Extra control rendered on the right of the root group's AND/OR row.
|
|
114
|
+
* Shown only once that row exists (≥2 conditions). Used by the column
|
|
115
|
+
* filter popups for Clear All.
|
|
116
|
+
*/
|
|
117
|
+
rootHeaderEnd?: React.ReactNode;
|
|
112
118
|
}
|
|
113
119
|
export declare const useQueryBuilder: () => QueryBuilderContextValue;
|
|
114
120
|
export interface QueryBuilderProviderProps {
|
|
@@ -123,6 +129,7 @@ export interface QueryBuilderProviderProps {
|
|
|
123
129
|
hideLockedSubject?: boolean;
|
|
124
130
|
hideDragHandles?: boolean;
|
|
125
131
|
layout?: QueryBuilderLayoutMode;
|
|
132
|
+
rootHeaderEnd?: React.ReactNode;
|
|
126
133
|
children: React.ReactNode;
|
|
127
134
|
}
|
|
128
135
|
/**
|
|
@@ -11,7 +11,7 @@ export const useQueryBuilder = () => {
|
|
|
11
11
|
}
|
|
12
12
|
return context;
|
|
13
13
|
};
|
|
14
|
-
export const QueryBuilderProvider = ({ module, columnScope, getColumns, getFields, subject, hideInlineAdd, hideAddGroup, hideLockedSubject, hideDragHandles, layout = 'auto', children, }) => {
|
|
14
|
+
export const QueryBuilderProvider = ({ module, columnScope, getColumns, getFields, subject, hideInlineAdd, hideAddGroup, hideLockedSubject, hideDragHandles, layout = 'auto', rootHeaderEnd, children, }) => {
|
|
15
15
|
const adaptable = useAdaptable();
|
|
16
16
|
const api = adaptable.api;
|
|
17
17
|
const lockedSubject = React.useMemo(() => {
|
|
@@ -72,6 +72,7 @@ export const QueryBuilderProvider = ({ module, columnScope, getColumns, getField
|
|
|
72
72
|
hideLockedSubject,
|
|
73
73
|
hideDragHandles,
|
|
74
74
|
layout,
|
|
75
|
+
rootHeaderEnd,
|
|
75
76
|
};
|
|
76
77
|
}, [
|
|
77
78
|
module,
|
|
@@ -88,6 +89,7 @@ export const QueryBuilderProvider = ({ module, columnScope, getColumns, getField
|
|
|
88
89
|
hideLockedSubject,
|
|
89
90
|
hideDragHandles,
|
|
90
91
|
layout,
|
|
92
|
+
rootHeaderEnd,
|
|
91
93
|
]);
|
|
92
94
|
return _jsx(QueryBuilderContext.Provider, { value: value, children: children });
|
|
93
95
|
};
|
package/src/env.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
export default {
|
|
2
2
|
NEXT_PUBLIC_INFINITE_TABLE_LICENSE_KEY: "StartDate=2021-06-29|EndDate=2030-01-01|Owner=Adaptable|Type=distribution|TS=1624971462479|C=137829811,1004007071,2756196225,1839832928,3994409405,636616862" || '',
|
|
3
|
-
PUBLISH_TIMESTAMP:
|
|
4
|
-
VERSION: "24.0.0-canary.
|
|
3
|
+
PUBLISH_TIMESTAMP: 1792792969512 || Date.now(),
|
|
4
|
+
VERSION: "24.0.0-canary.8" || '--current-version--',
|
|
5
5
|
};
|
package/src/types.d.ts
CHANGED
|
@@ -49,7 +49,7 @@ export type { BaseState } from './AdaptableState/BaseState';
|
|
|
49
49
|
export type { AdaptableNote, NoteState, AdaptableNotes } from './AdaptableState/NoteState';
|
|
50
50
|
export type { TeamSharingOptions, SharedEntitiesContext, } from './AdaptableOptions/TeamSharingOptions';
|
|
51
51
|
export type { ToolPanelOptions, CustomToolPanel, ToolPanelButtonContext, CustomToolPanelButtonContext, } from './AdaptableOptions/ToolPanelOptions';
|
|
52
|
-
export type { UserInterfaceOptions, LoadingScreenOptions, ObjectTagsContext, CustomIcon, } from './AdaptableOptions/UserInterfaceOptions';
|
|
52
|
+
export type { UserInterfaceOptions, LoadingScreenOptions, ColourPickerOptions, ColourPickerTab, ColourPickerColour, ColourPickerFilterContext, ColourPickerFilterResult, ObjectTagsContext, CustomIcon, } from './AdaptableOptions/UserInterfaceOptions';
|
|
53
53
|
export type { ContextMenuOptions, AdaptableSystemContextMenuItem, CustomContextMenuContext, CustomContextMenuItem, UserContextMenuItem, AgGridContextMenuItemType, DefaultAdaptableMenuStructure, DefaultAgGridMenuStructure, CustomGroupContextMenuItem, } from './AdaptableOptions/ContextMenuOptions';
|
|
54
54
|
export type { ColumnMenuOptions, CustomColumnMenuContext, CustomColumnMenuItem, UserColumnMenuItem, AdaptableSystemColumnMenuItem, AgGridColumnMenuItemType, CustomGroupColumnMenuItem, } from './AdaptableOptions/ColumnMenuOptions';
|
|
55
55
|
export type { CustomSettingsPanel, SettingsPanelOptions, SettingsPanelDisplayOptions, SettingsPanelNavigation, SettingsPanelNavigationGroup, SettingsPanelNavigationContext, SettingsPanelNavigationConfigurer, LegacyFlatSettingsPanelNavigation, PopupType, } from './AdaptableOptions/SettingsPanelOptions';
|