@grafana/scenes 4.13.0--canary.705.8847545922.0 → 4.13.0

package/dist/index.js

@@ -1304,7 +1304,7 @@ function lookupVariable(name, sceneObject) {
   return null;
 }
 
-function sceneInterpolator(sceneObject, target, scopedVars, format) {
+function sceneInterpolator(sceneObject, target, scopedVars, format, interpolations) {
   if (!target) {
     return target != null ? target : "";
   }
@@ -1314,9 +1314,16 @@ function sceneInterpolator(sceneObject, target, scopedVars, format) {
     const fmt = fmt2 || fmt3 || format;
     const variable = lookupFormatVariable(variableName, match, scopedVars, sceneObject);
     if (!variable) {
+      if (interpolations) {
+        interpolations.push({ match, variableName, fieldPath, format: fmt, value: match, found: false });
+      }
       return match;
     }
-    return formatValue(variable, variable.getValue(fieldPath), fmt);
+    const value = formatValue(variable, variable.getValue(fieldPath), fmt);
+    if (interpolations) {
+      interpolations.push({ match, variableName, fieldPath, format: fmt, value, found: value !== match });
+    }
+    return value;
   });
 }
 function lookupFormatVariable(name, match, scopedVars, sceneObject) {
@@ -1455,11 +1462,11 @@ function getLayout(scene) {
   }
   return null;
 }
-function interpolate(sceneObject, value, scopedVars, format) {
+function interpolate(sceneObject, value, scopedVars, format, interpolations) {
   if (value === "" || value == null) {
     return "";
   }
-  return sceneInterpolator(sceneObject, value, scopedVars, format);
+  return sceneInterpolator(sceneObject, value, scopedVars, format, interpolations);
 }
 function hasVariableDependencyInLoadingState(sceneObject) {
   if (!sceneObject.variableDependency) {
@@ -2840,59 +2847,6 @@ class CustomAllValue {
   }
 }
 
-class GroupByVariableUrlSyncHandler {
-  constructor(_sceneObject) {
-    this._sceneObject = _sceneObject;
-  }
-  getKey() {
-    return `var-${this._sceneObject.state.name}`;
-  }
-  getKeys() {
-    if (this._sceneObject.state.skipUrlSync) {
-      return [];
-    }
-    return [this.getKey()];
-  }
-  getUrlState() {
-    if (this._sceneObject.state.skipUrlSync) {
-      return {};
-    }
-    let { value: values, text: texts } = this._sceneObject.state;
-    values = Array.isArray(values) ? values : [values];
-    texts = Array.isArray(texts) ? texts : [texts];
-    const urlValue = lodash.zip(values, texts).map(toUrlValues);
-    return { [this.getKey()]: urlValue };
-  }
-  updateFromUrl(values) {
-    let urlValue = values[this.getKey()];
-    if (urlValue != null) {
-      if (!this._sceneObject.isActive) {
-        this._sceneObject.skipNextValidation = true;
-      }
-      urlValue = Array.isArray(urlValue) ? urlValue : [urlValue];
-      const valuesLabelsPairs = urlValue.map((value) => value ? value.split(",") : [value]);
-      let [values2, labels] = lodash.unzip(valuesLabelsPairs);
-      values2 = (values2 != null ? values2 : []).map(unescapeUrlDelimiters);
-      labels = (labels != null ? labels : []).map(unescapeUrlDelimiters);
-      this._sceneObject.setState({
-        urlOptions: values2.map((value, idx) => ({
-          value,
-          text: labels[idx]
-        }))
-      });
-      this._sceneObject.changeValueTo(values2, labels);
-    }
-  }
-}
-function toUrlValues([value, label]) {
-  if (value === void 0 || value === null) {
-    return "";
-  }
-  value = String(value);
-  label = label === void 0 || label === null ? value : String(label);
-  return toUrlCommaDelimitedString(value, label);
-}
-
 var __defProp$z = Object.defineProperty;
 var __defProps$n = Object.defineProperties;
 var __getOwnPropDescs$n = Object.getOwnPropertyDescriptors;
@@ -2929,7 +2883,6 @@ class GroupByVariable extends MultiValueVariable {
       noValueOnClear: true
     }));
     this.isLazy = true;
