@grafana/scenes 4.11.2--canary.687.8737546972.0 → 4.11.2--canary.648.8738574184.0
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/esm/components/VizPanel/VizPanelMenu.js +3 -1
- package/dist/esm/components/VizPanel/VizPanelMenu.js.map +1 -1
- package/dist/esm/components/layout/grid/SceneGridRow.js +3 -1
- package/dist/esm/components/layout/grid/SceneGridRow.js.map +1 -1
- package/dist/esm/variables/components/VariableValueSelect.js +3 -0
- package/dist/esm/variables/components/VariableValueSelect.js.map +1 -1
- package/dist/esm/variables/components/VariableValueSelectors.js +5 -2
- package/dist/esm/variables/components/VariableValueSelectors.js.map +1 -1
- package/dist/esm/variables/groupby/GroupByVariable.js +3 -55
- package/dist/esm/variables/groupby/GroupByVariable.js.map +1 -1
- package/dist/esm/variables/sets/SceneVariableSet.js +0 -3
- package/dist/esm/variables/sets/SceneVariableSet.js.map +1 -1
- package/dist/esm/variables/types.js.map +1 -1
- package/dist/esm/variables/utils.js +2 -20
- package/dist/esm/variables/utils.js.map +1 -1
- package/dist/esm/variables/variants/TestVariable.js +1 -3
- package/dist/esm/variables/variants/TestVariable.js.map +1 -1
- package/dist/index.d.ts +1 -8
- package/dist/index.js +87 -154
- package/dist/index.js.map +1 -1
- package/package.json +2 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TestVariable.js","sources":["../../../../src/variables/variants/TestVariable.tsx"],"sourcesContent":["import { Observable, Subject } from 'rxjs';\n\nimport { sceneGraph } from '../../core/sceneGraph';\nimport { SceneComponentProps } from '../../core/types';\nimport { queryMetricTree } from '../../utils/metricTree';\nimport { VariableDependencyConfig } from '../VariableDependencyConfig';\nimport { renderSelectForVariable } from '../components/VariableValueSelect';\nimport { VariableValueOption } from '../types';\n\nimport { MultiValueVariable, MultiValueVariableState, VariableGetOptionsArgs } from './MultiValueVariable';\nimport { VariableRefresh } from '@grafana/data';\nimport { getClosest } from '../../core/sceneGraph/utils';\nimport { SceneVariableSet } from '../sets/SceneVariableSet';\nimport { SceneQueryControllerEntry } from '../../behaviors/SceneQueryController';\n\nexport interface TestVariableState extends MultiValueVariableState {\n query: string;\n delayMs?: number;\n issuedQuery?: string;\n refresh?: VariableRefresh;\n throwError?: string;\n optionsToReturn?: VariableValueOption[];\n}\n\n/**\n * This variable is only designed for unit tests and potentially e2e tests.\n */\nexport class TestVariable extends MultiValueVariable<TestVariableState> {\n private completeUpdate = new Subject<number>();\n public isGettingValues = true;\n public getValueOptionsCount = 0;\n
|
|
1
|
+
{"version":3,"file":"TestVariable.js","sources":["../../../../src/variables/variants/TestVariable.tsx"],"sourcesContent":["import { Observable, Subject } from 'rxjs';\n\nimport { sceneGraph } from '../../core/sceneGraph';\nimport { SceneComponentProps } from '../../core/types';\nimport { queryMetricTree } from '../../utils/metricTree';\nimport { VariableDependencyConfig } from '../VariableDependencyConfig';\nimport { renderSelectForVariable } from '../components/VariableValueSelect';\nimport { VariableValueOption } from '../types';\n\nimport { MultiValueVariable, MultiValueVariableState, VariableGetOptionsArgs } from './MultiValueVariable';\nimport { VariableRefresh } from '@grafana/data';\nimport { getClosest } from '../../core/sceneGraph/utils';\nimport { SceneVariableSet } from '../sets/SceneVariableSet';\nimport { SceneQueryControllerEntry } from '../../behaviors/SceneQueryController';\n\nexport interface TestVariableState extends MultiValueVariableState {\n query: string;\n delayMs?: number;\n issuedQuery?: string;\n refresh?: VariableRefresh;\n throwError?: string;\n optionsToReturn?: VariableValueOption[];\n}\n\n/**\n * This variable is only designed for unit tests and potentially e2e tests.\n */\nexport class TestVariable extends MultiValueVariable<TestVariableState> {\n private completeUpdate = new Subject<number>();\n public isGettingValues = true;\n public getValueOptionsCount = 0;\n\n protected _variableDependency = new VariableDependencyConfig(this, {\n statePaths: ['query'],\n });\n\n public constructor(initialState: Partial<TestVariableState>) {\n super({\n type: 'custom',\n name: 'Test',\n value: 'Value',\n text: 'Text',\n query: 'Query',\n options: [],\n refresh: VariableRefresh.onDashboardLoad,\n ...initialState,\n });\n }\n\n public getValueOptions(args: VariableGetOptionsArgs): Observable<VariableValueOption[]> {\n const { delayMs } = this.state;\n\n this.getValueOptionsCount += 1;\n\n const queryController = sceneGraph.getQueryController(this);\n\n return new Observable<VariableValueOption[]>((observer) => {\n const queryEntry: SceneQueryControllerEntry = {\n type: 'variable',\n origin: this,\n cancel: () => observer.complete(),\n };\n\n if (queryController) {\n queryController.queryStarted(queryEntry);\n }\n\n this.setState({ loading: true });\n\n if (this.state.throwError) {\n throw new Error(this.state.throwError);\n }\n\n const interpolatedQuery = sceneGraph.interpolate(this, this.state.query);\n const options = this.getOptions(interpolatedQuery);\n\n const sub = this.completeUpdate.subscribe({\n next: () => {\n this.setState({ issuedQuery: interpolatedQuery, options, loading: false });\n observer.next(options);\n observer.complete();\n },\n });\n\n let timeout: number | undefined;\n if (delayMs) {\n timeout = window.setTimeout(() => this.signalUpdateCompleted(), delayMs);\n } else if (delayMs === 0) {\n this.signalUpdateCompleted();\n }\n\n this.isGettingValues = true;\n\n return () => {\n sub.unsubscribe();\n window.clearTimeout(timeout);\n this.isGettingValues = false;\n\n if (this.state.loading) {\n this.setState({ loading: false });\n }\n\n if (queryController) {\n queryController.queryCompleted(queryEntry);\n }\n };\n });\n }\n\n public cancel() {\n const sceneVarSet = getClosest(this, (s) => (s instanceof SceneVariableSet ? s : undefined));\n sceneVarSet?.cancel(this);\n }\n\n private getOptions(interpolatedQuery: string) {\n if (this.state.optionsToReturn) {\n return this.state.optionsToReturn;\n }\n\n return queryMetricTree(interpolatedQuery).map((x) => ({ label: x.name, value: x.name }));\n }\n\n /** Useful from tests */\n public signalUpdateCompleted() {\n this.completeUpdate.next(1);\n }\n\n public static Component = ({ model }: SceneComponentProps<MultiValueVariable>) => {\n return renderSelectForVariable(model);\n };\n}\n"],"names":[],"mappings":"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"}
|
package/dist/index.d.ts
CHANGED
|
@@ -61,11 +61,6 @@ interface SceneVariable<TState extends SceneVariableState = SceneVariableState>
|
|
|
61
61
|
* Allows cancelling variable execution.
|
|
62
62
|
*/
|
|
63
63
|
onCancel?(): void;
|
|
64
|
-
/**
|
|
65
|
-
* @experimental
|
|
66
|
-
* Indicates that a variable loads values lazily when user interacts with the variable dropdown.
|
|
67
|
-
*/
|
|
68
|
-
isLazy?: boolean;
|
|
69
64
|
}
|
|
70
65
|
type VariableValue = VariableValueSingle | VariableValueSingle[];
|
|
71
66
|
type VariableValueSingle = string | boolean | number | CustomVariableValue;
|
|
@@ -908,7 +903,6 @@ type getTagKeysProvider = (set: GroupByVariable, currentKey: string | null) => P
|
|
|
908
903
|
}>;
|
|
909
904
|
declare class GroupByVariable extends MultiValueVariable<GroupByVariableState> {
|
|
910
905
|
static Component: typeof GroupByVariableRenderer;
|
|
911
|
-
isLazy: boolean;
|
|
912
906
|
validateAndUpdate(): Observable<ValidateAndUpdateResult>;
|
|
913
907
|
private _updateValueGivenNewOptions;
|
|
914
908
|
getValueOptions(args: VariableGetOptionsArgs): Observable<VariableValueOption[]>;
|
|
@@ -1469,9 +1463,8 @@ declare class TestVariable extends MultiValueVariable<TestVariableState> {
|
|
|
1469
1463
|
private completeUpdate;
|
|
1470
1464
|
isGettingValues: boolean;
|
|
1471
1465
|
getValueOptionsCount: number;
|
|
1472
|
-
isLazy: boolean;
|
|
1473
1466
|
protected _variableDependency: VariableDependencyConfig<TestVariableState>;
|
|
1474
|
-
constructor(initialState: Partial<TestVariableState
|
|
1467
|
+
constructor(initialState: Partial<TestVariableState>);
|
|
1475
1468
|
getValueOptions(args: VariableGetOptionsArgs): Observable<VariableValueOption[]>;
|
|
1476
1469
|
cancel(): void;
|
|
1477
1470
|
private getOptions;
|
package/dist/index.js
CHANGED
|
@@ -2840,6 +2840,81 @@ class CustomAllValue {
|
|
|
2840
2840
|
}
|
|
2841
2841
|
}
|
|
2842
2842
|
|
|
2843
|
+
function VariableValueSelect({ model }) {
|
|
2844
|
+
const { value, key } = model.useState();
|
|
2845
|
+
const onInputChange = model.onSearchChange ? (value2, meta) => {
|
|
2846
|
+
if (meta.action === "input-change") {
|
|
2847
|
+
model.onSearchChange(value2);
|
|
2848
|
+
}
|
|
2849
|
+
} : void 0;
|
|
2850
|
+
return /* @__PURE__ */ React__default["default"].createElement(ui.Select, {
|
|
2851
|
+
id: key,
|
|
2852
|
+
placeholder: "Select value",
|
|
2853
|
+
width: "auto",
|
|
2854
|
+
value,
|
|
2855
|
+
allowCustomValue: true,
|
|
2856
|
+
virtualized: true,
|
|
2857
|
+
tabSelectsValue: false,
|
|
2858
|
+
onInputChange,
|
|
2859
|
+
options: model.getOptionsForSelect(),
|
|
2860
|
+
"data-testid": e2eSelectors.selectors.pages.Dashboard.SubMenu.submenuItemValueDropDownValueLinkTexts(`${value}`),
|
|
2861
|
+
onChange: (newValue) => {
|
|
2862
|
+
model.changeValueTo(newValue.value, newValue.label);
|
|
2863
|
+
}
|
|
2864
|
+
});
|
|
2865
|
+
}
|
|
2866
|
+
function VariableValueSelectMulti({ model }) {
|
|
2867
|
+
const { value, key, maxVisibleValues, noValueOnClear } = model.useState();
|
|
2868
|
+
const arrayValue = React.useMemo(() => lodash.isArray(value) ? value : [value], [value]);
|
|
2869
|
+
const options = model.getOptionsForSelect();
|
|
2870
|
+
const [uncommittedValue, setUncommittedValue] = React.useState(arrayValue);
|
|
2871
|
+
React.useEffect(() => {
|
|
2872
|
+
setUncommittedValue(arrayValue);
|
|
2873
|
+
}, [arrayValue]);
|
|
2874
|
+
const onInputChange = model.onSearchChange ? (value2, meta) => {
|
|
2875
|
+
if (meta.action === "input-change") {
|
|
2876
|
+
model.onSearchChange(value2);
|
|
2877
|
+
}
|
|
2878
|
+
} : void 0;
|
|
2879
|
+
const placeholder = options.length > 0 ? "Select value" : "";
|
|
2880
|
+
return /* @__PURE__ */ React__default["default"].createElement(ui.MultiSelect, {
|
|
2881
|
+
id: key,
|
|
2882
|
+
placeholder,
|
|
2883
|
+
width: "auto",
|
|
2884
|
+
value: uncommittedValue,
|
|
2885
|
+
noMultiValueWrap: true,
|
|
2886
|
+
maxVisibleValues: maxVisibleValues != null ? maxVisibleValues : 5,
|
|
2887
|
+
tabSelectsValue: false,
|
|
2888
|
+
virtualized: true,
|
|
2889
|
+
allowCustomValue: true,
|
|
2890
|
+
options: model.getOptionsForSelect(),
|
|
2891
|
+
closeMenuOnSelect: false,
|
|
2892
|
+
isClearable: true,
|
|
2893
|
+
onInputChange,
|
|
2894
|
+
onBlur: () => {
|
|
2895
|
+
model.changeValueTo(uncommittedValue);
|
|
2896
|
+
},
|
|
2897
|
+
"data-testid": e2eSelectors.selectors.pages.Dashboard.SubMenu.submenuItemValueDropDownValueLinkTexts(`${uncommittedValue}`),
|
|
2898
|
+
onChange: (newValue, action) => {
|
|
2899
|
+
if (action.action === "clear" && noValueOnClear) {
|
|
2900
|
+
model.changeValueTo([]);
|
|
2901
|
+
}
|
|
2902
|
+
setUncommittedValue(newValue.map((x) => x.value));
|
|
2903
|
+
}
|
|
2904
|
+
});
|
|
2905
|
+
}
|
|
2906
|
+
function renderSelectForVariable(model) {
|
|
2907
|
+
if (model.state.isMulti) {
|
|
2908
|
+
return /* @__PURE__ */ React__default["default"].createElement(VariableValueSelectMulti, {
|
|
2909
|
+
model
|
|
2910
|
+
});
|
|
2911
|
+
} else {
|
|
2912
|
+
return /* @__PURE__ */ React__default["default"].createElement(VariableValueSelect, {
|
|
2913
|
+
model
|
|
2914
|
+
});
|
|
2915
|
+
}
|
|
2916
|
+
}
|
|
2917
|
+
|
|
2843
2918
|
var __defProp$z = Object.defineProperty;
|
|
2844
2919
|
var __defProps$n = Object.defineProperties;
|
|
2845
2920
|
var __getOwnPropDescs$n = Object.getOwnPropertyDescriptors;
|
|
@@ -2875,7 +2950,6 @@ class GroupByVariable extends MultiValueVariable {
|
|
|
2875
2950
|
}, initialState), {
|
|
2876
2951
|
noValueOnClear: true
|
|
2877
2952
|
}));
|
|
2878
|
-
this.isLazy = true;
|
|
2879
2953
|
this._getKeys = async (ds) => {
|
|
2880
2954
|
var _a, _b, _c;
|
|
2881
2955
|
const override = await ((_b = (_a = this.state).getTagKeysProvider) == null ? void 0 : _b.call(_a, this, null));
|
|
@@ -2961,56 +3035,7 @@ class GroupByVariable extends MultiValueVariable {
|
|
|
2961
3035
|
}
|
|
2962
3036
|
GroupByVariable.Component = GroupByVariableRenderer;
|
|
2963
3037
|
function GroupByVariableRenderer({ model }) {
|
|
2964
|
-
|
|
2965
|
-
const arrayValue = React.useMemo(() => lodash.isArray(value) ? value : [value], [value]);
|
|
2966
|
-
const [isFetchingOptions, setIsFetchingOptions] = React.useState(false);
|
|
2967
|
-
const [isOptionsOpen, setIsOptionsOpen] = React.useState(false);
|
|
2968
|
-
const [uncommittedValue, setUncommittedValue] = React.useState(arrayValue);
|
|
2969
|
-
React.useEffect(() => {
|
|
2970
|
-
setUncommittedValue(arrayValue);
|
|
2971
|
-
}, [arrayValue]);
|
|
2972
|
-
const onInputChange = model.onSearchChange ? (value2, meta) => {
|
|
2973
|
-
if (meta.action === "input-change") {
|
|
2974
|
-
model.onSearchChange(value2);
|
|
2975
|
-
}
|
|
2976
|
-
} : void 0;
|
|
2977
|
-
const placeholder = "Select value";
|
|
2978
|
-
return /* @__PURE__ */ React__default["default"].createElement(ui.MultiSelect, {
|
|
2979
|
-
"data-testid": `GroupBySelect-${key}`,
|
|
2980
|
-
id: key,
|
|
2981
|
-
placeholder,
|
|
2982
|
-
width: "auto",
|
|
2983
|
-
value: uncommittedValue,
|
|
2984
|
-
noMultiValueWrap: true,
|
|
2985
|
-
maxVisibleValues: maxVisibleValues != null ? maxVisibleValues : 5,
|
|
2986
|
-
tabSelectsValue: false,
|
|
2987
|
-
virtualized: true,
|
|
2988
|
-
allowCustomValue: true,
|
|
2989
|
-
options: model.getOptionsForSelect(),
|
|
2990
|
-
closeMenuOnSelect: false,
|
|
2991
|
-
isOpen: isOptionsOpen,
|
|
2992
|
-
isClearable: true,
|
|
2993
|
-
isLoading: isFetchingOptions,
|
|
2994
|
-
onInputChange,
|
|
2995
|
-
onBlur: () => {
|
|
2996
|
-
model.changeValueTo(uncommittedValue);
|
|
2997
|
-
},
|
|
2998
|
-
onChange: (newValue, action) => {
|
|
2999
|
-
if (action.action === "clear" && noValueOnClear) {
|
|
3000
|
-
model.changeValueTo([]);
|
|
3001
|
-
}
|
|
3002
|
-
setUncommittedValue(newValue.map((x) => x.value));
|
|
3003
|
-
},
|
|
3004
|
-
onOpenMenu: async () => {
|
|
3005
|
-
setIsFetchingOptions(true);
|
|
3006
|
-
await rxjs.lastValueFrom(model.validateAndUpdate());
|
|
3007
|
-
setIsFetchingOptions(false);
|
|
3008
|
-
setIsOptionsOpen(true);
|
|
3009
|
-
},
|
|
3010
|
-
onCloseMenu: () => {
|
|
3011
|
-
setIsOptionsOpen(false);
|
|
3012
|
-
}
|
|
3013
|
-
});
|
|
3038
|
+
return renderSelectForVariable(model);
|
|
3014
3039
|
}
|
|
3015
3040
|
|
|
3016
3041
|
function LoadingIndicator(props) {
|
|
@@ -4026,9 +4051,9 @@ function escapeLokiRegexp(value) {
|
|
|
4026
4051
|
function getQueriesForVariables(sourceObject) {
|
|
4027
4052
|
const runners = sceneGraph.findAllObjects(
|
|
4028
4053
|
sourceObject.getRoot(),
|
|
4029
|
-
(o) => o instanceof SceneQueryRunner
|
|
4054
|
+
(o) => o instanceof SceneQueryRunner && o.isActive
|
|
4030
4055
|
);
|
|
4031
|
-
const applicableRunners =
|
|
4056
|
+
const applicableRunners = runners.filter((r) => {
|
|
4032
4057
|
var _a, _b;
|
|
4033
4058
|
return ((_a = r.state.datasource) == null ? void 0 : _a.uid) === ((_b = sourceObject.state.datasource) == null ? void 0 : _b.uid);
|
|
4034
4059
|
});
|
|
@@ -4041,24 +4066,6 @@ function getQueriesForVariables(sourceObject) {
|
|
|
4041
4066
|
});
|
|
4042
4067
|
return result;
|
|
4043
4068
|
}
|
|
4044
|
-
function filterOutInactiveRunnerDuplicates(runners) {
|
|
4045
|
-
const groupedItems = {};
|
|
4046
|
-
for (const item of runners) {
|
|
4047
|
-
if (item.state.key) {
|
|
4048
|
-
if (!(item.state.key in groupedItems)) {
|
|
4049
|
-
groupedItems[item.state.key] = [];
|
|
4050
|
-
}
|
|
4051
|
-
groupedItems[item.state.key].push(item);
|
|
4052
|
-
}
|
|
4053
|
-
}
|
|
4054
|
-
return Object.values(groupedItems).flatMap((group) => {
|
|
4055
|
-
const activeItems = group.filter((item) => item.isActive);
|
|
4056
|
-
if (activeItems.length === 0 && group.length === 1) {
|
|
4057
|
-
return group;
|
|
4058
|
-
}
|
|
4059
|
-
return activeItems;
|
|
4060
|
-
});
|
|
4061
|
-
}
|
|
4062
4069
|
|
|
4063
4070
|
function isAdHocVariable(variable) {
|
|
4064
4071
|
return variable.state.type === "adhoc";
|
|
@@ -5983,7 +5990,8 @@ function VariableValueSelectWrapper({ variable, layout, showAlways }) {
|
|
|
5983
5990
|
}
|
|
5984
5991
|
if (layout === "vertical") {
|
|
5985
5992
|
return /* @__PURE__ */ React__default["default"].createElement("div", {
|
|
5986
|
-
className: verticalContainer
|
|
5993
|
+
className: verticalContainer,
|
|
5994
|
+
"data-testid": e2eSelectors.selectors.pages.Dashboard.SubMenu.submenuItem
|
|
5987
5995
|
}, /* @__PURE__ */ React__default["default"].createElement(VariableLabel, {
|
|
5988
5996
|
variable,
|
|
5989
5997
|
layout
|
|
@@ -5992,7 +6000,8 @@ function VariableValueSelectWrapper({ variable, layout, showAlways }) {
|
|
|
5992
6000
|
}));
|
|
5993
6001
|
}
|
|
5994
6002
|
return /* @__PURE__ */ React__default["default"].createElement("div", {
|
|
5995
|
-
className: containerStyle
|
|
6003
|
+
className: containerStyle,
|
|
6004
|
+
"data-testid": e2eSelectors.selectors.pages.Dashboard.SubMenu.submenuItem
|
|
5996
6005
|
}, /* @__PURE__ */ React__default["default"].createElement(VariableLabel, {
|
|
5997
6006
|
variable
|
|
5998
6007
|
}), /* @__PURE__ */ React__default["default"].createElement(variable.Component, {
|
|
@@ -6130,9 +6139,6 @@ class SceneVariableSet extends SceneObjectBase {
|
|
|
6130
6139
|
}
|
|
6131
6140
|
}
|
|
6132
6141
|
_variableNeedsUpdate(variable) {
|
|
6133
|
-
if (variable.isLazy) {
|
|
6134
|
-
return false;
|
|
6135
|
-
}
|
|
6136
6142
|
if (!variable.validateAndUpdate) {
|
|
6137
6143
|
return false;
|
|
6138
6144
|
}
|
|
@@ -6310,79 +6316,6 @@ class ConstantVariable extends SceneObjectBase {
|
|
|
6310
6316
|
}
|
|
6311
6317
|
}
|
|
6312
6318
|
|
|
6313
|
-
function VariableValueSelect({ model }) {
|
|
6314
|
-
const { value, key } = model.useState();
|
|
6315
|
-
const onInputChange = model.onSearchChange ? (value2, meta) => {
|
|
6316
|
-
if (meta.action === "input-change") {
|
|
6317
|
-
model.onSearchChange(value2);
|
|
6318
|
-
}
|
|
6319
|
-
} : void 0;
|
|
6320
|
-
return /* @__PURE__ */ React__default["default"].createElement(ui.Select, {
|
|
6321
|
-
id: key,
|
|
6322
|
-
placeholder: "Select value",
|
|
6323
|
-
width: "auto",
|
|
6324
|
-
value,
|
|
6325
|
-
allowCustomValue: true,
|
|
6326
|
-
virtualized: true,
|
|
6327
|
-
tabSelectsValue: false,
|
|
6328
|
-
onInputChange,
|
|
6329
|
-
options: model.getOptionsForSelect(),
|
|
6330
|
-
onChange: (newValue) => {
|
|
6331
|
-
model.changeValueTo(newValue.value, newValue.label);
|
|
6332
|
-
}
|
|
6333
|
-
});
|
|
6334
|
-
}
|
|
6335
|
-
function VariableValueSelectMulti({ model }) {
|
|
6336
|
-
const { value, key, maxVisibleValues, noValueOnClear } = model.useState();
|
|
6337
|
-
const arrayValue = React.useMemo(() => lodash.isArray(value) ? value : [value], [value]);
|
|
6338
|
-
const options = model.getOptionsForSelect();
|
|
6339
|
-
const [uncommittedValue, setUncommittedValue] = React.useState(arrayValue);
|
|
6340
|
-
React.useEffect(() => {
|
|
6341
|
-
setUncommittedValue(arrayValue);
|
|
6342
|
-
}, [arrayValue]);
|
|
6343
|
-
const onInputChange = model.onSearchChange ? (value2, meta) => {
|
|
6344
|
-
if (meta.action === "input-change") {
|
|
6345
|
-
model.onSearchChange(value2);
|
|
6346
|
-
}
|
|
6347
|
-
} : void 0;
|
|
6348
|
-
const placeholder = options.length > 0 ? "Select value" : "";
|
|
6349
|
-
return /* @__PURE__ */ React__default["default"].createElement(ui.MultiSelect, {
|
|
6350
|
-
id: key,
|
|
6351
|
-
placeholder,
|
|
6352
|
-
width: "auto",
|
|
6353
|
-
value: uncommittedValue,
|
|
6354
|
-
noMultiValueWrap: true,
|
|
6355
|
-
maxVisibleValues: maxVisibleValues != null ? maxVisibleValues : 5,
|
|
6356
|
-
tabSelectsValue: false,
|
|
6357
|
-
virtualized: true,
|
|
6358
|
-
allowCustomValue: true,
|
|
6359
|
-
options: model.getOptionsForSelect(),
|
|
6360
|
-
closeMenuOnSelect: false,
|
|
6361
|
-
isClearable: true,
|
|
6362
|
-
onInputChange,
|
|
6363
|
-
onBlur: () => {
|
|
6364
|
-
model.changeValueTo(uncommittedValue);
|
|
6365
|
-
},
|
|
6366
|
-
onChange: (newValue, action) => {
|
|
6367
|
-
if (action.action === "clear" && noValueOnClear) {
|
|
6368
|
-
model.changeValueTo([]);
|
|
6369
|
-
}
|
|
6370
|
-
setUncommittedValue(newValue.map((x) => x.value));
|
|
6371
|
-
}
|
|
6372
|
-
});
|
|
6373
|
-
}
|
|
6374
|
-
function renderSelectForVariable(model) {
|
|
6375
|
-
if (model.state.isMulti) {
|
|
6376
|
-
return /* @__PURE__ */ React__default["default"].createElement(VariableValueSelectMulti, {
|
|
6377
|
-
model
|
|
6378
|
-
});
|
|
6379
|
-
} else {
|
|
6380
|
-
return /* @__PURE__ */ React__default["default"].createElement(VariableValueSelect, {
|
|
6381
|
-
model
|
|
6382
|
-
});
|
|
6383
|
-
}
|
|
6384
|
-
}
|
|
6385
|
-
|
|
6386
6319
|
var __defProp$i = Object.defineProperty;
|
|
6387
6320
|
var __getOwnPropSymbols$i = Object.getOwnPropertySymbols;
|
|
6388
6321
|
var __hasOwnProp$i = Object.prototype.hasOwnProperty;
|
|
@@ -7057,7 +6990,7 @@ var __spreadValues$e = (a, b) => {
|
|
|
7057
6990
|
return a;
|
|
7058
6991
|
};
|
|
7059
6992
|
class TestVariable extends MultiValueVariable {
|
|
7060
|
-
constructor(initialState
|
|
6993
|
+
constructor(initialState) {
|
|
7061
6994
|
super(__spreadValues$e({
|
|
7062
6995
|
type: "custom",
|
|
7063
6996
|
name: "Test",
|
|
@@ -7070,11 +7003,9 @@ class TestVariable extends MultiValueVariable {
|
|
|
7070
7003
|
this.completeUpdate = new rxjs.Subject();
|
|
7071
7004
|
this.isGettingValues = true;
|
|
7072
7005
|
this.getValueOptionsCount = 0;
|
|
7073
|
-
this.isLazy = false;
|
|
7074
7006
|
this._variableDependency = new VariableDependencyConfig(this, {
|
|
7075
7007
|
statePaths: ["query"]
|
|
7076
7008
|
});
|
|
7077
|
-
this.isLazy = isLazy;
|
|
7078
7009
|
}
|
|
7079
7010
|
getValueOptions(args) {
|
|
7080
7011
|
const { delayMs } = this.state;
|
|
@@ -7570,7 +7501,8 @@ function VizPanelMenuRenderer({ model }) {
|
|
|
7570
7501
|
childItems: item.subMenu ? renderItems(item.subMenu) : void 0,
|
|
7571
7502
|
url: item.href,
|
|
7572
7503
|
onClick: item.onClick,
|
|
7573
|
-
shortcut: item.shortcut
|
|
7504
|
+
shortcut: item.shortcut,
|
|
7505
|
+
testId: e2eSelectors.selectors.components.Panels.Panel.menuItems(item.text)
|
|
7574
7506
|
})
|
|
7575
7507
|
);
|
|
7576
7508
|
};
|
|
@@ -8196,7 +8128,8 @@ function SceneGridRowRenderer({ model }) {
|
|
|
8196
8128
|
}, /* @__PURE__ */ React__default["default"].createElement("button", {
|
|
8197
8129
|
onClick: model.onCollapseToggle,
|
|
8198
8130
|
className: styles.rowTitleButton,
|
|
8199
|
-
"aria-label": isCollapsed ? "Expand row" : "Collapse row"
|
|
8131
|
+
"aria-label": isCollapsed ? "Expand row" : "Collapse row",
|
|
8132
|
+
"data-testid": e2eSelectors.selectors.components.DashboardRow.title(sceneGraph.interpolate(model, title, void 0, "text"))
|
|
8200
8133
|
}, isCollapsible && /* @__PURE__ */ React__default["default"].createElement(ui.Icon, {
|
|
8201
8134
|
name: isCollapsed ? "angle-right" : "angle-down"
|
|
8202
8135
|
}), /* @__PURE__ */ React__default["default"].createElement("span", {
|