@grafana/scenes 6.12.0--canary.1121.15045230319.0 → 6.12.0--canary.1121.15070832166.0

package/dist/index.d.ts

@@ -1,7 +1,7 @@
 import * as _grafana_data from '@grafana/data';
 import { BusEventWithPayload, EventBus, BusEvent, BusEventType, BusEventHandler, PanelMenuItem, FieldConfigSource, PanelPlugin, AbsoluteTimeRange, PanelData, InterpolateFunction, PanelModel, TimeRange, DataTransformContext, DataFrame, DataQueryRequest, DataSourceGetTagKeysOptions, DataSourceGetTagValuesOptions, IconName, PageLayoutType, UrlQueryMap, DataQuery as DataQuery$1, DataSourceApi, Registry, RegistryItem, ScopedVars, AdHocVariableFilter, GetTagResponse, MetricFindValue, SelectableValue, VariableRefresh as VariableRefresh$1, VariableSort, Scope, EventFilterOptions, AnnotationEvent, AnnotationQuery, DataTransformerConfig, TimeOption, FieldConfig, FieldType, FieldValueMatcherConfig, ScopedVar, RawTimeRange } from '@grafana/data';
 import * as React$1 from 'react';
-import React__default, { ComponentType, ReactNode, CSSProperties, PointerEvent, ForwardRefExoticComponent } from 'react';
+import React__default, { ComponentType, CSSProperties, PointerEvent, ForwardRefExoticComponent } from 'react';
 import * as rxjs from 'rxjs';
 import { Observable, Subscription, Unsubscribable, MonoTypeOperatorFunction, ReplaySubject } from 'rxjs';
 import * as _grafana_schema from '@grafana/schema';
@@ -64,9 +64,9 @@ interface SceneVariable<TState extends SceneVariableState = SceneVariableState>
      */
     onCancel?(): void;
     /**
-     * Edge case for variables that is hidden but wants to be render to access react contexts (ScopesVariable)
+     * Edge case for variables that are hidden but wants to be render to access react contexts (ScopesVariable)
      */
-    hiddenRender?(): React.ReactNode;
+    UNSAFE_renderAsHidden?: boolean;
     /**
      * @experimental
      * Indicates that a variable loads values lazily when user interacts with the variable dropdown.
@@ -280,7 +280,7 @@ interface VariableDependencyConfigOptions<TState extends SceneObjectState> {
      */
     handleTimeMacros?: boolean;
     /**
-     * Depends on scopes
+     * Will add ScopesVariable as a dependency which will cause updates when the scopes change.
      */
     dependsOnScopes?: boolean;
 }
@@ -374,7 +374,7 @@ interface VizPanelState<TOptions = {}, TFieldConfig = {}> extends SceneObjectSta
 }
 declare class VizPanel<TOptions = {}, TFieldConfig extends {} = {}> extends SceneObjectBase<VizPanelState<TOptions, TFieldConfig>> {
     static Component: typeof VizPanelRenderer;
-    protected _variableDependency: VariableDependencyConfig<VizPanelState<TOptions, TFieldConfig>>;
+    protected _variableDependency: VariableDependencyConfig<VizPanelState<{}, {}>>;
     protected _panelContext?: PanelContext;
     private _plugin?;
     private _prevData?;
@@ -414,7 +414,7 @@ declare class VizPanel<TOptions = {}, TFieldConfig extends {} = {}> extends Scen
     private _onSeriesVisibilityChange;
     private _onInstanceStateChange;
     private _onToggleLegendSort;
-    clone(): this;
+    clone(withState?: Partial<VizPanelState>): this;
     private buildPanelContext;
 }
 
@@ -1857,7 +1857,7 @@ interface VariableSelectProps {
     /** To provide an option to hide the label in the variable value selector */
     hideLabel?: boolean;
 }
