@quillsql/react 2.10.39 → 2.11.1
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/dist/cjs/Chart.d.ts +4 -0
- package/dist/cjs/Chart.d.ts.map +1 -1
- package/dist/cjs/Chart.js +5 -5
- package/dist/cjs/ChartBuilder.js +2 -2
- package/dist/cjs/Context.d.ts +1 -1
- package/dist/cjs/Context.d.ts.map +1 -1
- package/dist/cjs/Context.js +3 -1
- package/dist/cjs/Dashboard.d.ts +3 -1
- package/dist/cjs/Dashboard.d.ts.map +1 -1
- package/dist/cjs/Dashboard.js +4 -4
- package/dist/cjs/QuillProvider.d.ts +3 -1
- package/dist/cjs/QuillProvider.d.ts.map +1 -1
- package/dist/cjs/QuillProvider.js +2 -2
- package/dist/cjs/ReportBuilder.d.ts +40 -40
- package/dist/cjs/ReportBuilder.d.ts.map +1 -1
- package/dist/cjs/ReportBuilder.js +2036 -909
- package/dist/cjs/components/Chart/LineChart.d.ts +5 -1
- package/dist/cjs/components/Chart/LineChart.d.ts.map +1 -1
- package/dist/cjs/components/Chart/LineChart.js +18 -6
- package/dist/cjs/components/QuillTable.d.ts +1 -1
- package/dist/cjs/components/QuillTable.d.ts.map +1 -1
- package/dist/cjs/components/QuillTable.js +157 -157
- package/dist/cjs/components/ReportBuilder/AddColumnPopover.d.ts +2 -0
- package/dist/cjs/components/ReportBuilder/AddColumnPopover.d.ts.map +1 -0
- package/dist/cjs/components/ReportBuilder/AddColumnPopover.js +128 -0
- package/dist/cjs/components/ReportBuilder/ast.d.ts +512 -0
- package/dist/cjs/components/ReportBuilder/ast.d.ts.map +1 -0
- package/dist/cjs/components/ReportBuilder/ast.js +210 -0
- package/dist/cjs/components/ReportBuilder/bigDateMap.d.ts +7 -0
- package/dist/cjs/components/ReportBuilder/bigDateMap.d.ts.map +1 -0
- package/dist/cjs/components/ReportBuilder/bigDateMap.js +689 -0
- package/dist/cjs/components/ReportBuilder/constants.d.ts +89 -0
- package/dist/cjs/components/ReportBuilder/constants.d.ts.map +1 -0
- package/dist/cjs/components/ReportBuilder/constants.js +130 -0
- package/dist/cjs/components/ReportBuilder/convert.d.ts +41 -0
- package/dist/cjs/components/ReportBuilder/convert.d.ts.map +1 -0
- package/dist/cjs/components/ReportBuilder/convert.js +730 -0
- package/dist/cjs/components/ReportBuilder/operators.d.ts +445 -0
- package/dist/cjs/components/ReportBuilder/operators.d.ts.map +1 -0
- package/dist/cjs/components/ReportBuilder/operators.js +552 -0
- package/dist/cjs/components/ReportBuilder/pivot.d.ts +10 -0
- package/dist/cjs/components/ReportBuilder/pivot.d.ts.map +1 -0
- package/dist/cjs/components/ReportBuilder/pivot.js +2 -0
- package/dist/cjs/components/ReportBuilder/postgres.d.ts +150 -0
- package/dist/cjs/components/ReportBuilder/postgres.d.ts.map +1 -0
- package/dist/cjs/components/ReportBuilder/postgres.js +365 -0
- package/dist/cjs/components/ReportBuilder/schema.d.ts +23 -0
- package/dist/cjs/components/ReportBuilder/schema.d.ts.map +1 -0
- package/dist/cjs/components/ReportBuilder/schema.js +2 -0
- package/dist/cjs/components/ReportBuilder/ui.d.ts +34 -0
- package/dist/cjs/components/ReportBuilder/ui.d.ts.map +1 -0
- package/dist/cjs/components/ReportBuilder/ui.js +389 -0
- package/dist/cjs/components/ReportBuilder/util.d.ts +76 -0
- package/dist/cjs/components/ReportBuilder/util.d.ts.map +1 -0
- package/dist/cjs/components/ReportBuilder/util.js +648 -0
- package/dist/cjs/components/UiComponents.d.ts +15 -2
- package/dist/cjs/components/UiComponents.d.ts.map +1 -1
- package/dist/cjs/components/UiComponents.js +50 -3
- package/dist/cjs/utils/crypto.d.ts +1 -1
- package/dist/cjs/utils/crypto.d.ts.map +1 -1
- package/dist/cjs/utils/crypto.js +9 -5
- package/dist/esm/Chart.d.ts +4 -0
- package/dist/esm/Chart.d.ts.map +1 -1
- package/dist/esm/Chart.js +5 -5
- package/dist/esm/ChartBuilder.js +1 -1
- package/dist/esm/Context.d.ts +1 -1
- package/dist/esm/Context.d.ts.map +1 -1
- package/dist/esm/Context.js +3 -1
- package/dist/esm/Dashboard.d.ts +3 -1
- package/dist/esm/Dashboard.d.ts.map +1 -1
- package/dist/esm/Dashboard.js +4 -4
- package/dist/esm/QuillProvider.d.ts +3 -1
- package/dist/esm/QuillProvider.d.ts.map +1 -1
- package/dist/esm/QuillProvider.js +2 -2
- package/dist/esm/ReportBuilder.d.ts +40 -40
- package/dist/esm/ReportBuilder.d.ts.map +1 -1
- package/dist/esm/ReportBuilder.js +2038 -909
- package/dist/esm/components/Chart/LineChart.d.ts +5 -1
- package/dist/esm/components/Chart/LineChart.d.ts.map +1 -1
- package/dist/esm/components/Chart/LineChart.js +18 -6
- package/dist/esm/components/QuillTable.d.ts +1 -1
- package/dist/esm/components/QuillTable.d.ts.map +1 -1
- package/dist/esm/components/QuillTable.js +157 -157
- package/dist/esm/components/ReportBuilder/AddColumnPopover.d.ts +2 -0
- package/dist/esm/components/ReportBuilder/AddColumnPopover.d.ts.map +1 -0
- package/dist/esm/components/ReportBuilder/AddColumnPopover.js +125 -0
- package/dist/esm/components/ReportBuilder/ast.d.ts +512 -0
- package/dist/esm/components/ReportBuilder/ast.d.ts.map +1 -0
- package/dist/esm/components/ReportBuilder/ast.js +186 -0
- package/dist/esm/components/ReportBuilder/bigDateMap.d.ts +7 -0
- package/dist/esm/components/ReportBuilder/bigDateMap.d.ts.map +1 -0
- package/dist/esm/components/ReportBuilder/bigDateMap.js +686 -0
- package/dist/esm/components/ReportBuilder/constants.d.ts +89 -0
- package/dist/esm/components/ReportBuilder/constants.d.ts.map +1 -0
- package/dist/esm/components/ReportBuilder/constants.js +127 -0
- package/dist/esm/components/ReportBuilder/convert.d.ts +41 -0
- package/dist/esm/components/ReportBuilder/convert.d.ts.map +1 -0
- package/dist/esm/components/ReportBuilder/convert.js +719 -0
- package/dist/esm/components/ReportBuilder/operators.d.ts +445 -0
- package/dist/esm/components/ReportBuilder/operators.d.ts.map +1 -0
- package/dist/esm/components/ReportBuilder/operators.js +548 -0
- package/dist/esm/components/ReportBuilder/pivot.d.ts +10 -0
- package/dist/esm/components/ReportBuilder/pivot.d.ts.map +1 -0
- package/dist/esm/components/ReportBuilder/pivot.js +1 -0
- package/dist/esm/components/ReportBuilder/postgres.d.ts +150 -0
- package/dist/esm/components/ReportBuilder/postgres.d.ts.map +1 -0
- package/dist/esm/components/ReportBuilder/postgres.js +355 -0
- package/dist/esm/components/ReportBuilder/schema.d.ts +23 -0
- package/dist/esm/components/ReportBuilder/schema.d.ts.map +1 -0
- package/dist/esm/components/ReportBuilder/schema.js +1 -0
- package/dist/esm/components/ReportBuilder/ui.d.ts +34 -0
- package/dist/esm/components/ReportBuilder/ui.d.ts.map +1 -0
- package/dist/esm/components/ReportBuilder/ui.js +366 -0
- package/dist/esm/components/ReportBuilder/util.d.ts +76 -0
- package/dist/esm/components/ReportBuilder/util.d.ts.map +1 -0
- package/dist/esm/components/ReportBuilder/util.js +616 -0
- package/dist/esm/components/UiComponents.d.ts +15 -2
- package/dist/esm/components/UiComponents.d.ts.map +1 -1
- package/dist/esm/components/UiComponents.js +47 -2
- package/dist/esm/utils/crypto.d.ts +1 -1
- package/dist/esm/utils/crypto.d.ts.map +1 -1
- package/dist/esm/utils/crypto.js +9 -5
- package/package.json +1 -1
|
@@ -0,0 +1,389 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
exports.AddFilterPopover = exports.TagWrapper = exports.QuillFilterPopover = exports.EditPopover = exports.QuillTabs = exports.DEFAULT_TAB_OPTIONS = exports.QuillTableLoadingState = exports.QuillButtonLoadingState = exports.QuillDraggableColumn = exports.QuillSelectColumn = exports.QuillHandleButton = exports.QuillPopover = exports.MemoizedPopover = exports.QuillSelect = exports.CustomContainer = exports.QuillSidebar = exports.QuillSidebarSubHeading = exports.QuillSidebarHeading = exports.QuillTag = exports.QuillReportBuilderTable = exports.QuillTextInput = exports.QuillSecondaryButton = exports.QuillButton = void 0;
|
|
7
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
8
|
+
const react_1 = require("react");
|
|
9
|
+
const UiComponents_1 = require("../UiComponents");
|
|
10
|
+
const QuillTable_1 = __importDefault(require("../QuillTable"));
|
|
11
|
+
const Context_1 = require("../../Context");
|
|
12
|
+
const util_1 = require("./util");
|
|
13
|
+
const csv_1 = require("../../utils/csv");
|
|
14
|
+
/**
|
|
15
|
+
* This file is a collection of basic UI components that conform to the shape
|
|
16
|
+
* expected by the Report Builder. Where possible, we use our existing
|
|
17
|
+
* components and wrap them in a thin shim to make the interface match if
|
|
18
|
+
* needed.
|
|
19
|
+
*/
|
|
20
|
+
const QuillButton = ({ children, ...props }) => {
|
|
21
|
+
const [theme] = (0, react_1.useContext)(Context_1.ThemeContext);
|
|
22
|
+
return ((0, jsx_runtime_1.jsx)("button", { ...props, style: {
|
|
23
|
+
borderRadius: '6px',
|
|
24
|
+
backgroundColor: '#000000',
|
|
25
|
+
opacity: 1,
|
|
26
|
+
paddingLeft: '16px',
|
|
27
|
+
paddingRight: '16px',
|
|
28
|
+
fontSize: '14px',
|
|
29
|
+
fontWeight: 600,
|
|
30
|
+
color: '#FFFFFF',
|
|
31
|
+
cursor: 'pointer',
|
|
32
|
+
outline: 'none',
|
|
33
|
+
border: 'none',
|
|
34
|
+
fontFamily: theme?.fontFamily,
|
|
35
|
+
height: 38,
|
|
36
|
+
whiteSpace: 'nowrap',
|
|
37
|
+
...props.style,
|
|
38
|
+
}, children: children }));
|
|
39
|
+
};
|
|
40
|
+
exports.QuillButton = QuillButton;
|
|
41
|
+
const QuillSecondaryButton = ({ children, ...props }) => {
|
|
42
|
+
const [theme] = (0, react_1.useContext)(Context_1.ThemeContext);
|
|
43
|
+
return ((0, jsx_runtime_1.jsx)("button", { ...props, style: {
|
|
44
|
+
borderRadius: '6px',
|
|
45
|
+
backgroundColor: theme?.secondaryButtonColor || '#F5F5F5',
|
|
46
|
+
opacity: 1,
|
|
47
|
+
paddingLeft: '16px',
|
|
48
|
+
paddingRight: '16px',
|
|
49
|
+
fontSize: '14px',
|
|
50
|
+
fontWeight: 600,
|
|
51
|
+
color: theme?.primaryTextColor,
|
|
52
|
+
cursor: 'pointer',
|
|
53
|
+
outline: 'none',
|
|
54
|
+
border: 'none',
|
|
55
|
+
fontFamily: theme?.fontFamily,
|
|
56
|
+
height: 38,
|
|
57
|
+
whiteSpace: 'nowrap',
|
|
58
|
+
...props.style,
|
|
59
|
+
}, children: children }));
|
|
60
|
+
};
|
|
61
|
+
exports.QuillSecondaryButton = QuillSecondaryButton;
|
|
62
|
+
const QuillTextInput = (props) => {
|
|
63
|
+
const [theme] = (0, react_1.useContext)(Context_1.ThemeContext);
|
|
64
|
+
return ((0, jsx_runtime_1.jsx)("input", { ...props, style: {
|
|
65
|
+
color: theme?.primaryTextColor,
|
|
66
|
+
backgroundColor: theme?.backgroundColor || 'white',
|
|
67
|
+
fontFamily: theme?.fontFamily,
|
|
68
|
+
fontWeight: 'medium',
|
|
69
|
+
borderWidth: '1px',
|
|
70
|
+
borderColor: theme?.borderColor || '#E7E7E7',
|
|
71
|
+
borderStyle: 'solid',
|
|
72
|
+
borderRadius: '6px',
|
|
73
|
+
boxShadow: 'rgba(0, 0, 0, 0.1) 0px 1px 5px 0px',
|
|
74
|
+
padding: '0 12px',
|
|
75
|
+
display: 'block',
|
|
76
|
+
minHeight: 32,
|
|
77
|
+
...props.style,
|
|
78
|
+
} }));
|
|
79
|
+
};
|
|
80
|
+
exports.QuillTextInput = QuillTextInput;
|
|
81
|
+
const QuillReportBuilderTable = ({ rows, columns, error, ...props }) => {
|
|
82
|
+
const reformattedColumns = columns.map((c) => ({ label: c, field: c }));
|
|
83
|
+
return ((0, jsx_runtime_1.jsx)("div", { style: { height: '100%', overflow: 'auto' }, children: (0, jsx_runtime_1.jsx)(QuillTable_1.default, { rows: rows, columns: reformattedColumns, rowsPerPage: 10, showDownloadCSVButton: rows?.length > 0, downloadCSV: () => (0, csv_1.downloadCSV)({ rows, fields: reformattedColumns, name: 'my_report' }), emptyStateLabel: error || 'No results', ...props }) }));
|
|
84
|
+
};
|
|
85
|
+
exports.QuillReportBuilderTable = QuillReportBuilderTable;
|
|
86
|
+
exports.QuillTag = (0, react_1.forwardRef)(({ label, onClick, children, onClickDelete, hideDelete = false, ..._props }, forwardedRef) => {
|
|
87
|
+
const [theme] = (0, react_1.useContext)(Context_1.ThemeContext);
|
|
88
|
+
return ((0, jsx_runtime_1.jsxs)("div", { style: {
|
|
89
|
+
boxShadow: '0px 1px 4px #e2e8f005',
|
|
90
|
+
border: '1px solid #e2e8f0',
|
|
91
|
+
borderRadius: 6,
|
|
92
|
+
display: 'flex',
|
|
93
|
+
flexDirection: 'row',
|
|
94
|
+
width: '100%',
|
|
95
|
+
padding: '4px 8px',
|
|
96
|
+
alignItems: 'center',
|
|
97
|
+
backgroundColor: 'white',
|
|
98
|
+
fontSize: 14,
|
|
99
|
+
}, ref: forwardedRef, onClick: onClick, children: [label ?? children, !hideDelete && ((0, jsx_runtime_1.jsx)("div", { style: {
|
|
100
|
+
marginLeft: 'auto',
|
|
101
|
+
marginRight: '8px',
|
|
102
|
+
display: 'flex',
|
|
103
|
+
flexDirection: 'column',
|
|
104
|
+
justifyContent: 'center',
|
|
105
|
+
}, children: (0, jsx_runtime_1.jsx)("button", { onClick: onClickDelete, style: { margin: -4 }, children: (0, jsx_runtime_1.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", fill: theme?.secondaryButtonColor || 'currentColor', style: { width: 16, height: 16 }, children: (0, jsx_runtime_1.jsx)("path", { d: "M6.28 5.22a.75.75 0 0 0-1.06 1.06L8.94 10l-3.72 3.72a.75.75 0 1 0 1.06 1.06L10 11.06l3.72 3.72a.75.75 0 1 0 1.06-1.06L11.06 10l3.72-3.72a.75.75 0 0 0-1.06-1.06L10 8.94 6.28 5.22Z" }) }) }) }))] }));
|
|
106
|
+
});
|
|
107
|
+
// A heading element in the sidebar (eg. "Filters")
|
|
108
|
+
const QuillSidebarHeading = ({ label }) => ((0, jsx_runtime_1.jsx)(UiComponents_1.MemoizedHeader, { children: label }));
|
|
109
|
+
exports.QuillSidebarHeading = QuillSidebarHeading;
|
|
110
|
+
// A sub-heading element in the sidebar (eg. "Filters")
|
|
111
|
+
const QuillSidebarSubHeading = ({ label }) => ((0, jsx_runtime_1.jsx)(UiComponents_1.MemoizedLabel, { children: label }));
|
|
112
|
+
exports.QuillSidebarSubHeading = QuillSidebarSubHeading;
|
|
113
|
+
// The gray thing on the left.
|
|
114
|
+
exports.QuillSidebar = (0, react_1.forwardRef)(({ children, ...props }, forwardedRef) => ((0, jsx_runtime_1.jsx)("div", { style: {
|
|
115
|
+
overflow: 'visible',
|
|
116
|
+
padding: '12px',
|
|
117
|
+
width: '25%',
|
|
118
|
+
height: '100%',
|
|
119
|
+
maxWidth: '300px',
|
|
120
|
+
}, ref: forwardedRef, ...props, children: children })));
|
|
121
|
+
// A big wrapper around the main content (ie. Input, Button, and Table)
|
|
122
|
+
exports.CustomContainer = (0, react_1.forwardRef)(({ children, ...props }, forwardedRef) => ((0, jsx_runtime_1.jsx)("div", { style: {
|
|
123
|
+
position: 'sticky',
|
|
124
|
+
top: 0,
|
|
125
|
+
display: 'flex',
|
|
126
|
+
flexDirection: 'column',
|
|
127
|
+
gap: '12px',
|
|
128
|
+
borderLeftWidth: '1px',
|
|
129
|
+
overflowY: 'auto',
|
|
130
|
+
padding: '1rem',
|
|
131
|
+
flexGrow: 1,
|
|
132
|
+
width: '75%',
|
|
133
|
+
height: '100%',
|
|
134
|
+
}, ref: forwardedRef, ...props, children: children })));
|
|
135
|
+
const QuillSelect = ({ onChange, ...props }) => {
|
|
136
|
+
const handleOnChange = (value) => {
|
|
137
|
+
if (!onChange)
|
|
138
|
+
return;
|
|
139
|
+
const option = props.options.find((opt) => opt.value === value);
|
|
140
|
+
if (option) {
|
|
141
|
+
onChange(option.value);
|
|
142
|
+
}
|
|
143
|
+
};
|
|
144
|
+
return (0, jsx_runtime_1.jsx)(UiComponents_1.MemoizedSelect, { ...props, onChange: handleOnChange });
|
|
145
|
+
};
|
|
146
|
+
exports.QuillSelect = QuillSelect;
|
|
147
|
+
function MemoizedPopover({ onClose, children, style = {}, trigger, isOpen, }) {
|
|
148
|
+
const modalRef = (0, react_1.useRef)(null);
|
|
149
|
+
(0, react_1.useEffect)(() => {
|
|
150
|
+
const listener = (event) => {
|
|
151
|
+
if (modalRef?.current && !modalRef?.current?.contains(event.target)) {
|
|
152
|
+
onClose(event);
|
|
153
|
+
}
|
|
154
|
+
};
|
|
155
|
+
document.addEventListener('mousedown', listener);
|
|
156
|
+
return () => {
|
|
157
|
+
document.removeEventListener('mousedown', listener);
|
|
158
|
+
};
|
|
159
|
+
}, [modalRef, onClose]);
|
|
160
|
+
return ((0, jsx_runtime_1.jsxs)("div", { children: [trigger, isOpen && ((0, jsx_runtime_1.jsx)("div", { id: "quill-popover-modal", ref: modalRef, style: { position: 'relative' }, children: (0, jsx_runtime_1.jsx)("div", { style: {
|
|
161
|
+
background: 'white',
|
|
162
|
+
position: 'absolute',
|
|
163
|
+
boxShadow: '0px 1px 12px 0px rgba(56, 65, 81, 0.1)',
|
|
164
|
+
border: '1px solid #e7e7e7',
|
|
165
|
+
boxSizing: 'content-box',
|
|
166
|
+
zIndex: 999,
|
|
167
|
+
top: 12,
|
|
168
|
+
borderRadius: 6,
|
|
169
|
+
padding: 20,
|
|
170
|
+
overflow: 'auto',
|
|
171
|
+
...style,
|
|
172
|
+
}, children: children }) }))] }));
|
|
173
|
+
}
|
|
174
|
+
exports.MemoizedPopover = MemoizedPopover;
|
|
175
|
+
exports.QuillPopover = (0, react_1.forwardRef)(({ children, trigger, isOpen, onClose = () => { }, title = undefined }, ref) => {
|
|
176
|
+
return ((0, jsx_runtime_1.jsxs)(MemoizedPopover, { isOpen: isOpen, onClose: onClose, trigger: trigger, parentRef: ref, ref: ref, children: [title && ((0, jsx_runtime_1.jsx)("h1", { style: {
|
|
177
|
+
fontWeight: '600',
|
|
178
|
+
fontSize: 18,
|
|
179
|
+
margin: 0,
|
|
180
|
+
textAlign: 'left',
|
|
181
|
+
paddingBottom: 12,
|
|
182
|
+
}, children: title })), children] }));
|
|
183
|
+
});
|
|
184
|
+
// The six-dot grab-handle icon.
|
|
185
|
+
const QuillHandleButton = () => {
|
|
186
|
+
return ((0, jsx_runtime_1.jsxs)("div", { style: {
|
|
187
|
+
display: 'flex',
|
|
188
|
+
gap: 2,
|
|
189
|
+
flexDirection: 'row',
|
|
190
|
+
paddingTop: 8,
|
|
191
|
+
paddingBottom: 8,
|
|
192
|
+
paddingLeft: 8,
|
|
193
|
+
paddingRight: 8,
|
|
194
|
+
borderRadius: 4,
|
|
195
|
+
}, className: "handle", children: [(0, jsx_runtime_1.jsx)("style", { children: `.handle{background:white;} .handle:hover{background:rgba(0,0,0,0.03);}` }), (0, jsx_runtime_1.jsxs)("div", { style: { display: 'flex', gap: 2, flexDirection: 'column' }, children: [(0, jsx_runtime_1.jsx)("div", { style: {
|
|
196
|
+
width: 3,
|
|
197
|
+
height: 3,
|
|
198
|
+
borderRadius: 3,
|
|
199
|
+
background: '#9CA0A7',
|
|
200
|
+
} }), (0, jsx_runtime_1.jsx)("div", { style: {
|
|
201
|
+
width: 3,
|
|
202
|
+
height: 3,
|
|
203
|
+
borderRadius: 3,
|
|
204
|
+
background: '#9CA0A7',
|
|
205
|
+
} }), (0, jsx_runtime_1.jsx)("div", { style: {
|
|
206
|
+
width: 3,
|
|
207
|
+
height: 3,
|
|
208
|
+
borderRadius: 3,
|
|
209
|
+
background: '#9CA0A7',
|
|
210
|
+
} })] }), (0, jsx_runtime_1.jsxs)("div", { style: { display: 'flex', gap: 2, flexDirection: 'column' }, children: [(0, jsx_runtime_1.jsx)("div", { style: {
|
|
211
|
+
width: 3,
|
|
212
|
+
height: 3,
|
|
213
|
+
borderRadius: 3,
|
|
214
|
+
background: '#9CA0A7',
|
|
215
|
+
} }), (0, jsx_runtime_1.jsx)("div", { style: {
|
|
216
|
+
width: 3,
|
|
217
|
+
height: 3,
|
|
218
|
+
borderRadius: 3,
|
|
219
|
+
background: '#9CA0A7',
|
|
220
|
+
} }), (0, jsx_runtime_1.jsx)("div", { style: {
|
|
221
|
+
width: 3,
|
|
222
|
+
height: 3,
|
|
223
|
+
borderRadius: 3,
|
|
224
|
+
background: '#9CA0A7',
|
|
225
|
+
} })] })] }));
|
|
226
|
+
};
|
|
227
|
+
exports.QuillHandleButton = QuillHandleButton;
|
|
228
|
+
const QuillSelectColumn = ({ label, selected, setSelected, children, }) => {
|
|
229
|
+
return ((0, jsx_runtime_1.jsxs)("div", { title: label, style: {
|
|
230
|
+
boxShadow: '0px 1px 4px #e2e8f005',
|
|
231
|
+
paddingTop: 4,
|
|
232
|
+
paddingBottom: 4,
|
|
233
|
+
paddingLeft: 5,
|
|
234
|
+
border: '1px solid #e2e8f0',
|
|
235
|
+
borderRadius: 4,
|
|
236
|
+
display: 'flex',
|
|
237
|
+
alignItems: 'center',
|
|
238
|
+
backgroundColor: 'white',
|
|
239
|
+
}, children: [(0, jsx_runtime_1.jsx)("div", { children: children }), (0, jsx_runtime_1.jsxs)("label", { style: {
|
|
240
|
+
display: 'flex',
|
|
241
|
+
gap: 2,
|
|
242
|
+
whiteSpace: 'nowrap',
|
|
243
|
+
textOverflow: 'ellipsis',
|
|
244
|
+
overflow: 'hidden',
|
|
245
|
+
}, children: [(0, jsx_runtime_1.jsx)(UiComponents_1.MemoizedCheckbox, { checked: selected, onChange: () => setSelected() }), (0, jsx_runtime_1.jsx)("span", { style: {
|
|
246
|
+
marginLeft: 6,
|
|
247
|
+
display: 'block',
|
|
248
|
+
whiteSpace: 'nowrap',
|
|
249
|
+
textOverflow: 'ellipsis',
|
|
250
|
+
overflow: 'hidden',
|
|
251
|
+
}, children: label })] })] }));
|
|
252
|
+
};
|
|
253
|
+
exports.QuillSelectColumn = QuillSelectColumn;
|
|
254
|
+
// A draggable card with a grab-handle and a column name
|
|
255
|
+
const QuillDraggableColumn = ({ label, children, onDelete }) => {
|
|
256
|
+
const [theme] = (0, react_1.useContext)(Context_1.ThemeContext);
|
|
257
|
+
return ((0, jsx_runtime_1.jsxs)("div", { style: {
|
|
258
|
+
boxShadow: '0px 1px 4px #e2e8f005',
|
|
259
|
+
border: '1px solid #e2e8f0',
|
|
260
|
+
borderRadius: 6,
|
|
261
|
+
display: 'flex',
|
|
262
|
+
alignItems: 'center',
|
|
263
|
+
backgroundColor: 'white',
|
|
264
|
+
}, children: [(0, jsx_runtime_1.jsx)("div", { children: children }), (0, jsx_runtime_1.jsx)("div", { style: {
|
|
265
|
+
marginLeft: 2,
|
|
266
|
+
marginRight: 'auto',
|
|
267
|
+
fontSize: 14,
|
|
268
|
+
display: 'block',
|
|
269
|
+
whiteSpace: 'nowrap',
|
|
270
|
+
textOverflow: 'ellipsis',
|
|
271
|
+
}, children: label }), (0, jsx_runtime_1.jsx)("button", { onClick: onDelete, style: { paddingRight: 8, margin: -4 }, children: (0, jsx_runtime_1.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", fill: theme?.secondaryButtonColor || 'currentColor', style: { width: 16, height: 16 }, children: (0, jsx_runtime_1.jsx)("path", { d: "M6.28 5.22a.75.75 0 0 0-1.06 1.06L8.94 10l-3.72 3.72a.75.75 0 1 0 1.06 1.06L10 11.06l3.72 3.72a.75.75 0 1 0 1.06-1.06L11.06 10l3.72-3.72a.75.75 0 0 0-1.06-1.06L10 8.94 6.28 5.22Z" }) }) })] }));
|
|
272
|
+
};
|
|
273
|
+
exports.QuillDraggableColumn = QuillDraggableColumn;
|
|
274
|
+
// Three dots animated bouncing
|
|
275
|
+
const QuillButtonLoadingState = () => {
|
|
276
|
+
return (0, jsx_runtime_1.jsx)(exports.QuillButton, { children: "Loading..." });
|
|
277
|
+
};
|
|
278
|
+
exports.QuillButtonLoadingState = QuillButtonLoadingState;
|
|
279
|
+
// Loading state for the table
|
|
280
|
+
const QuillTableLoadingState = () => {
|
|
281
|
+
return ((0, jsx_runtime_1.jsx)("div", { style: { display: 'flex', flexDirection: 'column', margin: 'auto' }, children: (0, jsx_runtime_1.jsx)(UiComponents_1.LoadingSpinner, {}) }));
|
|
282
|
+
};
|
|
283
|
+
exports.QuillTableLoadingState = QuillTableLoadingState;
|
|
284
|
+
exports.DEFAULT_TAB_OPTIONS = [
|
|
285
|
+
{ label: 'or', value: 'OR' },
|
|
286
|
+
{ label: 'and', value: 'AND' },
|
|
287
|
+
];
|
|
288
|
+
exports.QuillTabs = (0, react_1.forwardRef)(({ options = exports.DEFAULT_TAB_OPTIONS, ...props }, ref) => ((0, jsx_runtime_1.jsx)(UiComponents_1.MemoizedTabs, { ref: ref, options: options, ...props })));
|
|
289
|
+
const EditPopover = ({ onSave, onDelete, Button, renderNode, activeEditItem, }) => {
|
|
290
|
+
return ((0, jsx_runtime_1.jsxs)("div", { style: {
|
|
291
|
+
display: 'flex',
|
|
292
|
+
flexDirection: 'column',
|
|
293
|
+
gap: 12,
|
|
294
|
+
}, children: [activeEditItem && renderNode(activeEditItem), (0, jsx_runtime_1.jsxs)("div", { style: {
|
|
295
|
+
display: 'flex',
|
|
296
|
+
flexDirection: 'row',
|
|
297
|
+
justifyContent: 'end',
|
|
298
|
+
gap: 8,
|
|
299
|
+
width: '100%',
|
|
300
|
+
}, children: [(0, jsx_runtime_1.jsx)(exports.QuillSecondaryButton, { onClick: onDelete, children: "Delete" }), (0, jsx_runtime_1.jsx)(Button, { onClick: onSave, children: "Save" })] })] }));
|
|
301
|
+
};
|
|
302
|
+
exports.EditPopover = EditPopover;
|
|
303
|
+
const QuillFilterPopover = ({ filterLabel, onClickDeleteFilter, popoverTitle, popoverChildren, isOpen, setIsOpen, }) => {
|
|
304
|
+
return ((0, jsx_runtime_1.jsx)(exports.QuillPopover, { isOpen: isOpen, title: popoverTitle, trigger: (0, jsx_runtime_1.jsx)(exports.QuillTag, { label: filterLabel, onClickDelete: onClickDeleteFilter, onClick: () => {
|
|
305
|
+
setIsOpen((isOpen) => !isOpen);
|
|
306
|
+
} }), onClose: () => {
|
|
307
|
+
setIsOpen(false);
|
|
308
|
+
}, children: popoverChildren }));
|
|
309
|
+
};
|
|
310
|
+
exports.QuillFilterPopover = QuillFilterPopover;
|
|
311
|
+
const TagWrapper = ({ isCard, isRow, editPopoverKey, keyPrefix, formData, activeEditItem, setEditPopoverKey, setActiveEditItem, setActivePath, setOpenPopover, setIsPending, clearCheckboxes, fetchSqlQuery, handleDelete, setCheckboxes, handleReplaceSubtree, FilterPopover, getByKey, EditPopover, Button, renderNode, children, }) => {
|
|
312
|
+
const [isOpen, setIsOpen] = (0, react_1.useState)(false);
|
|
313
|
+
(0, react_1.useEffect)(() => {
|
|
314
|
+
if (isOpen) {
|
|
315
|
+
// open
|
|
316
|
+
setActiveEditItem(getByKey(formData, keyPrefix));
|
|
317
|
+
setActivePath(keyPrefix);
|
|
318
|
+
setIsPending(true);
|
|
319
|
+
setEditPopoverKey(keyPrefix);
|
|
320
|
+
setCheckboxes(getByKey(formData, keyPrefix));
|
|
321
|
+
}
|
|
322
|
+
else {
|
|
323
|
+
// closed
|
|
324
|
+
setEditPopoverKey(null);
|
|
325
|
+
setIsPending(false);
|
|
326
|
+
setActiveEditItem(null);
|
|
327
|
+
setActivePath(null);
|
|
328
|
+
setOpenPopover(null);
|
|
329
|
+
clearCheckboxes();
|
|
330
|
+
}
|
|
331
|
+
}, [isOpen]);
|
|
332
|
+
if (isCard && isRow) {
|
|
333
|
+
const handleClickDelete = (e) => {
|
|
334
|
+
e.stopPropagation(); // don't call onClick handler
|
|
335
|
+
setIsPending(false);
|
|
336
|
+
handleDelete(keyPrefix);
|
|
337
|
+
setActiveEditItem(null);
|
|
338
|
+
setActivePath(null);
|
|
339
|
+
setOpenPopover(null);
|
|
340
|
+
setEditPopoverKey(null);
|
|
341
|
+
clearCheckboxes();
|
|
342
|
+
};
|
|
343
|
+
return ((0, jsx_runtime_1.jsx)("div", { style: { width: '100%' }, children: (0, jsx_runtime_1.jsx)(FilterPopover, { isOpen: editPopoverKey === keyPrefix, popoverTitle: "Edit Filter", filterLabel: children, onClickDeleteFilter: handleClickDelete, setIsOpen: setIsOpen, popoverChildren: (0, jsx_runtime_1.jsx)(EditPopover, { Button: Button, renderNode: renderNode, activeEditItem: activeEditItem, onSave: () => {
|
|
344
|
+
if ((0, util_1.isNodeEmptyCollection)(activeEditItem)) {
|
|
345
|
+
setIsPending(false);
|
|
346
|
+
setActiveEditItem(null);
|
|
347
|
+
setActivePath(null);
|
|
348
|
+
setOpenPopover(null);
|
|
349
|
+
setEditPopoverKey(null);
|
|
350
|
+
handleDelete(keyPrefix);
|
|
351
|
+
fetchSqlQuery();
|
|
352
|
+
clearCheckboxes();
|
|
353
|
+
}
|
|
354
|
+
else {
|
|
355
|
+
setEditPopoverKey(null);
|
|
356
|
+
setIsPending(false);
|
|
357
|
+
handleReplaceSubtree(keyPrefix, activeEditItem, false);
|
|
358
|
+
setActiveEditItem(null);
|
|
359
|
+
setActivePath(null);
|
|
360
|
+
setOpenPopover(null);
|
|
361
|
+
clearCheckboxes();
|
|
362
|
+
}
|
|
363
|
+
}, onDelete: () => {
|
|
364
|
+
setIsPending(false);
|
|
365
|
+
setActiveEditItem(null);
|
|
366
|
+
setActivePath(null);
|
|
367
|
+
setOpenPopover(null);
|
|
368
|
+
setEditPopoverKey(null);
|
|
369
|
+
handleDelete(keyPrefix);
|
|
370
|
+
fetchSqlQuery();
|
|
371
|
+
clearCheckboxes();
|
|
372
|
+
} }) }) })); // Make sure to close the <Tag> correctly
|
|
373
|
+
}
|
|
374
|
+
else if (isRow) {
|
|
375
|
+
return (0, jsx_runtime_1.jsx)("div", { children: children });
|
|
376
|
+
}
|
|
377
|
+
else {
|
|
378
|
+
return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: children });
|
|
379
|
+
}
|
|
380
|
+
};
|
|
381
|
+
exports.TagWrapper = TagWrapper;
|
|
382
|
+
const AddFilterPopover = ({ onSave, Button, renderNode, activeEditItem, }) => {
|
|
383
|
+
return ((0, jsx_runtime_1.jsxs)("div", { style: { display: 'flex', flexDirection: 'column', gap: 12 }, children: [activeEditItem && renderNode(activeEditItem), (0, jsx_runtime_1.jsx)("div", { style: {
|
|
384
|
+
display: 'flex',
|
|
385
|
+
flexDirection: 'row',
|
|
386
|
+
justifyContent: 'end',
|
|
387
|
+
}, children: (0, jsx_runtime_1.jsx)(Button, { onMouseUp: onSave, children: "Add filter" }) })] }));
|
|
388
|
+
};
|
|
389
|
+
exports.AddFilterPopover = AddFilterPopover;
|
|
@@ -0,0 +1,76 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* A node that is "in" or "not in" where none of the variants are selected.
|
|
3
|
+
*/
|
|
4
|
+
export declare const isNodeEmptyCollection: (node: any) => boolean;
|
|
5
|
+
export declare function isTopLevelBoolean(node: any): boolean;
|
|
6
|
+
export declare function hasTopLevelOrBoolean(ast: any): boolean;
|
|
7
|
+
export declare const isDateTrunc: (node: any) => boolean;
|
|
8
|
+
export declare const isColumnReferenceish: (node: any) => any;
|
|
9
|
+
export declare function generateColumnExpr(name: any): {
|
|
10
|
+
type: string;
|
|
11
|
+
expr: {
|
|
12
|
+
type: string;
|
|
13
|
+
table: null;
|
|
14
|
+
column: any;
|
|
15
|
+
};
|
|
16
|
+
as: null;
|
|
17
|
+
};
|
|
18
|
+
export declare const isColumnDateish: (col: any) => any;
|
|
19
|
+
export declare function areObjectsEqualish(left: any, right: any): boolean;
|
|
20
|
+
export declare function formatDateComparisonNode(node: any): string | null;
|
|
21
|
+
export declare function getInTheCurrentIntervalSentence(node: any, databaseType: string): string | null;
|
|
22
|
+
export declare function getInTheLastIntervalSentence(node: any, databaseType: string): string | null;
|
|
23
|
+
export declare function getInThePreviousIntervalSentence(node: any, databaseType: string): string | null;
|
|
24
|
+
export declare const isInTheLastInterval: (node: any, databaseType: string) => boolean;
|
|
25
|
+
export declare const isInTheLastIntervalBigQuery: (node: any) => boolean;
|
|
26
|
+
export declare const isTheCurrentInterval: (node: any, databaseType: string) => boolean;
|
|
27
|
+
export declare const isThePreviousInterval: (node: any, databaseType: string) => any;
|
|
28
|
+
export declare const isTheCurrentIntervalBigQuery: (node: any) => boolean;
|
|
29
|
+
/**
|
|
30
|
+
* Returns whether this node is the root of a binary expression
|
|
31
|
+
* where the left child is a string but really should be
|
|
32
|
+
* interpreted as a column name.
|
|
33
|
+
*/
|
|
34
|
+
export declare const isColumnComparison: (node: any) => any;
|
|
35
|
+
export declare const newUTCDate: (dateString: string) => Date;
|
|
36
|
+
/**
|
|
37
|
+
* Takes the right side of a dateTruncEquals expression (ie. the suffix)
|
|
38
|
+
* and returns a pretty string representation of what that value means.
|
|
39
|
+
*
|
|
40
|
+
* eg. date_trunc('year', TIMESTAMP '2023-01-01') would be "in 2023"
|
|
41
|
+
* eg. date_trunc('month', TIMESTAMP '2023-01-01') would be "in Jan 2023"
|
|
42
|
+
* eg. date_trunc('quarter', TIMESTAMP '2023-01-01') would be "in Q1 2023"
|
|
43
|
+
*/
|
|
44
|
+
export declare function dateTruncSuffixToString(node: any, databaseType?: string): string;
|
|
45
|
+
/**
|
|
46
|
+
* Takes an extract binary expression and returns a string version
|
|
47
|
+
* of what the AST means.
|
|
48
|
+
*
|
|
49
|
+
* eg. extract(YEAR FROM "created_at") = 2023 would be "in 2023"
|
|
50
|
+
* eg. extract(MONTH FROM "created_at") = 1 would be "in January"
|
|
51
|
+
* eg. TODO: add more variants as they come up
|
|
52
|
+
*/
|
|
53
|
+
export declare function extractSuffixToString(node: any): string;
|
|
54
|
+
export declare function tryConvertDateEquality(node: any, databaseType?: string): string | undefined;
|
|
55
|
+
/**
|
|
56
|
+
* Returns whether this node is an equality of a date column with a
|
|
57
|
+
* date trunc.
|
|
58
|
+
*/
|
|
59
|
+
export declare const isDateTruncEquals: (node: any) => boolean;
|
|
60
|
+
/**
|
|
61
|
+
* Returns whether this node is an equality of a date column with extract.
|
|
62
|
+
*/
|
|
63
|
+
export declare const isExtractEquals: (node: any) => boolean;
|
|
64
|
+
export declare function showNodeAsRow(node: any, ast: any): boolean;
|
|
65
|
+
export declare function getPostgresBasicType(column: any): 'string' | 'number' | 'date' | undefined;
|
|
66
|
+
export declare const deepCopy: (obj: any) => any;
|
|
67
|
+
export declare const trimEndS: (s: string) => string;
|
|
68
|
+
export declare const getDateFilterInfo: (node: any) => {
|
|
69
|
+
dateColumn: any;
|
|
70
|
+
dateColumnPath: string;
|
|
71
|
+
dateFilterType: string;
|
|
72
|
+
intervalCount: number | null | undefined;
|
|
73
|
+
intervalType: any;
|
|
74
|
+
intervalPaths: any;
|
|
75
|
+
};
|
|
76
|
+
//# sourceMappingURL=util.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"util.d.ts","sourceRoot":"","sources":["../../../../src/components/ReportBuilder/util.ts"],"names":[],"mappings":"AAMA;;GAEG;AACH,eAAO,MAAM,qBAAqB,SAAU,GAAG,YAW9C,CAAC;AAEF,wBAAgB,iBAAiB,CAAC,IAAI,EAAE,GAAG,WAa1C;AAED,wBAAgB,oBAAoB,CAAC,GAAG,EAAE,GAAG,WAK5C;AAGD,eAAO,MAAM,WAAW,SAAU,GAAG,YAuBpC,CAAC;AAKF,eAAO,MAAM,oBAAoB,SAAU,GAAG,QAE7C,CAAC;AAEF,wBAAgB,kBAAkB,CAAC,IAAI,EAAE,GAAG;;;;;;;;EAU3C;AAKD,eAAO,MAAM,eAAe,QAAS,GAAG,QAMvC,CAAC;AAEF,wBAAgB,kBAAkB,CAAC,IAAI,EAAE,GAAG,EAAE,KAAK,EAAE,GAAG,WAiBvD;AAED,wBAAgB,wBAAwB,CAAC,IAAI,EAAE,GAAG,iBAQjD;AAED,wBAAgB,+BAA+B,CAC7C,IAAI,EAAE,GAAG,EACT,YAAY,EAAE,MAAM,GACnB,MAAM,GAAG,IAAI,CAOf;AAQD,wBAAgB,4BAA4B,CAC1C,IAAI,EAAE,GAAG,EACT,YAAY,EAAE,MAAM,GACnB,MAAM,GAAG,IAAI,CAWf;AAED,wBAAgB,gCAAgC,CAC9C,IAAI,EAAE,GAAG,EACT,YAAY,EAAE,MAAM,GACnB,MAAM,GAAG,IAAI,CAOf;AAMD,eAAO,MAAM,mBAAmB,SAAU,GAAG,gBAAgB,MAAM,YA4BlE,CAAC;AAIF,eAAO,MAAM,2BAA2B,SAAU,GAAG,YAUpD,CAAC;AAIF,eAAO,MAAM,oBAAoB,SACzB,GAAG,gBACK,MAAM,KACnB,OAmBF,CAAC;AAEF,eAAO,MAAM,qBAAqB,SAAU,GAAG,gBAAgB,MAAM,QAYpE,CAAC;AAEF,eAAO,MAAM,4BAA4B,SAAU,GAAG,KAAG,OAUxD,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,kBAAkB,SAAU,GAAG,QA4B3C,CAAC;AAGF,eAAO,MAAM,UAAU,eAAgB,MAAM,SAe5C,CAAC;AAmBF;;;;;;;GAOG;AACH,wBAAgB,uBAAuB,CAAC,IAAI,EAAE,GAAG,EAAE,YAAY,CAAC,EAAE,MAAM,UAsBvE;AAED;;;;;;;GAOG;AACH,wBAAgB,qBAAqB,CAAC,IAAI,EAAE,GAAG,UAgB9C;AAED,wBAAgB,sBAAsB,CAAC,IAAI,EAAE,GAAG,EAAE,YAAY,CAAC,EAAE,MAAM,sBAetE;AAED;;;GAGG;AACH,eAAO,MAAM,iBAAiB,SAAU,GAAG,YAU1C,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,eAAe,SAAU,GAAG,YAOxC,CAAC;AAEF,wBAAgB,aAAa,CAAC,IAAI,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,WAehD;AAED,wBAAgB,oBAAoB,CAClC,MAAM,EAAE,GAAG,GACV,QAAQ,GAAG,QAAQ,GAAG,MAAM,GAAG,SAAS,CAyB1C;AAED,eAAO,MAAM,QAAQ,QAAS,GAAG,QAAoC,CAAC;AAEtE,eAAO,MAAM,QAAQ,MAAO,MAAM,WAA2C,CAAC;AA4L9E,eAAO,MAAM,iBAAiB,SAAU,GAAG;;;;;;;CAc1C,CAAC"}
|