@grafana/scenes 6.5.1--canary.1077.13965250047.0 → 6.5.1--canary.1079.13965689803.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/behaviors/ActWhenVariableChanged.js.map +1 -1
- package/dist/esm/behaviors/CursorSync.js +21 -3
- package/dist/esm/behaviors/CursorSync.js.map +1 -1
- package/dist/esm/behaviors/LiveNowTimer.js +2 -3
- package/dist/esm/behaviors/LiveNowTimer.js.map +1 -1
- package/dist/esm/behaviors/SceneQueryController.js +37 -7
- package/dist/esm/behaviors/SceneQueryController.js.map +1 -1
- package/dist/esm/behaviors/SceneRenderProfiler.js +17 -10
- package/dist/esm/behaviors/SceneRenderProfiler.js.map +1 -1
- package/dist/esm/components/EmbeddedScene.js +12 -1
- package/dist/esm/components/EmbeddedScene.js.map +1 -1
- package/dist/esm/components/NestedScene.js +30 -23
- package/dist/esm/components/NestedScene.js.map +1 -1
- package/dist/esm/components/SceneApp/SceneApp.js +11 -1
- package/dist/esm/components/SceneApp/SceneApp.js.map +1 -1
- package/dist/esm/components/SceneApp/SceneAppPage.js +47 -28
- package/dist/esm/components/SceneApp/SceneAppPage.js.map +1 -1
- package/dist/esm/components/SceneApp/SceneAppPageView.js +20 -14
- package/dist/esm/components/SceneApp/SceneAppPageView.js.map +1 -1
- package/dist/esm/components/SceneApp/utils.js +18 -2
- package/dist/esm/components/SceneApp/utils.js.map +1 -1
- package/dist/esm/components/SceneByFrameRepeater.js +3 -1
- package/dist/esm/components/SceneByFrameRepeater.js.map +1 -1
- package/dist/esm/components/SceneByVariableRepeater.js +3 -1
- package/dist/esm/components/SceneByVariableRepeater.js.map +1 -1
- package/dist/esm/components/SceneCanvasText.js +4 -1
- package/dist/esm/components/SceneCanvasText.js.map +1 -1
- package/dist/esm/components/SceneControlsSpacer.js +3 -1
- package/dist/esm/components/SceneControlsSpacer.js.map +1 -1
- package/dist/esm/components/SceneDebugger/DebugDetails.js +24 -11
- package/dist/esm/components/SceneDebugger/DebugDetails.js.map +1 -1
- package/dist/esm/components/SceneDebugger/DebugTreeNode.js +14 -2
- package/dist/esm/components/SceneDebugger/DebugTreeNode.js.map +1 -1
- package/dist/esm/components/SceneDebugger/SceneDebugger.js +29 -1
- package/dist/esm/components/SceneDebugger/SceneDebugger.js.map +1 -1
- package/dist/esm/components/SceneReactObject.js +17 -1
- package/dist/esm/components/SceneReactObject.js.map +1 -1
- package/dist/esm/components/SceneRefreshPicker.js +38 -23
- package/dist/esm/components/SceneRefreshPicker.js.map +1 -1
- package/dist/esm/components/SceneTimePicker.js +29 -27
- package/dist/esm/components/SceneTimePicker.js.map +1 -1
- package/dist/esm/components/SceneTimeRangeCompare.js +50 -36
- package/dist/esm/components/SceneTimeRangeCompare.js.map +1 -1
- package/dist/esm/components/SceneToolbarButton.js +14 -10
- package/dist/esm/components/SceneToolbarButton.js.map +1 -1
- package/dist/esm/components/VizPanel/VizPanel.js +29 -20
- package/dist/esm/components/VizPanel/VizPanel.js.map +1 -1
- package/dist/esm/components/VizPanel/VizPanelExploreButton.js +13 -17
- package/dist/esm/components/VizPanel/VizPanelExploreButton.js.map +1 -1
- package/dist/esm/components/VizPanel/VizPanelMenu.js +20 -18
- package/dist/esm/components/VizPanel/VizPanelMenu.js.map +1 -1
- package/dist/esm/components/VizPanel/VizPanelRenderer.js +122 -92
- package/dist/esm/components/VizPanel/VizPanelRenderer.js.map +1 -1
- package/dist/esm/components/VizPanel/VizPanelSeriesLimit.js +15 -7
- package/dist/esm/components/VizPanel/VizPanelSeriesLimit.js.map +1 -1
- package/dist/esm/components/VizPanel/colorSeriesConfigFactory.js +29 -15
- package/dist/esm/components/VizPanel/colorSeriesConfigFactory.js.map +1 -1
- package/dist/esm/components/VizPanel/registerRuntimePanelPlugin.js +21 -3
- package/dist/esm/components/VizPanel/registerRuntimePanelPlugin.js.map +1 -1
- package/dist/esm/components/VizPanel/seriesVisibilityConfigFactory.js +34 -22
- package/dist/esm/components/VizPanel/seriesVisibilityConfigFactory.js.map +1 -1
- package/dist/esm/components/layout/CSSGrid/SceneCSSGridLayout.js +40 -8
- package/dist/esm/components/layout/CSSGrid/SceneCSSGridLayout.js.map +1 -1
- package/dist/esm/components/layout/LazyLoader.js +35 -2
- package/dist/esm/components/layout/LazyLoader.js.map +1 -1
- package/dist/esm/components/layout/SceneFlexLayout.js +13 -3
- package/dist/esm/components/layout/SceneFlexLayout.js.map +1 -1
- package/dist/esm/components/layout/grid/SceneGridItem.js +3 -1
- package/dist/esm/components/layout/grid/SceneGridItem.js.map +1 -1
- package/dist/esm/components/layout/grid/SceneGridLayout.js +26 -26
- package/dist/esm/components/layout/grid/SceneGridLayout.js.map +1 -1
- package/dist/esm/components/layout/grid/SceneGridLayoutRenderer.js +104 -88
- package/dist/esm/components/layout/grid/SceneGridLayoutRenderer.js.map +1 -1
- package/dist/esm/components/layout/grid/SceneGridRow.js +48 -15
- package/dist/esm/components/layout/grid/SceneGridRow.js.map +1 -1
- package/dist/esm/components/layout/grid/constants.js.map +1 -1
- package/dist/esm/components/layout/grid/types.js.map +1 -1
- package/dist/esm/components/layout/grid/utils.js +21 -3
- package/dist/esm/components/layout/grid/utils.js.map +1 -1
- package/dist/esm/components/layout/split/SplitLayout.js.map +1 -1
- package/dist/esm/components/layout/split/SplitLayoutRenderer.js +14 -11
- package/dist/esm/components/layout/split/SplitLayoutRenderer.js.map +1 -1
- package/dist/esm/components/layout/split/Splitter.js +58 -60
- package/dist/esm/components/layout/split/Splitter.js.map +1 -1
- package/dist/esm/core/PanelBuilders/FieldConfigBuilder.js +23 -46
- package/dist/esm/core/PanelBuilders/FieldConfigBuilder.js.map +1 -1
- package/dist/esm/core/PanelBuilders/FieldConfigBuilders.js +8 -8
- package/dist/esm/core/PanelBuilders/FieldConfigBuilders.js.map +1 -1
- package/dist/esm/core/PanelBuilders/FieldConfigOverridesBuilder.js.map +1 -1
- package/dist/esm/core/PanelBuilders/PanelOptionsBuilder.js +0 -3
- package/dist/esm/core/PanelBuilders/PanelOptionsBuilder.js.map +1 -1
- package/dist/esm/core/PanelBuilders/PanelOptionsBuilders.js +28 -28
- package/dist/esm/core/PanelBuilders/PanelOptionsBuilders.js.map +1 -1
- package/dist/esm/core/PanelBuilders/StandardFieldConfigBuilders.js.map +1 -1
- package/dist/esm/core/PanelBuilders/VizConfigBuilder.js +0 -39
- package/dist/esm/core/PanelBuilders/VizConfigBuilder.js.map +1 -1
- package/dist/esm/core/PanelBuilders/VizConfigBuilders.js +32 -32
- package/dist/esm/core/PanelBuilders/VizConfigBuilders.js.map +1 -1
- package/dist/esm/core/PanelBuilders/VizPanelBuilder.js +21 -82
- package/dist/esm/core/PanelBuilders/VizPanelBuilder.js.map +1 -1
- package/dist/esm/core/PanelBuilders/index.js +32 -32
- package/dist/esm/core/PanelBuilders/index.js.map +1 -1
- package/dist/esm/core/SceneComponentWrapper.js +38 -4
- package/dist/esm/core/SceneComponentWrapper.js.map +1 -1
- package/dist/esm/core/SceneDataNode.js +19 -4
- package/dist/esm/core/SceneDataNode.js.map +1 -1
- package/dist/esm/core/SceneObjectBase.js +17 -55
- package/dist/esm/core/SceneObjectBase.js.map +1 -1
- package/dist/esm/core/SceneObjectRef.js +18 -7
- package/dist/esm/core/SceneObjectRef.js.map +1 -1
- package/dist/esm/core/SceneScopesBridge.js +0 -15
- package/dist/esm/core/SceneScopesBridge.js.map +1 -1
- package/dist/esm/core/SceneTimeRange.js +17 -9
- package/dist/esm/core/SceneTimeRange.js.map +1 -1
- package/dist/esm/core/SceneTimeRangeTransformerBase.js.map +1 -1
- package/dist/esm/core/SceneTimeZoneOverride.js +23 -7
- package/dist/esm/core/SceneTimeZoneOverride.js.map +1 -1
- package/dist/esm/core/events.js.map +1 -1
- package/dist/esm/core/sceneGraph/getQueryController.js.map +1 -1
- package/dist/esm/core/sceneGraph/getTimeRange.js.map +1 -1
- package/dist/esm/core/sceneGraph/index.js +1 -1
- package/dist/esm/core/sceneGraph/index.js.map +1 -1
- package/dist/esm/core/sceneGraph/sceneGraph.js.map +1 -1
- package/dist/esm/core/sceneGraph/utils.js +17 -1
- package/dist/esm/core/sceneGraph/utils.js.map +1 -1
- package/dist/esm/core/types.js.map +1 -1
- package/dist/esm/index.js +5 -6
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/querying/DataLayersMerger.js.map +1 -1
- package/dist/esm/querying/DataProviderProxy.js.map +1 -1
- package/dist/esm/querying/ExtraQueryProvider.js.map +1 -1
- package/dist/esm/querying/RuntimeDataSource.js.map +1 -1
- package/dist/esm/querying/SceneDataLayerSet.js +24 -9
- package/dist/esm/querying/SceneDataLayerSet.js.map +1 -1
- package/dist/esm/querying/SceneDataTransformer.js +24 -11
- package/dist/esm/querying/SceneDataTransformer.js.map +1 -1
- package/dist/esm/querying/SceneQueryRunner.js +34 -45
- package/dist/esm/querying/SceneQueryRunner.js.map +1 -1
- package/dist/esm/querying/extraQueryProcessingOperator.js +21 -3
- package/dist/esm/querying/extraQueryProcessingOperator.js.map +1 -1
- package/dist/esm/querying/getEnrichedDataRequest.js.map +1 -1
- package/dist/esm/querying/layers/SceneDataLayerBase.js +19 -16
- package/dist/esm/querying/layers/SceneDataLayerBase.js.map +1 -1
- package/dist/esm/querying/layers/SceneDataLayerControls.js +21 -15
- package/dist/esm/querying/layers/SceneDataLayerControls.js.map +1 -1
- package/dist/esm/querying/layers/annotations/AnnotationsDataLayer.js +30 -12
- package/dist/esm/querying/layers/annotations/AnnotationsDataLayer.js.map +1 -1
- package/dist/esm/querying/layers/annotations/filterAnnotations.js +23 -6
- package/dist/esm/querying/layers/annotations/filterAnnotations.js.map +1 -1
- package/dist/esm/querying/layers/annotations/standardAnnotationQuery.js +29 -19
- package/dist/esm/querying/layers/annotations/standardAnnotationQuery.js.map +1 -1
- package/dist/esm/querying/layers/annotations/standardAnnotationsSupport.js +34 -14
- package/dist/esm/querying/layers/annotations/standardAnnotationsSupport.js.map +1 -1
- package/dist/esm/querying/layers/annotations/utils.js +17 -1
- package/dist/esm/querying/layers/annotations/utils.js.map +1 -1
- package/dist/esm/querying/registerQueryWithController.js.map +1 -1
- package/dist/esm/services/SceneObjectUrlSyncConfig.js.map +1 -1
- package/dist/esm/services/UniqueUrlKeyMapper.js.map +1 -1
- package/dist/esm/services/UrlSyncContextProvider.js.map +1 -1
- package/dist/esm/services/UrlSyncManager.js +19 -11
- package/dist/esm/services/UrlSyncManager.js.map +1 -1
- package/dist/esm/services/useUrlSync.js.map +1 -1
- package/dist/esm/services/utils.js.map +1 -1
- package/dist/esm/utils/ControlsLabel.js +47 -23
- package/dist/esm/utils/ControlsLabel.js.map +1 -1
- package/dist/esm/utils/LoadingIndicator.js +10 -11
- package/dist/esm/utils/LoadingIndicator.js.map +1 -1
- package/dist/esm/utils/SafeSerializableSceneObject.js +18 -7
- package/dist/esm/utils/SafeSerializableSceneObject.js.map +1 -1
- package/dist/esm/utils/compatibility/setWindowGrafanaSceneContext.js.map +1 -1
- package/dist/esm/utils/date.js.map +1 -1
- package/dist/esm/utils/evaluateTimeRange.js.map +1 -1
- package/dist/esm/utils/explore.js.map +1 -1
- package/dist/esm/utils/getCompareSeriesRefId.js.map +1 -1
- package/dist/esm/utils/getDataSource.js.map +1 -1
- package/dist/esm/utils/getMessageFromError.js.map +1 -1
- package/dist/esm/utils/metricTree.js.map +1 -1
- package/dist/esm/utils/parseUrlParam.js.map +1 -1
- package/dist/esm/utils/utils.js.map +1 -1
- package/dist/esm/utils/wrapInSafeSerializableSceneObject.js.map +1 -1
- package/dist/esm/utils/writeSceneLog.js.map +1 -1
- package/dist/esm/variables/VariableDependencyConfig.js +0 -9
- package/dist/esm/variables/VariableDependencyConfig.js.map +1 -1
- package/dist/esm/variables/VariableValueRecorder.js.map +1 -1
- package/dist/esm/variables/adhoc/AdHocFilterBuilder.js +12 -13
- package/dist/esm/variables/adhoc/AdHocFilterBuilder.js.map +1 -1
- package/dist/esm/variables/adhoc/AdHocFilterRenderer.js +142 -129
- package/dist/esm/variables/adhoc/AdHocFilterRenderer.js.map +1 -1
- package/dist/esm/variables/adhoc/AdHocFiltersCombobox/AdHocFilterPill.js +91 -84
- package/dist/esm/variables/adhoc/AdHocFiltersCombobox/AdHocFilterPill.js.map +1 -1
- package/dist/esm/variables/adhoc/AdHocFiltersCombobox/AdHocFiltersAlwaysWipCombobox.js +6 -1
- package/dist/esm/variables/adhoc/AdHocFiltersCombobox/AdHocFiltersAlwaysWipCombobox.js.map +1 -1
- package/dist/esm/variables/adhoc/AdHocFiltersCombobox/AdHocFiltersCombobox.js +194 -195
- package/dist/esm/variables/adhoc/AdHocFiltersCombobox/AdHocFiltersCombobox.js.map +1 -1
- package/dist/esm/variables/adhoc/AdHocFiltersCombobox/AdHocFiltersComboboxRenderer.js +28 -34
- package/dist/esm/variables/adhoc/AdHocFiltersCombobox/AdHocFiltersComboboxRenderer.js.map +1 -1
- package/dist/esm/variables/adhoc/AdHocFiltersCombobox/DropdownItem.js +65 -28
- package/dist/esm/variables/adhoc/AdHocFiltersCombobox/DropdownItem.js.map +1 -1
- package/dist/esm/variables/adhoc/AdHocFiltersCombobox/MultiValuePill.js +43 -29
- package/dist/esm/variables/adhoc/AdHocFiltersCombobox/MultiValuePill.js.map +1 -1
- package/dist/esm/variables/adhoc/AdHocFiltersCombobox/useFloatingInteractions.js +1 -2
- package/dist/esm/variables/adhoc/AdHocFiltersCombobox/useFloatingInteractions.js.map +1 -1
- package/dist/esm/variables/adhoc/AdHocFiltersCombobox/utils.js.map +1 -1
- package/dist/esm/variables/adhoc/AdHocFiltersVariable.js +55 -43
- package/dist/esm/variables/adhoc/AdHocFiltersVariable.js.map +1 -1
- package/dist/esm/variables/adhoc/AdHocFiltersVariableUrlSyncHandler.js.map +1 -1
- package/dist/esm/variables/adhoc/getAdHocFiltersFromScopes.js +0 -1
- package/dist/esm/variables/adhoc/getAdHocFiltersFromScopes.js.map +1 -1
- package/dist/esm/variables/adhoc/getAdhocOptionSearcher.js.map +1 -1
- package/dist/esm/variables/adhoc/patchGetAdhocFilters.js.map +1 -1
- package/dist/esm/variables/components/VariableValueControl.js +6 -9
- package/dist/esm/variables/components/VariableValueControl.js.map +1 -1
- package/dist/esm/variables/components/VariableValueInput.js +10 -13
- package/dist/esm/variables/components/VariableValueInput.js.map +1 -1
- package/dist/esm/variables/components/VariableValueSelect.js +115 -90
- package/dist/esm/variables/components/VariableValueSelect.js.map +1 -1
- package/dist/esm/variables/components/VariableValueSelectors.js +37 -20
- package/dist/esm/variables/components/VariableValueSelectors.js.map +1 -1
- package/dist/esm/variables/components/getOptionSearcher.js +1 -1
- package/dist/esm/variables/components/getOptionSearcher.js.map +1 -1
- package/dist/esm/variables/constants.js.map +1 -1
- package/dist/esm/variables/filter.js +1 -6
- package/dist/esm/variables/filter.js.map +1 -1
- package/dist/esm/variables/getEnrichedFiltersRequest.js.map +1 -1
- package/dist/esm/variables/groupby/GroupByVariable.js +112 -106
- package/dist/esm/variables/groupby/GroupByVariable.js.map +1 -1
- package/dist/esm/variables/groupby/GroupByVariableUrlSyncHandler.js.map +1 -1
- package/dist/esm/variables/groupby/findActiveGroupByVariablesByUid.js.map +1 -1
- package/dist/esm/variables/interpolation/ScopedVarsVariable.js.map +1 -1
- package/dist/esm/variables/interpolation/defaults.js.map +1 -1
- package/dist/esm/variables/interpolation/fieldAccessorCache.js.map +1 -1
- package/dist/esm/variables/interpolation/formatRegistry.js.map +1 -1
- package/dist/esm/variables/interpolation/sceneInterpolator.js.map +1 -1
- package/dist/esm/variables/lookupVariable.js.map +1 -1
- package/dist/esm/variables/macros/AllVariablesMacro.js.map +1 -1
- package/dist/esm/variables/macros/contextMacros.js.map +1 -1
- package/dist/esm/variables/macros/dataMacros.js.map +1 -1
- package/dist/esm/variables/macros/index.js.map +1 -1
- package/dist/esm/variables/macros/templateProxies.js +21 -4
- package/dist/esm/variables/macros/templateProxies.js.map +1 -1
- package/dist/esm/variables/macros/timeMacros.js.map +1 -1
- package/dist/esm/variables/macros/types.js.map +1 -1
- package/dist/esm/variables/macros/urlMacros.js.map +1 -1
- package/dist/esm/variables/sets/SceneVariableSet.js +0 -44
- 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.map +1 -1
- package/dist/esm/variables/variants/ConstantVariable.js +23 -4
- package/dist/esm/variables/variants/ConstantVariable.js.map +1 -1
- package/dist/esm/variables/variants/CustomVariable.js +19 -4
- package/dist/esm/variables/variants/CustomVariable.js.map +1 -1
- package/dist/esm/variables/variants/DataSourceVariable.js +19 -4
- package/dist/esm/variables/variants/DataSourceVariable.js.map +1 -1
- package/dist/esm/variables/variants/IntervalVariable.js +29 -17
- package/dist/esm/variables/variants/IntervalVariable.js.map +1 -1
- package/dist/esm/variables/variants/LocalValueVariable.js +23 -8
- package/dist/esm/variables/variants/LocalValueVariable.js.map +1 -1
- package/dist/esm/variables/variants/MultiValueVariable.js +0 -16
- package/dist/esm/variables/variants/MultiValueVariable.js.map +1 -1
- package/dist/esm/variables/variants/TestVariable.js +19 -5
- package/dist/esm/variables/variants/TestVariable.js.map +1 -1
- package/dist/esm/variables/variants/TextBoxVariable.js +22 -5
- package/dist/esm/variables/variants/TextBoxVariable.js.map +1 -1
- package/dist/esm/variables/variants/guards.js.map +1 -1
- package/dist/esm/variables/variants/query/QueryVariable.js +20 -8
- package/dist/esm/variables/variants/query/QueryVariable.js.map +1 -1
- package/dist/esm/variables/variants/query/createQueryVariableRunner.js +23 -6
- package/dist/esm/variables/variants/query/createQueryVariableRunner.js.map +1 -1
- package/dist/esm/variables/variants/query/guards.js.map +1 -1
- package/dist/esm/variables/variants/query/toMetricFindValues.js.map +1 -1
- package/dist/esm/variables/variants/query/utils.js.map +1 -1
- package/dist/index.d.ts +6 -36
- package/dist/index.js +2792 -2036
- package/dist/index.js.map +1 -1
- package/package.json +9 -8
|
@@ -1,11 +1,42 @@
|
|
|
1
1
|
import { isArray } from 'lodash';
|
|
2
|
-
import React, {
|
|
3
|
-
import { useTheme2, getSelectStyles, useStyles2, Checkbox,
|
|
2
|
+
import React, { useState, useMemo, useEffect } from 'react';
|
|
3
|
+
import { Select, MultiSelect, useTheme2, getSelectStyles, useStyles2, Checkbox, ToggleAllState } from '@grafana/ui';
|
|
4
4
|
import { selectors } from '@grafana/e2e-selectors';
|
|
5
|
-
import {
|
|
5
|
+
import { cx, css } from '@emotion/css';
|
|
6
6
|
import { getOptionSearcher } from './getOptionSearcher.js';
|
|
7
7
|
import { sceneGraph } from '../../core/sceneGraph/index.js';
|
|
8
8
|
|
|
9
|
+
var __defProp = Object.defineProperty;
|
|
10
|
+
var __defProps = Object.defineProperties;
|
|
11
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
12
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
13
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
14
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
15
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
16
|
+
var __spreadValues = (a, b) => {
|
|
17
|
+
for (var prop in b || (b = {}))
|
|
18
|
+
if (__hasOwnProp.call(b, prop))
|
|
19
|
+
__defNormalProp(a, prop, b[prop]);
|
|
20
|
+
if (__getOwnPropSymbols)
|
|
21
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
22
|
+
if (__propIsEnum.call(b, prop))
|
|
23
|
+
__defNormalProp(a, prop, b[prop]);
|
|
24
|
+
}
|
|
25
|
+
return a;
|
|
26
|
+
};
|
|
27
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
28
|
+
var __objRest = (source, exclude) => {
|
|
29
|
+
var target = {};
|
|
30
|
+
for (var prop in source)
|
|
31
|
+
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
32
|
+
target[prop] = source[prop];
|
|
33
|
+
if (source != null && __getOwnPropSymbols)
|
|
34
|
+
for (var prop of __getOwnPropSymbols(source)) {
|
|
35
|
+
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
36
|
+
target[prop] = source[prop];
|
|
37
|
+
}
|
|
38
|
+
return target;
|
|
39
|
+
};
|
|
9
40
|
const filterNoOp = () => true;
|
|
10
41
|
const filterAll = (v) => v.value !== "$__all";
|
|
11
42
|
const determineToggleAllState = (selectedValues, options) => {
|
|
@@ -49,34 +80,31 @@ function VariableValueSelect({ model }) {
|
|
|
49
80
|
const onCloseMenu = () => {
|
|
50
81
|
setInputValue("");
|
|
51
82
|
};
|
|
52
|
-
return /* @__PURE__ */ React.createElement(
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
if (hasCustomValue !== newValue.__isNew__) {
|
|
75
|
-
setHasCustomValue(newValue.__isNew__);
|
|
76
|
-
}
|
|
83
|
+
return /* @__PURE__ */ React.createElement(Select, {
|
|
84
|
+
id: key,
|
|
85
|
+
isValidNewOption: (inputValue2) => inputValue2.trim().length > 0,
|
|
86
|
+
placeholder: "Select value",
|
|
87
|
+
width: "auto",
|
|
88
|
+
disabled: isReadOnly,
|
|
89
|
+
value: selectValue,
|
|
90
|
+
inputValue,
|
|
91
|
+
allowCustomValue,
|
|
92
|
+
virtualized: true,
|
|
93
|
+
filterOption: filterNoOp,
|
|
94
|
+
tabSelectsValue: false,
|
|
95
|
+
onInputChange,
|
|
96
|
+
onOpenMenu,
|
|
97
|
+
onCloseMenu,
|
|
98
|
+
options: filteredOptions,
|
|
99
|
+
"data-testid": selectors.pages.Dashboard.SubMenu.submenuItemValueDropDownValueLinkTexts(`${value}`),
|
|
100
|
+
onChange: (newValue) => {
|
|
101
|
+
model.changeValueTo(newValue.value, newValue.label, true);
|
|
102
|
+
queryController == null ? void 0 : queryController.startProfile("VariableValueSelect");
|
|
103
|
+
if (hasCustomValue !== newValue.__isNew__) {
|
|
104
|
+
setHasCustomValue(newValue.__isNew__);
|
|
77
105
|
}
|
|
78
106
|
}
|
|
79
|
-
);
|
|
107
|
+
});
|
|
80
108
|
}
|
|
81
109
|
function VariableValueSelectMulti({ model }) {
|
|
82
110
|
const {
|
|
@@ -113,45 +141,42 @@ function VariableValueSelectMulti({ model }) {
|
|
|
113
141
|
};
|
|
114
142
|
const placeholder = options.length > 0 ? "Select value" : "";
|
|
115
143
|
const filteredOptions = optionSearcher(inputValue);
|
|
116
|
-
return /* @__PURE__ */ React.createElement(
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
"
|
|
147
|
-
|
|
148
|
-
if (action.action === "clear" && noValueOnClear) {
|
|
149
|
-
model.changeValueTo([], void 0, true);
|
|
150
|
-
}
|
|
151
|
-
setUncommittedValue(newValue.map((x) => x.value));
|
|
144
|
+
return /* @__PURE__ */ React.createElement(MultiSelect, {
|
|
145
|
+
id: key,
|
|
146
|
+
placeholder,
|
|
147
|
+
width: "auto",
|
|
148
|
+
inputValue,
|
|
149
|
+
disabled: isReadOnly,
|
|
150
|
+
value: uncommittedValue,
|
|
151
|
+
noMultiValueWrap: true,
|
|
152
|
+
maxVisibleValues: maxVisibleValues != null ? maxVisibleValues : 5,
|
|
153
|
+
tabSelectsValue: false,
|
|
154
|
+
virtualized: true,
|
|
155
|
+
allowCustomValue,
|
|
156
|
+
toggleAllOptions: {
|
|
157
|
+
enabled: true,
|
|
158
|
+
optionsFilter: filterAll,
|
|
159
|
+
determineToggleAllState
|
|
160
|
+
},
|
|
161
|
+
options: filteredOptions,
|
|
162
|
+
closeMenuOnSelect: false,
|
|
163
|
+
components: { Option: OptionWithCheckbox },
|
|
164
|
+
isClearable: true,
|
|
165
|
+
hideSelectedOptions: false,
|
|
166
|
+
onInputChange,
|
|
167
|
+
onBlur: () => {
|
|
168
|
+
model.changeValueTo(uncommittedValue, void 0, true);
|
|
169
|
+
queryController == null ? void 0 : queryController.startProfile("VariableValueSelectMulti");
|
|
170
|
+
},
|
|
171
|
+
filterOption: filterNoOp,
|
|
172
|
+
"data-testid": selectors.pages.Dashboard.SubMenu.submenuItemValueDropDownValueLinkTexts(`${uncommittedValue}`),
|
|
173
|
+
onChange: (newValue, action) => {
|
|
174
|
+
if (action.action === "clear" && noValueOnClear) {
|
|
175
|
+
model.changeValueTo([], void 0, true);
|
|
152
176
|
}
|
|
177
|
+
setUncommittedValue(newValue.map((x) => x.value));
|
|
153
178
|
}
|
|
154
|
-
);
|
|
179
|
+
});
|
|
155
180
|
}
|
|
156
181
|
const OptionWithCheckbox = ({
|
|
157
182
|
children,
|
|
@@ -163,32 +188,28 @@ const OptionWithCheckbox = ({
|
|
|
163
188
|
indeterminate,
|
|
164
189
|
renderOptionLabel
|
|
165
190
|
}) => {
|
|
166
|
-
var
|
|
167
|
-
const
|
|
191
|
+
var _b;
|
|
192
|
+
const _a = innerProps, rest = __objRest(_a, ["onMouseMove", "onMouseOver"]);
|
|
168
193
|
const theme = useTheme2();
|
|
169
194
|
const selectStyles = getSelectStyles(theme);
|
|
170
195
|
const optionStyles = useStyles2(getOptionStyles);
|
|
171
|
-
return /* @__PURE__ */ React.createElement(
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
(_a = data.label) != null ? _a : String(data.value)
|
|
187
|
-
)
|
|
188
|
-
},
|
|
189
|
-
/* @__PURE__ */ React.createElement("span", null, children)
|
|
196
|
+
return /* @__PURE__ */ React.createElement("div", __spreadProps(__spreadValues({
|
|
197
|
+
ref: innerRef,
|
|
198
|
+
className: cx(selectStyles.option, isFocused && selectStyles.optionFocused)
|
|
199
|
+
}, rest), {
|
|
200
|
+
"data-testid": "data-testid Select option",
|
|
201
|
+
title: data.title
|
|
202
|
+
}), /* @__PURE__ */ React.createElement("div", {
|
|
203
|
+
className: optionStyles.checkbox
|
|
204
|
+
}, /* @__PURE__ */ React.createElement(Checkbox, {
|
|
205
|
+
indeterminate,
|
|
206
|
+
value: isSelected
|
|
207
|
+
})), /* @__PURE__ */ React.createElement("div", {
|
|
208
|
+
className: selectStyles.optionBody,
|
|
209
|
+
"data-testid": selectors.pages.Dashboard.SubMenu.submenuItemValueDropDownOptionTexts(
|
|
210
|
+
(_b = data.label) != null ? _b : String(data.value)
|
|
190
211
|
)
|
|
191
|
-
);
|
|
212
|
+
}, /* @__PURE__ */ React.createElement("span", null, children)));
|
|
192
213
|
};
|
|
193
214
|
OptionWithCheckbox.displayName = "SelectMenuOptions";
|
|
194
215
|
const getOptionStyles = (theme) => ({
|
|
@@ -198,9 +219,13 @@ const getOptionStyles = (theme) => ({
|
|
|
198
219
|
});
|
|
199
220
|
function renderSelectForVariable(model) {
|
|
200
221
|
if (model.state.isMulti) {
|
|
201
|
-
return /* @__PURE__ */ React.createElement(VariableValueSelectMulti, {
|
|
222
|
+
return /* @__PURE__ */ React.createElement(VariableValueSelectMulti, {
|
|
223
|
+
model
|
|
224
|
+
});
|
|
202
225
|
} else {
|
|
203
|
-
return /* @__PURE__ */ React.createElement(VariableValueSelect, {
|
|
226
|
+
return /* @__PURE__ */ React.createElement(VariableValueSelect, {
|
|
227
|
+
model
|
|
228
|
+
});
|
|
204
229
|
}
|
|
205
230
|
}
|
|
206
231
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"VariableValueSelect.js","sources":["../../../../src/variables/components/VariableValueSelect.tsx"],"sourcesContent":["import { isArray } from 'lodash';\nimport React, { RefCallback, useEffect, useMemo, useState } from 'react';\nimport {\n Checkbox,\n InputActionMeta,\n MultiSelect,\n Select,\n ToggleAllState,\n getSelectStyles,\n useStyles2,\n useTheme2,\n} from '@grafana/ui';\n\nimport { SceneComponentProps } from '../../core/types';\nimport { MultiValueVariable } from '../variants/MultiValueVariable';\nimport { VariableValue, VariableValueSingle } from '../types';\nimport { selectors } from '@grafana/e2e-selectors';\nimport { GrafanaTheme2, SelectableValue } from '@grafana/data';\nimport { css, cx } from '@emotion/css';\nimport { getOptionSearcher } from './getOptionSearcher';\nimport { sceneGraph } from '../../core/sceneGraph';\n\nconst filterNoOp = () => true;\n\nconst filterAll = (v: SelectableValue<VariableValueSingle>) => v.value !== '$__all';\n\nconst determineToggleAllState = (\n selectedValues: Array<SelectableValue<VariableValueSingle>>,\n options: Array<SelectableValue<VariableValueSingle>>\n) => {\n if (selectedValues.length === options.filter(filterAll).length) {\n return ToggleAllState.allSelected;\n } else if (\n selectedValues.length === 0 ||\n (selectedValues.length === 1 && selectedValues[0] && selectedValues[0].value === '$__all')\n ) {\n return ToggleAllState.noneSelected;\n } else {\n return ToggleAllState.indeterminate;\n }\n};\n\nexport function toSelectableValue<T>(value: T, label?: string): SelectableValue<T> {\n return {\n value,\n label: label ?? String(value),\n };\n}\n\nexport function VariableValueSelect({ model }: SceneComponentProps<MultiValueVariable>) {\n const { value, text, key, options, includeAll, isReadOnly, allowCustomValue = true } = model.useState();\n const [inputValue, setInputValue] = useState('');\n const [hasCustomValue, setHasCustomValue] = useState(false);\n const selectValue = toSelectableValue(value, String(text));\n const queryController = sceneGraph.getQueryController(model);\n const optionSearcher = useMemo(() => getOptionSearcher(options, includeAll), [options, includeAll]);\n\n const onInputChange = (value: string, { action }: InputActionMeta) => {\n if (action === 'input-change') {\n setInputValue(value);\n if (model.onSearchChange) {\n model.onSearchChange!(value);\n }\n return value;\n }\n\n return value;\n };\n\n const filteredOptions = optionSearcher(inputValue);\n\n const onOpenMenu = () => {\n if (hasCustomValue) {\n setInputValue(String(text));\n }\n };\n\n const onCloseMenu = () => {\n setInputValue('');\n };\n\n return (\n <Select<VariableValue>\n id={key}\n isValidNewOption={(inputValue) => inputValue.trim().length > 0}\n placeholder=\"Select value\"\n width=\"auto\"\n disabled={isReadOnly}\n value={selectValue}\n inputValue={inputValue}\n allowCustomValue={allowCustomValue}\n virtualized\n filterOption={filterNoOp}\n tabSelectsValue={false}\n onInputChange={onInputChange}\n onOpenMenu={onOpenMenu}\n onCloseMenu={onCloseMenu}\n options={filteredOptions}\n data-testid={selectors.pages.Dashboard.SubMenu.submenuItemValueDropDownValueLinkTexts(`${value}`)}\n onChange={(newValue) => {\n model.changeValueTo(newValue.value!, newValue.label!, true);\n queryController?.startProfile('VariableValueSelect');\n\n if (hasCustomValue !== newValue.__isNew__) {\n setHasCustomValue(newValue.__isNew__);\n }\n }}\n />\n );\n}\n\nexport function VariableValueSelectMulti({ model }: SceneComponentProps<MultiValueVariable>) {\n const {\n value,\n options,\n key,\n maxVisibleValues,\n noValueOnClear,\n includeAll,\n isReadOnly,\n allowCustomValue = true,\n } = model.useState();\n const arrayValue = useMemo(() => (isArray(value) ? value : [value]), [value]);\n // To not trigger queries on every selection we store this state locally here and only update the variable onBlur\n const [uncommittedValue, setUncommittedValue] = useState(arrayValue);\n const [inputValue, setInputValue] = useState('');\n const queryController = sceneGraph.getQueryController(model);\n\n const optionSearcher = useMemo(() => getOptionSearcher(options, includeAll), [options, includeAll]);\n\n // Detect value changes outside\n useEffect(() => {\n setUncommittedValue(arrayValue);\n }, [arrayValue]);\n\n const onInputChange = (value: string, { action }: InputActionMeta) => {\n if (action === 'input-change') {\n setInputValue(value);\n if (model.onSearchChange) {\n model.onSearchChange!(value);\n }\n return value;\n }\n\n if (action === 'input-blur') {\n setInputValue('');\n return '';\n }\n\n return inputValue;\n };\n\n const placeholder = options.length > 0 ? 'Select value' : '';\n const filteredOptions = optionSearcher(inputValue);\n\n return (\n <MultiSelect<VariableValueSingle>\n id={key}\n placeholder={placeholder}\n width=\"auto\"\n inputValue={inputValue}\n disabled={isReadOnly}\n value={uncommittedValue}\n noMultiValueWrap={true}\n maxVisibleValues={maxVisibleValues ?? 5}\n tabSelectsValue={false}\n virtualized\n allowCustomValue={allowCustomValue}\n //@ts-ignore\n toggleAllOptions={{\n enabled: true,\n optionsFilter: filterAll,\n determineToggleAllState: determineToggleAllState,\n }}\n options={filteredOptions}\n closeMenuOnSelect={false}\n components={{ Option: OptionWithCheckbox }}\n isClearable={true}\n hideSelectedOptions={false}\n onInputChange={onInputChange}\n onBlur={() => {\n model.changeValueTo(uncommittedValue, undefined, true);\n queryController?.startProfile('VariableValueSelectMulti');\n }}\n filterOption={filterNoOp}\n data-testid={selectors.pages.Dashboard.SubMenu.submenuItemValueDropDownValueLinkTexts(`${uncommittedValue}`)}\n onChange={(newValue, action) => {\n if (action.action === 'clear' && noValueOnClear) {\n model.changeValueTo([], undefined, true);\n }\n setUncommittedValue(newValue.map((x) => x.value!));\n }}\n />\n );\n}\n\ninterface SelectMenuOptionProps<T> {\n isDisabled: boolean;\n isFocused: boolean;\n isSelected: boolean;\n innerProps: JSX.IntrinsicElements['div'];\n innerRef: RefCallback<HTMLDivElement>;\n renderOptionLabel?: (value: SelectableValue<T>) => JSX.Element;\n data: SelectableValue<T>;\n indeterminate: boolean;\n}\n\nexport const OptionWithCheckbox = ({\n children,\n data,\n innerProps,\n innerRef,\n isFocused,\n isSelected,\n indeterminate,\n renderOptionLabel,\n}: React.PropsWithChildren<SelectMenuOptionProps<unknown>>) => {\n // We are removing onMouseMove and onMouseOver from innerProps because they cause the whole\n // list to re-render everytime the user hovers over an option. This is a performance issue.\n // See https://github.com/JedWatson/react-select/issues/3128#issuecomment-451936743\n const { onMouseMove, onMouseOver, ...rest } = innerProps;\n const theme = useTheme2();\n const selectStyles = getSelectStyles(theme);\n const optionStyles = useStyles2(getOptionStyles);\n\n return (\n <div\n ref={innerRef}\n className={cx(selectStyles.option, isFocused && selectStyles.optionFocused)}\n {...rest}\n // TODO: use below selector once we update grafana dependencies to ^11.1.0\n // data-testid={selectors.components.Select.option}\n data-testid=\"data-testid Select option\"\n title={data.title}\n >\n <div className={optionStyles.checkbox}>\n <Checkbox indeterminate={indeterminate} value={isSelected} />\n </div>\n <div\n className={selectStyles.optionBody}\n data-testid={selectors.pages.Dashboard.SubMenu.submenuItemValueDropDownOptionTexts(\n data.label ?? String(data.value)\n )}\n >\n <span>{children}</span>\n </div>\n </div>\n );\n};\n\nOptionWithCheckbox.displayName = 'SelectMenuOptions';\n\nconst getOptionStyles = (theme: GrafanaTheme2) => ({\n checkbox: css({\n marginRight: theme.spacing(2),\n }),\n});\n\nexport function renderSelectForVariable(model: MultiValueVariable) {\n if (model.state.isMulti) {\n return <VariableValueSelectMulti model={model} />;\n } else {\n return <VariableValueSelect model={model} />;\n }\n}\n"],"names":["value","inputValue"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"VariableValueSelect.js","sources":["../../../../src/variables/components/VariableValueSelect.tsx"],"sourcesContent":["import { isArray } from 'lodash';\nimport React, { RefCallback, useEffect, useMemo, useState } from 'react';\nimport {\n Checkbox,\n InputActionMeta,\n MultiSelect,\n Select,\n ToggleAllState,\n getSelectStyles,\n useStyles2,\n useTheme2,\n} from '@grafana/ui';\n\nimport { SceneComponentProps } from '../../core/types';\nimport { MultiValueVariable } from '../variants/MultiValueVariable';\nimport { VariableValue, VariableValueSingle } from '../types';\nimport { selectors } from '@grafana/e2e-selectors';\nimport { GrafanaTheme2, SelectableValue } from '@grafana/data';\nimport { css, cx } from '@emotion/css';\nimport { getOptionSearcher } from './getOptionSearcher';\nimport { sceneGraph } from '../../core/sceneGraph';\n\nconst filterNoOp = () => true;\n\nconst filterAll = (v: SelectableValue<VariableValueSingle>) => v.value !== '$__all';\n\nconst determineToggleAllState = (\n selectedValues: Array<SelectableValue<VariableValueSingle>>,\n options: Array<SelectableValue<VariableValueSingle>>\n) => {\n if (selectedValues.length === options.filter(filterAll).length) {\n return ToggleAllState.allSelected;\n } else if (\n selectedValues.length === 0 ||\n (selectedValues.length === 1 && selectedValues[0] && selectedValues[0].value === '$__all')\n ) {\n return ToggleAllState.noneSelected;\n } else {\n return ToggleAllState.indeterminate;\n }\n};\n\nexport function toSelectableValue<T>(value: T, label?: string): SelectableValue<T> {\n return {\n value,\n label: label ?? String(value),\n };\n}\n\nexport function VariableValueSelect({ model }: SceneComponentProps<MultiValueVariable>) {\n const { value, text, key, options, includeAll, isReadOnly, allowCustomValue = true } = model.useState();\n const [inputValue, setInputValue] = useState('');\n const [hasCustomValue, setHasCustomValue] = useState(false);\n const selectValue = toSelectableValue(value, String(text));\n const queryController = sceneGraph.getQueryController(model);\n const optionSearcher = useMemo(() => getOptionSearcher(options, includeAll), [options, includeAll]);\n\n const onInputChange = (value: string, { action }: InputActionMeta) => {\n if (action === 'input-change') {\n setInputValue(value);\n if (model.onSearchChange) {\n model.onSearchChange!(value);\n }\n return value;\n }\n\n return value;\n };\n\n const filteredOptions = optionSearcher(inputValue);\n\n const onOpenMenu = () => {\n if (hasCustomValue) {\n setInputValue(String(text));\n }\n };\n\n const onCloseMenu = () => {\n setInputValue('');\n };\n\n return (\n <Select<VariableValue>\n id={key}\n isValidNewOption={(inputValue) => inputValue.trim().length > 0}\n placeholder=\"Select value\"\n width=\"auto\"\n disabled={isReadOnly}\n value={selectValue}\n inputValue={inputValue}\n allowCustomValue={allowCustomValue}\n virtualized\n filterOption={filterNoOp}\n tabSelectsValue={false}\n onInputChange={onInputChange}\n onOpenMenu={onOpenMenu}\n onCloseMenu={onCloseMenu}\n options={filteredOptions}\n data-testid={selectors.pages.Dashboard.SubMenu.submenuItemValueDropDownValueLinkTexts(`${value}`)}\n onChange={(newValue) => {\n model.changeValueTo(newValue.value!, newValue.label!, true);\n queryController?.startProfile('VariableValueSelect');\n\n if (hasCustomValue !== newValue.__isNew__) {\n setHasCustomValue(newValue.__isNew__);\n }\n }}\n />\n );\n}\n\nexport function VariableValueSelectMulti({ model }: SceneComponentProps<MultiValueVariable>) {\n const {\n value,\n options,\n key,\n maxVisibleValues,\n noValueOnClear,\n includeAll,\n isReadOnly,\n allowCustomValue = true,\n } = model.useState();\n const arrayValue = useMemo(() => (isArray(value) ? value : [value]), [value]);\n // To not trigger queries on every selection we store this state locally here and only update the variable onBlur\n const [uncommittedValue, setUncommittedValue] = useState(arrayValue);\n const [inputValue, setInputValue] = useState('');\n const queryController = sceneGraph.getQueryController(model);\n\n const optionSearcher = useMemo(() => getOptionSearcher(options, includeAll), [options, includeAll]);\n\n // Detect value changes outside\n useEffect(() => {\n setUncommittedValue(arrayValue);\n }, [arrayValue]);\n\n const onInputChange = (value: string, { action }: InputActionMeta) => {\n if (action === 'input-change') {\n setInputValue(value);\n if (model.onSearchChange) {\n model.onSearchChange!(value);\n }\n return value;\n }\n\n if (action === 'input-blur') {\n setInputValue('');\n return '';\n }\n\n return inputValue;\n };\n\n const placeholder = options.length > 0 ? 'Select value' : '';\n const filteredOptions = optionSearcher(inputValue);\n\n return (\n <MultiSelect<VariableValueSingle>\n id={key}\n placeholder={placeholder}\n width=\"auto\"\n inputValue={inputValue}\n disabled={isReadOnly}\n value={uncommittedValue}\n noMultiValueWrap={true}\n maxVisibleValues={maxVisibleValues ?? 5}\n tabSelectsValue={false}\n virtualized\n allowCustomValue={allowCustomValue}\n //@ts-ignore\n toggleAllOptions={{\n enabled: true,\n optionsFilter: filterAll,\n determineToggleAllState: determineToggleAllState,\n }}\n options={filteredOptions}\n closeMenuOnSelect={false}\n components={{ Option: OptionWithCheckbox }}\n isClearable={true}\n hideSelectedOptions={false}\n onInputChange={onInputChange}\n onBlur={() => {\n model.changeValueTo(uncommittedValue, undefined, true);\n queryController?.startProfile('VariableValueSelectMulti');\n }}\n filterOption={filterNoOp}\n data-testid={selectors.pages.Dashboard.SubMenu.submenuItemValueDropDownValueLinkTexts(`${uncommittedValue}`)}\n onChange={(newValue, action) => {\n if (action.action === 'clear' && noValueOnClear) {\n model.changeValueTo([], undefined, true);\n }\n setUncommittedValue(newValue.map((x) => x.value!));\n }}\n />\n );\n}\n\ninterface SelectMenuOptionProps<T> {\n isDisabled: boolean;\n isFocused: boolean;\n isSelected: boolean;\n innerProps: JSX.IntrinsicElements['div'];\n innerRef: RefCallback<HTMLDivElement>;\n renderOptionLabel?: (value: SelectableValue<T>) => JSX.Element;\n data: SelectableValue<T>;\n indeterminate: boolean;\n}\n\nexport const OptionWithCheckbox = ({\n children,\n data,\n innerProps,\n innerRef,\n isFocused,\n isSelected,\n indeterminate,\n renderOptionLabel,\n}: React.PropsWithChildren<SelectMenuOptionProps<unknown>>) => {\n // We are removing onMouseMove and onMouseOver from innerProps because they cause the whole\n // list to re-render everytime the user hovers over an option. This is a performance issue.\n // See https://github.com/JedWatson/react-select/issues/3128#issuecomment-451936743\n const { onMouseMove, onMouseOver, ...rest } = innerProps;\n const theme = useTheme2();\n const selectStyles = getSelectStyles(theme);\n const optionStyles = useStyles2(getOptionStyles);\n\n return (\n <div\n ref={innerRef}\n className={cx(selectStyles.option, isFocused && selectStyles.optionFocused)}\n {...rest}\n // TODO: use below selector once we update grafana dependencies to ^11.1.0\n // data-testid={selectors.components.Select.option}\n data-testid=\"data-testid Select option\"\n title={data.title}\n >\n <div className={optionStyles.checkbox}>\n <Checkbox indeterminate={indeterminate} value={isSelected} />\n </div>\n <div\n className={selectStyles.optionBody}\n data-testid={selectors.pages.Dashboard.SubMenu.submenuItemValueDropDownOptionTexts(\n data.label ?? String(data.value)\n )}\n >\n <span>{children}</span>\n </div>\n </div>\n );\n};\n\nOptionWithCheckbox.displayName = 'SelectMenuOptions';\n\nconst getOptionStyles = (theme: GrafanaTheme2) => ({\n checkbox: css({\n marginRight: theme.spacing(2),\n }),\n});\n\nexport function renderSelectForVariable(model: MultiValueVariable) {\n if (model.state.isMulti) {\n return <VariableValueSelectMulti model={model} />;\n } else {\n return <VariableValueSelect model={model} />;\n }\n}\n"],"names":["value","inputValue"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsBA,MAAM,aAAa,MAAM,IAAA,CAAA;AAEzB,MAAM,SAAY,GAAA,CAAC,CAA4C,KAAA,CAAA,CAAE,KAAU,KAAA,QAAA,CAAA;AAE3E,MAAM,uBAAA,GAA0B,CAC9B,cAAA,EACA,OACG,KAAA;AACH,EAAA,IAAI,eAAe,MAAW,KAAA,OAAA,CAAQ,MAAO,CAAA,SAAS,EAAE,MAAQ,EAAA;AAC9D,IAAA,OAAO,cAAe,CAAA,WAAA,CAAA;AAAA,GAEtB,MAAA,IAAA,cAAA,CAAe,MAAW,KAAA,CAAA,IACzB,cAAe,CAAA,MAAA,KAAW,CAAK,IAAA,cAAA,CAAe,CAAM,CAAA,IAAA,cAAA,CAAe,CAAG,CAAA,CAAA,KAAA,KAAU,QACjF,EAAA;AACA,IAAA,OAAO,cAAe,CAAA,YAAA,CAAA;AAAA,GACjB,MAAA;AACL,IAAA,OAAO,cAAe,CAAA,aAAA,CAAA;AAAA,GACxB;AACF,CAAA,CAAA;AAEgB,SAAA,iBAAA,CAAqB,OAAU,KAAoC,EAAA;AACjF,EAAO,OAAA;AAAA,IACL,KAAA;AAAA,IACA,KAAA,EAAO,KAAS,IAAA,IAAA,GAAA,KAAA,GAAA,MAAA,CAAO,KAAK,CAAA;AAAA,GAC9B,CAAA;AACF,CAAA;AAEgB,SAAA,mBAAA,CAAoB,EAAE,KAAA,EAAkD,EAAA;AACtF,EAAM,MAAA,EAAE,KAAO,EAAA,IAAA,EAAM,GAAK,EAAA,OAAA,EAAS,UAAY,EAAA,UAAA,EAAY,gBAAmB,GAAA,IAAA,EAAS,GAAA,KAAA,CAAM,QAAS,EAAA,CAAA;AACtG,EAAA,MAAM,CAAC,UAAA,EAAY,aAAa,CAAA,GAAI,SAAS,EAAE,CAAA,CAAA;AAC/C,EAAA,MAAM,CAAC,cAAA,EAAgB,iBAAiB,CAAA,GAAI,SAAS,KAAK,CAAA,CAAA;AAC1D,EAAA,MAAM,WAAc,GAAA,iBAAA,CAAkB,KAAO,EAAA,MAAA,CAAO,IAAI,CAAC,CAAA,CAAA;AACzD,EAAM,MAAA,eAAA,GAAkB,UAAW,CAAA,kBAAA,CAAmB,KAAK,CAAA,CAAA;AAC3D,EAAM,MAAA,cAAA,GAAiB,OAAQ,CAAA,MAAM,iBAAkB,CAAA,OAAA,EAAS,UAAU,CAAG,EAAA,CAAC,OAAS,EAAA,UAAU,CAAC,CAAA,CAAA;AAElG,EAAA,MAAM,aAAgB,GAAA,CAACA,MAAe,EAAA,EAAE,QAA8B,KAAA;AACpE,IAAA,IAAI,WAAW,cAAgB,EAAA;AAC7B,MAAA,aAAA,CAAcA,MAAK,CAAA,CAAA;AACnB,MAAA,IAAI,MAAM,cAAgB,EAAA;AACxB,QAAA,KAAA,CAAM,eAAgBA,MAAK,CAAA,CAAA;AAAA,OAC7B;AACA,MAAOA,OAAAA,MAAAA,CAAAA;AAAA,KACT;AAEA,IAAOA,OAAAA,MAAAA,CAAAA;AAAA,GACT,CAAA;AAEA,EAAM,MAAA,eAAA,GAAkB,eAAe,UAAU,CAAA,CAAA;AAEjD,EAAA,MAAM,aAAa,MAAM;AACvB,IAAA,IAAI,cAAgB,EAAA;AAClB,MAAc,aAAA,CAAA,MAAA,CAAO,IAAI,CAAC,CAAA,CAAA;AAAA,KAC5B;AAAA,GACF,CAAA;AAEA,EAAA,MAAM,cAAc,MAAM;AACxB,IAAA,aAAA,CAAc,EAAE,CAAA,CAAA;AAAA,GAClB,CAAA;AAEA,EAAA,uBACG,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA;AAAA,IACC,EAAI,EAAA,GAAA;AAAA,IACJ,kBAAkB,CAACC,WAAAA,KAAeA,WAAW,CAAA,IAAA,GAAO,MAAS,GAAA,CAAA;AAAA,IAC7D,WAAY,EAAA,cAAA;AAAA,IACZ,KAAM,EAAA,MAAA;AAAA,IACN,QAAU,EAAA,UAAA;AAAA,IACV,KAAO,EAAA,WAAA;AAAA,IACP,UAAA;AAAA,IACA,gBAAA;AAAA,IACA,WAAW,EAAA,IAAA;AAAA,IACX,YAAc,EAAA,UAAA;AAAA,IACd,eAAiB,EAAA,KAAA;AAAA,IACjB,aAAA;AAAA,IACA,UAAA;AAAA,IACA,WAAA;AAAA,IACA,OAAS,EAAA,eAAA;AAAA,IACT,eAAa,SAAU,CAAA,KAAA,CAAM,UAAU,OAAQ,CAAA,sCAAA,CAAuC,GAAG,KAAO,CAAA,CAAA,CAAA;AAAA,IAChG,QAAA,EAAU,CAAC,QAAa,KAAA;AACtB,MAAA,KAAA,CAAM,aAAc,CAAA,QAAA,CAAS,KAAQ,EAAA,QAAA,CAAS,OAAQ,IAAI,CAAA,CAAA;AAC1D,MAAA,eAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,eAAA,CAAiB,YAAa,CAAA,qBAAA,CAAA,CAAA;AAE9B,MAAI,IAAA,cAAA,KAAmB,SAAS,SAAW,EAAA;AACzC,QAAA,iBAAA,CAAkB,SAAS,SAAS,CAAA,CAAA;AAAA,OACtC;AAAA,KACF;AAAA,GACF,CAAA,CAAA;AAEJ,CAAA;AAEgB,SAAA,wBAAA,CAAyB,EAAE,KAAA,EAAkD,EAAA;AAC3F,EAAM,MAAA;AAAA,IACJ,KAAA;AAAA,IACA,OAAA;AAAA,IACA,GAAA;AAAA,IACA,gBAAA;AAAA,IACA,cAAA;AAAA,IACA,UAAA;AAAA,IACA,UAAA;AAAA,IACA,gBAAmB,GAAA,IAAA;AAAA,GACrB,GAAI,MAAM,QAAS,EAAA,CAAA;AACnB,EAAA,MAAM,UAAa,GAAA,OAAA,CAAQ,MAAO,OAAA,CAAQ,KAAK,CAAA,GAAI,KAAQ,GAAA,CAAC,KAAK,CAAA,EAAI,CAAC,KAAK,CAAC,CAAA,CAAA;AAE5E,EAAA,MAAM,CAAC,gBAAA,EAAkB,mBAAmB,CAAA,GAAI,SAAS,UAAU,CAAA,CAAA;AACnE,EAAA,MAAM,CAAC,UAAA,EAAY,aAAa,CAAA,GAAI,SAAS,EAAE,CAAA,CAAA;AAC/C,EAAM,MAAA,eAAA,GAAkB,UAAW,CAAA,kBAAA,CAAmB,KAAK,CAAA,CAAA;AAE3D,EAAM,MAAA,cAAA,GAAiB,OAAQ,CAAA,MAAM,iBAAkB,CAAA,OAAA,EAAS,UAAU,CAAG,EAAA,CAAC,OAAS,EAAA,UAAU,CAAC,CAAA,CAAA;AAGlG,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,mBAAA,CAAoB,UAAU,CAAA,CAAA;AAAA,GAChC,EAAG,CAAC,UAAU,CAAC,CAAA,CAAA;AAEf,EAAA,MAAM,aAAgB,GAAA,CAACD,MAAe,EAAA,EAAE,QAA8B,KAAA;AACpE,IAAA,IAAI,WAAW,cAAgB,EAAA;AAC7B,MAAA,aAAA,CAAcA,MAAK,CAAA,CAAA;AACnB,MAAA,IAAI,MAAM,cAAgB,EAAA;AACxB,QAAA,KAAA,CAAM,eAAgBA,MAAK,CAAA,CAAA;AAAA,OAC7B;AACA,MAAOA,OAAAA,MAAAA,CAAAA;AAAA,KACT;AAEA,IAAA,IAAI,WAAW,YAAc,EAAA;AAC3B,MAAA,aAAA,CAAc,EAAE,CAAA,CAAA;AAChB,MAAO,OAAA,EAAA,CAAA;AAAA,KACT;AAEA,IAAO,OAAA,UAAA,CAAA;AAAA,GACT,CAAA;AAEA,EAAA,MAAM,WAAc,GAAA,OAAA,CAAQ,MAAS,GAAA,CAAA,GAAI,cAAiB,GAAA,EAAA,CAAA;AAC1D,EAAM,MAAA,eAAA,GAAkB,eAAe,UAAU,CAAA,CAAA;AAEjD,EAAA,uBACG,KAAA,CAAA,aAAA,CAAA,WAAA,EAAA;AAAA,IACC,EAAI,EAAA,GAAA;AAAA,IACJ,WAAA;AAAA,IACA,KAAM,EAAA,MAAA;AAAA,IACN,UAAA;AAAA,IACA,QAAU,EAAA,UAAA;AAAA,IACV,KAAO,EAAA,gBAAA;AAAA,IACP,gBAAkB,EAAA,IAAA;AAAA,IAClB,kBAAkB,gBAAoB,IAAA,IAAA,GAAA,gBAAA,GAAA,CAAA;AAAA,IACtC,eAAiB,EAAA,KAAA;AAAA,IACjB,WAAW,EAAA,IAAA;AAAA,IACX,gBAAA;AAAA,IAEA,gBAAkB,EAAA;AAAA,MAChB,OAAS,EAAA,IAAA;AAAA,MACT,aAAe,EAAA,SAAA;AAAA,MACf,uBAAA;AAAA,KACF;AAAA,IACA,OAAS,EAAA,eAAA;AAAA,IACT,iBAAmB,EAAA,KAAA;AAAA,IACnB,UAAA,EAAY,EAAE,MAAA,EAAQ,kBAAmB,EAAA;AAAA,IACzC,WAAa,EAAA,IAAA;AAAA,IACb,mBAAqB,EAAA,KAAA;AAAA,IACrB,aAAA;AAAA,IACA,QAAQ,MAAM;AACZ,MAAM,KAAA,CAAA,aAAA,CAAc,gBAAkB,EAAA,KAAA,CAAA,EAAW,IAAI,CAAA,CAAA;AACrD,MAAA,eAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,eAAA,CAAiB,YAAa,CAAA,0BAAA,CAAA,CAAA;AAAA,KAChC;AAAA,IACA,YAAc,EAAA,UAAA;AAAA,IACd,eAAa,SAAU,CAAA,KAAA,CAAM,UAAU,OAAQ,CAAA,sCAAA,CAAuC,GAAG,gBAAkB,CAAA,CAAA,CAAA;AAAA,IAC3G,QAAA,EAAU,CAAC,QAAA,EAAU,MAAW,KAAA;AAC9B,MAAI,IAAA,MAAA,CAAO,MAAW,KAAA,OAAA,IAAW,cAAgB,EAAA;AAC/C,QAAA,KAAA,CAAM,aAAc,CAAA,EAAI,EAAA,KAAA,CAAA,EAAW,IAAI,CAAA,CAAA;AAAA,OACzC;AACA,MAAA,mBAAA,CAAoB,SAAS,GAAI,CAAA,CAAC,CAAM,KAAA,CAAA,CAAE,KAAM,CAAC,CAAA,CAAA;AAAA,KACnD;AAAA,GACF,CAAA,CAAA;AAEJ,CAAA;AAaO,MAAM,qBAAqB,CAAC;AAAA,EACjC,QAAA;AAAA,EACA,IAAA;AAAA,EACA,UAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA;AAAA,EACA,UAAA;AAAA,EACA,aAAA;AAAA,EACA,iBAAA;AACF,CAA+D,KAAA;AAxN/D,EAAA,IAAA,EAAA,CAAA;AA4NE,EAA8C,MAAA,EAAA,GAAA,UAAA,CAAA,CAAT,IAAS,GAAA,SAAA,CAAA,EAAA,EAAT,CAA7B,aAAa,EAAA,aAAA,CAAA,EAAA;AACrB,EAAA,MAAM,QAAQ,SAAU,EAAA,CAAA;AACxB,EAAM,MAAA,YAAA,GAAe,gBAAgB,KAAK,CAAA,CAAA;AAC1C,EAAM,MAAA,YAAA,GAAe,WAAW,eAAe,CAAA,CAAA;AAE/C,EAAA,uBACG,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,aAAA,CAAA,cAAA,CAAA;AAAA,IACC,GAAK,EAAA,QAAA;AAAA,IACL,WAAW,EAAG,CAAA,YAAA,CAAa,MAAQ,EAAA,SAAA,IAAa,aAAa,aAAa,CAAA;AAAA,GAAA,EACtE,IAHL,CAAA,EAAA;AAAA,IAMC,aAAY,EAAA,2BAAA;AAAA,IACZ,OAAO,IAAK,CAAA,KAAA;AAAA,GAAA,CAAA,kBAEX,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAA,IAAI,WAAW,YAAa,CAAA,QAAA;AAAA,GAAA,kBAC1B,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA;AAAA,IAAS,aAAA;AAAA,IAA8B,KAAO,EAAA,UAAA;AAAA,GAAY,CAC7D,mBACC,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAA,IACC,WAAW,YAAa,CAAA,UAAA;AAAA,IACxB,aAAa,EAAA,SAAA,CAAU,KAAM,CAAA,SAAA,CAAU,OAAQ,CAAA,mCAAA;AAAA,MAAA,CAC7C,EAAK,GAAA,IAAA,CAAA,KAAA,KAAL,IAAc,GAAA,EAAA,GAAA,MAAA,CAAO,KAAK,KAAK,CAAA;AAAA,KACjC;AAAA,GAAA,kBAEC,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,IAAA,EAAM,QAAS,CAClB,CACF,CAAA,CAAA;AAEJ,EAAA;AAEA,kBAAA,CAAmB,WAAc,GAAA,mBAAA,CAAA;AAEjC,MAAM,eAAA,GAAkB,CAAC,KAA0B,MAAA;AAAA,EACjD,UAAU,GAAI,CAAA;AAAA,IACZ,WAAA,EAAa,KAAM,CAAA,OAAA,CAAQ,CAAC,CAAA;AAAA,GAC7B,CAAA;AACH,CAAA,CAAA,CAAA;AAEO,SAAS,wBAAwB,KAA2B,EAAA;AACjE,EAAI,IAAA,KAAA,CAAM,MAAM,OAAS,EAAA;AACvB,IAAA,uBAAQ,KAAA,CAAA,aAAA,CAAA,wBAAA,EAAA;AAAA,MAAyB,KAAA;AAAA,KAAc,CAAA,CAAA;AAAA,GAC1C,MAAA;AACL,IAAA,uBAAQ,KAAA,CAAA,aAAA,CAAA,mBAAA,EAAA;AAAA,MAAoB,KAAA;AAAA,KAAc,CAAA,CAAA;AAAA,GAC5C;AACF;;;;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { VariableHide } from '@grafana/data';
|
|
3
|
-
import {
|
|
3
|
+
import { SceneObjectBase, useSceneObjectState } from '../../core/SceneObjectBase.js';
|
|
4
4
|
import { sceneGraph } from '../../core/sceneGraph/index.js';
|
|
5
5
|
import { ControlsLabel } from '../../utils/ControlsLabel.js';
|
|
6
6
|
import { css } from '@emotion/css';
|
|
@@ -11,7 +11,11 @@ class VariableValueSelectors extends SceneObjectBase {
|
|
|
11
11
|
VariableValueSelectors.Component = VariableValueSelectorsRenderer;
|
|
12
12
|
function VariableValueSelectorsRenderer({ model }) {
|
|
13
13
|
const variables = sceneGraph.getVariables(model).useState();
|
|
14
|
-
return /* @__PURE__ */ React.createElement(React.Fragment, null, variables.variables.map((variable) => /* @__PURE__ */ React.createElement(VariableValueSelectWrapper, {
|
|
14
|
+
return /* @__PURE__ */ React.createElement(React.Fragment, null, variables.variables.map((variable) => /* @__PURE__ */ React.createElement(VariableValueSelectWrapper, {
|
|
15
|
+
key: variable.state.key,
|
|
16
|
+
variable,
|
|
17
|
+
layout: model.state.layout
|
|
18
|
+
})));
|
|
15
19
|
}
|
|
16
20
|
function VariableValueSelectWrapper({ variable, layout, showAlways, hideLabel }) {
|
|
17
21
|
const state = useSceneObjectState(variable, { shouldActivateOrKeepAlive: true });
|
|
@@ -19,9 +23,26 @@ function VariableValueSelectWrapper({ variable, layout, showAlways, hideLabel })
|
|
|
19
23
|
return null;
|
|
20
24
|
}
|
|
21
25
|
if (layout === "vertical") {
|
|
22
|
-
return /* @__PURE__ */ React.createElement("div", {
|
|
26
|
+
return /* @__PURE__ */ React.createElement("div", {
|
|
27
|
+
className: verticalContainer,
|
|
28
|
+
"data-testid": selectors.pages.Dashboard.SubMenu.submenuItem
|
|
29
|
+
}, /* @__PURE__ */ React.createElement(VariableLabel, {
|
|
30
|
+
variable,
|
|
31
|
+
layout,
|
|
32
|
+
hideLabel
|
|
33
|
+
}), /* @__PURE__ */ React.createElement(variable.Component, {
|
|
34
|
+
model: variable
|
|
35
|
+
}));
|
|
23
36
|
}
|
|
24
|
-
return /* @__PURE__ */ React.createElement("div", {
|
|
37
|
+
return /* @__PURE__ */ React.createElement("div", {
|
|
38
|
+
className: containerStyle,
|
|
39
|
+
"data-testid": selectors.pages.Dashboard.SubMenu.submenuItem
|
|
40
|
+
}, /* @__PURE__ */ React.createElement(VariableLabel, {
|
|
41
|
+
variable,
|
|
42
|
+
hideLabel
|
|
43
|
+
}), /* @__PURE__ */ React.createElement(variable.Component, {
|
|
44
|
+
model: variable
|
|
45
|
+
}));
|
|
25
46
|
}
|
|
26
47
|
function VariableLabel({ variable, layout, hideLabel }) {
|
|
27
48
|
var _a;
|
|
@@ -31,25 +52,21 @@ function VariableLabel({ variable, layout, hideLabel }) {
|
|
|
31
52
|
}
|
|
32
53
|
const elementId = `var-${state.key}`;
|
|
33
54
|
const labelOrName = state.label || state.name;
|
|
34
|
-
return /* @__PURE__ */ React.createElement(
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
onCancel: ()
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
description: (_a = state.description) != null ? _a : void 0
|
|
47
|
-
}
|
|
48
|
-
);
|
|
55
|
+
return /* @__PURE__ */ React.createElement(ControlsLabel, {
|
|
56
|
+
htmlFor: elementId,
|
|
57
|
+
isLoading: state.loading,
|
|
58
|
+
onCancel: () => {
|
|
59
|
+
var _a2;
|
|
60
|
+
return (_a2 = variable.onCancel) == null ? void 0 : _a2.call(variable);
|
|
61
|
+
},
|
|
62
|
+
label: labelOrName,
|
|
63
|
+
error: state.error,
|
|
64
|
+
layout,
|
|
65
|
+
description: (_a = state.description) != null ? _a : void 0
|
|
66
|
+
});
|
|
49
67
|
}
|
|
50
68
|
const containerStyle = css({
|
|
51
69
|
display: "flex",
|
|
52
|
-
// No border for second element (inputs) as label and input border is shared
|
|
53
70
|
"> :nth-child(2)": css({
|
|
54
71
|
borderTopLeftRadius: 0,
|
|
55
72
|
borderBottomLeftRadius: 0
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"VariableValueSelectors.js","sources":["../../../../src/variables/components/VariableValueSelectors.tsx"],"sourcesContent":["import React from 'react';\n\nimport { VariableHide } from '@grafana/data';\n\nimport { SceneObjectBase, useSceneObjectState } from '../../core/SceneObjectBase';\nimport { sceneGraph } from '../../core/sceneGraph';\nimport { ControlsLayout, SceneComponentProps, SceneObjectState } from '../../core/types';\nimport { SceneVariable, SceneVariableState } from '../types';\nimport { ControlsLabel } from '../../utils/ControlsLabel';\nimport { css } from '@emotion/css';\nimport { selectors } from '@grafana/e2e-selectors';\n\nexport interface VariableValueSelectorsState extends SceneObjectState {\n layout?: ControlsLayout;\n}\n\nexport class VariableValueSelectors extends SceneObjectBase<VariableValueSelectorsState> {\n public static Component = VariableValueSelectorsRenderer;\n}\n\nfunction VariableValueSelectorsRenderer({ model }: SceneComponentProps<VariableValueSelectors>) {\n const variables = sceneGraph.getVariables(model)!.useState();\n\n return (\n <>\n {variables.variables.map((variable) => (\n <VariableValueSelectWrapper key={variable.state.key} variable={variable} layout={model.state.layout} />\n ))}\n </>\n );\n}\n\ninterface VariableSelectProps {\n layout?: ControlsLayout;\n variable: SceneVariable;\n /** To override hide from VariableValueSelectByName */\n showAlways?: boolean;\n /** To provide an option to hide the label in the variable value selector */\n hideLabel?: boolean;\n}\n\nexport function VariableValueSelectWrapper({ variable, layout, showAlways, hideLabel }: VariableSelectProps) {\n const state = useSceneObjectState<SceneVariableState>(variable, { shouldActivateOrKeepAlive: true });\n\n if (state.hide === VariableHide.hideVariable && !showAlways) {\n return null;\n }\n\n if (layout === 'vertical') {\n return (\n <div className={verticalContainer} data-testid={selectors.pages.Dashboard.SubMenu.submenuItem}>\n <VariableLabel variable={variable} layout={layout} hideLabel={hideLabel} />\n <variable.Component model={variable} />\n </div>\n );\n }\n\n return (\n <div className={containerStyle} data-testid={selectors.pages.Dashboard.SubMenu.submenuItem}>\n <VariableLabel variable={variable} hideLabel={hideLabel} />\n <variable.Component model={variable} />\n </div>\n );\n}\n\nfunction VariableLabel({ variable, layout, hideLabel }: VariableSelectProps) {\n const { state } = variable;\n\n if (variable.state.hide === VariableHide.hideLabel || hideLabel) {\n return null;\n }\n\n const elementId = `var-${state.key}`;\n const labelOrName = state.label || state.name;\n\n return (\n <ControlsLabel\n htmlFor={elementId}\n isLoading={state.loading}\n onCancel={() => variable.onCancel?.()}\n label={labelOrName}\n error={state.error}\n layout={layout}\n description={state.description ?? undefined}\n />\n );\n}\n\nconst containerStyle = css({\n display: 'flex',\n // No border for second element (inputs) as label and input border is shared\n '> :nth-child(2)': css({\n borderTopLeftRadius: 0,\n borderBottomLeftRadius: 0,\n }),\n});\n\nconst verticalContainer = css({ display: 'flex', flexDirection: 'column' });\n"],"names":["_a"],"mappings":";;;;;;;;AAgBO,MAAM,+BAA+B,eAA6C,CAAA;AAEzF;AAFa,sBAAA,CACG,SAAY,GAAA,8BAAA;AAG5B,SAAS,8BAAA,CAA+B,EAAE,KAAA,EAAsD,EAAA;AAC9F,EAAA,MAAM,SAAY,GAAA,UAAA,CAAW,YAAa,CAAA,KAAK,EAAG,QAAS,EAAA;AAE3D,EAAA,iEAEK,SAAU,CAAA,SAAA,CAAU,
|
|
1
|
+
{"version":3,"file":"VariableValueSelectors.js","sources":["../../../../src/variables/components/VariableValueSelectors.tsx"],"sourcesContent":["import React from 'react';\n\nimport { VariableHide } from '@grafana/data';\n\nimport { SceneObjectBase, useSceneObjectState } from '../../core/SceneObjectBase';\nimport { sceneGraph } from '../../core/sceneGraph';\nimport { ControlsLayout, SceneComponentProps, SceneObjectState } from '../../core/types';\nimport { SceneVariable, SceneVariableState } from '../types';\nimport { ControlsLabel } from '../../utils/ControlsLabel';\nimport { css } from '@emotion/css';\nimport { selectors } from '@grafana/e2e-selectors';\n\nexport interface VariableValueSelectorsState extends SceneObjectState {\n layout?: ControlsLayout;\n}\n\nexport class VariableValueSelectors extends SceneObjectBase<VariableValueSelectorsState> {\n public static Component = VariableValueSelectorsRenderer;\n}\n\nfunction VariableValueSelectorsRenderer({ model }: SceneComponentProps<VariableValueSelectors>) {\n const variables = sceneGraph.getVariables(model)!.useState();\n\n return (\n <>\n {variables.variables.map((variable) => (\n <VariableValueSelectWrapper key={variable.state.key} variable={variable} layout={model.state.layout} />\n ))}\n </>\n );\n}\n\ninterface VariableSelectProps {\n layout?: ControlsLayout;\n variable: SceneVariable;\n /** To override hide from VariableValueSelectByName */\n showAlways?: boolean;\n /** To provide an option to hide the label in the variable value selector */\n hideLabel?: boolean;\n}\n\nexport function VariableValueSelectWrapper({ variable, layout, showAlways, hideLabel }: VariableSelectProps) {\n const state = useSceneObjectState<SceneVariableState>(variable, { shouldActivateOrKeepAlive: true });\n\n if (state.hide === VariableHide.hideVariable && !showAlways) {\n return null;\n }\n\n if (layout === 'vertical') {\n return (\n <div className={verticalContainer} data-testid={selectors.pages.Dashboard.SubMenu.submenuItem}>\n <VariableLabel variable={variable} layout={layout} hideLabel={hideLabel} />\n <variable.Component model={variable} />\n </div>\n );\n }\n\n return (\n <div className={containerStyle} data-testid={selectors.pages.Dashboard.SubMenu.submenuItem}>\n <VariableLabel variable={variable} hideLabel={hideLabel} />\n <variable.Component model={variable} />\n </div>\n );\n}\n\nfunction VariableLabel({ variable, layout, hideLabel }: VariableSelectProps) {\n const { state } = variable;\n\n if (variable.state.hide === VariableHide.hideLabel || hideLabel) {\n return null;\n }\n\n const elementId = `var-${state.key}`;\n const labelOrName = state.label || state.name;\n\n return (\n <ControlsLabel\n htmlFor={elementId}\n isLoading={state.loading}\n onCancel={() => variable.onCancel?.()}\n label={labelOrName}\n error={state.error}\n layout={layout}\n description={state.description ?? undefined}\n />\n );\n}\n\nconst containerStyle = css({\n display: 'flex',\n // No border for second element (inputs) as label and input border is shared\n '> :nth-child(2)': css({\n borderTopLeftRadius: 0,\n borderBottomLeftRadius: 0,\n }),\n});\n\nconst verticalContainer = css({ display: 'flex', flexDirection: 'column' });\n"],"names":["_a"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"getOptionSearcher.js","sources":["../../../../src/variables/components/getOptionSearcher.ts"],"sourcesContent":["import { VariableValueOption } from '../types';\nimport { ALL_VARIABLE_TEXT, ALL_VARIABLE_VALUE } from '../constants';\nimport { fuzzyFind } from '../filter';\n\nexport function getOptionSearcher(options: VariableValueOption[], includeAll = false) {\n let allOptions = options;\n\n if (includeAll) {\n allOptions = [{ value: ALL_VARIABLE_VALUE, label: ALL_VARIABLE_TEXT }, ...allOptions];\n }\n\n const haystack = allOptions.map((o) => o.label);\n\n return (search: string) => fuzzyFind<VariableValueOption>(allOptions, haystack, search);\n}\n"],"names":[],"mappings":";;;AAIgB,SAAA,iBAAA,CAAkB,OAAgC,EAAA,UAAA,GAAa,KAAO,EAAA;AACpF,EAAA,IAAI,UAAa,GAAA,OAAA;AAEjB,EAAA,IAAI,UAAY,EAAA;AACd,IAAa,UAAA,GAAA,CAAC,EAAE,KAAO,EAAA,kBAAA,EAAoB,OAAO,iBAAkB,EAAA,EAAG,GAAG,UAAU,CAAA;AAAA;
|
|
1
|
+
{"version":3,"file":"getOptionSearcher.js","sources":["../../../../src/variables/components/getOptionSearcher.ts"],"sourcesContent":["import { VariableValueOption } from '../types';\nimport { ALL_VARIABLE_TEXT, ALL_VARIABLE_VALUE } from '../constants';\nimport { fuzzyFind } from '../filter';\n\nexport function getOptionSearcher(options: VariableValueOption[], includeAll = false) {\n let allOptions = options;\n\n if (includeAll) {\n allOptions = [{ value: ALL_VARIABLE_VALUE, label: ALL_VARIABLE_TEXT }, ...allOptions];\n }\n\n const haystack = allOptions.map((o) => o.label);\n\n return (search: string) => fuzzyFind<VariableValueOption>(allOptions, haystack, search);\n}\n"],"names":[],"mappings":";;;AAIgB,SAAA,iBAAA,CAAkB,OAAgC,EAAA,UAAA,GAAa,KAAO,EAAA;AACpF,EAAA,IAAI,UAAa,GAAA,OAAA,CAAA;AAEjB,EAAA,IAAI,UAAY,EAAA;AACd,IAAa,UAAA,GAAA,CAAC,EAAE,KAAO,EAAA,kBAAA,EAAoB,OAAO,iBAAkB,EAAA,EAAG,GAAG,UAAU,CAAA,CAAA;AAAA,GACtF;AAEA,EAAA,MAAM,WAAW,UAAW,CAAA,GAAA,CAAI,CAAC,CAAA,KAAM,EAAE,KAAK,CAAA,CAAA;AAE9C,EAAA,OAAO,CAAC,MAAA,KAAmB,SAA+B,CAAA,UAAA,EAAY,UAAU,MAAM,CAAA,CAAA;AACxF;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"constants.js","sources":["../../../src/variables/constants.ts"],"sourcesContent":["export const ALL_VARIABLE_TEXT = 'All';\nexport const ALL_VARIABLE_VALUE = '$__all';\nexport const NONE_VARIABLE_TEXT = 'None';\nexport const NONE_VARIABLE_VALUE = '';\nexport const AUTO_VARIABLE_TEXT = 'Auto';\nexport const AUTO_VARIABLE_VALUE = '$__auto';\n\n// Grafana core source: https://github.com/grafana/grafana/blob/main/public/app/features/variables/utils.ts#L23\n/*\n * This regex matches 3 types of variable reference with an optional format specifier\n * \\$(\\w+) $var1\n * \\[\\[(\\w+?)(?::(\\w+))?\\]\\] [[var2]] or [[var2:fmt2]]\n * \\${(\\w+)(?::(\\w+))?} ${var3} or ${var3:fmt3}\n */\nexport const VARIABLE_REGEX = /\\$(\\w+)|\\[\\[(\\w+?)(?::(\\w+))?\\]\\]|\\${(\\w+)(?:\\.([^:^\\}]+))?(?::([^\\}]+))?}/g;\nexport const SEARCH_FILTER_VARIABLE = '__searchFilter';\n"],"names":[],"mappings":"AAAO,MAAM,iBAAoB,GAAA;AAC1B,MAAM,kBAAqB,GAAA;AAG3B,MAAM,kBAAqB,GAAA;AAC3B,MAAM,mBAAsB,GAAA;AAS5B,MAAM,cAAiB,GAAA;AACvB,MAAM,sBAAyB,GAAA;;;;"}
|
|
1
|
+
{"version":3,"file":"constants.js","sources":["../../../src/variables/constants.ts"],"sourcesContent":["export const ALL_VARIABLE_TEXT = 'All';\nexport const ALL_VARIABLE_VALUE = '$__all';\nexport const NONE_VARIABLE_TEXT = 'None';\nexport const NONE_VARIABLE_VALUE = '';\nexport const AUTO_VARIABLE_TEXT = 'Auto';\nexport const AUTO_VARIABLE_VALUE = '$__auto';\n\n// Grafana core source: https://github.com/grafana/grafana/blob/main/public/app/features/variables/utils.ts#L23\n/*\n * This regex matches 3 types of variable reference with an optional format specifier\n * \\$(\\w+) $var1\n * \\[\\[(\\w+?)(?::(\\w+))?\\]\\] [[var2]] or [[var2:fmt2]]\n * \\${(\\w+)(?::(\\w+))?} ${var3} or ${var3:fmt3}\n */\nexport const VARIABLE_REGEX = /\\$(\\w+)|\\[\\[(\\w+?)(?::(\\w+))?\\]\\]|\\${(\\w+)(?:\\.([^:^\\}]+))?(?::([^\\}]+))?}/g;\nexport const SEARCH_FILTER_VARIABLE = '__searchFilter';\n"],"names":[],"mappings":"AAAO,MAAM,iBAAoB,GAAA,MAAA;AAC1B,MAAM,kBAAqB,GAAA,SAAA;AAG3B,MAAM,kBAAqB,GAAA,OAAA;AAC3B,MAAM,mBAAsB,GAAA,UAAA;AAS5B,MAAM,cAAiB,GAAA,8EAAA;AACvB,MAAM,sBAAyB,GAAA;;;;"}
|
|
@@ -11,12 +11,7 @@ function fuzzyFind(options, haystack, needle) {
|
|
|
11
11
|
let matches = [];
|
|
12
12
|
if (needle === "") {
|
|
13
13
|
matches = options;
|
|
14
|
-
} else if (
|
|
15
|
-
// contains non-ascii
|
|
16
|
-
REGEXP_NON_ASCII.test(needle) || // is only ascii symbols (operators)
|
|
17
|
-
REGEXP_ONLY_SYMBOLS.test(needle) || // too long (often copy-paste from somewhere)
|
|
18
|
-
needle.length > maxNeedleLength || uf.split(needle).length > maxFuzzyTerms
|
|
19
|
-
) {
|
|
14
|
+
} else if (REGEXP_NON_ASCII.test(needle) || REGEXP_ONLY_SYMBOLS.test(needle) || needle.length > maxNeedleLength || uf.split(needle).length > maxFuzzyTerms) {
|
|
20
15
|
for (let i = 0; i < haystack.length; i++) {
|
|
21
16
|
let item = haystack[i];
|
|
22
17
|
if (item.includes(needle)) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"filter.js","sources":["../../../src/variables/filter.ts"],"sourcesContent":["import { SelectableValue } from '@grafana/data';\nimport uFuzzy from '@leeoniya/ufuzzy';\nimport { VariableValueOption } from './types';\n\n// https://catonmat.net/my-favorite-regex :)\nconst REGEXP_NON_ASCII = /[^ -~]/m;\n// https://www.asciitable.com/\n// matches only these: `~!@#$%^&*()_+-=[]\\{}|;':\",./<>?\nconst REGEXP_ONLY_SYMBOLS = /^[\\x21-\\x2F\\x3A-\\x40\\x5B-\\x60\\x7B-\\x7E]+$/m;\n// limit max terms in needle that qualify for re-ordering\nconst outOfOrderLimit = 5;\n// beyond 25 chars fall back to substring search\nconst maxNeedleLength = 25;\n// beyond 5 terms fall back to substring match\nconst maxFuzzyTerms = 5;\n// when number of matches <= 1e4, do ranking + sorting by quality\nconst rankThreshold = 1e4;\n\n// typo tolerance mode\nconst uf = new uFuzzy({ intraMode: 1 });\n\nexport function fuzzyFind<T extends SelectableValue | VariableValueOption>(\n options: T[],\n haystack: string[],\n needle: string\n) {\n let matches: T[] = [];\n\n if (needle === '') {\n matches = options;\n }\n // fallback to substring matches to avoid badness\n else if (\n // contains non-ascii\n REGEXP_NON_ASCII.test(needle) ||\n // is only ascii symbols (operators)\n REGEXP_ONLY_SYMBOLS.test(needle) ||\n // too long (often copy-paste from somewhere)\n needle.length > maxNeedleLength ||\n uf.split(needle).length > maxFuzzyTerms\n ) {\n for (let i = 0; i < haystack.length; i++) {\n let item = haystack[i];\n\n if (item.includes(needle)) {\n matches.push(options[i]);\n }\n }\n }\n // fuzzy search\n else {\n const [idxs, info, order] = uf.search(haystack, needle, outOfOrderLimit, rankThreshold);\n\n if (idxs?.length) {\n if (info && order) {\n matches = order.map((idx) => options[info.idx[idx]]);\n } else {\n matches = idxs.map((idx) => options[idx]);\n }\n }\n }\n\n return matches;\n}\n"],"names":[],"mappings":";;AAKA,MAAM,gBAAmB,GAAA,SAAA;AAGzB,MAAM,mBAAsB,GAAA,4CAAA;AAE5B,MAAM,eAAkB,GAAA,CAAA;AAExB,MAAM,eAAkB,GAAA,EAAA;AAExB,MAAM,aAAgB,GAAA,CAAA;AAEtB,MAAM,aAAgB,GAAA,GAAA;AAGtB,MAAM,KAAK,IAAI,MAAA,CAAO,EAAE,SAAA,EAAW,GAAG,CAAA;AAEtB,SAAA,SAAA,CACd,OACA,EAAA,QAAA,EACA,MACA,EAAA;AACA,EAAA,IAAI,UAAe,EAAC;AAEpB,EAAA,IAAI,WAAW,EAAI,EAAA;AACjB,IAAU,OAAA,GAAA,OAAA;AAAA,
|
|
1
|
+
{"version":3,"file":"filter.js","sources":["../../../src/variables/filter.ts"],"sourcesContent":["import { SelectableValue } from '@grafana/data';\nimport uFuzzy from '@leeoniya/ufuzzy';\nimport { VariableValueOption } from './types';\n\n// https://catonmat.net/my-favorite-regex :)\nconst REGEXP_NON_ASCII = /[^ -~]/m;\n// https://www.asciitable.com/\n// matches only these: `~!@#$%^&*()_+-=[]\\{}|;':\",./<>?\nconst REGEXP_ONLY_SYMBOLS = /^[\\x21-\\x2F\\x3A-\\x40\\x5B-\\x60\\x7B-\\x7E]+$/m;\n// limit max terms in needle that qualify for re-ordering\nconst outOfOrderLimit = 5;\n// beyond 25 chars fall back to substring search\nconst maxNeedleLength = 25;\n// beyond 5 terms fall back to substring match\nconst maxFuzzyTerms = 5;\n// when number of matches <= 1e4, do ranking + sorting by quality\nconst rankThreshold = 1e4;\n\n// typo tolerance mode\nconst uf = new uFuzzy({ intraMode: 1 });\n\nexport function fuzzyFind<T extends SelectableValue | VariableValueOption>(\n options: T[],\n haystack: string[],\n needle: string\n) {\n let matches: T[] = [];\n\n if (needle === '') {\n matches = options;\n }\n // fallback to substring matches to avoid badness\n else if (\n // contains non-ascii\n REGEXP_NON_ASCII.test(needle) ||\n // is only ascii symbols (operators)\n REGEXP_ONLY_SYMBOLS.test(needle) ||\n // too long (often copy-paste from somewhere)\n needle.length > maxNeedleLength ||\n uf.split(needle).length > maxFuzzyTerms\n ) {\n for (let i = 0; i < haystack.length; i++) {\n let item = haystack[i];\n\n if (item.includes(needle)) {\n matches.push(options[i]);\n }\n }\n }\n // fuzzy search\n else {\n const [idxs, info, order] = uf.search(haystack, needle, outOfOrderLimit, rankThreshold);\n\n if (idxs?.length) {\n if (info && order) {\n matches = order.map((idx) => options[info.idx[idx]]);\n } else {\n matches = idxs.map((idx) => options[idx]);\n }\n }\n }\n\n return matches;\n}\n"],"names":[],"mappings":";;AAKA,MAAM,gBAAmB,GAAA,SAAA,CAAA;AAGzB,MAAM,mBAAsB,GAAA,4CAAA,CAAA;AAE5B,MAAM,eAAkB,GAAA,CAAA,CAAA;AAExB,MAAM,eAAkB,GAAA,EAAA,CAAA;AAExB,MAAM,aAAgB,GAAA,CAAA,CAAA;AAEtB,MAAM,aAAgB,GAAA,GAAA,CAAA;AAGtB,MAAM,KAAK,IAAI,MAAA,CAAO,EAAE,SAAA,EAAW,GAAG,CAAA,CAAA;AAEtB,SAAA,SAAA,CACd,OACA,EAAA,QAAA,EACA,MACA,EAAA;AACA,EAAA,IAAI,UAAe,EAAC,CAAA;AAEpB,EAAA,IAAI,WAAW,EAAI,EAAA;AACjB,IAAU,OAAA,GAAA,OAAA,CAAA;AAAA,aAKV,gBAAiB,CAAA,IAAA,CAAK,MAAM,CAAA,IAE5B,oBAAoB,IAAK,CAAA,MAAM,CAE/B,IAAA,MAAA,CAAO,SAAS,eAChB,IAAA,EAAA,CAAG,MAAM,MAAM,CAAA,CAAE,SAAS,aAC1B,EAAA;AACA,IAAA,KAAA,IAAS,CAAI,GAAA,CAAA,EAAG,CAAI,GAAA,QAAA,CAAS,QAAQ,CAAK,EAAA,EAAA;AACxC,MAAA,IAAI,OAAO,QAAS,CAAA,CAAA,CAAA,CAAA;AAEpB,MAAI,IAAA,IAAA,CAAK,QAAS,CAAA,MAAM,CAAG,EAAA;AACzB,QAAQ,OAAA,CAAA,IAAA,CAAK,QAAQ,CAAE,CAAA,CAAA,CAAA;AAAA,OACzB;AAAA,KACF;AAAA,GAGG,MAAA;AACH,IAAM,MAAA,CAAC,IAAM,EAAA,IAAA,EAAM,KAAK,CAAA,GAAI,GAAG,MAAO,CAAA,QAAA,EAAU,MAAQ,EAAA,eAAA,EAAiB,aAAa,CAAA,CAAA;AAEtF,IAAA,IAAI,6BAAM,MAAQ,EAAA;AAChB,MAAA,IAAI,QAAQ,KAAO,EAAA;AACjB,QAAA,OAAA,GAAU,MAAM,GAAI,CAAA,CAAC,QAAQ,OAAQ,CAAA,IAAA,CAAK,IAAI,GAAK,CAAA,CAAA,CAAA,CAAA;AAAA,OAC9C,MAAA;AACL,QAAA,OAAA,GAAU,IAAK,CAAA,GAAA,CAAI,CAAC,GAAA,KAAQ,QAAQ,GAAI,CAAA,CAAA,CAAA;AAAA,OAC1C;AAAA,KACF;AAAA,GACF;AAEA,EAAO,OAAA,OAAA,CAAA;AACT;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"getEnrichedFiltersRequest.js","sources":["../../../src/variables/getEnrichedFiltersRequest.ts"],"sourcesContent":["import { DataSourceGetTagKeysOptions, DataSourceGetTagValuesOptions } from '@grafana/data';\nimport { isFiltersRequestEnricher, SceneObject } from '../core/types';\n\nexport function getEnrichedFiltersRequest(\n sourceRunner: SceneObject\n): Partial<DataSourceGetTagKeysOptions | DataSourceGetTagValuesOptions> | null {\n const root = sourceRunner.getRoot();\n\n if (isFiltersRequestEnricher(root)) {\n return root.enrichFiltersRequest(sourceRunner);\n }\n\n return null;\n}\n"],"names":[],"mappings":";;AAGO,SAAS,0BACd,YAC6E,EAAA;AAC7E,EAAM,MAAA,IAAA,GAAO,aAAa,OAAQ,EAAA;AAElC,EAAI,IAAA,wBAAA,CAAyB,IAAI,CAAG,EAAA;AAClC,IAAO,OAAA,IAAA,CAAK,qBAAqB,YAAY,CAAA;AAAA
|
|
1
|
+
{"version":3,"file":"getEnrichedFiltersRequest.js","sources":["../../../src/variables/getEnrichedFiltersRequest.ts"],"sourcesContent":["import { DataSourceGetTagKeysOptions, DataSourceGetTagValuesOptions } from '@grafana/data';\nimport { isFiltersRequestEnricher, SceneObject } from '../core/types';\n\nexport function getEnrichedFiltersRequest(\n sourceRunner: SceneObject\n): Partial<DataSourceGetTagKeysOptions | DataSourceGetTagValuesOptions> | null {\n const root = sourceRunner.getRoot();\n\n if (isFiltersRequestEnricher(root)) {\n return root.enrichFiltersRequest(sourceRunner);\n }\n\n return null;\n}\n"],"names":[],"mappings":";;AAGO,SAAS,0BACd,YAC6E,EAAA;AAC7E,EAAM,MAAA,IAAA,GAAO,aAAa,OAAQ,EAAA,CAAA;AAElC,EAAI,IAAA,wBAAA,CAAyB,IAAI,CAAG,EAAA;AAClC,IAAO,OAAA,IAAA,CAAK,qBAAqB,YAAY,CAAA,CAAA;AAAA,GAC/C;AAEA,EAAO,OAAA,IAAA,CAAA;AACT;;;;"}
|