@grafana/scenes 6.5.1--canary.1077.13964702348.0 → 6.5.1--canary.1078.13965220580.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 +33 -44
- 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 +63 -45
- 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 +2799 -2037
- package/dist/index.js.map +1 -1
- package/package.json +9 -9
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AdHocFilterRenderer.js","sources":["../../../../src/variables/adhoc/AdHocFilterRenderer.tsx"],"sourcesContent":["import React, { useMemo, useState } from 'react';\n\nimport { AdHocFiltersVariable, AdHocFilterWithLabels, isMultiValueOperator } from './AdHocFiltersVariable';\nimport { GrafanaTheme2, SelectableValue } from '@grafana/data';\nimport { Button, Field, InputActionMeta, Select, useStyles2 } from '@grafana/ui';\nimport { css, cx } from '@emotion/css';\nimport { ControlsLabel } from '../../utils/ControlsLabel';\nimport { getAdhocOptionSearcher } from './getAdhocOptionSearcher';\nimport { handleOptionGroups } from '../utils';\nimport { OptionWithCheckbox } from '../components/VariableValueSelect';\n\ninterface Props {\n filter: AdHocFilterWithLabels;\n model: AdHocFiltersVariable;\n}\n\nfunction keyLabelToOption(key: string, label?: string): SelectableValue | null {\n return key !== ''\n ? {\n value: key,\n label: label || key,\n }\n : null;\n}\n\nconst filterNoOp = () => true;\n\nexport function AdHocFilterRenderer({ filter, model }: Props) {\n const styles = useStyles2(getStyles);\n\n const [keys, setKeys] = useState<SelectableValue[]>([]);\n const [values, setValues] = useState<SelectableValue[]>([]);\n const [isKeysLoading, setIsKeysLoading] = useState(false);\n const [isValuesLoading, setIsValuesLoading] = useState(false);\n const [isKeysOpen, setIsKeysOpen] = useState(false);\n const [isValuesOpen, setIsValuesOpen] = useState(false);\n const [isOperatorOpen, setIsOperatorOpen] = useState(false);\n const [valueInputValue, setValueInputValue] = useState('');\n const [valueHasCustomValue, setValueHasCustomValue] = useState(false);\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<SelectableValue>(\n filter.values ? filter.values.map((value, index) => keyLabelToOption(value, filter.valueLabels?.[index])) : []\n );\n const isMultiValue = isMultiValueOperator(filter.operator);\n\n const keyValue = keyLabelToOption(filter.key, filter.keyLabel);\n const valueValue = keyLabelToOption(filter.value, filter.valueLabels?.[0]);\n\n const optionSearcher = useMemo(() => getAdhocOptionSearcher(values), [values]);\n const onAddCustomValue = model.state.onAddCustomValue;\n\n const onValueInputChange = (value: string, { action }: InputActionMeta) => {\n if (action === 'input-change') {\n setValueInputValue(value);\n }\n return value;\n };\n\n const onOperatorChange = (v: SelectableValue) => {\n const existingOperator = filter.operator;\n const newOperator = v.value;\n\n const update: Partial<AdHocFilterWithLabels> = { operator: newOperator };\n // clear value if operator has changed from multi to single\n if (isMultiValueOperator(existingOperator) && !isMultiValueOperator(newOperator)) {\n update.value = '';\n update.valueLabels = [''];\n update.values = undefined;\n setUncommittedValue([]);\n // set values if operator has changed from single to multi\n } else if (!isMultiValueOperator(existingOperator) && isMultiValueOperator(newOperator) && filter.value) {\n update.values = [filter.value];\n setUncommittedValue([\n {\n value: filter.value,\n label: filter.valueLabels?.[0] ?? filter.value,\n },\n ]);\n }\n model._updateFilter(filter, update);\n };\n\n const filteredValueOptions = useMemo(\n () => handleOptionGroups(optionSearcher(valueInputValue)),\n [optionSearcher, valueInputValue]\n );\n\n const multiValueProps = {\n isMulti: true,\n value: uncommittedValue,\n components: {\n Option: OptionWithCheckbox,\n },\n hideSelectedOptions: false,\n closeMenuOnSelect: false,\n openMenuOnFocus: false,\n onChange: (v: SelectableValue) => {\n setUncommittedValue(v);\n // clear input value when creating a new custom multi value\n if (v.some((value: SelectableValue) => value.__isNew__)) {\n setValueInputValue('');\n }\n },\n onBlur: () => {\n model._updateFilter(filter, {\n value: uncommittedValue[0]?.value ?? '',\n // TODO remove expect-error when we're on the latest version of @grafana/data\n values: uncommittedValue.map((option: SelectableValue<string>) => option.value),\n valueLabels: uncommittedValue.map((option: SelectableValue<string>) => option.label),\n });\n },\n };\n\n const valueSelect = (\n <Select\n virtualized\n allowCustomValue={model.state.allowCustomValue ?? true}\n isValidNewOption={(inputValue) => inputValue.trim().length > 0}\n allowCreateWhileLoading\n formatCreateLabel={(inputValue) => `Use custom value: ${inputValue}`}\n disabled={model.state.readOnly}\n className={cx(styles.value, isValuesOpen ? styles.widthWhenOpen : undefined)}\n width=\"auto\"\n value={valueValue}\n filterOption={filterNoOp}\n placeholder={'Select value'}\n options={filteredValueOptions}\n inputValue={valueInputValue}\n onInputChange={onValueInputChange}\n onChange={(v) => {\n if (onAddCustomValue && v.__isNew__) {\n model._updateFilter(filter, onAddCustomValue(v, filter));\n } else {\n model._updateFilter(filter, {\n value: v.value,\n valueLabels: v.label ? [v.label] : [v.value],\n });\n }\n\n if (valueHasCustomValue !== v.__isNew__) {\n setValueHasCustomValue(v.__isNew__);\n }\n }}\n // there's a bug in react-select where the menu doesn't recalculate its position when the options are loaded asynchronously\n // see https://github.com/grafana/grafana/issues/63558\n // instead, we explicitly control the menu visibility and prevent showing it until the options have fully loaded\n isOpen={isValuesOpen && !isValuesLoading}\n isLoading={isValuesLoading}\n openMenuOnFocus={true}\n onOpenMenu={async () => {\n setIsValuesLoading(true);\n setIsValuesOpen(true);\n const values = await model._getValuesFor(filter);\n setIsValuesLoading(false);\n setValues(values);\n if (valueHasCustomValue) {\n setValueInputValue(valueValue?.label ?? '');\n }\n }}\n onCloseMenu={() => {\n setIsValuesOpen(false);\n setValueInputValue('');\n }}\n {...(isMultiValue && multiValueProps)}\n />\n );\n\n const keySelect = (\n <Select\n // By changing the key, we reset the Select component,\n // to ensure that the loaded values are shown after they are loaded\n key={`${isValuesLoading ? 'loading' : 'loaded'}`}\n disabled={model.state.readOnly}\n className={cx(styles.key, isKeysOpen ? styles.widthWhenOpen : undefined)}\n width=\"auto\"\n allowCustomValue={model.state.allowCustomValue ?? true}\n value={keyValue}\n placeholder={'Select label'}\n options={handleOptionGroups(keys)}\n onChange={(v) => {\n model._updateFilter(filter, {\n key: v.value,\n keyLabel: v.label,\n // clear value if key has changed\n value: '',\n valueLabels: [''],\n values: undefined,\n });\n setUncommittedValue([]);\n }}\n autoFocus={filter.key === ''}\n // there's a bug in react-select where the menu doesn't recalculate its position when the options are loaded asynchronously\n // see https://github.com/grafana/grafana/issues/63558\n // instead, we explicitly control the menu visibility and prevent showing it until the options have fully loaded\n isOpen={isKeysOpen && !isKeysLoading}\n isLoading={isKeysLoading}\n onOpenMenu={async () => {\n setIsKeysOpen(true);\n setIsKeysLoading(true);\n const keys = await model._getKeys(filter.key);\n setIsKeysLoading(false);\n setKeys(keys);\n }}\n onCloseMenu={() => {\n setIsKeysOpen(false);\n }}\n onBlur={() => {\n if (filter.key === '') {\n model._removeFilter(filter);\n }\n }}\n openMenuOnFocus={true}\n />\n );\n\n const operatorSelect = (\n <Select\n className={cx(styles.operator, {\n [styles.widthWhenOpen]: isOperatorOpen,\n })}\n value={filter.operator}\n disabled={model.state.readOnly}\n options={model._getOperators()}\n onChange={onOperatorChange}\n onOpenMenu={() => {\n setIsOperatorOpen(true);\n }}\n onCloseMenu={() => {\n setIsOperatorOpen(false);\n }}\n />\n );\n\n if (model.state.layout === 'vertical') {\n if (filter.key) {\n const label = (\n <ControlsLabel layout=\"vertical\" label={filter.key ?? ''} onRemove={() => model._removeFilter(filter)} />\n );\n\n return (\n <Field label={label} data-testid={`AdHocFilter-${filter.key}`} className={styles.field}>\n <div className={styles.wrapper}>\n {operatorSelect}\n {valueSelect}\n </div>\n </Field>\n );\n } else {\n return (\n <Field label={'Select label'} data-testid={`AdHocFilter-${filter.key}`} className={styles.field}>\n {keySelect}\n </Field>\n );\n }\n }\n\n return (\n <div className={styles.wrapper} data-testid={`AdHocFilter-${filter.key}`}>\n {keySelect}\n {operatorSelect}\n {valueSelect}\n <Button\n variant=\"secondary\"\n aria-label=\"Remove filter\"\n title=\"Remove filter\"\n className={styles.removeButton}\n icon=\"times\"\n data-testid={`AdHocFilter-remove-${filter.key ?? ''}`}\n onClick={() => model._removeFilter(filter)}\n />\n </div>\n );\n}\n\nconst getStyles = (theme: GrafanaTheme2) => ({\n field: css({\n marginBottom: 0,\n }),\n wrapper: css({\n display: 'flex',\n '> *': {\n '&:not(:first-child)': {\n // Negative margin hides the double-border on adjacent selects\n marginLeft: -1,\n },\n\n '&:first-child': {\n borderTopRightRadius: 0,\n borderBottomRightRadius: 0,\n },\n\n '&:last-child': {\n borderTopLeftRadius: 0,\n borderBottomLeftRadius: 0,\n },\n\n '&:not(:first-child):not(:last-child)': {\n borderRadius: 0,\n },\n\n // Fix focus state zIndex issues\n position: 'relative',\n zIndex: 0,\n\n // Adjacent borders are overlapping, so raise children up when hovering etc\n // so all that child's borders are visible.\n '&:hover': {\n zIndex: 1,\n },\n\n '&:focus-within': {\n zIndex: 2,\n },\n },\n }),\n widthWhenOpen: css({\n minWidth: theme.spacing(16),\n }),\n value: css({\n flexBasis: 'content',\n flexShrink: 1,\n minWidth: '90px',\n }),\n key: css({\n flexBasis: 'content',\n minWidth: '90px',\n flexShrink: 1,\n }),\n operator: css({\n flexShrink: 0,\n flexBasis: 'content',\n }),\n removeButton: css({\n paddingLeft: theme.spacing(3 / 2),\n paddingRight: theme.spacing(3 / 2),\n borderLeft: 'none',\n width: theme.spacing(3),\n marginRight: theme.spacing(1),\n boxSizing: 'border-box',\n // To not have button background and last select border intersect\n position: 'relative',\n left: '1px',\n }),\n});\n"],"names":["_a","_b","values","keys"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"AdHocFilterRenderer.js","sources":["../../../../src/variables/adhoc/AdHocFilterRenderer.tsx"],"sourcesContent":["import React, { useMemo, useState } from 'react';\n\nimport { AdHocFiltersVariable, AdHocFilterWithLabels, isMultiValueOperator } from './AdHocFiltersVariable';\nimport { GrafanaTheme2, SelectableValue } from '@grafana/data';\nimport { Button, Field, InputActionMeta, Select, useStyles2 } from '@grafana/ui';\nimport { css, cx } from '@emotion/css';\nimport { ControlsLabel } from '../../utils/ControlsLabel';\nimport { getAdhocOptionSearcher } from './getAdhocOptionSearcher';\nimport { handleOptionGroups } from '../utils';\nimport { OptionWithCheckbox } from '../components/VariableValueSelect';\n\ninterface Props {\n filter: AdHocFilterWithLabels;\n model: AdHocFiltersVariable;\n}\n\nfunction keyLabelToOption(key: string, label?: string): SelectableValue | null {\n return key !== ''\n ? {\n value: key,\n label: label || key,\n }\n : null;\n}\n\nconst filterNoOp = () => true;\n\nexport function AdHocFilterRenderer({ filter, model }: Props) {\n const styles = useStyles2(getStyles);\n\n const [keys, setKeys] = useState<SelectableValue[]>([]);\n const [values, setValues] = useState<SelectableValue[]>([]);\n const [isKeysLoading, setIsKeysLoading] = useState(false);\n const [isValuesLoading, setIsValuesLoading] = useState(false);\n const [isKeysOpen, setIsKeysOpen] = useState(false);\n const [isValuesOpen, setIsValuesOpen] = useState(false);\n const [isOperatorOpen, setIsOperatorOpen] = useState(false);\n const [valueInputValue, setValueInputValue] = useState('');\n const [valueHasCustomValue, setValueHasCustomValue] = useState(false);\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<SelectableValue>(\n filter.values ? filter.values.map((value, index) => keyLabelToOption(value, filter.valueLabels?.[index])) : []\n );\n const isMultiValue = isMultiValueOperator(filter.operator);\n\n const keyValue = keyLabelToOption(filter.key, filter.keyLabel);\n const valueValue = keyLabelToOption(filter.value, filter.valueLabels?.[0]);\n\n const optionSearcher = useMemo(() => getAdhocOptionSearcher(values), [values]);\n const onAddCustomValue = model.state.onAddCustomValue;\n\n const onValueInputChange = (value: string, { action }: InputActionMeta) => {\n if (action === 'input-change') {\n setValueInputValue(value);\n }\n return value;\n };\n\n const onOperatorChange = (v: SelectableValue) => {\n const existingOperator = filter.operator;\n const newOperator = v.value;\n\n const update: Partial<AdHocFilterWithLabels> = { operator: newOperator };\n // clear value if operator has changed from multi to single\n if (isMultiValueOperator(existingOperator) && !isMultiValueOperator(newOperator)) {\n update.value = '';\n update.valueLabels = [''];\n update.values = undefined;\n setUncommittedValue([]);\n // set values if operator has changed from single to multi\n } else if (!isMultiValueOperator(existingOperator) && isMultiValueOperator(newOperator) && filter.value) {\n update.values = [filter.value];\n setUncommittedValue([\n {\n value: filter.value,\n label: filter.valueLabels?.[0] ?? filter.value,\n },\n ]);\n }\n model._updateFilter(filter, update);\n };\n\n const filteredValueOptions = useMemo(\n () => handleOptionGroups(optionSearcher(valueInputValue)),\n [optionSearcher, valueInputValue]\n );\n\n const multiValueProps = {\n isMulti: true,\n value: uncommittedValue,\n components: {\n Option: OptionWithCheckbox,\n },\n hideSelectedOptions: false,\n closeMenuOnSelect: false,\n openMenuOnFocus: false,\n onChange: (v: SelectableValue) => {\n setUncommittedValue(v);\n // clear input value when creating a new custom multi value\n if (v.some((value: SelectableValue) => value.__isNew__)) {\n setValueInputValue('');\n }\n },\n onBlur: () => {\n model._updateFilter(filter, {\n value: uncommittedValue[0]?.value ?? '',\n // TODO remove expect-error when we're on the latest version of @grafana/data\n values: uncommittedValue.map((option: SelectableValue<string>) => option.value),\n valueLabels: uncommittedValue.map((option: SelectableValue<string>) => option.label),\n });\n },\n };\n\n const valueSelect = (\n <Select\n virtualized\n allowCustomValue={model.state.allowCustomValue ?? true}\n isValidNewOption={(inputValue) => inputValue.trim().length > 0}\n allowCreateWhileLoading\n formatCreateLabel={(inputValue) => `Use custom value: ${inputValue}`}\n disabled={model.state.readOnly}\n className={cx(styles.value, isValuesOpen ? styles.widthWhenOpen : undefined)}\n width=\"auto\"\n value={valueValue}\n filterOption={filterNoOp}\n placeholder={'Select value'}\n options={filteredValueOptions}\n inputValue={valueInputValue}\n onInputChange={onValueInputChange}\n onChange={(v) => {\n if (onAddCustomValue && v.__isNew__) {\n model._updateFilter(filter, onAddCustomValue(v, filter));\n } else {\n model._updateFilter(filter, {\n value: v.value,\n valueLabels: v.label ? [v.label] : [v.value],\n });\n }\n\n if (valueHasCustomValue !== v.__isNew__) {\n setValueHasCustomValue(v.__isNew__);\n }\n }}\n // there's a bug in react-select where the menu doesn't recalculate its position when the options are loaded asynchronously\n // see https://github.com/grafana/grafana/issues/63558\n // instead, we explicitly control the menu visibility and prevent showing it until the options have fully loaded\n isOpen={isValuesOpen && !isValuesLoading}\n isLoading={isValuesLoading}\n openMenuOnFocus={true}\n onOpenMenu={async () => {\n setIsValuesLoading(true);\n setIsValuesOpen(true);\n const values = await model._getValuesFor(filter);\n setIsValuesLoading(false);\n setValues(values);\n if (valueHasCustomValue) {\n setValueInputValue(valueValue?.label ?? '');\n }\n }}\n onCloseMenu={() => {\n setIsValuesOpen(false);\n setValueInputValue('');\n }}\n {...(isMultiValue && multiValueProps)}\n />\n );\n\n const keySelect = (\n <Select\n // By changing the key, we reset the Select component,\n // to ensure that the loaded values are shown after they are loaded\n key={`${isValuesLoading ? 'loading' : 'loaded'}`}\n disabled={model.state.readOnly}\n className={cx(styles.key, isKeysOpen ? styles.widthWhenOpen : undefined)}\n width=\"auto\"\n allowCustomValue={model.state.allowCustomValue ?? true}\n value={keyValue}\n placeholder={'Select label'}\n options={handleOptionGroups(keys)}\n onChange={(v) => {\n model._updateFilter(filter, {\n key: v.value,\n keyLabel: v.label,\n // clear value if key has changed\n value: '',\n valueLabels: [''],\n values: undefined,\n });\n setUncommittedValue([]);\n }}\n autoFocus={filter.key === ''}\n // there's a bug in react-select where the menu doesn't recalculate its position when the options are loaded asynchronously\n // see https://github.com/grafana/grafana/issues/63558\n // instead, we explicitly control the menu visibility and prevent showing it until the options have fully loaded\n isOpen={isKeysOpen && !isKeysLoading}\n isLoading={isKeysLoading}\n onOpenMenu={async () => {\n setIsKeysOpen(true);\n setIsKeysLoading(true);\n const keys = await model._getKeys(filter.key);\n setIsKeysLoading(false);\n setKeys(keys);\n }}\n onCloseMenu={() => {\n setIsKeysOpen(false);\n }}\n onBlur={() => {\n if (filter.key === '') {\n model._removeFilter(filter);\n }\n }}\n openMenuOnFocus={true}\n />\n );\n\n const operatorSelect = (\n <Select\n className={cx(styles.operator, {\n [styles.widthWhenOpen]: isOperatorOpen,\n })}\n value={filter.operator}\n disabled={model.state.readOnly}\n options={model._getOperators()}\n onChange={onOperatorChange}\n onOpenMenu={() => {\n setIsOperatorOpen(true);\n }}\n onCloseMenu={() => {\n setIsOperatorOpen(false);\n }}\n />\n );\n\n if (model.state.layout === 'vertical') {\n if (filter.key) {\n const label = (\n <ControlsLabel layout=\"vertical\" label={filter.key ?? ''} onRemove={() => model._removeFilter(filter)} />\n );\n\n return (\n <Field label={label} data-testid={`AdHocFilter-${filter.key}`} className={styles.field}>\n <div className={styles.wrapper}>\n {operatorSelect}\n {valueSelect}\n </div>\n </Field>\n );\n } else {\n return (\n <Field label={'Select label'} data-testid={`AdHocFilter-${filter.key}`} className={styles.field}>\n {keySelect}\n </Field>\n );\n }\n }\n\n return (\n <div className={styles.wrapper} data-testid={`AdHocFilter-${filter.key}`}>\n {keySelect}\n {operatorSelect}\n {valueSelect}\n <Button\n variant=\"secondary\"\n aria-label=\"Remove filter\"\n title=\"Remove filter\"\n className={styles.removeButton}\n icon=\"times\"\n data-testid={`AdHocFilter-remove-${filter.key ?? ''}`}\n onClick={() => model._removeFilter(filter)}\n />\n </div>\n );\n}\n\nconst getStyles = (theme: GrafanaTheme2) => ({\n field: css({\n marginBottom: 0,\n }),\n wrapper: css({\n display: 'flex',\n '> *': {\n '&:not(:first-child)': {\n // Negative margin hides the double-border on adjacent selects\n marginLeft: -1,\n },\n\n '&:first-child': {\n borderTopRightRadius: 0,\n borderBottomRightRadius: 0,\n },\n\n '&:last-child': {\n borderTopLeftRadius: 0,\n borderBottomLeftRadius: 0,\n },\n\n '&:not(:first-child):not(:last-child)': {\n borderRadius: 0,\n },\n\n // Fix focus state zIndex issues\n position: 'relative',\n zIndex: 0,\n\n // Adjacent borders are overlapping, so raise children up when hovering etc\n // so all that child's borders are visible.\n '&:hover': {\n zIndex: 1,\n },\n\n '&:focus-within': {\n zIndex: 2,\n },\n },\n }),\n widthWhenOpen: css({\n minWidth: theme.spacing(16),\n }),\n value: css({\n flexBasis: 'content',\n flexShrink: 1,\n minWidth: '90px',\n }),\n key: css({\n flexBasis: 'content',\n minWidth: '90px',\n flexShrink: 1,\n }),\n operator: css({\n flexShrink: 0,\n flexBasis: 'content',\n }),\n removeButton: css({\n paddingLeft: theme.spacing(3 / 2),\n paddingRight: theme.spacing(3 / 2),\n borderLeft: 'none',\n width: theme.spacing(3),\n marginRight: theme.spacing(1),\n boxSizing: 'border-box',\n // To not have button background and last select border intersect\n position: 'relative',\n left: '1px',\n }),\n});\n"],"names":["_a","_b","values","keys"],"mappings":"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"}
|
|
@@ -1,8 +1,27 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { cx, css } from '@emotion/css';
|
|
2
2
|
import { useStyles2, Tooltip, IconButton } from '@grafana/ui';
|
|
3
3
|
import React, { useState, useRef, useCallback, useEffect } from 'react';
|
|
4
4
|
import { AdHocCombobox } from './AdHocFiltersCombobox.js';
|
|
5
5
|
|
|
6
|
+
var __defProp = Object.defineProperty;
|
|
7
|
+
var __defProps = Object.defineProperties;
|
|
8
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
9
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
10
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
11
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
12
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
13
|
+
var __spreadValues = (a, b) => {
|
|
14
|
+
for (var prop in b || (b = {}))
|
|
15
|
+
if (__hasOwnProp.call(b, prop))
|
|
16
|
+
__defNormalProp(a, prop, b[prop]);
|
|
17
|
+
if (__getOwnPropSymbols)
|
|
18
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
19
|
+
if (__propIsEnum.call(b, prop))
|
|
20
|
+
__defNormalProp(a, prop, b[prop]);
|
|
21
|
+
}
|
|
22
|
+
return a;
|
|
23
|
+
};
|
|
24
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
6
25
|
const LABEL_MAX_VISIBLE_LENGTH = 20;
|
|
7
26
|
function AdHocFilterPill({ filter, model, readOnly, focusOnWipInputRef }) {
|
|
8
27
|
var _a, _b, _c;
|
|
@@ -43,94 +62,82 @@ function AdHocFilterPill({ filter, model, readOnly, focusOnWipInputRef }) {
|
|
|
43
62
|
}
|
|
44
63
|
}, [viewMode]);
|
|
45
64
|
if (viewMode) {
|
|
46
|
-
const pillText = /* @__PURE__ */ React.createElement("span", {
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
65
|
+
const pillText = /* @__PURE__ */ React.createElement("span", {
|
|
66
|
+
className: styles.pillText
|
|
67
|
+
}, keyLabel, " ", filter.operator, " ", valueLabel);
|
|
68
|
+
return /* @__PURE__ */ React.createElement("div", {
|
|
69
|
+
className: cx(styles.combinedFilterPill, readOnly && styles.readOnlyCombinedFilter),
|
|
70
|
+
onClick: (e) => {
|
|
71
|
+
e.stopPropagation();
|
|
72
|
+
setPopulateInputOnEdit(true);
|
|
73
|
+
handleChangeViewMode();
|
|
74
|
+
},
|
|
75
|
+
onKeyDown: (e) => {
|
|
76
|
+
if (e.key === "Enter") {
|
|
53
77
|
setPopulateInputOnEdit(true);
|
|
54
78
|
handleChangeViewMode();
|
|
55
|
-
},
|
|
56
|
-
onKeyDown: (e) => {
|
|
57
|
-
if (e.key === "Enter") {
|
|
58
|
-
setPopulateInputOnEdit(true);
|
|
59
|
-
handleChangeViewMode();
|
|
60
|
-
}
|
|
61
|
-
},
|
|
62
|
-
role: "button",
|
|
63
|
-
"aria-label": `Edit filter with key ${keyLabel}`,
|
|
64
|
-
tabIndex: 0,
|
|
65
|
-
ref: pillWrapperRef
|
|
66
|
-
},
|
|
67
|
-
valueLabel.length < LABEL_MAX_VISIBLE_LENGTH ? pillText : /* @__PURE__ */ React.createElement(Tooltip, { content: /* @__PURE__ */ React.createElement("div", { className: styles.tooltipText }, valueLabel), placement: "top" }, pillText),
|
|
68
|
-
!readOnly && !filter.origin ? /* @__PURE__ */ React.createElement(
|
|
69
|
-
IconButton,
|
|
70
|
-
{
|
|
71
|
-
onClick: (e) => {
|
|
72
|
-
e.stopPropagation();
|
|
73
|
-
model._removeFilter(filter);
|
|
74
|
-
setTimeout(() => focusOnWipInputRef == null ? void 0 : focusOnWipInputRef());
|
|
75
|
-
},
|
|
76
|
-
onKeyDownCapture: (e) => {
|
|
77
|
-
if (e.key === "Enter") {
|
|
78
|
-
e.preventDefault();
|
|
79
|
-
e.stopPropagation();
|
|
80
|
-
model._removeFilter(filter);
|
|
81
|
-
setTimeout(() => focusOnWipInputRef == null ? void 0 : focusOnWipInputRef());
|
|
82
|
-
}
|
|
83
|
-
},
|
|
84
|
-
name: "times",
|
|
85
|
-
size: "md",
|
|
86
|
-
className: styles.pillIcon,
|
|
87
|
-
tooltip: `Remove filter with key ${keyLabel}`
|
|
88
79
|
}
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
80
|
+
},
|
|
81
|
+
role: "button",
|
|
82
|
+
"aria-label": `Edit filter with key ${keyLabel}`,
|
|
83
|
+
tabIndex: 0,
|
|
84
|
+
ref: pillWrapperRef
|
|
85
|
+
}, valueLabel.length < LABEL_MAX_VISIBLE_LENGTH ? pillText : /* @__PURE__ */ React.createElement(Tooltip, {
|
|
86
|
+
content: /* @__PURE__ */ React.createElement("div", {
|
|
87
|
+
className: styles.tooltipText
|
|
88
|
+
}, valueLabel),
|
|
89
|
+
placement: "top"
|
|
90
|
+
}, pillText), !readOnly && !filter.origin ? /* @__PURE__ */ React.createElement(IconButton, {
|
|
91
|
+
onClick: (e) => {
|
|
92
|
+
e.stopPropagation();
|
|
93
|
+
model._removeFilter(filter);
|
|
94
|
+
setTimeout(() => focusOnWipInputRef == null ? void 0 : focusOnWipInputRef());
|
|
95
|
+
},
|
|
96
|
+
onKeyDownCapture: (e) => {
|
|
97
|
+
if (e.key === "Enter") {
|
|
98
|
+
e.preventDefault();
|
|
99
|
+
e.stopPropagation();
|
|
100
|
+
model._removeFilter(filter);
|
|
101
|
+
setTimeout(() => focusOnWipInputRef == null ? void 0 : focusOnWipInputRef());
|
|
97
102
|
}
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
103
|
+
},
|
|
104
|
+
name: "times",
|
|
105
|
+
size: "md",
|
|
106
|
+
className: styles.pillIcon,
|
|
107
|
+
tooltip: `Remove filter with key ${keyLabel}`
|
|
108
|
+
}) : null, filter.origin && !filter.originalValue && /* @__PURE__ */ React.createElement(IconButton, {
|
|
109
|
+
name: "info-circle",
|
|
110
|
+
size: "md",
|
|
111
|
+
className: styles.pillIcon,
|
|
112
|
+
tooltip: `This is a ${filter.origin} injected filter`
|
|
113
|
+
}), filter.origin && filter.originalValue && /* @__PURE__ */ React.createElement(IconButton, {
|
|
114
|
+
onClick: (e) => {
|
|
115
|
+
e.stopPropagation();
|
|
116
|
+
model.restoreOriginalFilter(filter);
|
|
117
|
+
},
|
|
118
|
+
onKeyDownCapture: (e) => {
|
|
119
|
+
if (e.key === "Enter") {
|
|
120
|
+
e.preventDefault();
|
|
121
|
+
e.stopPropagation();
|
|
122
|
+
model.restoreOriginalFilter(filter);
|
|
117
123
|
}
|
|
118
|
-
|
|
119
|
-
|
|
124
|
+
},
|
|
125
|
+
name: "history",
|
|
126
|
+
size: "md",
|
|
127
|
+
className: styles.pillIcon,
|
|
128
|
+
tooltip: `Restore filter to its original value`
|
|
129
|
+
}));
|
|
120
130
|
}
|
|
121
|
-
return /* @__PURE__ */ React.createElement(
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
populateInputOnEdit
|
|
129
|
-
}
|
|
130
|
-
);
|
|
131
|
+
return /* @__PURE__ */ React.createElement(AdHocCombobox, {
|
|
132
|
+
filter,
|
|
133
|
+
model,
|
|
134
|
+
handleChangeViewMode,
|
|
135
|
+
focusOnWipInputRef,
|
|
136
|
+
populateInputOnEdit
|
|
137
|
+
});
|
|
131
138
|
}
|
|
132
139
|
const getStyles = (theme) => ({
|
|
133
|
-
combinedFilterPill: css({
|
|
140
|
+
combinedFilterPill: css(__spreadProps(__spreadValues({
|
|
134
141
|
display: "flex",
|
|
135
142
|
alignItems: "center",
|
|
136
143
|
background: theme.colors.action.selected,
|
|
@@ -140,14 +147,14 @@ const getStyles = (theme) => ({
|
|
|
140
147
|
color: theme.colors.text.primary,
|
|
141
148
|
overflow: "hidden",
|
|
142
149
|
whiteSpace: "nowrap",
|
|
143
|
-
minHeight: theme.spacing(2.75)
|
|
144
|
-
|
|
150
|
+
minHeight: theme.spacing(2.75)
|
|
151
|
+
}, theme.typography.bodySmall), {
|
|
145
152
|
fontWeight: theme.typography.fontWeightBold,
|
|
146
153
|
cursor: "pointer",
|
|
147
154
|
"&:hover": {
|
|
148
155
|
background: theme.colors.action.hover
|
|
149
156
|
}
|
|
150
|
-
}),
|
|
157
|
+
})),
|
|
151
158
|
readOnlyCombinedFilter: css({
|
|
152
159
|
paddingRight: theme.spacing(1),
|
|
153
160
|
cursor: "text",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AdHocFilterPill.js","sources":["../../../../../src/variables/adhoc/AdHocFiltersCombobox/AdHocFilterPill.tsx"],"sourcesContent":["import { css, cx } from '@emotion/css';\nimport { GrafanaTheme2 } from '@grafana/data';\nimport { useStyles2, IconButton, Tooltip } from '@grafana/ui';\nimport React, { useState, useRef, useCallback, useEffect } from 'react';\nimport { AdHocCombobox } from './AdHocFiltersCombobox';\nimport { AdHocFilterWithLabels, AdHocFiltersVariable } from '../AdHocFiltersVariable';\n\nconst LABEL_MAX_VISIBLE_LENGTH = 20;\n\ninterface Props {\n filter: AdHocFilterWithLabels;\n model: AdHocFiltersVariable;\n readOnly?: boolean;\n focusOnWipInputRef?: () => void;\n}\n\nexport function AdHocFilterPill({ filter, model, readOnly, focusOnWipInputRef }: Props) {\n const styles = useStyles2(getStyles);\n const [viewMode, setViewMode] = useState(true);\n const [shouldFocusOnPillWrapper, setShouldFocusOnPillWrapper] = useState(false);\n const pillWrapperRef = useRef<HTMLDivElement>(null);\n const [populateInputOnEdit, setPopulateInputOnEdit] = useState(false);\n\n const keyLabel = filter.keyLabel ?? filter.key;\n const valueLabel = filter.valueLabels?.join(', ') || filter.values?.join(', ') || filter.value;\n\n const handleChangeViewMode = useCallback(\n (event?: React.MouseEvent, shouldFocusOnPillWrapperOverride?: boolean) => {\n event?.stopPropagation();\n if (readOnly) {\n return;\n }\n\n setShouldFocusOnPillWrapper(shouldFocusOnPillWrapperOverride ?? !viewMode);\n setViewMode(!viewMode);\n },\n [readOnly, viewMode]\n );\n\n useEffect(() => {\n if (shouldFocusOnPillWrapper) {\n pillWrapperRef.current?.focus();\n setShouldFocusOnPillWrapper(false);\n }\n }, [shouldFocusOnPillWrapper]);\n\n // set viewMode to false when filter.forceEdit is defined\n useEffect(() => {\n if (filter.forceEdit && viewMode) {\n setViewMode(false);\n // immediately set forceEdit back to undefined as a clean up\n model._updateFilter(filter, { forceEdit: undefined });\n }\n }, [filter, model, viewMode]);\n\n // reset populateInputOnEdit when pill goes into view mode\n useEffect(() => {\n if (viewMode) {\n setPopulateInputOnEdit((prevValue) => (prevValue ? false : prevValue));\n }\n }, [viewMode]);\n\n if (viewMode) {\n const pillText = (\n <span className={styles.pillText}>\n {keyLabel} {filter.operator} {valueLabel}\n </span>\n );\n return (\n <div\n className={cx(styles.combinedFilterPill, readOnly && styles.readOnlyCombinedFilter)}\n onClick={(e) => {\n e.stopPropagation();\n setPopulateInputOnEdit(true);\n handleChangeViewMode();\n }}\n onKeyDown={(e) => {\n if (e.key === 'Enter') {\n setPopulateInputOnEdit(true);\n handleChangeViewMode();\n }\n }}\n role=\"button\"\n aria-label={`Edit filter with key ${keyLabel}`}\n tabIndex={0}\n ref={pillWrapperRef}\n >\n {valueLabel.length < LABEL_MAX_VISIBLE_LENGTH ? (\n pillText\n ) : (\n <Tooltip content={<div className={styles.tooltipText}>{valueLabel}</div>} placement=\"top\">\n {pillText}\n </Tooltip>\n )}\n\n {!readOnly && !filter.origin ? (\n <IconButton\n onClick={(e) => {\n e.stopPropagation();\n model._removeFilter(filter);\n setTimeout(() => focusOnWipInputRef?.());\n }}\n onKeyDownCapture={(e) => {\n if (e.key === 'Enter') {\n e.preventDefault();\n e.stopPropagation();\n model._removeFilter(filter);\n setTimeout(() => focusOnWipInputRef?.());\n }\n }}\n name=\"times\"\n size=\"md\"\n className={styles.pillIcon}\n tooltip={`Remove filter with key ${keyLabel}`}\n />\n ) : null}\n\n {filter.origin && !filter.originalValue && (\n <IconButton\n name=\"info-circle\"\n size=\"md\"\n className={styles.pillIcon}\n tooltip={`This is a ${filter.origin} injected filter`}\n />\n )}\n\n {filter.origin && filter.originalValue && (\n <IconButton\n onClick={(e) => {\n e.stopPropagation();\n model.restoreOriginalFilter(filter);\n }}\n onKeyDownCapture={(e) => {\n if (e.key === 'Enter') {\n e.preventDefault();\n e.stopPropagation();\n model.restoreOriginalFilter(filter);\n }\n }}\n name=\"history\"\n size=\"md\"\n className={styles.pillIcon}\n tooltip={`Restore filter to its original value`}\n />\n )}\n </div>\n );\n }\n\n return (\n <AdHocCombobox\n filter={filter}\n model={model}\n handleChangeViewMode={handleChangeViewMode}\n focusOnWipInputRef={focusOnWipInputRef}\n populateInputOnEdit={populateInputOnEdit}\n />\n );\n}\n\nconst getStyles = (theme: GrafanaTheme2) => ({\n combinedFilterPill: css({\n display: 'flex',\n alignItems: 'center',\n background: theme.colors.action.selected,\n borderRadius: theme.shape.radius.default,\n border: `1px solid ${theme.colors.border.weak}`,\n padding: theme.spacing(0.125, 0, 0.125, 1),\n color: theme.colors.text.primary,\n overflow: 'hidden',\n whiteSpace: 'nowrap',\n minHeight: theme.spacing(2.75),\n ...theme.typography.bodySmall,\n fontWeight: theme.typography.fontWeightBold,\n cursor: 'pointer',\n\n '&:hover': {\n background: theme.colors.action.hover,\n },\n }),\n readOnlyCombinedFilter: css({\n paddingRight: theme.spacing(1),\n cursor: 'text',\n '&:hover': {\n background: theme.colors.action.selected,\n },\n }),\n pillIcon: css({\n marginInline: theme.spacing(0.5),\n cursor: 'pointer',\n '&:hover': {\n color: theme.colors.text.primary,\n },\n }),\n pillText: css({\n maxWidth: '200px',\n width: '100%',\n textOverflow: 'ellipsis',\n overflow: 'hidden',\n }),\n tooltipText: css({\n textAlign: 'center',\n }),\n});\n"],"names":["_a"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"AdHocFilterPill.js","sources":["../../../../../src/variables/adhoc/AdHocFiltersCombobox/AdHocFilterPill.tsx"],"sourcesContent":["import { css, cx } from '@emotion/css';\nimport { GrafanaTheme2 } from '@grafana/data';\nimport { useStyles2, IconButton, Tooltip } from '@grafana/ui';\nimport React, { useState, useRef, useCallback, useEffect } from 'react';\nimport { AdHocCombobox } from './AdHocFiltersCombobox';\nimport { AdHocFilterWithLabels, AdHocFiltersVariable } from '../AdHocFiltersVariable';\n\nconst LABEL_MAX_VISIBLE_LENGTH = 20;\n\ninterface Props {\n filter: AdHocFilterWithLabels;\n model: AdHocFiltersVariable;\n readOnly?: boolean;\n focusOnWipInputRef?: () => void;\n}\n\nexport function AdHocFilterPill({ filter, model, readOnly, focusOnWipInputRef }: Props) {\n const styles = useStyles2(getStyles);\n const [viewMode, setViewMode] = useState(true);\n const [shouldFocusOnPillWrapper, setShouldFocusOnPillWrapper] = useState(false);\n const pillWrapperRef = useRef<HTMLDivElement>(null);\n const [populateInputOnEdit, setPopulateInputOnEdit] = useState(false);\n\n const keyLabel = filter.keyLabel ?? filter.key;\n const valueLabel = filter.valueLabels?.join(', ') || filter.values?.join(', ') || filter.value;\n\n const handleChangeViewMode = useCallback(\n (event?: React.MouseEvent, shouldFocusOnPillWrapperOverride?: boolean) => {\n event?.stopPropagation();\n if (readOnly) {\n return;\n }\n\n setShouldFocusOnPillWrapper(shouldFocusOnPillWrapperOverride ?? !viewMode);\n setViewMode(!viewMode);\n },\n [readOnly, viewMode]\n );\n\n useEffect(() => {\n if (shouldFocusOnPillWrapper) {\n pillWrapperRef.current?.focus();\n setShouldFocusOnPillWrapper(false);\n }\n }, [shouldFocusOnPillWrapper]);\n\n // set viewMode to false when filter.forceEdit is defined\n useEffect(() => {\n if (filter.forceEdit && viewMode) {\n setViewMode(false);\n // immediately set forceEdit back to undefined as a clean up\n model._updateFilter(filter, { forceEdit: undefined });\n }\n }, [filter, model, viewMode]);\n\n // reset populateInputOnEdit when pill goes into view mode\n useEffect(() => {\n if (viewMode) {\n setPopulateInputOnEdit((prevValue) => (prevValue ? false : prevValue));\n }\n }, [viewMode]);\n\n if (viewMode) {\n const pillText = (\n <span className={styles.pillText}>\n {keyLabel} {filter.operator} {valueLabel}\n </span>\n );\n return (\n <div\n className={cx(styles.combinedFilterPill, readOnly && styles.readOnlyCombinedFilter)}\n onClick={(e) => {\n e.stopPropagation();\n setPopulateInputOnEdit(true);\n handleChangeViewMode();\n }}\n onKeyDown={(e) => {\n if (e.key === 'Enter') {\n setPopulateInputOnEdit(true);\n handleChangeViewMode();\n }\n }}\n role=\"button\"\n aria-label={`Edit filter with key ${keyLabel}`}\n tabIndex={0}\n ref={pillWrapperRef}\n >\n {valueLabel.length < LABEL_MAX_VISIBLE_LENGTH ? (\n pillText\n ) : (\n <Tooltip content={<div className={styles.tooltipText}>{valueLabel}</div>} placement=\"top\">\n {pillText}\n </Tooltip>\n )}\n\n {!readOnly && !filter.origin ? (\n <IconButton\n onClick={(e) => {\n e.stopPropagation();\n model._removeFilter(filter);\n setTimeout(() => focusOnWipInputRef?.());\n }}\n onKeyDownCapture={(e) => {\n if (e.key === 'Enter') {\n e.preventDefault();\n e.stopPropagation();\n model._removeFilter(filter);\n setTimeout(() => focusOnWipInputRef?.());\n }\n }}\n name=\"times\"\n size=\"md\"\n className={styles.pillIcon}\n tooltip={`Remove filter with key ${keyLabel}`}\n />\n ) : null}\n\n {filter.origin && !filter.originalValue && (\n <IconButton\n name=\"info-circle\"\n size=\"md\"\n className={styles.pillIcon}\n tooltip={`This is a ${filter.origin} injected filter`}\n />\n )}\n\n {filter.origin && filter.originalValue && (\n <IconButton\n onClick={(e) => {\n e.stopPropagation();\n model.restoreOriginalFilter(filter);\n }}\n onKeyDownCapture={(e) => {\n if (e.key === 'Enter') {\n e.preventDefault();\n e.stopPropagation();\n model.restoreOriginalFilter(filter);\n }\n }}\n name=\"history\"\n size=\"md\"\n className={styles.pillIcon}\n tooltip={`Restore filter to its original value`}\n />\n )}\n </div>\n );\n }\n\n return (\n <AdHocCombobox\n filter={filter}\n model={model}\n handleChangeViewMode={handleChangeViewMode}\n focusOnWipInputRef={focusOnWipInputRef}\n populateInputOnEdit={populateInputOnEdit}\n />\n );\n}\n\nconst getStyles = (theme: GrafanaTheme2) => ({\n combinedFilterPill: css({\n display: 'flex',\n alignItems: 'center',\n background: theme.colors.action.selected,\n borderRadius: theme.shape.radius.default,\n border: `1px solid ${theme.colors.border.weak}`,\n padding: theme.spacing(0.125, 0, 0.125, 1),\n color: theme.colors.text.primary,\n overflow: 'hidden',\n whiteSpace: 'nowrap',\n minHeight: theme.spacing(2.75),\n ...theme.typography.bodySmall,\n fontWeight: theme.typography.fontWeightBold,\n cursor: 'pointer',\n\n '&:hover': {\n background: theme.colors.action.hover,\n },\n }),\n readOnlyCombinedFilter: css({\n paddingRight: theme.spacing(1),\n cursor: 'text',\n '&:hover': {\n background: theme.colors.action.selected,\n },\n }),\n pillIcon: css({\n marginInline: theme.spacing(0.5),\n cursor: 'pointer',\n '&:hover': {\n color: theme.colors.text.primary,\n },\n }),\n pillText: css({\n maxWidth: '200px',\n width: '100%',\n textOverflow: 'ellipsis',\n overflow: 'hidden',\n }),\n tooltipText: css({\n textAlign: 'center',\n }),\n});\n"],"names":["_a"],"mappings":"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"}
|
|
@@ -8,7 +8,12 @@ const AdHocFiltersAlwaysWipCombobox = forwardRef(function AdHocFiltersAlwaysWipC
|
|
|
8
8
|
model._addWip();
|
|
9
9
|
}
|
|
10
10
|
}, [_wip]);
|
|
11
|
-
return /* @__PURE__ */ React.createElement(AdHocCombobox, {
|
|
11
|
+
return /* @__PURE__ */ React.createElement(AdHocCombobox, {
|
|
12
|
+
model,
|
|
13
|
+
filter: _wip,
|
|
14
|
+
isAlwaysWip: true,
|
|
15
|
+
ref: parentRef
|
|
16
|
+
});
|
|
12
17
|
});
|
|
13
18
|
|
|
14
19
|
export { AdHocFiltersAlwaysWipCombobox };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AdHocFiltersAlwaysWipCombobox.js","sources":["../../../../../src/variables/adhoc/AdHocFiltersCombobox/AdHocFiltersAlwaysWipCombobox.tsx"],"sourcesContent":["import React, { forwardRef, useLayoutEffect } from 'react';\nimport { AdHocFiltersVariable } from '../AdHocFiltersVariable';\nimport { AdHocCombobox } from './AdHocFiltersCombobox';\n\ninterface Props {\n model: AdHocFiltersVariable;\n}\n\nexport const AdHocFiltersAlwaysWipCombobox = forwardRef(function AdHocFiltersAlwaysWipCombobox(\n { model }: Props,\n // pass ability to focus on input element back to parent\n // parentRef is coming from AdHocFiltersComboboxRenderer\n // parentRef is mutated through useImperativeHandle in AdHocCombobox\n parentRef\n) {\n const { _wip } = model.useState();\n\n // when combobox is in wip mode then check and add _wip if its missing\n // needed on first render and when _wip is reset on filter value commit\n useLayoutEffect(() => {\n if (!_wip) {\n model._addWip();\n }\n\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [_wip]);\n\n return <AdHocCombobox model={model} filter={_wip} isAlwaysWip ref={parentRef} />;\n});\n"],"names":["AdHocFiltersAlwaysWipCombobox"],"mappings":";;;AAQO,MAAM,gCAAgC,UAAW,CAAA,SAASA,+BAC/D,EAAE,KAAA,IAIF,SACA,EAAA;AACA,EAAA,MAAM,EAAE,IAAA,EAAS,GAAA,KAAA,CAAM,QAAS,EAAA;AAIhC,EAAA,eAAA,CAAgB,MAAM;AACpB,IAAA,IAAI,CAAC,IAAM,EAAA;AACT,MAAA,KAAA,CAAM,OAAQ,EAAA;AAAA;
|
|
1
|
+
{"version":3,"file":"AdHocFiltersAlwaysWipCombobox.js","sources":["../../../../../src/variables/adhoc/AdHocFiltersCombobox/AdHocFiltersAlwaysWipCombobox.tsx"],"sourcesContent":["import React, { forwardRef, useLayoutEffect } from 'react';\nimport { AdHocFiltersVariable } from '../AdHocFiltersVariable';\nimport { AdHocCombobox } from './AdHocFiltersCombobox';\n\ninterface Props {\n model: AdHocFiltersVariable;\n}\n\nexport const AdHocFiltersAlwaysWipCombobox = forwardRef(function AdHocFiltersAlwaysWipCombobox(\n { model }: Props,\n // pass ability to focus on input element back to parent\n // parentRef is coming from AdHocFiltersComboboxRenderer\n // parentRef is mutated through useImperativeHandle in AdHocCombobox\n parentRef\n) {\n const { _wip } = model.useState();\n\n // when combobox is in wip mode then check and add _wip if its missing\n // needed on first render and when _wip is reset on filter value commit\n useLayoutEffect(() => {\n if (!_wip) {\n model._addWip();\n }\n\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [_wip]);\n\n return <AdHocCombobox model={model} filter={_wip} isAlwaysWip ref={parentRef} />;\n});\n"],"names":["AdHocFiltersAlwaysWipCombobox"],"mappings":";;;AAQO,MAAM,gCAAgC,UAAW,CAAA,SAASA,+BAC/D,EAAE,KAAA,IAIF,SACA,EAAA;AACA,EAAA,MAAM,EAAE,IAAA,EAAS,GAAA,KAAA,CAAM,QAAS,EAAA,CAAA;AAIhC,EAAA,eAAA,CAAgB,MAAM;AACpB,IAAA,IAAI,CAAC,IAAM,EAAA;AACT,MAAA,KAAA,CAAM,OAAQ,EAAA,CAAA;AAAA,KAChB;AAAA,GAGF,EAAG,CAAC,IAAI,CAAC,CAAA,CAAA;AAET,EAAA,uBAAQ,KAAA,CAAA,aAAA,CAAA,aAAA,EAAA;AAAA,IAAc,KAAA;AAAA,IAAc,MAAQ,EAAA,IAAA;AAAA,IAAM,WAAW,EAAA,IAAA;AAAA,IAAC,GAAK,EAAA,SAAA;AAAA,GAAW,CAAA,CAAA;AAChF,CAAC;;;;"}
|