@grafana/scenes 5.11.0 → 5.11.1--canary.830.10618954979.0
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/esm/variables/adhoc/AdHocFiltersCombobox/AdHocFilterPill.js +126 -0
- package/dist/esm/variables/adhoc/AdHocFiltersCombobox/AdHocFilterPill.js.map +1 -0
- package/dist/esm/variables/adhoc/AdHocFiltersCombobox/AdHocFiltersAlwaysWipCombobox.js +20 -0
- package/dist/esm/variables/adhoc/AdHocFiltersCombobox/AdHocFiltersAlwaysWipCombobox.js.map +1 -0
- package/dist/esm/variables/adhoc/AdHocFiltersCombobox/AdHocFiltersCombobox.js +371 -0
- package/dist/esm/variables/adhoc/AdHocFiltersCombobox/AdHocFiltersCombobox.js.map +1 -0
- package/dist/esm/variables/adhoc/AdHocFiltersCombobox/AdHocFiltersComboboxRenderer.js +64 -0
- package/dist/esm/variables/adhoc/AdHocFiltersCombobox/AdHocFiltersComboboxRenderer.js.map +1 -0
- package/dist/esm/variables/adhoc/AdHocFiltersCombobox/DropdownItem.js +102 -0
- package/dist/esm/variables/adhoc/AdHocFiltersCombobox/DropdownItem.js.map +1 -0
- package/dist/esm/variables/adhoc/AdHocFiltersCombobox/useFloatingInteractions.js +59 -0
- package/dist/esm/variables/adhoc/AdHocFiltersCombobox/useFloatingInteractions.js.map +1 -0
- package/dist/esm/variables/adhoc/AdHocFiltersCombobox/utils.js +111 -0
- package/dist/esm/variables/adhoc/AdHocFiltersCombobox/utils.js.map +1 -0
- package/dist/esm/variables/adhoc/AdHocFiltersVariable.js +44 -27
- package/dist/esm/variables/adhoc/AdHocFiltersVariable.js.map +1 -1
- package/dist/index.d.ts +3 -1
- package/dist/index.js +1063 -238
- package/dist/index.js.map +1 -1
- package/package.json +4 -2
@@ -0,0 +1,126 @@
|
|
1
|
+
import { cx, css } from '@emotion/css';
|
2
|
+
import { useStyles2, IconButton } from '@grafana/ui';
|
3
|
+
import React, { useState, useRef, useCallback } from 'react';
|
4
|
+
import { flushSync } from 'react-dom';
|
5
|
+
import { AdHocCombobox } from './AdHocFiltersCombobox.js';
|
6
|
+
|
7
|
+
var __defProp = Object.defineProperty;
|
8
|
+
var __defProps = Object.defineProperties;
|
9
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
10
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
11
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
12
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
13
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
14
|
+
var __spreadValues = (a, b) => {
|
15
|
+
for (var prop in b || (b = {}))
|
16
|
+
if (__hasOwnProp.call(b, prop))
|
17
|
+
__defNormalProp(a, prop, b[prop]);
|
18
|
+
if (__getOwnPropSymbols)
|
19
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
20
|
+
if (__propIsEnum.call(b, prop))
|
21
|
+
__defNormalProp(a, prop, b[prop]);
|
22
|
+
}
|
23
|
+
return a;
|
24
|
+
};
|
25
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
26
|
+
function AdHocFilterPill({ filter, model, readOnly }) {
|
27
|
+
var _a, _b, _c;
|
28
|
+
const styles = useStyles2(getStyles);
|
29
|
+
const [viewMode, setViewMode] = useState(true);
|
30
|
+
const pillWrapperRef = useRef(null);
|
31
|
+
const keyLabel = (_a = filter.keyLabel) != null ? _a : filter.key;
|
32
|
+
const valueLabel = (_c = (_b = filter.valueLabels) == null ? void 0 : _b[0]) != null ? _c : filter.value;
|
33
|
+
const handleChangeViewMode = useCallback(
|
34
|
+
(event) => {
|
35
|
+
var _a2;
|
36
|
+
event == null ? void 0 : event.stopPropagation();
|
37
|
+
if (readOnly) {
|
38
|
+
return;
|
39
|
+
}
|
40
|
+
let viewMode2 = false;
|
41
|
+
flushSync(() => {
|
42
|
+
setViewMode((mode) => {
|
43
|
+
viewMode2 = mode;
|
44
|
+
return !mode;
|
45
|
+
});
|
46
|
+
});
|
47
|
+
if (!viewMode2) {
|
48
|
+
(_a2 = pillWrapperRef.current) == null ? void 0 : _a2.focus();
|
49
|
+
}
|
50
|
+
},
|
51
|
+
[readOnly]
|
52
|
+
);
|
53
|
+
if (viewMode) {
|
54
|
+
return /* @__PURE__ */ React.createElement("div", {
|
55
|
+
className: cx(styles.combinedFilterPill, { [styles.readOnlyCombinedFilter]: readOnly }),
|
56
|
+
onClick: handleChangeViewMode,
|
57
|
+
onKeyDown: (e) => {
|
58
|
+
if (e.key === "Enter") {
|
59
|
+
handleChangeViewMode();
|
60
|
+
}
|
61
|
+
},
|
62
|
+
role: "button",
|
63
|
+
"aria-label": `Edit filter with key ${keyLabel}`,
|
64
|
+
tabIndex: 0,
|
65
|
+
ref: pillWrapperRef
|
66
|
+
}, /* @__PURE__ */ React.createElement("span", null, keyLabel, " ", filter.operator, " ", valueLabel), !readOnly ? /* @__PURE__ */ React.createElement(IconButton, {
|
67
|
+
onClick: (e) => {
|
68
|
+
e.stopPropagation();
|
69
|
+
model._removeFilter(filter);
|
70
|
+
},
|
71
|
+
onKeyDownCapture: (e) => {
|
72
|
+
if (e.key === "Enter") {
|
73
|
+
e.preventDefault();
|
74
|
+
e.stopPropagation();
|
75
|
+
model._removeFilter(filter);
|
76
|
+
}
|
77
|
+
},
|
78
|
+
name: "times",
|
79
|
+
size: "md",
|
80
|
+
className: styles.removeButton,
|
81
|
+
tooltip: `Remove filter with key ${keyLabel}`
|
82
|
+
}) : null);
|
83
|
+
}
|
84
|
+
return /* @__PURE__ */ React.createElement(AdHocCombobox, {
|
85
|
+
filter,
|
86
|
+
model,
|
87
|
+
handleChangeViewMode
|
88
|
+
});
|
89
|
+
}
|
90
|
+
const getStyles = (theme) => ({
|
91
|
+
combinedFilterPill: css(__spreadProps(__spreadValues({
|
92
|
+
display: "flex",
|
93
|
+
alignItems: "center",
|
94
|
+
background: theme.colors.action.selected,
|
95
|
+
borderRadius: theme.shape.radius.default,
|
96
|
+
border: `1px solid ${theme.colors.border.weak}`,
|
97
|
+
padding: theme.spacing(0.125, 0, 0.125, 1),
|
98
|
+
color: theme.colors.text.primary,
|
99
|
+
overflow: "hidden",
|
100
|
+
whiteSpace: "nowrap",
|
101
|
+
minHeight: theme.spacing(2.75)
|
102
|
+
}, theme.typography.bodySmall), {
|
103
|
+
fontWeight: theme.typography.fontWeightBold,
|
104
|
+
cursor: "pointer",
|
105
|
+
"&:hover": {
|
106
|
+
background: theme.colors.action.hover
|
107
|
+
}
|
108
|
+
})),
|
109
|
+
readOnlyCombinedFilter: css({
|
110
|
+
paddingRight: theme.spacing(1),
|
111
|
+
cursor: "text",
|
112
|
+
"&:hover": {
|
113
|
+
background: theme.colors.action.selected
|
114
|
+
}
|
115
|
+
}),
|
116
|
+
removeButton: css({
|
117
|
+
marginInline: theme.spacing(0.5),
|
118
|
+
cursor: "pointer",
|
119
|
+
"&:hover": {
|
120
|
+
color: theme.colors.text.primary
|
121
|
+
}
|
122
|
+
})
|
123
|
+
});
|
124
|
+
|
125
|
+
export { AdHocFilterPill };
|
126
|
+
//# sourceMappingURL=AdHocFilterPill.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"AdHocFilterPill.js","sources":["../../../../../src/variables/adhoc/AdHocFiltersCombobox/AdHocFilterPill.tsx"],"sourcesContent":["import { css, cx } from '@emotion/css';\nimport { GrafanaTheme2 } from '@grafana/data';\nimport { useStyles2, IconButton } from '@grafana/ui';\nimport React, { useState, useRef, useCallback } from 'react';\nimport { flushSync } from 'react-dom';\nimport { AdHocCombobox } from './AdHocFiltersCombobox';\nimport { AdHocFilterWithLabels, AdHocFiltersVariable } from '../AdHocFiltersVariable';\n\ninterface Props {\n filter: AdHocFilterWithLabels;\n model: AdHocFiltersVariable;\n readOnly?: boolean;\n}\n\nexport function AdHocFilterPill({ filter, model, readOnly }: Props) {\n const styles = useStyles2(getStyles);\n const [viewMode, setViewMode] = useState(true);\n const pillWrapperRef = useRef<HTMLDivElement>(null);\n\n const keyLabel = filter.keyLabel ?? filter.key;\n const valueLabel = filter.valueLabels?.[0] ?? filter.value;\n\n const handleChangeViewMode = useCallback(\n (event?: React.MouseEvent) => {\n event?.stopPropagation();\n if (readOnly) {\n return;\n }\n let viewMode = false;\n flushSync(() => {\n setViewMode((mode) => {\n viewMode = mode;\n return !mode;\n });\n });\n if (!viewMode) {\n pillWrapperRef.current?.focus();\n }\n },\n [readOnly]\n );\n\n if (viewMode) {\n return (\n <div\n className={cx(styles.combinedFilterPill, { [styles.readOnlyCombinedFilter]: readOnly })}\n onClick={handleChangeViewMode}\n onKeyDown={(e) => {\n if (e.key === 'Enter') {\n handleChangeViewMode();\n }\n }}\n role=\"button\"\n aria-label={`Edit filter with key ${keyLabel}`}\n tabIndex={0}\n ref={pillWrapperRef}\n >\n <span>\n {keyLabel} {filter.operator} {valueLabel}\n </span>\n {!readOnly ? (\n <IconButton\n onClick={(e) => {\n e.stopPropagation();\n model._removeFilter(filter);\n }}\n onKeyDownCapture={(e) => {\n if (e.key === 'Enter') {\n e.preventDefault();\n e.stopPropagation();\n model._removeFilter(filter);\n }\n }}\n name=\"times\"\n size=\"md\"\n className={styles.removeButton}\n tooltip={`Remove filter with key ${keyLabel}`}\n />\n ) : null}\n </div>\n );\n }\n\n return <AdHocCombobox filter={filter} model={model} handleChangeViewMode={handleChangeViewMode} />;\n}\n\nconst getStyles = (theme: GrafanaTheme2) => ({\n combinedFilterPill: css({\n display: 'flex',\n alignItems: 'center',\n background: theme.colors.action.selected,\n borderRadius: theme.shape.radius.default,\n border: `1px solid ${theme.colors.border.weak}`,\n padding: theme.spacing(0.125, 0, 0.125, 1),\n color: theme.colors.text.primary,\n overflow: 'hidden',\n whiteSpace: 'nowrap',\n minHeight: theme.spacing(2.75),\n ...theme.typography.bodySmall,\n fontWeight: theme.typography.fontWeightBold,\n cursor: 'pointer',\n\n '&:hover': {\n background: theme.colors.action.hover,\n },\n }),\n readOnlyCombinedFilter: css({\n paddingRight: theme.spacing(1),\n cursor: 'text',\n '&:hover': {\n background: theme.colors.action.selected,\n },\n }),\n removeButton: css({\n marginInline: theme.spacing(0.5),\n cursor: 'pointer',\n '&:hover': {\n color: theme.colors.text.primary,\n },\n }),\n});\n"],"names":["_a","viewMode"],"mappings":"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"}
|
@@ -0,0 +1,20 @@
|
|
1
|
+
import React, { forwardRef, useLayoutEffect } from 'react';
|
2
|
+
import { AdHocCombobox } from './AdHocFiltersCombobox.js';
|
3
|
+
|
4
|
+
const AdHocFiltersAlwaysWipCombobox = forwardRef(function AdHocFiltersAlwaysWipCombobox2({ model }, parentRef) {
|
5
|
+
const { _wip } = model.useState();
|
6
|
+
useLayoutEffect(() => {
|
7
|
+
if (!_wip) {
|
8
|
+
model._addWip();
|
9
|
+
}
|
10
|
+
}, [_wip]);
|
11
|
+
return /* @__PURE__ */ React.createElement(AdHocCombobox, {
|
12
|
+
model,
|
13
|
+
filter: _wip,
|
14
|
+
isAlwaysWip: true,
|
15
|
+
ref: parentRef
|
16
|
+
});
|
17
|
+
});
|
18
|
+
|
19
|
+
export { AdHocFiltersAlwaysWipCombobox };
|
20
|
+
//# sourceMappingURL=AdHocFiltersAlwaysWipCombobox.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"AdHocFiltersAlwaysWipCombobox.js","sources":["../../../../../src/variables/adhoc/AdHocFiltersCombobox/AdHocFiltersAlwaysWipCombobox.tsx"],"sourcesContent":["import React, { forwardRef, useLayoutEffect } from 'react';\nimport { AdHocFiltersVariable } from '../AdHocFiltersVariable';\nimport { AdHocCombobox } from './AdHocFiltersCombobox';\n\ninterface Props {\n model: AdHocFiltersVariable;\n}\n\nexport const AdHocFiltersAlwaysWipCombobox = forwardRef(function AdHocFiltersAlwaysWipCombobox(\n { model }: Props,\n // pass ability to focus on input element back to parent\n // parentRef is coming from AdHocFiltersComboboxRenderer\n // parentRef is mutated through useImperativeHandle in AdHocCombobox\n parentRef\n) {\n const { _wip } = model.useState();\n\n // when combobox is in wip mode then check and add _wip if its missing\n // needed on first render and when _wip is reset on filter value commit\n useLayoutEffect(() => {\n if (!_wip) {\n model._addWip();\n }\n\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [_wip]);\n\n return <AdHocCombobox model={model} filter={_wip} isAlwaysWip ref={parentRef} />;\n});\n"],"names":["AdHocFiltersAlwaysWipCombobox"],"mappings":";;;AAQO,MAAM,gCAAgC,UAAW,CAAA,SAASA,+BAC/D,EAAE,KAAA,IAIF,SACA,EAAA;AACA,EAAA,MAAM,EAAE,IAAA,EAAS,GAAA,KAAA,CAAM,QAAS,EAAA,CAAA;AAIhC,EAAA,eAAA,CAAgB,MAAM;AACpB,IAAA,IAAI,CAAC,IAAM,EAAA;AACT,MAAA,KAAA,CAAM,OAAQ,EAAA,CAAA;AAAA,KAChB;AAAA,GAGF,EAAG,CAAC,IAAI,CAAC,CAAA,CAAA;AAET,EAAA,uBAAQ,KAAA,CAAA,aAAA,CAAA,aAAA,EAAA;AAAA,IAAc,KAAA;AAAA,IAAc,MAAQ,EAAA,IAAA;AAAA,IAAM,WAAW,EAAA,IAAA;AAAA,IAAC,GAAK,EAAA,SAAA;AAAA,GAAW,CAAA,CAAA;AAChF,CAAC;;;;"}
|
@@ -0,0 +1,371 @@
|
|
1
|
+
import React, { forwardRef, useState, useId, useRef, useMemo, useCallback, useImperativeHandle, useEffect, useLayoutEffect } from 'react';
|
2
|
+
import { FloatingPortal, FloatingFocusManager } from '@floating-ui/react';
|
3
|
+
import { useStyles2, Spinner, Text } from '@grafana/ui';
|
4
|
+
import { cx, css } from '@emotion/css';
|
5
|
+
import { useVirtualizer } from '@tanstack/react-virtual';
|
6
|
+
import { LoadingOptionsPlaceholder, OptionsErrorPlaceholder, NoOptionsPlaceholder, DropdownItem } from './DropdownItem.js';
|
7
|
+
import { fuzzySearchOptions, flattenOptionGroups, setupDropdownAccessibility, VIRTUAL_LIST_ITEM_HEIGHT, VIRTUAL_LIST_OVERSCAN, generateFilterUpdatePayload, switchToNextInputType, switchInputType, ERROR_STATE_DROPDOWN_WIDTH } from './utils.js';
|
8
|
+
import { handleOptionGroups } from '../../utils.js';
|
9
|
+
import { useFloatingInteractions } from './useFloatingInteractions.js';
|
10
|
+
|
11
|
+
var __defProp = Object.defineProperty;
|
12
|
+
var __defProps = Object.defineProperties;
|
13
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
14
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
15
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
16
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
17
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
18
|
+
var __spreadValues = (a, b) => {
|
19
|
+
for (var prop in b || (b = {}))
|
20
|
+
if (__hasOwnProp.call(b, prop))
|
21
|
+
__defNormalProp(a, prop, b[prop]);
|
22
|
+
if (__getOwnPropSymbols)
|
23
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
24
|
+
if (__propIsEnum.call(b, prop))
|
25
|
+
__defNormalProp(a, prop, b[prop]);
|
26
|
+
}
|
27
|
+
return a;
|
28
|
+
};
|
29
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
30
|
+
const AdHocCombobox = forwardRef(function AdHocCombobox2({ filter, model, isAlwaysWip, handleChangeViewMode }, parentRef) {
|
31
|
+
var _a, _b, _c;
|
32
|
+
const [open, setOpen] = useState(false);
|
33
|
+
const [options, setOptions] = useState([]);
|
34
|
+
const [optionsLoading, setOptionsLoading] = useState(false);
|
35
|
+
const [optionsError, setOptionsError] = useState(false);
|
36
|
+
const [inputValue, setInputValue] = useState("");
|
37
|
+
const [activeIndex, setActiveIndex] = useState(null);
|
38
|
+
const [filterInputType, setInputType] = useState(!isAlwaysWip ? "value" : "key");
|
39
|
+
const styles = useStyles2(getStyles);
|
40
|
+
const operatorIdentifier = useId();
|
41
|
+
const listRef = useRef([]);
|
42
|
+
const disabledIndicesRef = useRef([]);
|
43
|
+
const optionsSearcher = useMemo(() => fuzzySearchOptions(options), [options]);
|
44
|
+
const handleResetWip = useCallback(() => {
|
45
|
+
if (isAlwaysWip) {
|
46
|
+
model._addWip();
|
47
|
+
setInputType("key");
|
48
|
+
setInputValue("");
|
49
|
+
}
|
50
|
+
}, [model, isAlwaysWip]);
|
51
|
+
const onOpenChange = useCallback(
|
52
|
+
(nextOpen, _, reason) => {
|
53
|
+
setOpen(nextOpen);
|
54
|
+
if (reason && ["outside-press", "escape-key"].includes(reason)) {
|
55
|
+
handleResetWip();
|
56
|
+
handleChangeViewMode == null ? void 0 : handleChangeViewMode();
|
57
|
+
}
|
58
|
+
},
|
59
|
+
[handleChangeViewMode, handleResetWip]
|
60
|
+
);
|
61
|
+
const { refs, floatingStyles, context, getReferenceProps, getFloatingProps, getItemProps } = useFloatingInteractions({
|
62
|
+
open,
|
63
|
+
onOpenChange,
|
64
|
+
activeIndex,
|
65
|
+
setActiveIndex,
|
66
|
+
operatorIdentifier,
|
67
|
+
listRef,
|
68
|
+
disabledIndicesRef
|
69
|
+
});
|
70
|
+
useImperativeHandle(parentRef, () => () => {
|
71
|
+
var _a2;
|
72
|
+
return (_a2 = refs.domReference.current) == null ? void 0 : _a2.focus();
|
73
|
+
}, [refs.domReference]);
|
74
|
+
function onChange(event) {
|
75
|
+
const value = event.target.value;
|
76
|
+
setInputValue(value);
|
77
|
+
setActiveIndex(0);
|
78
|
+
}
|
79
|
+
const filteredDropDownItems = flattenOptionGroups(handleOptionGroups(optionsSearcher(inputValue, filterInputType)));
|
80
|
+
if (filterInputType !== "operator" && inputValue) {
|
81
|
+
filteredDropDownItems.push({
|
82
|
+
value: inputValue.trim(),
|
83
|
+
label: inputValue.trim(),
|
84
|
+
isCustom: true
|
85
|
+
});
|
86
|
+
}
|
87
|
+
const maxOptionWidth = setupDropdownAccessibility(filteredDropDownItems, listRef, disabledIndicesRef);
|
88
|
+
const handleFetchOptions = useCallback(
|
89
|
+
async (inputType) => {
|
90
|
+
var _a2;
|
91
|
+
setOptionsError(false);
|
92
|
+
setOptionsLoading(true);
|
93
|
+
setOptions([]);
|
94
|
+
let options2 = [];
|
95
|
+
try {
|
96
|
+
if (inputType === "key") {
|
97
|
+
options2 = await model._getKeys(null);
|
98
|
+
} else if (inputType === "operator") {
|
99
|
+
options2 = model._getOperators();
|
100
|
+
} else if (inputType === "value") {
|
101
|
+
options2 = await model._getValuesFor(filter);
|
102
|
+
}
|
103
|
+
setOptions(options2);
|
104
|
+
if ((_a2 = options2[0]) == null ? void 0 : _a2.group) {
|
105
|
+
setActiveIndex(1);
|
106
|
+
}
|
107
|
+
} catch (e) {
|
108
|
+
setOptionsError(true);
|
109
|
+
}
|
110
|
+
setOptionsLoading(false);
|
111
|
+
},
|
112
|
+
[filter, model]
|
113
|
+
);
|
114
|
+
const rowVirtualizer = useVirtualizer({
|
115
|
+
count: filteredDropDownItems.length,
|
116
|
+
getScrollElement: () => refs.floating.current,
|
117
|
+
estimateSize: () => VIRTUAL_LIST_ITEM_HEIGHT,
|
118
|
+
overscan: VIRTUAL_LIST_OVERSCAN
|
119
|
+
});
|
120
|
+
const handleBackspaceInput = useCallback(
|
121
|
+
(event) => {
|
122
|
+
if (event.key === "Backspace" && !inputValue && filterInputType === "key") {
|
123
|
+
model._removeLastFilter();
|
124
|
+
handleFetchOptions(filterInputType);
|
125
|
+
}
|
126
|
+
},
|
127
|
+
[inputValue, filterInputType]
|
128
|
+
);
|
129
|
+
const handleTabInput = useCallback((event) => {
|
130
|
+
if (event.key === "Tab" && !event.shiftKey) {
|
131
|
+
handleChangeViewMode == null ? void 0 : handleChangeViewMode();
|
132
|
+
handleResetWip();
|
133
|
+
}
|
134
|
+
}, []);
|
135
|
+
const handleShiftTabInput = useCallback((event) => {
|
136
|
+
if (event.key === "Tab" && event.shiftKey) {
|
137
|
+
handleChangeViewMode == null ? void 0 : handleChangeViewMode();
|
138
|
+
handleResetWip();
|
139
|
+
}
|
140
|
+
}, []);
|
141
|
+
const handleEnterInput = useCallback(
|
142
|
+
(event) => {
|
143
|
+
if (event.key === "Enter" && activeIndex != null) {
|
144
|
+
if (!filteredDropDownItems[activeIndex]) {
|
145
|
+
return;
|
146
|
+
}
|
147
|
+
model._updateFilter(filter, generateFilterUpdatePayload(filterInputType, filteredDropDownItems[activeIndex]));
|
148
|
+
setInputValue("");
|
149
|
+
setActiveIndex(0);
|
150
|
+
switchToNextInputType(filterInputType, setInputType, handleChangeViewMode, refs.domReference.current);
|
151
|
+
}
|
152
|
+
},
|
153
|
+
[activeIndex, filter, filterInputType, filteredDropDownItems, model]
|
154
|
+
);
|
155
|
+
useEffect(() => {
|
156
|
+
if (open) {
|
157
|
+
handleFetchOptions(filterInputType);
|
158
|
+
}
|
159
|
+
}, [open, filterInputType]);
|
160
|
+
useEffect(() => {
|
161
|
+
var _a2;
|
162
|
+
if (!isAlwaysWip) {
|
163
|
+
setInputType("value");
|
164
|
+
setInputValue("");
|
165
|
+
(_a2 = refs.domReference.current) == null ? void 0 : _a2.focus();
|
166
|
+
}
|
167
|
+
}, []);
|
168
|
+
useLayoutEffect(() => {
|
169
|
+
var _a2, _b2;
|
170
|
+
if (activeIndex !== null && rowVirtualizer.range && (activeIndex > ((_a2 = rowVirtualizer.range) == null ? void 0 : _a2.endIndex) || activeIndex < ((_b2 = rowVirtualizer.range) == null ? void 0 : _b2.startIndex))) {
|
171
|
+
rowVirtualizer.scrollToIndex(activeIndex);
|
172
|
+
}
|
173
|
+
}, [activeIndex, rowVirtualizer]);
|
174
|
+
const keyLabel = (_a = filter == null ? void 0 : filter.keyLabel) != null ? _a : filter == null ? void 0 : filter.key;
|
175
|
+
const valueLabel = (_c = (_b = filter == null ? void 0 : filter.valueLabels) == null ? void 0 : _b[0]) != null ? _c : filter == null ? void 0 : filter.value;
|
176
|
+
return /* @__PURE__ */ React.createElement("div", {
|
177
|
+
className: styles.comboboxWrapper
|
178
|
+
}, filter ? /* @__PURE__ */ React.createElement("div", {
|
179
|
+
className: styles.pillWrapper
|
180
|
+
}, (filter == null ? void 0 : filter.key) ? /* @__PURE__ */ React.createElement("div", {
|
181
|
+
className: cx(styles.basePill, styles.keyPill)
|
182
|
+
}, keyLabel) : null, (filter == null ? void 0 : filter.key) && (filter == null ? void 0 : filter.operator) && filterInputType !== "operator" ? /* @__PURE__ */ React.createElement("div", {
|
183
|
+
id: operatorIdentifier,
|
184
|
+
className: cx(styles.basePill, styles.operatorPill, operatorIdentifier),
|
185
|
+
role: "button",
|
186
|
+
"aria-label": "Edit filter operator",
|
187
|
+
tabIndex: 0,
|
188
|
+
onClick: (event) => {
|
189
|
+
event.stopPropagation();
|
190
|
+
switchInputType("operator", setInputType, void 0, refs.domReference.current);
|
191
|
+
},
|
192
|
+
onKeyDown: (event) => {
|
193
|
+
handleShiftTabInput(event);
|
194
|
+
if (event.key === "Enter") {
|
195
|
+
switchInputType("operator", setInputType, void 0, refs.domReference.current);
|
196
|
+
}
|
197
|
+
}
|
198
|
+
}, filter.operator) : null, (filter == null ? void 0 : filter.key) && (filter == null ? void 0 : filter.operator) && (filter == null ? void 0 : filter.value) && !["operator", "value"].includes(filterInputType) ? /* @__PURE__ */ React.createElement("div", {
|
199
|
+
className: cx(styles.basePill, styles.valuePill)
|
200
|
+
}, valueLabel) : null) : null, /* @__PURE__ */ React.createElement("input", __spreadProps(__spreadValues({}, getReferenceProps({
|
201
|
+
ref: refs.setReference,
|
202
|
+
onChange,
|
203
|
+
value: inputValue,
|
204
|
+
placeholder: !isAlwaysWip ? filterInputType === "operator" ? `${filter[filterInputType]} ${valueLabel}` : filter[filterInputType] : "Filter by label values",
|
205
|
+
"aria-autocomplete": "list",
|
206
|
+
onKeyDown(event) {
|
207
|
+
if (!open) {
|
208
|
+
setOpen(true);
|
209
|
+
return;
|
210
|
+
}
|
211
|
+
if (filterInputType === "operator") {
|
212
|
+
handleShiftTabInput(event);
|
213
|
+
}
|
214
|
+
handleBackspaceInput(event);
|
215
|
+
handleTabInput(event);
|
216
|
+
handleEnterInput(event);
|
217
|
+
}
|
218
|
+
})), {
|
219
|
+
className: cx(styles.inputStyle, { [styles.loadingInputPadding]: !optionsLoading }),
|
220
|
+
onClick: (event) => {
|
221
|
+
event.stopPropagation();
|
222
|
+
setOpen(true);
|
223
|
+
},
|
224
|
+
onFocus: () => {
|
225
|
+
setActiveIndex(0);
|
226
|
+
setOpen(true);
|
227
|
+
}
|
228
|
+
})), optionsLoading ? /* @__PURE__ */ React.createElement(Spinner, {
|
229
|
+
className: styles.loadingIndicator,
|
230
|
+
inline: true
|
231
|
+
}) : null, /* @__PURE__ */ React.createElement(FloatingPortal, null, open && /* @__PURE__ */ React.createElement(FloatingFocusManager, {
|
232
|
+
context,
|
233
|
+
initialFocus: -1,
|
234
|
+
visuallyHiddenDismiss: true,
|
235
|
+
modal: false
|
236
|
+
}, /* @__PURE__ */ React.createElement("div", {
|
237
|
+
style: __spreadProps(__spreadValues({}, floatingStyles), {
|
238
|
+
width: `${optionsError ? ERROR_STATE_DROPDOWN_WIDTH : maxOptionWidth}px`
|
239
|
+
}),
|
240
|
+
ref: refs.setFloating,
|
241
|
+
className: styles.dropdownWrapper,
|
242
|
+
tabIndex: -1
|
243
|
+
}, /* @__PURE__ */ React.createElement("div", __spreadProps(__spreadValues({
|
244
|
+
style: {
|
245
|
+
height: `${rowVirtualizer.getTotalSize() || VIRTUAL_LIST_ITEM_HEIGHT}px`
|
246
|
+
}
|
247
|
+
}, getFloatingProps()), {
|
248
|
+
tabIndex: -1
|
249
|
+
}), optionsLoading ? /* @__PURE__ */ React.createElement(LoadingOptionsPlaceholder, null) : optionsError ? /* @__PURE__ */ React.createElement(OptionsErrorPlaceholder, {
|
250
|
+
handleFetchOptions: () => handleFetchOptions(filterInputType)
|
251
|
+
}) : !filteredDropDownItems.length && (filterInputType === "operator" || !inputValue) ? /* @__PURE__ */ React.createElement(NoOptionsPlaceholder, null) : rowVirtualizer.getVirtualItems().map((virtualItem) => {
|
252
|
+
var _a2;
|
253
|
+
const item = filteredDropDownItems[virtualItem.index];
|
254
|
+
const index = virtualItem.index;
|
255
|
+
if (item.options) {
|
256
|
+
return /* @__PURE__ */ React.createElement("div", {
|
257
|
+
key: `${item.label}+${index}`,
|
258
|
+
className: cx(styles.optionGroupLabel, styles.groupTopBorder),
|
259
|
+
style: {
|
260
|
+
height: `${virtualItem.size}px`,
|
261
|
+
transform: `translateY(${virtualItem.start}px)`
|
262
|
+
}
|
263
|
+
}, /* @__PURE__ */ React.createElement(Text, {
|
264
|
+
weight: "bold",
|
265
|
+
variant: "bodySmall",
|
266
|
+
color: "secondary"
|
267
|
+
}, item.label));
|
268
|
+
}
|
269
|
+
const nextItem = filteredDropDownItems[virtualItem.index + 1];
|
270
|
+
const shouldAddBottomBorder = nextItem && !nextItem.group && !nextItem.options && item.group;
|
271
|
+
return /* @__PURE__ */ React.createElement(DropdownItem, __spreadProps(__spreadValues({}, getItemProps({
|
272
|
+
key: `${item.value}-${index}`,
|
273
|
+
ref(node) {
|
274
|
+
listRef.current[index] = node;
|
275
|
+
},
|
276
|
+
onClick(event) {
|
277
|
+
if (filterInputType !== "value") {
|
278
|
+
event.stopPropagation();
|
279
|
+
}
|
280
|
+
model._updateFilter(filter, generateFilterUpdatePayload(filterInputType, item));
|
281
|
+
setInputValue("");
|
282
|
+
switchToNextInputType(
|
283
|
+
filterInputType,
|
284
|
+
setInputType,
|
285
|
+
handleChangeViewMode,
|
286
|
+
refs.domReference.current
|
287
|
+
);
|
288
|
+
}
|
289
|
+
})), {
|
290
|
+
active: activeIndex === index,
|
291
|
+
addGroupBottomBorder: shouldAddBottomBorder,
|
292
|
+
style: {
|
293
|
+
height: `${virtualItem.size}px`,
|
294
|
+
transform: `translateY(${virtualItem.start}px)`
|
295
|
+
},
|
296
|
+
"aria-setsize": filteredDropDownItems.length,
|
297
|
+
"aria-posinset": virtualItem.index + 1
|
298
|
+
}), item.isCustom ? "Use custom value: " : "", " ", (_a2 = item.label) != null ? _a2 : item.value);
|
299
|
+
}))))));
|
300
|
+
});
|
301
|
+
const getStyles = (theme) => ({
|
302
|
+
comboboxWrapper: css({
|
303
|
+
display: "flex",
|
304
|
+
flexWrap: "nowrap"
|
305
|
+
}),
|
306
|
+
pillWrapper: css({
|
307
|
+
display: "flex",
|
308
|
+
alignItems: "center",
|
309
|
+
whiteSpace: "nowrap"
|
310
|
+
}),
|
311
|
+
basePill: css(__spreadProps(__spreadValues({
|
312
|
+
display: "flex",
|
313
|
+
alignItems: "center",
|
314
|
+
background: theme.colors.action.disabledBackground,
|
315
|
+
border: `1px solid ${theme.colors.border.weak}`,
|
316
|
+
padding: theme.spacing(0.125, 1, 0.125, 1),
|
317
|
+
color: theme.colors.text.primary,
|
318
|
+
overflow: "hidden",
|
319
|
+
whiteSpace: "nowrap",
|
320
|
+
minHeight: theme.spacing(2.75)
|
321
|
+
}, theme.typography.bodySmall), {
|
322
|
+
cursor: "pointer"
|
323
|
+
})),
|
324
|
+
keyPill: css({
|
325
|
+
fontWeight: theme.typography.fontWeightBold,
|
326
|
+
cursor: "default"
|
327
|
+
}),
|
328
|
+
operatorPill: css({
|
329
|
+
"&:hover": {
|
330
|
+
background: theme.colors.action.hover
|
331
|
+
}
|
332
|
+
}),
|
333
|
+
valuePill: css({
|
334
|
+
background: theme.colors.action.selected
|
335
|
+
}),
|
336
|
+
dropdownWrapper: css({
|
337
|
+
backgroundColor: theme.colors.background.primary,
|
338
|
+
color: theme.colors.text.primary,
|
339
|
+
boxShadow: theme.shadows.z2,
|
340
|
+
overflowY: "auto",
|
341
|
+
zIndex: theme.zIndex.dropdown
|
342
|
+
}),
|
343
|
+
inputStyle: css({
|
344
|
+
paddingBlock: 0,
|
345
|
+
"&:focus": {
|
346
|
+
outline: "none"
|
347
|
+
}
|
348
|
+
}),
|
349
|
+
loadingIndicator: css({
|
350
|
+
color: theme.colors.text.secondary,
|
351
|
+
marginLeft: theme.spacing(0.5)
|
352
|
+
}),
|
353
|
+
loadingInputPadding: css({
|
354
|
+
paddingRight: theme.spacing(2.5)
|
355
|
+
}),
|
356
|
+
optionGroupLabel: css({
|
357
|
+
padding: theme.spacing(1),
|
358
|
+
position: "absolute",
|
359
|
+
top: 0,
|
360
|
+
left: 0,
|
361
|
+
width: "100%"
|
362
|
+
}),
|
363
|
+
groupTopBorder: css({
|
364
|
+
"&:not(:first-child)": {
|
365
|
+
borderTop: `1px solid ${theme.colors.border.weak}`
|
366
|
+
}
|
367
|
+
})
|
368
|
+
});
|
369
|
+
|
370
|
+
export { AdHocCombobox };
|
371
|
+
//# sourceMappingURL=AdHocFiltersCombobox.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"AdHocFiltersCombobox.js","sources":["../../../../../src/variables/adhoc/AdHocFiltersCombobox/AdHocFiltersCombobox.tsx"],"sourcesContent":["import React, {\n forwardRef,\n useCallback,\n useEffect,\n useId,\n useImperativeHandle,\n useLayoutEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { FloatingFocusManager, FloatingPortal, UseFloatingOptions } from '@floating-ui/react';\nimport { Spinner, Text, useStyles2 } from '@grafana/ui';\nimport { GrafanaTheme2, SelectableValue } from '@grafana/data';\nimport { css, cx } from '@emotion/css';\nimport { AdHocFilterWithLabels, AdHocFiltersVariable } from '../AdHocFiltersVariable';\nimport { useVirtualizer } from '@tanstack/react-virtual';\nimport { DropdownItem, LoadingOptionsPlaceholder, NoOptionsPlaceholder, OptionsErrorPlaceholder } from './DropdownItem';\nimport {\n ERROR_STATE_DROPDOWN_WIDTH,\n flattenOptionGroups,\n fuzzySearchOptions,\n generateFilterUpdatePayload,\n setupDropdownAccessibility,\n switchInputType,\n switchToNextInputType,\n VIRTUAL_LIST_ITEM_HEIGHT,\n VIRTUAL_LIST_OVERSCAN,\n} from './utils';\nimport { handleOptionGroups } from '../../utils';\nimport { useFloatingInteractions } from './useFloatingInteractions';\n\ninterface AdHocComboboxProps {\n filter?: AdHocFilterWithLabels;\n isAlwaysWip?: boolean;\n model: AdHocFiltersVariable;\n handleChangeViewMode?: () => void;\n}\n\nexport type AdHocInputType = 'key' | 'operator' | 'value';\n\nexport const AdHocCombobox = forwardRef(function AdHocCombobox(\n { filter, model, isAlwaysWip, handleChangeViewMode }: AdHocComboboxProps,\n parentRef\n) {\n const [open, setOpen] = useState(false);\n const [options, setOptions] = useState<Array<SelectableValue<string>>>([]);\n const [optionsLoading, setOptionsLoading] = useState<boolean>(false);\n const [optionsError, setOptionsError] = useState<boolean>(false);\n const [inputValue, setInputValue] = useState('');\n const [activeIndex, setActiveIndex] = useState<number | null>(null);\n const [filterInputType, setInputType] = useState<AdHocInputType>(!isAlwaysWip ? 'value' : 'key');\n const styles = useStyles2(getStyles);\n\n // used to identify operator element and prevent dismiss because it registers as outside click\n const operatorIdentifier = useId();\n\n const listRef = useRef<Array<HTMLElement | null>>([]);\n const disabledIndicesRef = useRef<number[]>([]);\n\n const optionsSearcher = useMemo(() => fuzzySearchOptions(options), [options]);\n\n // reset wip filter. Used when navigating away with incomplete wip filer or when selecting wip filter value\n const handleResetWip = useCallback(() => {\n if (isAlwaysWip) {\n model._addWip();\n setInputType('key');\n setInputValue('');\n }\n }, [model, isAlwaysWip]);\n\n const onOpenChange = useCallback<NonNullable<UseFloatingOptions['onOpenChange']>>(\n (nextOpen, _, reason) => {\n setOpen(nextOpen);\n // change from filter edit mode to filter view mode when clicked\n // outside input or dropdown\n if (reason && ['outside-press', 'escape-key'].includes(reason)) {\n handleResetWip();\n handleChangeViewMode?.();\n }\n },\n [handleChangeViewMode, handleResetWip]\n );\n\n const { refs, floatingStyles, context, getReferenceProps, getFloatingProps, getItemProps } = useFloatingInteractions({\n open,\n onOpenChange,\n activeIndex,\n setActiveIndex,\n operatorIdentifier,\n listRef,\n disabledIndicesRef,\n });\n\n // pass ability to focus on input element back to parent\n // parentRef is coming from AdHocFiltersComboboxRenderer\n useImperativeHandle(parentRef, () => () => refs.domReference.current?.focus(), [refs.domReference]);\n\n function onChange(event: React.ChangeEvent<HTMLInputElement>) {\n // part of POC for seamless filter parser\n // filterAutoParser({ event, filterInputType, options, model, filter, setInputValue, setInputType, refs });\n\n const value = event.target.value;\n setInputValue(value);\n setActiveIndex(0);\n }\n\n // operation order on fetched options:\n // fuzzy search -> extract into groups -> flatten group labels and options\n const filteredDropDownItems = flattenOptionGroups(handleOptionGroups(optionsSearcher(inputValue, filterInputType)));\n\n // adding custom option this way so that virtualiser is aware of it and can scroll to\n if (filterInputType !== 'operator' && inputValue) {\n filteredDropDownItems.push({\n value: inputValue.trim(),\n label: inputValue.trim(),\n isCustom: true,\n });\n }\n\n // calculate width and populate listRef and disabledIndicesRef for arrow key navigation\n const maxOptionWidth = setupDropdownAccessibility(filteredDropDownItems, listRef, disabledIndicesRef);\n\n const handleFetchOptions = useCallback(\n async (inputType: AdHocInputType) => {\n setOptionsError(false);\n setOptionsLoading(true);\n setOptions([]);\n let options: Array<SelectableValue<string>> = [];\n try {\n if (inputType === 'key') {\n options = await model._getKeys(null);\n } else if (inputType === 'operator') {\n options = model._getOperators();\n } else if (inputType === 'value') {\n options = await model._getValuesFor(filter!);\n }\n\n setOptions(options);\n if (options[0]?.group) {\n setActiveIndex(1);\n }\n } catch (e) {\n setOptionsError(true);\n }\n setOptionsLoading(false);\n },\n [filter, model]\n );\n\n const rowVirtualizer = useVirtualizer({\n count: filteredDropDownItems.length,\n getScrollElement: () => refs.floating.current,\n estimateSize: () => VIRTUAL_LIST_ITEM_HEIGHT,\n overscan: VIRTUAL_LIST_OVERSCAN,\n });\n\n //\n // Keyboard interactions\n //\n\n const handleBackspaceInput = useCallback(\n (event: React.KeyboardEvent) => {\n if (event.key === 'Backspace' && !inputValue && filterInputType === 'key') {\n model._removeLastFilter();\n handleFetchOptions(filterInputType);\n }\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [inputValue, filterInputType]\n );\n\n const handleTabInput = useCallback((event: React.KeyboardEvent) => {\n // change filter to view mode when navigating away with Tab key\n // this is needed because useDismiss only reacts to mousedown\n if (event.key === 'Tab' && !event.shiftKey) {\n handleChangeViewMode?.();\n handleResetWip();\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n const handleShiftTabInput = useCallback((event: React.KeyboardEvent) => {\n if (event.key === 'Tab' && event.shiftKey) {\n handleChangeViewMode?.();\n handleResetWip();\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n const handleEnterInput = useCallback(\n (event: React.KeyboardEvent) => {\n if (event.key === 'Enter' && activeIndex != null) {\n // safeguard for non existing items\n if (!filteredDropDownItems[activeIndex]) {\n return;\n }\n\n model._updateFilter(filter!, generateFilterUpdatePayload(filterInputType, filteredDropDownItems[activeIndex]));\n setInputValue('');\n setActiveIndex(0);\n\n switchToNextInputType(filterInputType, setInputType, handleChangeViewMode, refs.domReference.current);\n }\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [activeIndex, filter, filterInputType, filteredDropDownItems, model]\n );\n\n //\n // Effects\n //\n\n useEffect(() => {\n // fetch options when dropdown is opened.\n if (open) {\n handleFetchOptions(filterInputType);\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [open, filterInputType]);\n\n // when not in wip mode this is the point of switching from view to edit mode\n // and in this case we default to 'value' input type and focus input\n useEffect(() => {\n if (!isAlwaysWip) {\n setInputType('value');\n setInputValue('');\n\n refs.domReference.current?.focus();\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n useLayoutEffect(() => {\n // this is needed to scroll virtual list to the position of currently selected\n // dropdown item when navigating with arrow up/down keys to end/start of list\n if (\n activeIndex !== null &&\n rowVirtualizer.range &&\n (activeIndex > rowVirtualizer.range?.endIndex || activeIndex < rowVirtualizer.range?.startIndex)\n ) {\n rowVirtualizer.scrollToIndex(activeIndex);\n }\n }, [activeIndex, rowVirtualizer]);\n\n const keyLabel = filter?.keyLabel ?? filter?.key;\n const valueLabel = filter?.valueLabels?.[0] ?? filter?.value;\n\n return (\n <div className={styles.comboboxWrapper}>\n {filter ? (\n <div className={styles.pillWrapper}>\n {/* Filter key pill render */}\n {filter?.key ? <div className={cx(styles.basePill, styles.keyPill)}>{keyLabel}</div> : null}\n {/* Filter operator pill render */}\n {filter?.key && filter?.operator && filterInputType !== 'operator' ? (\n <div\n id={operatorIdentifier}\n className={cx(styles.basePill, styles.operatorPill, operatorIdentifier)}\n role=\"button\"\n aria-label=\"Edit filter operator\"\n tabIndex={0}\n onClick={(event) => {\n event.stopPropagation();\n switchInputType('operator', setInputType, undefined, refs.domReference.current);\n }}\n onKeyDown={(event) => {\n handleShiftTabInput(event);\n if (event.key === 'Enter') {\n switchInputType('operator', setInputType, undefined, refs.domReference.current);\n }\n }}\n >\n {filter.operator}\n </div>\n ) : null}\n\n {/* Filter value pill render - currently is not possible to see, will be used with multi value */}\n {filter?.key && filter?.operator && filter?.value && !['operator', 'value'].includes(filterInputType) ? (\n <div className={cx(styles.basePill, styles.valuePill)}>{valueLabel}</div>\n ) : null}\n </div>\n ) : null}\n\n <input\n {...getReferenceProps({\n ref: refs.setReference,\n onChange,\n value: inputValue,\n // dynamic placeholder to display operator and/or value in filter edit mode\n placeholder: !isAlwaysWip\n ? filterInputType === 'operator'\n ? `${filter![filterInputType]} ${valueLabel}`\n : filter![filterInputType]\n : 'Filter by label values',\n 'aria-autocomplete': 'list',\n onKeyDown(event) {\n if (!open) {\n setOpen(true);\n return;\n }\n if (filterInputType === 'operator') {\n handleShiftTabInput(event);\n }\n handleBackspaceInput(event);\n handleTabInput(event);\n handleEnterInput(event);\n },\n })}\n className={cx(styles.inputStyle, { [styles.loadingInputPadding]: !optionsLoading })}\n onClick={(event) => {\n event.stopPropagation();\n setOpen(true);\n }}\n onFocus={() => {\n setActiveIndex(0);\n setOpen(true);\n }}\n />\n {optionsLoading ? <Spinner className={styles.loadingIndicator} inline={true} /> : null}\n <FloatingPortal>\n {open && (\n <FloatingFocusManager context={context} initialFocus={-1} visuallyHiddenDismiss modal={false}>\n <div\n style={{\n ...floatingStyles,\n width: `${optionsError ? ERROR_STATE_DROPDOWN_WIDTH : maxOptionWidth}px`,\n }}\n ref={refs.setFloating}\n className={styles.dropdownWrapper}\n tabIndex={-1}\n >\n <div\n style={{\n height: `${rowVirtualizer.getTotalSize() || VIRTUAL_LIST_ITEM_HEIGHT}px`, // fallback to 38px for loading/error/no options placeholders\n }}\n {...getFloatingProps()}\n tabIndex={-1}\n >\n {optionsLoading ? (\n <LoadingOptionsPlaceholder />\n ) : optionsError ? (\n <OptionsErrorPlaceholder handleFetchOptions={() => handleFetchOptions(filterInputType)} />\n ) : !filteredDropDownItems.length && (filterInputType === 'operator' || !inputValue) ? (\n <NoOptionsPlaceholder />\n ) : (\n rowVirtualizer.getVirtualItems().map((virtualItem) => {\n const item = filteredDropDownItems[virtualItem.index];\n const index = virtualItem.index;\n\n // render group label\n if (item.options) {\n return (\n <div\n key={`${item.label}+${index}`}\n className={cx(styles.optionGroupLabel, styles.groupTopBorder)}\n style={{\n height: `${virtualItem.size}px`,\n transform: `translateY(${virtualItem.start}px)`,\n }}\n >\n <Text weight=\"bold\" variant=\"bodySmall\" color=\"secondary\">\n {item.label!}\n </Text>\n </div>\n );\n }\n\n const nextItem: SelectableValue<string> | undefined = filteredDropDownItems[virtualItem.index + 1];\n const shouldAddBottomBorder = nextItem && !nextItem.group && !nextItem.options && item.group;\n\n return (\n // key is included in getItemProps()\n // eslint-disable-next-line react/jsx-key\n <DropdownItem\n {...getItemProps({\n key: `${item.value!}-${index}`,\n ref(node) {\n listRef.current[index] = node;\n },\n onClick(event) {\n if (filterInputType !== 'value') {\n event.stopPropagation();\n }\n model._updateFilter(filter!, generateFilterUpdatePayload(filterInputType, item));\n setInputValue('');\n\n switchToNextInputType(\n filterInputType,\n setInputType,\n handleChangeViewMode,\n refs.domReference.current\n );\n },\n })}\n active={activeIndex === index}\n addGroupBottomBorder={shouldAddBottomBorder}\n // virtual item positioning and accessibility\n style={{\n height: `${virtualItem.size}px`,\n transform: `translateY(${virtualItem.start}px)`,\n }}\n aria-setsize={filteredDropDownItems.length}\n aria-posinset={virtualItem.index + 1}\n >\n {item.isCustom ? 'Use custom value: ' : ''} {item.label ?? item.value}\n </DropdownItem>\n );\n })\n )}\n </div>\n </div>\n </FloatingFocusManager>\n )}\n </FloatingPortal>\n </div>\n );\n});\n\nconst getStyles = (theme: GrafanaTheme2) => ({\n comboboxWrapper: css({\n display: 'flex',\n flexWrap: 'nowrap',\n }),\n pillWrapper: css({\n display: 'flex',\n alignItems: 'center',\n whiteSpace: 'nowrap',\n }),\n basePill: css({\n display: 'flex',\n alignItems: 'center',\n background: theme.colors.action.disabledBackground,\n border: `1px solid ${theme.colors.border.weak}`,\n padding: theme.spacing(0.125, 1, 0.125, 1),\n color: theme.colors.text.primary,\n overflow: 'hidden',\n whiteSpace: 'nowrap',\n minHeight: theme.spacing(2.75),\n ...theme.typography.bodySmall,\n cursor: 'pointer',\n }),\n keyPill: css({\n fontWeight: theme.typography.fontWeightBold,\n cursor: 'default',\n }),\n operatorPill: css({\n '&:hover': {\n background: theme.colors.action.hover,\n },\n }),\n valuePill: css({\n background: theme.colors.action.selected,\n }),\n dropdownWrapper: css({\n backgroundColor: theme.colors.background.primary,\n color: theme.colors.text.primary,\n boxShadow: theme.shadows.z2,\n overflowY: 'auto',\n zIndex: theme.zIndex.dropdown,\n }),\n inputStyle: css({\n paddingBlock: 0,\n '&:focus': {\n outline: 'none',\n },\n }),\n loadingIndicator: css({\n color: theme.colors.text.secondary,\n marginLeft: theme.spacing(0.5),\n }),\n loadingInputPadding: css({\n paddingRight: theme.spacing(2.5),\n }),\n optionGroupLabel: css({\n padding: theme.spacing(1),\n position: 'absolute',\n top: 0,\n left: 0,\n width: '100%',\n }),\n groupTopBorder: css({\n '&:not(:first-child)': {\n borderTop: `1px solid ${theme.colors.border.weak}`,\n },\n }),\n});\n"],"names":["AdHocCombobox","_a","options","_b"],"mappings":"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"}
|