@grafana/scenes 6.27.1 → 6.27.3--canary.1189.16466706909.0

package/dist/esm/variables/variants/TextBoxVariable.js

@@ -12,7 +12,7 @@ class TextBoxVariable extends SceneObjectBase {
       name: "",
       ...initialState
     });
-    this._urlSync = new SceneObjectUrlSyncConfig(this, { keys: () => [this.getKey()] });
+    this._urlSync = new SceneObjectUrlSyncConfig(this, { keys: () => this.getKeys() });
   }
   getValue() {
     return this.state.value;
@@ -26,7 +26,16 @@ class TextBoxVariable extends SceneObjectBase {
   getKey() {
     return `var-${this.state.name}`;
   }
+  getKeys() {
+    if (this.state.skipUrlSync) {
+      return [];
+    }
+    return [this.getKey()];
+  }
   getUrlState() {
+    if (this.state.skipUrlSync) {
+      return {};
+    }
     return { [this.getKey()]: this.state.value };
   }
   updateFromUrl(values) {

package/dist/esm/variables/variants/TextBoxVariable.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextBoxVariable.js","sources":["../../../../src/variables/variants/TextBoxVariable.tsx"],"sourcesContent":["import React from 'react';\nimport { SceneObjectBase } from '../../core/SceneObjectBase';\nimport { SceneComponentProps, SceneObjectUrlValues } from '../../core/types';\nimport { SceneObjectUrlSyncConfig } from '../../services/SceneObjectUrlSyncConfig';\nimport { VariableValueInput } from '../components/VariableValueInput';\nimport { SceneVariable, SceneVariableState, SceneVariableValueChangedEvent, VariableValue } from '../types';\n\nexport interface TextBoxVariableState extends SceneVariableState {\n  value: string;\n}\n\nexport class TextBoxVariable\n  extends SceneObjectBase<TextBoxVariableState>\n  implements SceneVariable<TextBoxVariableState>\n{\n  public constructor(initialState: Partial<TextBoxVariableState>) {\n    super({\n      type: 'textbox',\n      value: '',\n      name: '',\n      ...initialState,\n    });\n\n    this._urlSync = new SceneObjectUrlSyncConfig(this, { keys: () => [this.getKey()] });\n  }\n\n  public getValue(): VariableValue {\n    return this.state.value;\n  }\n\n  public setValue(newValue: string) {\n    if (newValue !== this.state.value) {\n      this.setState({ value: newValue });\n      this.publishEvent(new SceneVariableValueChangedEvent(this), true);\n    }\n  }\n\n  private getKey(): string {\n    return `var-${this.state.name}`;\n  }\n\n  public getUrlState() {\n    return { [this.getKey()]: this.state.value };\n  }\n\n  public updateFromUrl(values: SceneObjectUrlValues) {\n    const val = values[this.getKey()];\n\n    if (typeof val === 'string') {\n      this.setValue(val);\n    }\n  }\n\n  public static Component = ({ model }: SceneComponentProps<TextBoxVariable>) => {\n    return <VariableValueInput model={model} />;\n  };\n}\n"],"names":[],"mappings":";;;;;;AAWO,MAAM,wBACH,eAEV,CAAA;AAAA,EACS,YAAY,YAA6C,EAAA;AAC9D,IAAM,KAAA,CAAA;AAAA,MACJ,IAAM,EAAA,SAAA;AAAA,MACN,KAAO,EAAA,EAAA;AAAA,MACP,IAAM,EAAA,EAAA;AAAA,MACN,GAAG;AAAA,KACJ,CAAA;AAED,IAAA,IAAA,CAAK,QAAW,GAAA,IAAI,wBAAyB,CAAA,IAAA,EAAM,EAAE,IAAA,EAAM,MAAM,CAAC,IAAK,CAAA,MAAA,EAAQ,CAAA,EAAG,CAAA;AAAA;AACpF,EAEO,QAA0B,GAAA;AAC/B,IAAA,OAAO,KAAK,KAAM,CAAA,KAAA;AAAA;AACpB,EAEO,SAAS,QAAkB,EAAA;AAChC,IAAI,IAAA,QAAA,KAAa,IAAK,CAAA,KAAA,CAAM,KAAO,EAAA;AACjC,MAAA,IAAA,CAAK,QAAS,CAAA,EAAE,KAAO,EAAA,QAAA,EAAU,CAAA;AACjC,MAAA,IAAA,CAAK,YAAa,CAAA,IAAI,8BAA+B,CAAA,IAAI,GAAG,IAAI,CAAA;AAAA;AAClE;AACF,EAEQ,MAAiB,GAAA;AACvB,IAAO,OAAA,CAAA,IAAA,EAAO,IAAK,CAAA,KAAA,CAAM,IAAI,CAAA,CAAA;AAAA;AAC/B,EAEO,WAAc,GAAA;AACnB,IAAO,OAAA,EAAE,CAAC,IAAK,CAAA,MAAA,EAAQ,GAAG,IAAA,CAAK,MAAM,KAAM,EAAA;AAAA;AAC7C,EAEO,cAAc,MAA8B,EAAA;AACjD,IAAA,MAAM,GAAM,GAAA,MAAA,CAAO,IAAK,CAAA,MAAA,EAAQ,CAAA;AAEhC,IAAI,IAAA,OAAO,QAAQ,QAAU,EAAA;AAC3B,MAAA,IAAA,CAAK,SAAS,GAAG,CAAA;AAAA;AACnB;AAMJ;AA7Ca,eAAA,CA0CG,SAAY,GAAA,CAAC,EAAE,KAAA,EAAkD,KAAA;AAC7E,EAAO,uBAAA,KAAA,CAAA,aAAA,CAAC,sBAAmB,KAAc,EAAA,CAAA;AAC3C,CAAA;;;;"}
+{"version":3,"file":"TextBoxVariable.js","sources":["../../../../src/variables/variants/TextBoxVariable.tsx"],"sourcesContent":["import React from 'react';\nimport { SceneObjectBase } from '../../core/SceneObjectBase';\nimport { SceneComponentProps, SceneObjectUrlValues } from '../../core/types';\nimport { SceneObjectUrlSyncConfig } from '../../services/SceneObjectUrlSyncConfig';\nimport { VariableValueInput } from '../components/VariableValueInput';\nimport { SceneVariable, SceneVariableState, SceneVariableValueChangedEvent, VariableValue } from '../types';\n\nexport interface TextBoxVariableState extends SceneVariableState {\n  value: string;\n}\n\nexport class TextBoxVariable\n  extends SceneObjectBase<TextBoxVariableState>\n  implements SceneVariable<TextBoxVariableState>\n{\n  public constructor(initialState: Partial<TextBoxVariableState>) {\n    super({\n      type: 'textbox',\n      value: '',\n      name: '',\n      ...initialState,\n    });\n\n    this._urlSync = new SceneObjectUrlSyncConfig(this, { keys: () => this.getKeys() });\n  }\n\n  public getValue(): VariableValue {\n    return this.state.value;\n  }\n\n  public setValue(newValue: string) {\n    if (newValue !== this.state.value) {\n      this.setState({ value: newValue });\n      this.publishEvent(new SceneVariableValueChangedEvent(this), true);\n    }\n  }\n\n  private getKey(): string {\n    return `var-${this.state.name}`;\n  }\n\n  public getKeys(): string[] {\n    if (this.state.skipUrlSync) {\n      return [];\n    }\n\n    return [this.getKey()];\n  }\n\n  public getUrlState() {\n    if (this.state.skipUrlSync) {\n      return {};\n    }\n\n    return { [this.getKey()]: this.state.value };\n  }\n\n  public updateFromUrl(values: SceneObjectUrlValues) {\n    const val = values[this.getKey()];\n\n    if (typeof val === 'string') {\n      this.setValue(val);\n    }\n  }\n\n  public static Component = ({ model }: SceneComponentProps<TextBoxVariable>) => {\n    return <VariableValueInput model={model} />;\n  };\n}\n"],"names":[],"mappings":";;;;;;AAWO,MAAM,wBACH,eAEV,CAAA;AAAA,EACS,YAAY,YAA6C,EAAA;AAC9D,IAAM,KAAA,CAAA;AAAA,MACJ,IAAM,EAAA,SAAA;AAAA,MACN,KAAO,EAAA,EAAA;AAAA,MACP,IAAM,EAAA,EAAA;AAAA,MACN,GAAG;AAAA,KACJ,CAAA;AAED,IAAK,IAAA,CAAA,QAAA,GAAW,IAAI,wBAAA,CAAyB,IAAM,EAAA,EAAE,MAAM,MAAM,IAAA,CAAK,OAAQ,EAAA,EAAG,CAAA;AAAA;AACnF,EAEO,QAA0B,GAAA;AAC/B,IAAA,OAAO,KAAK,KAAM,CAAA,KAAA;AAAA;AACpB,EAEO,SAAS,QAAkB,EAAA;AAChC,IAAI,IAAA,QAAA,KAAa,IAAK,CAAA,KAAA,CAAM,KAAO,EAAA;AACjC,MAAA,IAAA,CAAK,QAAS,CAAA,EAAE,KAAO,EAAA,QAAA,EAAU,CAAA;AACjC,MAAA,IAAA,CAAK,YAAa,CAAA,IAAI,8BAA+B,CAAA,IAAI,GAAG,IAAI,CAAA;AAAA;AAClE;AACF,EAEQ,MAAiB,GAAA;AACvB,IAAO,OAAA,CAAA,IAAA,EAAO,IAAK,CAAA,KAAA,CAAM,IAAI,CAAA,CAAA;AAAA;AAC/B,EAEO,OAAoB,GAAA;AACzB,IAAI,IAAA,IAAA,CAAK,MAAM,WAAa,EAAA;AAC1B,MAAA,OAAO,EAAC;AAAA;AAGV,IAAO,OAAA,CAAC,IAAK,CAAA,MAAA,EAAQ,CAAA;AAAA;AACvB,EAEO,WAAc,GAAA;AACnB,IAAI,IAAA,IAAA,CAAK,MAAM,WAAa,EAAA;AAC1B,MAAA,OAAO,EAAC;AAAA;AAGV,IAAO,OAAA,EAAE,CAAC,IAAK,CAAA,MAAA,EAAQ,GAAG,IAAA,CAAK,MAAM,KAAM,EAAA;AAAA;AAC7C,EAEO,cAAc,MAA8B,EAAA;AACjD,IAAA,MAAM,GAAM,GAAA,MAAA,CAAO,IAAK,CAAA,MAAA,EAAQ,CAAA;AAEhC,IAAI,IAAA,OAAO,QAAQ,QAAU,EAAA;AAC3B,MAAA,IAAA,CAAK,SAAS,GAAG,CAAA;AAAA;AACnB;AAMJ;AAzDa,eAAA,CAsDG,SAAY,GAAA,CAAC,EAAE,KAAA,EAAkD,KAAA;AAC7E,EAAO,uBAAA,KAAA,CAAA,aAAA,CAAC,sBAAmB,KAAc,EAAA,CAAA;AAC3C,CAAA;;;;"}

package/dist/index.d.ts

@@ -1152,6 +1152,7 @@ declare class TextBoxVariable extends SceneObjectBase<TextBoxVariableState> impl
     getValue(): VariableValue;
     setValue(newValue: string): void;
     private getKey;
+    getKeys(): string[];
     getUrlState(): {
         [x: string]: string;
     };

package/dist/index.js

@@ -1214,9 +1214,12 @@ function getTimeWindow(time, timeWindow) {
   };
 }
 function getValidTimeZone(timeZone) {
-  if (timeZone === void 0 || timeZone === "") {
+  if (timeZone === void 0) {
     return void 0;
   }
+  if (lodash.isEmpty(timeZone)) {
+    return runtime.config.bootData.user.timezone;
+  }
   if (timeZone === schema.defaultTimeZone) {
     return timeZone;
   }
@@ -1504,6 +1507,20 @@ const formatRegistry = new data.Registry(() => {
       description: "SQL string quoting and commas for use in IN statements and other scenarios",
       formatter: sqlStringFormatter
     },
+    {
+      id: "join",
+      // join not yet available in depended @grafana/schema version
+      name: "Join",
+      description: "Join values with a comma",
+      formatter: (value, args) => {
+        var _a;
+        if (lodash.isArray(value)) {
+          const separator = (_a = args[0]) != null ? _a : ",";
+          return value.join(separator);
+        }
+        return String(value);
+      }
+    },
     {
       id: schema.VariableFormatID.Date,
       name: "Date",
@@ -1578,6 +1595,19 @@ const formatRegistry = new data.Registry(() => {
         return formatQueryParameter(variable.state.name, value);
       }
     },
+    {
+      id: "customqueryparam",
+      name: "Custom query parameter",
+      description: "Format variables as URL parameters with custom name and value prefix. Example in multi-variable scenario A + B + C => p-foo=x-A&p-foo=x-B&p-foo=x-C.",
+      formatter: (value, args, variable) => {
+        const name = encodeURIComponentStrict(args[0] || variable.state.name);
+        const valuePrefix = encodeURIComponentStrict(args[1] || "");
+        if (Array.isArray(value)) {
+          return value.map((v) => customFormatQueryParameter(name, v, valuePrefix)).join("&");
+        }
+        return customFormatQueryParameter(name, value, valuePrefix);
+      }
+    },
     {
       id: schema.VariableFormatID.UriEncode,
       name: "Percent encode as URI",
@@ -1614,6 +1644,9 @@ const replaceSpecialCharactersToASCII = (value) => value.replace(/[!'()*]/g, (c)
 function formatQueryParameter(name, value) {
   return `var-${name}=${encodeURIComponentStrict(value)}`;
 }
+function customFormatQueryParameter(name, value, valuePrefix = "") {
+  return `${name}=${valuePrefix}${encodeURIComponentStrict(value)}`;
+}
 const SQL_ESCAPE_MAP = {
   "'": "''",
   '"': '\\"'
@@ -5681,7 +5714,7 @@ class AdHocFiltersVariable extends SceneObjectBase {
     }
     (_e = this.state.originFilters) == null ? void 0 : _e.forEach((filter) => {
       var _a2;
-      this._originalValues.set(filter.key, {
+      this._originalValues.set(`${filter.key}-${filter.origin}`, {
         operator: filter.operator,
         value: (_a2 = filter.values) != null ? _a2 : [filter.value]
       });
@@ -5706,7 +5739,7 @@ class AdHocFiltersVariable extends SceneObjectBase {
     const remainingFilters = [];
     finalFilters.forEach((scopeFilter) => {
       var _a2;
-      this._originalValues.set(scopeFilter.key, {
+      this._originalValues.set(`${scopeFilter.key}-${scopeFilter.origin}`, {
         value: (_a2 = scopeFilter.values) != null ? _a2 : [scopeFilter.value],
         operator: scopeFilter.operator
       });
@@ -5777,7 +5810,7 @@ class AdHocFiltersVariable extends SceneObjectBase {
       restorable: false
     };
     if (filter.restorable) {
-      const originalFilter = this._originalValues.get(filter.key);
+      const originalFilter = this._originalValues.get(`${filter.key}-${filter.origin}`);
       if (!originalFilter) {
         return;
       }
@@ -5796,7 +5829,7 @@ class AdHocFiltersVariable extends SceneObjectBase {
     var _a;
     const { originFilters, filters, _wip } = this.state;
     if (filter.origin) {
-      const originalValues = this._originalValues.get(filter.key);
+      const originalValues = this._originalValues.get(`${filter.key}-${filter.origin}`);
       const updateValues = update.values || (update.value ? [update.value] : void 0);
       if (updateValues && !lodash.isEqual(updateValues, originalValues == null ? void 0 : originalValues.value) || update.operator && update.operator !== (originalValues == null ? void 0 : originalValues.operator)) {
         update.restorable = true;
@@ -5926,7 +5959,7 @@ class AdHocFiltersVariable extends SceneObjectBase {
         if (!f.matchAllFilter) {
           f.nonApplicable = true;
         }
-        const originalValue = this._originalValues.get(f.key);
+        const originalValue = this._originalValues.get(`${f.key}-${f.origin}`);
         if (originalValue) {
           originalValue.nonApplicable = true;
         }
@@ -10443,7 +10476,7 @@ class TextBoxVariable extends SceneObjectBase {
       name: "",
       ...initialState
     });
-    this._urlSync = new SceneObjectUrlSyncConfig(this, { keys: () => [this.getKey()] });
+    this._urlSync = new SceneObjectUrlSyncConfig(this, { keys: () => this.getKeys() });
   }
   getValue() {
     return this.state.value;
@@ -10457,7 +10490,16 @@ class TextBoxVariable extends SceneObjectBase {
   getKey() {
     return `var-${this.state.name}`;
   }
+  getKeys() {
+    if (this.state.skipUrlSync) {
+      return [];
+    }
+    return [this.getKey()];
+  }
   getUrlState() {
+    if (this.state.skipUrlSync) {
+      return {};
+    }
     return { [this.getKey()]: this.state.value };
   }
   updateFromUrl(values) {
@@ -10886,6 +10928,7 @@ function VizPanelMenuRenderer({ model }) {
             ui.Menu.Item,
             {
               key: item.text,
+              role: "menuitem",
               label: item.text,
               icon: item.iconClassName,
               childItems: item.subMenu ? renderItems(item.subMenu) : void 0,