v0.2.0

Release Notes

Layout: Create atomic, layout specific objects (#97)

The interface of SceneFlexLayout and SceneGridLayout has changed. These scene objects now accept only dedicated layout item objects as children:

• SceneFlexItem for SceneFlexLayout
• SceneGridItem and SceneGridRow for SceneGridLayout

placement property has been replaced by those layout-specific objects.

Example

// BEFORE
const layout = new SceneFlexLayout({
  direction: 'column',
  children: [
    new VizPanel({
      placement: {
        width: '50%',
        height: '400',
     },
     ...
    })
  ],
  ...
})


// AFTER
const layout = new SceneFlexLayout({
  direction: 'column',
  children: [ 
    new SceneFlexItem({ 
      width: '50%',
      height: '400',
      body: new VizPanel({ ... }),
    }),
  ],
  ...
})

---

🚀 Enhancement

• @grafana/scenes
  • Layout: Create atomic, layout specific objects #97 (@dprokop @torkelo)
  • Interpolation: FormatRegistryID is now replaced by VariableFormatID from schema package #112 (@ryantxu @torkelo)

Authors: 3

• Dominik Prokop (@dprokop)
• Ryan McKinley (@ryantxu)
• Torkel Ödegaard (@torkelo)

v0.1.0

Release Notes

UrlSync: Simplify url sync interface (#100)

The SceneObjectUrlSyncHandler interface has changed. The function getUrlState no longer takes state as parameter. The implementation needs to use the current scene object state instead.

---

🚀 Enhancement

• @grafana/scenes
  • UrlSync: Simplify url sync interface #100 (@torkelo)

🐛 Bug Fix

• Auto: Removing label condition that did not work #109 (@torkelo)
• @grafana/scenes
  • Clean up changelog #108 (@torkelo)

Authors: 1

• Torkel Ödegaard (@torkelo)

v0.0.32

🐛 Bug Fix

• ScenesApp: Change to workspace dependency #99 (@torkelo)
• Yarn: Caching should work #93 (@torkelo)
• @grafana/scenes
  • Enable auto #107 (@torkelo)
  • Fix type import #104 (@torkelo)
  • Macros: Share SkipFormattingValue value between AllUrlVariablesMacro and UrlTimeRangeMacro #101 (@torkelo)
  • Scene: Support for new types of "macro" variables starting with __all_variables #98 (@domasx2 @torkelo)
  • UrlSyncManager: Improvements and fixes #96 (@torkelo)
  • Changelog: Clean up auto crap #94 (@torkelo)

Authors: 2

• Domas (@domasx2)
• Torkel Ödegaard (@torkelo)

v0.0.28

🐛 Bug Fix

• Auto release test #91 (@torkelo)
• Release: test #90 (@torkelo)
• Update #88 (@torkelo)
• Auto: Automate changelog and github releases #85 (@torkelo)
• @grafana/scenes
  • Auto: Another release test #92 (@torkelo)
  • Auto: Testing #89 (@torkelo)

⚠️ Pushed to main

• add step (@torkelo)
• Add a condition (@torkelo)

Authors: 1

• Torkel Ödegaard (@torkelo)

0.0.21

SceneObject subscribeToState parameter change

Signature change. Now the parameter to this function expects a simple function that takes two args (newState, prevState).

Before:

this._subs.add(
  sourceData.subscribeToState({
    next: (state) => this.transform(state.data),
  })
);

Becomes:

this._subs.add(sourceData.subscribeToState((state) => this.transform(state.data)));

addActivationHandler

SceneObject now has a new function called addActivationHandler that makes it much easier to add external behaviors to core scene componenents. The
activation handler (callback) can return a deactivation handler. This works very similar to useEffect.

For custom components that used to override activate and then call super.activate() we now recommend that you instead use addActivationHandler from
the constructor. See #77 for some examples.

VizPanelMenu

A new scene object to enable panel menu for VizPanel.

Example usage:

const menu = new VizPanelMenu({});

// Configure menu items
menu.addActivationHandler(() => {
  menu.setItems(menuItems);
});

// Attach menu to VizPanel
const panelWithMenu = new VizPanel({
  title: 'Panel with menu',
  menu,
  // ... VizPanel configuration
});