-declare function VariableValueSelectWrapper({ variable, layout, showAlways, hideLabel }: VariableSelectProps): string | number | boolean | React__default.JSX.Element | Iterable<React__default.ReactNode> | null | undefined;
+declare function VariableValueSelectWrapper({ variable, layout, showAlways, hideLabel }: VariableSelectProps): React__default.JSX.Element | null;
 
 interface VariableValueControlState extends SceneObjectState {
     layout?: ControlsLayout;
@@ -1987,11 +1987,13 @@ interface ScopesVariableState extends SceneVariableState {
 declare class ScopesVariable extends SceneObjectBase<ScopesVariableState> implements SceneVariable<ScopesVariableState> {
     protected _renderBeforeActivation: boolean;
     protected _context: ScopesContextValue | undefined;
+    UNSAFE_renderAsHidden: boolean;
+    static Component: typeof ScopesVariableRenderer;
     constructor(state: Partial<ScopesVariableState>);
     /**
      * Temporary simple implementation to stringify the scopes.
      */
-    getValue(fieldPath: string): VariableValue;
+    getValue(): VariableValue;
     getScopes(): Scope[] | undefined;
     /**
      * This method is used to keep the context up to date with the scopes context received from React
@@ -2003,11 +2005,8 @@ declare class ScopesVariable extends SceneObjectBase<ScopesVariableState> implem
         loading: boolean;
         value: Scope[];
     }): void;
-    /**
-     * Special function that enables variables to be hidden but still render to access react contexts
-     */
-    hiddenRender(): ReactNode;
 }
+declare function ScopesVariableRenderer({ model }: SceneComponentProps<ScopesVariable>): null;
 
 interface LocalValueVariableState extends SceneVariableState {
     value: VariableValue;

package/dist/index.js

@@ -7087,15 +7087,16 @@ class ScopesVariable extends SceneObjectBase {
       hide: schema.VariableHide.hideVariable
     });
     this._renderBeforeActivation = true;
+    // Special options that enables variables to be hidden but still render to access react contexts
+    this.UNSAFE_renderAsHidden = true;
   }
   /**
    * Temporary simple implementation to stringify the scopes.
    */
-  getValue(fieldPath) {
+  getValue() {
     var _a;
     const scopes = (_a = this.state.scopes) != null ? _a : [];
-    const scopeNames = scopes.map((scope) => scope.metadata.name);
-    return scopeNames.join(", ");
+    return new ScopesVariableFormatter(scopes.map((scope) => scope.metadata.name));
   }
   getScopes() {
     return this.state.scopes;
@@ -7131,13 +7132,8 @@ class ScopesVariable extends SceneObjectBase {
       this.publishEvent(new SceneVariableValueChangedEvent(this), true);
     }
   }
-  /**
-   * Special function that enables variables to be hidden but still render to access react contexts
-   */
-  hiddenRender() {
-    return /* @__PURE__ */ React__default.default.createElement(ScopesVariableRenderer, { model: this });
-  }
 }
+ScopesVariable.Component = ScopesVariableRenderer;
 function ScopesVariableRenderer({ model }) {
   const context = React.useContext(runtime.ScopesContext);
   React.useEffect(() => {
@@ -7145,6 +7141,17 @@ function ScopesVariableRenderer({ model }) {
   }, [context, model]);
   return null;
 }
+class ScopesVariableFormatter {
+  constructor(_value) {
+    this._value = _value;
+  }
+  formatter(formatNameOrFn) {
+    if (formatNameOrFn === schema.VariableFormatID.QueryParam) {
+      return this._value.map((scope) => `scope=${encodeURIComponent(scope)}`).join("&");
+    }
+    return this._value.join(", ");
+  }
+}
 
 function getVariables(sceneObject) {
   var _a;
@@ -8351,8 +8358,8 @@ class VizPanel extends SceneObjectBase {
     this._prevData = rawData;
     return this._dataWithFieldConfig;
   }
-  clone() {
-    return super.clone({ _pluginInstanceState: void 0, _pluginLoadError: void 0 });
+  clone(withState) {
+    return super.clone({ _pluginInstanceState: void 0, _pluginLoadError: void 0, ...withState });
   }
   buildPanelContext() {
     const sync = getCursorSyncScope(this);
@@ -9407,8 +9414,8 @@ function VariableValueSelectorsRenderer({ model }) {
 function VariableValueSelectWrapper({ variable, layout, showAlways, hideLabel }) {
   const state = useSceneObjectState(variable, { shouldActivateOrKeepAlive: true });
   if (state.hide === data.VariableHide.hideVariable && !showAlways) {
-    if (variable.hiddenRender) {
-      return variable.hiddenRender();
+    if (variable.UNSAFE_renderAsHidden) {
+      return /* @__PURE__ */ React__default.default.createElement(variable.Component, { model: variable });
     }
     return null;
   }