@grafana/scenes 6.2.0--canary.1062.13673471910.0 → 6.2.0--canary.1070.13674378560.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/core/SceneObjectBase.js +7 -0
- package/dist/esm/core/SceneObjectBase.js.map +1 -1
- package/dist/esm/variables/adhoc/AdHocFiltersCombobox/AdHocFilterPill.js +3 -12
- package/dist/esm/variables/adhoc/AdHocFiltersCombobox/AdHocFilterPill.js.map +1 -1
- package/dist/esm/variables/adhoc/AdHocFiltersCombobox/AdHocFiltersCombobox.js +4 -11
- package/dist/esm/variables/adhoc/AdHocFiltersCombobox/AdHocFiltersCombobox.js.map +1 -1
- package/dist/esm/variables/adhoc/AdHocFiltersVariable.js +8 -52
- package/dist/esm/variables/adhoc/AdHocFiltersVariable.js.map +1 -1
- package/dist/esm/variables/adhoc/AdHocFiltersVariableUrlSyncHandler.js +9 -41
- package/dist/esm/variables/adhoc/AdHocFiltersVariableUrlSyncHandler.js.map +1 -1
- package/dist/esm/variables/utils.js +1 -11
- package/dist/esm/variables/utils.js.map +1 -1
- package/dist/index.d.ts +5 -2
- package/dist/index.js +29 -123
- package/dist/index.js.map +1 -1
- package/package.json +2 -2
package/dist/index.js
CHANGED
|
@@ -468,6 +468,13 @@ class SceneObjectBase {
|
|
|
468
468
|
}
|
|
469
469
|
return this._ref;
|
|
470
470
|
}
|
|
471
|
+
toJSON() {
|
|
472
|
+
return {
|
|
473
|
+
type: Object.getPrototypeOf(this).constructor.name,
|
|
474
|
+
isActive: this.isActive,
|
|
475
|
+
state: this.state
|
|
476
|
+
};
|
|
477
|
+
}
|
|
471
478
|
}
|
|
472
479
|
function useSceneObjectState(model, options) {
|
|
473
480
|
var _a;
|
|
@@ -3935,44 +3942,19 @@ class AdHocFiltersVariableUrlSyncHandler {
|
|
|
3935
3942
|
}
|
|
3936
3943
|
getUrlState() {
|
|
3937
3944
|
const filters = this._variable.state.filters;
|
|
3938
|
-
|
|
3939
|
-
let value = [];
|
|
3940
|
-
if (filters.length === 0 && (baseFilters == null ? void 0 : baseFilters.length) === 0) {
|
|
3945
|
+
if (filters.length === 0) {
|
|
3941
3946
|
return { [this.getKey()]: [""] };
|
|
3942
3947
|
}
|
|
3943
|
-
|
|
3944
|
-
|
|
3945
|
-
...filters.filter(isFilterComplete).filter((filter) => !filter.hidden).map((filter) => toArray(filter).map(escapeUrlPipeDelimiters).join("|"))
|
|
3946
|
-
);
|
|
3947
|
-
}
|
|
3948
|
-
if (baseFilters == null ? void 0 : baseFilters.length) {
|
|
3949
|
-
value.push(
|
|
3950
|
-
...baseFilters == null ? void 0 : baseFilters.filter(isFilterComplete).filter((filter) => !filter.hidden && filter.origin && filter.originalValue).map(
|
|
3951
|
-
(filter) => {
|
|
3952
|
-
var _a, _b;
|
|
3953
|
-
return toArray(filter).map(escapeInjectedFilterUrlDelimiters).join("|").concat(
|
|
3954
|
-
`#${(_b = (_a = filter.originalValue) == null ? void 0 : _a.map(escapeInjectedFilterUrlDelimiters).join("|")) != null ? _b : ""}#${filter.origin}`
|
|
3955
|
-
);
|
|
3956
|
-
}
|
|
3957
|
-
)
|
|
3958
|
-
);
|
|
3959
|
-
}
|
|
3960
|
-
return {
|
|
3961
|
-
[this.getKey()]: value.length ? value : [""]
|
|
3962
|
-
};
|
|
3948
|
+
const value = filters.filter(isFilterComplete).filter((filter) => !filter.hidden).map((filter) => toArray(filter).map(escapeUrlPipeDelimiters).join("|"));
|
|
3949
|
+
return { [this.getKey()]: value };
|
|
3963
3950
|
}
|
|
3964
3951
|
updateFromUrl(values) {
|
|
3965
3952
|
const urlValue = values[this.getKey()];
|
|
3966
3953
|
if (urlValue == null) {
|
|
3967
3954
|
return;
|
|
3968
3955
|
}
|
|
3969
|
-
|
|
3970
|
-
|
|
3971
|
-
this._variable.setState({
|
|
3972
|
-
filters: filters.filter((f) => !f.origin),
|
|
3973
|
-
baseFilters: filters.filter((f) => f.origin)
|
|
3974
|
-
});
|
|
3975
|
-
}
|
|
3956
|
+
const filters = deserializeUrlToFilters(urlValue);
|
|
3957
|
+
this._variable.setState({ filters });
|
|
3976
3958
|
}
|
|
3977
3959
|
}
|
|
3978
3960
|
function deserializeUrlToFilters(value) {
|
|
@@ -3997,12 +3979,10 @@ function toArray(filter) {
|
|
|
3997
3979
|
return result;
|
|
3998
3980
|
}
|
|
3999
3981
|
function toFilter(urlValue) {
|
|
4000
|
-
var _a;
|
|
4001
3982
|
if (typeof urlValue !== "string" || urlValue.length === 0) {
|
|
4002
3983
|
return null;
|
|
4003
3984
|
}
|
|
4004
|
-
const [
|
|
4005
|
-
const [key, keyLabel, operator, _operatorLabel, ...values] = filter.split("|").reduce((acc, v) => {
|
|
3985
|
+
const [key, keyLabel, operator, _operatorLabel, ...values] = urlValue.split("|").reduce((acc, v) => {
|
|
4006
3986
|
const [key2, label] = v.split(",");
|
|
4007
3987
|
acc.push(key2, label != null ? label : key2);
|
|
4008
3988
|
return acc;
|
|
@@ -4014,14 +3994,9 @@ function toFilter(urlValue) {
|
|
|
4014
3994
|
value: values[0],
|
|
4015
3995
|
values: isMultiValueOperator(operator) ? values.filter((_, index) => index % 2 === 0) : void 0,
|
|
4016
3996
|
valueLabels: values.filter((_, index) => index % 2 === 1),
|
|
4017
|
-
condition: ""
|
|
4018
|
-
origin: isFilterOrigin(origin) ? origin : void 0,
|
|
4019
|
-
originalValue: originalValues && originalValues.length ? (_a = originalValues.split("|")) != null ? _a : [originalValues] : void 0
|
|
3997
|
+
condition: ""
|
|
4020
3998
|
};
|
|
4021
3999
|
}
|
|
4022
|
-
function isFilterOrigin(value) {
|
|
4023
|
-
return value === FilterOrigin.Scopes || value === FilterOrigin.Dashboards;
|
|
4024
|
-
}
|
|
4025
4000
|
function isFilter(filter) {
|
|
4026
4001
|
return filter !== null && typeof filter.key === "string" && typeof filter.value === "string";
|
|
4027
4002
|
}
|
|
@@ -4889,20 +4864,13 @@ const AdHocCombobox = React.forwardRef(function AdHocCombobox2({ filter, model,
|
|
|
4889
4864
|
className: styles.pillWrapper
|
|
4890
4865
|
}, (filter == null ? void 0 : filter.key) ? /* @__PURE__ */ React__default["default"].createElement("div", {
|
|
4891
4866
|
className: css.cx(styles.basePill, styles.keyPill)
|
|
4892
|
-
}, keyLabel) : null, (filter == null ? void 0 : filter.key) && (filter == null ? void 0 : filter.operator) && filterInputType !== "operator" ? /* @__PURE__ */ React__default["default"].createElement("div",
|
|
4867
|
+
}, keyLabel) : null, (filter == null ? void 0 : filter.key) && (filter == null ? void 0 : filter.operator) && filterInputType !== "operator" ? /* @__PURE__ */ React__default["default"].createElement("div", {
|
|
4893
4868
|
id: operatorIdentifier,
|
|
4894
|
-
className: css.cx(
|
|
4895
|
-
|
|
4896
|
-
!filter.origin && styles.operatorPill,
|
|
4897
|
-
filter.origin && styles.keyPill,
|
|
4898
|
-
operatorIdentifier
|
|
4899
|
-
),
|
|
4869
|
+
className: css.cx(styles.basePill, styles.operatorPill, operatorIdentifier),
|
|
4870
|
+
role: "button",
|
|
4900
4871
|
"aria-label": "Edit filter operator",
|
|
4901
4872
|
tabIndex: 0,
|
|
4902
4873
|
onClick: (event) => {
|
|
4903
|
-
if (filter.origin) {
|
|
4904
|
-
return;
|
|
4905
|
-
}
|
|
4906
4874
|
event.stopPropagation();
|
|
4907
4875
|
setInputValue("");
|
|
4908
4876
|
switchInputType("operator", setInputType, void 0, refs.domReference.current);
|
|
@@ -4914,7 +4882,7 @@ const AdHocCombobox = React.forwardRef(function AdHocCombobox2({ filter, model,
|
|
|
4914
4882
|
switchInputType("operator", setInputType, void 0, refs.domReference.current);
|
|
4915
4883
|
}
|
|
4916
4884
|
}
|
|
4917
|
-
},
|
|
4885
|
+
}, filter.operator) : null, /* @__PURE__ */ React__default["default"].createElement("div", {
|
|
4918
4886
|
ref: multiValuePillWrapperRef
|
|
4919
4887
|
}), isMultiValueEdit ? filterMultiValues.map((item, i) => /* @__PURE__ */ React__default["default"].createElement(MultiValuePill, {
|
|
4920
4888
|
key: `${item.value}-${i}`,
|
|
@@ -5161,13 +5129,13 @@ function AdHocFilterPill({ filter, model, readOnly, focusOnWipInputRef }) {
|
|
|
5161
5129
|
const handleChangeViewMode = React.useCallback(
|
|
5162
5130
|
(event, shouldFocusOnPillWrapperOverride) => {
|
|
5163
5131
|
event == null ? void 0 : event.stopPropagation();
|
|
5164
|
-
if (readOnly) {
|
|
5132
|
+
if (readOnly || filter.origin) {
|
|
5165
5133
|
return;
|
|
5166
5134
|
}
|
|
5167
5135
|
setShouldFocusOnPillWrapper(shouldFocusOnPillWrapperOverride != null ? shouldFocusOnPillWrapperOverride : !viewMode);
|
|
5168
5136
|
setViewMode(!viewMode);
|
|
5169
5137
|
},
|
|
5170
|
-
[readOnly, viewMode]
|
|
5138
|
+
[readOnly, viewMode, filter.origin]
|
|
5171
5139
|
);
|
|
5172
5140
|
React.useEffect(() => {
|
|
5173
5141
|
var _a2;
|
|
@@ -5231,20 +5199,11 @@ function AdHocFilterPill({ filter, model, readOnly, focusOnWipInputRef }) {
|
|
|
5231
5199
|
size: "md",
|
|
5232
5200
|
className: styles.pillIcon,
|
|
5233
5201
|
tooltip: `Remove filter with key ${keyLabel}`
|
|
5234
|
-
}) : null, filter.origin &&
|
|
5202
|
+
}) : null, filter.origin && /* @__PURE__ */ React__default["default"].createElement(ui.IconButton, {
|
|
5235
5203
|
name: "info-circle",
|
|
5236
5204
|
size: "md",
|
|
5237
5205
|
className: styles.pillIcon,
|
|
5238
5206
|
tooltip: `This is a ${filter.origin} injected filter`
|
|
5239
|
-
}), filter.origin && filter.originalValue && /* @__PURE__ */ React__default["default"].createElement(ui.IconButton, {
|
|
5240
|
-
onClick: (e) => {
|
|
5241
|
-
e.stopPropagation();
|
|
5242
|
-
model.restoreOriginalFilter(filter);
|
|
5243
|
-
},
|
|
5244
|
-
name: "history",
|
|
5245
|
-
size: "md",
|
|
5246
|
-
className: styles.pillIcon,
|
|
5247
|
-
tooltip: `Restore filter to its original value`
|
|
5248
5207
|
}));
|
|
5249
5208
|
}
|
|
5250
5209
|
return /* @__PURE__ */ React__default["default"].createElement(AdHocCombobox, {
|
|
@@ -5442,17 +5401,14 @@ const OPERATORS = [
|
|
|
5442
5401
|
];
|
|
5443
5402
|
class AdHocFiltersVariable extends SceneObjectBase {
|
|
5444
5403
|
constructor(state) {
|
|
5445
|
-
var _a, _b
|
|
5404
|
+
var _a, _b;
|
|
5446
5405
|
super(__spreadValues$z({
|
|
5447
5406
|
type: "adhoc",
|
|
5448
5407
|
name: (_a = state.name) != null ? _a : "Filters",
|
|
5449
5408
|
filters: [],
|
|
5450
5409
|
datasource: null,
|
|
5451
5410
|
applyMode: "auto",
|
|
5452
|
-
filterExpression: (
|
|
5453
|
-
...(_c = (_b = state.baseFilters) == null ? void 0 : _b.filter((filter) => filter.origin)) != null ? _c : [],
|
|
5454
|
-
...(_d = state.filters) != null ? _d : []
|
|
5455
|
-
])
|
|
5411
|
+
filterExpression: (_b = state.filterExpression) != null ? _b : renderExpression(state.expressionBuilder, state.filters)
|
|
5456
5412
|
}, state));
|
|
5457
5413
|
this._scopedVars = { __sceneObject: wrapInSafeSerializableSceneObject(this) };
|
|
5458
5414
|
this._dataSourceSrv = runtime.getDataSourceSrv();
|
|
@@ -5462,15 +5418,9 @@ class AdHocFiltersVariable extends SceneObjectBase {
|
|
|
5462
5418
|
}
|
|
5463
5419
|
}
|
|
5464
5420
|
setState(update) {
|
|
5465
|
-
var _a, _b, _c;
|
|
5466
5421
|
let filterExpressionChanged = false;
|
|
5467
|
-
if (
|
|
5468
|
-
|
|
5469
|
-
const baseFilters = (_b = update.baseFilters) != null ? _b : this.state.baseFilters;
|
|
5470
|
-
update.filterExpression = renderExpression(this.state.expressionBuilder, [
|
|
5471
|
-
...(_c = baseFilters == null ? void 0 : baseFilters.filter((filter) => filter.origin)) != null ? _c : [],
|
|
5472
|
-
...filters != null ? filters : []
|
|
5473
|
-
]);
|
|
5422
|
+
if (update.filters && update.filters !== this.state.filters && !update.filterExpression) {
|
|
5423
|
+
update.filterExpression = renderExpression(this.state.expressionBuilder, update.filters);
|
|
5474
5424
|
filterExpressionChanged = update.filterExpression !== this.state.filterExpression;
|
|
5475
5425
|
}
|
|
5476
5426
|
super.setState(update);
|
|
@@ -5479,14 +5429,10 @@ class AdHocFiltersVariable extends SceneObjectBase {
|
|
|
5479
5429
|
}
|
|
5480
5430
|
}
|
|
5481
5431
|
updateFilters(filters, options) {
|
|
5482
|
-
var _a, _b;
|
|
5483
5432
|
let filterExpressionChanged = false;
|
|
5484
5433
|
let filterExpression = void 0;
|
|
5485
5434
|
if (filters && filters !== this.state.filters) {
|
|
5486
|
-
filterExpression = renderExpression(this.state.expressionBuilder,
|
|
5487
|
-
...(_b = (_a = this.state.baseFilters) == null ? void 0 : _a.filter((filter) => filter.origin)) != null ? _b : [],
|
|
5488
|
-
...filters
|
|
5489
|
-
]);
|
|
5435
|
+
filterExpression = renderExpression(this.state.expressionBuilder, filters);
|
|
5490
5436
|
filterExpressionChanged = filterExpression !== this.state.filterExpression;
|
|
5491
5437
|
}
|
|
5492
5438
|
super.setState({
|
|
@@ -5497,40 +5443,11 @@ class AdHocFiltersVariable extends SceneObjectBase {
|
|
|
5497
5443
|
this.publishEvent(new SceneVariableValueChangedEvent(this), true);
|
|
5498
5444
|
}
|
|
5499
5445
|
}
|
|
5500
|
-
restoreOriginalFilter(filter) {
|
|
5501
|
-
var _a;
|
|
5502
|
-
const original = {
|
|
5503
|
-
originalValue: void 0
|
|
5504
|
-
};
|
|
5505
|
-
if ((_a = filter.originalValue) == null ? void 0 : _a.length) {
|
|
5506
|
-
original.value = filter.originalValue[0];
|
|
5507
|
-
original.values = filter.originalValue;
|
|
5508
|
-
original.valueLabels = filter.originalValue;
|
|
5509
|
-
}
|
|
5510
|
-
this._updateFilter(filter, original);
|
|
5511
|
-
}
|
|
5512
5446
|
getValue() {
|
|
5513
5447
|
return this.state.filterExpression;
|
|
5514
5448
|
}
|
|
5515
5449
|
_updateFilter(filter, update) {
|
|
5516
|
-
|
|
5517
|
-
const { baseFilters, filters, _wip } = this.state;
|
|
5518
|
-
if (filter.origin) {
|
|
5519
|
-
const currentValues = filter.values ? filter.values : [filter.value];
|
|
5520
|
-
const updateValues = update.values || (update.value ? [update.value] : void 0);
|
|
5521
|
-
const originalValueOverride = update.hasOwnProperty("originalValue");
|
|
5522
|
-
if (!originalValueOverride && updateValues && !filter.originalValue && !lodash.isEqual(currentValues, updateValues)) {
|
|
5523
|
-
update.originalValue = currentValues;
|
|
5524
|
-
}
|
|
5525
|
-
if (!originalValueOverride && lodash.isEqual(updateValues, filter.originalValue)) {
|
|
5526
|
-
update.originalValue = void 0;
|
|
5527
|
-
}
|
|
5528
|
-
const updatedBaseFilters = (_a = baseFilters == null ? void 0 : baseFilters.map((f) => {
|
|
5529
|
-
return f === filter ? __spreadValues$z(__spreadValues$z({}, f), update) : f;
|
|
5530
|
-
})) != null ? _a : [];
|
|
5531
|
-
this.setState({ baseFilters: updatedBaseFilters });
|
|
5532
|
-
return;
|
|
5533
|
-
}
|
|
5450
|
+
const { filters, _wip } = this.state;
|
|
5534
5451
|
if (filter === _wip) {
|
|
5535
5452
|
if ("value" in update && update["value"] !== "") {
|
|
5536
5453
|
this.setState({ filters: [...filters, __spreadValues$z(__spreadValues$z({}, _wip), update)], _wip: void 0 });
|
|
@@ -5616,7 +5533,7 @@ class AdHocFiltersVariable extends SceneObjectBase {
|
|
|
5616
5533
|
return keys.map(toSelectableValue);
|
|
5617
5534
|
}
|
|
5618
5535
|
async _getValuesFor(filter) {
|
|
5619
|
-
var _a, _b, _c
|
|
5536
|
+
var _a, _b, _c;
|
|
5620
5537
|
const override = await ((_b = (_a = this.state).getTagValuesProvider) == null ? void 0 : _b.call(_a, this, filter));
|
|
5621
5538
|
if (override && override.replace) {
|
|
5622
5539
|
return dataFromResponse(override.values).map(toSelectableValue);
|
|
@@ -5625,8 +5542,7 @@ class AdHocFiltersVariable extends SceneObjectBase {
|
|
|
5625
5542
|
if (!ds || !ds.getTagValues) {
|
|
5626
5543
|
return [];
|
|
5627
5544
|
}
|
|
5628
|
-
const
|
|
5629
|
-
const otherFilters = this.state.filters.filter((f) => f.key !== filter.key).concat(filteredBaseFilters);
|
|
5545
|
+
const otherFilters = this.state.filters.filter((f) => f.key !== filter.key).concat((_c = this.state.baseFilters) != null ? _c : []);
|
|
5630
5546
|
const timeRange = sceneGraph.getTimeRange(this).state.value;
|
|
5631
5547
|
const queries = this.state.useQueriesAsFilterForOptions ? getQueriesForVariables(this) : void 0;
|
|
5632
5548
|
const response = await ds.getTagValues(__spreadValues$z({
|
|
@@ -6327,15 +6243,6 @@ function escapeUrlCommaDelimiters(value) {
|
|
|
6327
6243
|
}
|
|
6328
6244
|
return /,/g[Symbol.replace](value, "__gfc__");
|
|
6329
6245
|
}
|
|
6330
|
-
function escapeUrlHashDelimiters(value) {
|
|
6331
|
-
if (value === null || value === void 0) {
|
|
6332
|
-
return "";
|
|
6333
|
-
}
|
|
6334
|
-
return /#/g[Symbol.replace](value, "__gfh__");
|
|
6335
|
-
}
|
|
6336
|
-
function escapeInjectedFilterUrlDelimiters(value) {
|
|
6337
|
-
return escapeUrlHashDelimiters(escapeUrlPipeDelimiters(value));
|
|
6338
|
-
}
|
|
6339
6246
|
function escapeURLDelimiters(value) {
|
|
6340
6247
|
return escapeUrlCommaDelimiters(escapeUrlPipeDelimiters(value));
|
|
6341
6248
|
}
|
|
@@ -6345,7 +6252,6 @@ function unescapeUrlDelimiters(value) {
|
|
|
6345
6252
|
}
|
|
6346
6253
|
value = /__gfp__/g[Symbol.replace](value, "|");
|
|
6347
6254
|
value = /__gfc__/g[Symbol.replace](value, ",");
|
|
6348
|
-
value = /__gfh__/g[Symbol.replace](value, "#");
|
|
6349
6255
|
return value;
|
|
6350
6256
|
}
|
|
6351
6257
|
function toUrlCommaDelimitedString(key, label) {
|