-    this._urlSync = new GroupByVariableUrlSyncHandler(this);
     this._getKeys = async (ds) => {
       var _a, _b, _c;
       const override = await ((_b = (_a = this.state).getTagKeysProvider) == null ? void 0 : _b.call(_a, this, null));
@@ -2979,11 +2932,9 @@ class GroupByVariable extends MultiValueVariable {
     this.setState(stateUpdate);
   }
   getValueOptions(args) {
-    var _a;
-    const urlOptions = (_a = this.state.urlOptions) != null ? _a : [];
     if (this.state.defaultOptions) {
       return rxjs.of(
-        lodash.unionBy(this.state.defaultOptions, urlOptions, "value").map((o) => ({
+        this.state.defaultOptions.map((o) => ({
           label: o.text,
           value: String(o.value)
         }))
@@ -2999,7 +2950,7 @@ class GroupByVariable extends MultiValueVariable {
         return rxjs.from(this._getKeys(ds)).pipe(
           rxjs.take(1),
           rxjs.mergeMap((data) => {
-            const a = lodash.unionBy(data, urlOptions, "value").map((i) => {
+            const a = data.map((i) => {
               return {
                 label: i.text,
                 value: i.value ? String(i.value) : i.text
@@ -3017,24 +2968,14 @@ class GroupByVariable extends MultiValueVariable {
 }
 GroupByVariable.Component = GroupByVariableRenderer;
 function GroupByVariableRenderer({ model }) {
-  const { value, text, key, maxVisibleValues, noValueOnClear } = model.useState();
-  const values = React.useMemo(() => {
-    const arrayValue = lodash.isArray(value) ? value : [value];
-    const arrayText = lodash.isArray(text) ? text : [text];
-    return arrayValue.map((value2, idx) => {
-      var _a;
-      return {
-        value: value2,
-        label: String((_a = arrayText[idx]) != null ? _a : value2)
-      };
-    });
-  }, [value, text]);
+  const { value, key, maxVisibleValues, noValueOnClear } = model.useState();
+  const arrayValue = React.useMemo(() => lodash.isArray(value) ? value : [value], [value]);
   const [isFetchingOptions, setIsFetchingOptions] = React.useState(false);
   const [isOptionsOpen, setIsOptionsOpen] = React.useState(false);
-  const [uncommittedValue, setUncommittedValue] = React.useState(values);
+  const [uncommittedValue, setUncommittedValue] = React.useState(arrayValue);
   React.useEffect(() => {
-    setUncommittedValue(values);
-  }, [values]);
+    setUncommittedValue(arrayValue);
+  }, [arrayValue]);
   const onInputChange = model.onSearchChange ? (value2, meta) => {
     if (meta.action === "input-change") {
       model.onSearchChange(value2);
@@ -3059,13 +3000,13 @@ function GroupByVariableRenderer({ model }) {
     isLoading: isFetchingOptions,
     onInputChange,
     onBlur: () => {
-      model.changeValueTo(uncommittedValue.map((x) => x.value));
+      model.changeValueTo(uncommittedValue);
     },
     onChange: (newValue, action) => {
       if (action.action === "clear" && noValueOnClear) {
         model.changeValueTo([]);
       }
-      setUncommittedValue(newValue);
+      setUncommittedValue(newValue.map((x) => x.value));
     },
     onOpenMenu: async () => {
       setIsFetchingOptions(true);
@@ -3388,7 +3329,7 @@ class AdHocFiltersVariableUrlSyncHandler {
     if (filters.length === 0) {
       return { [this.getKey()]: [""] };
     }
-    const value = filters.map((filter) => toArray(filter).map(escapeUrlPipeDelimiters).join("|"));
+    const value = filters.map((filter) => toArray(filter).map(escapePipeDelimiters).join("|"));
     return { [this.getKey()]: value };
   }
   updateFromUrl(values) {
@@ -3408,13 +3349,39 @@ function deserializeUrlToFilters(value) {
   const filter = toFilter(value);
   return filter === null ? [] : [filter];
 }
+function escapePipeDelimiters(value) {
+  if (value === null || value === void 0) {
+    return "";
+  }
+  return value = /\|/g[Symbol.replace](value, "__gfp__");
+}
+function escapeCommaDelimiters(value) {
+  if (value === null || value === void 0) {
+    return "";
+  }
+  return /,/g[Symbol.replace](value, "__gfc__");
+}
+function unescapeDelimiters(value) {
+  if (value === null || value === void 0) {
+    return "";
+  }
+  value = /__gfp__/g[Symbol.replace](value, "|");
+  value = /__gfc__/g[Symbol.replace](value, ",");
+  return value;
+}
 function toArray(filter) {
   return [
-    toUrlCommaDelimitedString(filter.key, filter.keyLabel),
+    toCommaDelimitedString(filter.key, filter.keyLabel),
     filter.operator,
-    toUrlCommaDelimitedString(filter.value, filter.valueLabel)
+    toCommaDelimitedString(filter.value, filter.valueLabel)
   ];
 }
+function toCommaDelimitedString(key, label) {
+  if (!label || key === label) {
+    return escapeCommaDelimiters(key);
+  }
+  return [key, label].map(escapeCommaDelimiters).join(",");
+}
 function toFilter(urlValue) {
   if (typeof urlValue !== "string" || urlValue.length === 0) {
     return null;
@@ -3423,7 +3390,7 @@ function toFilter(urlValue) {
     const [key2, label] = v.split(",");
     acc.push(key2, label != null ? label : key2);
     return acc;
-  }, []).map(unescapeUrlDelimiters);
+  }, []).map(unescapeDelimiters);
   return {
     key,
     keyLabel,
@@ -4133,32 +4100,6 @@ function filterOutInactiveRunnerDuplicates(runners) {
     return activeItems;
   });
 }
-function escapeUrlPipeDelimiters(value) {
-  if (value === null || value === void 0) {
-    return "";
-  }
-  return value = /\|/g[Symbol.replace](value, "__gfp__");
-}
-function escapeUrlCommaDelimiters(value) {
-  if (value === null || value === void 0) {
-    return "";
-  }
-  return /,/g[Symbol.replace](value, "__gfc__");
-}
-function unescapeUrlDelimiters(value) {
-  if (value === null || value === void 0) {
-    return "";
-  }
-  value = /__gfp__/g[Symbol.replace](value, "|");
-  value = /__gfc__/g[Symbol.replace](value, ",");
-  return value;
-}
-function toUrlCommaDelimitedString(key, label) {
-  if (!label || key === label) {
-    return escapeUrlCommaDelimiters(key);
-  }
-  return [key, label].map(escapeUrlCommaDelimiters).join(",");
-}
 
 function isAdHocVariable(variable) {
   return variable.state.type === "adhoc";