Umbraco 13 to 17: Equivalent of block.Index in custom backoffice views

Questions
1

Hi all,

I’m migrating custom backoffice views for some blocks from v13 - v17.

In the old AngularJS setup, it was possible to get the index of a block using {{block.index}}.

Anyone know of an equivalent method to expose this in the new backoffice?

Thanks!

2

Anything in… UMB_BLOCK_ENTRY_CONTEXT

untested AI generation…

this.consumeContext(UMB_BLOCK_ENTRY_CONTEXT, (instance) => {
      if (!instance) return;

      // Observe layout changes or query the block manager for its current index
      this.observe(instance.layout, (layout) => {
        if (layout && 'index' in layout) {
          this._blockIndex = (layout as any).index;
        }
      });
    });
3

Thanks Mike! Great starting point, tweaked it and got it working.

For anyone else trying to solve, managed to get there with this:

 import { UMB_BLOCK_ENTRY_CONTEXT } from '@umbraco-cms/backoffice/block';

@property({ type: Number })
private _blockIndex = 0;

constructor() {
    super();

    this.consumeContext(UMB_BLOCK_ENTRY_CONTEXT, (instance) => {
        if (!instance) return;

        this.observe(instance.index, (i) => {
            if (i !== undefined) {
                this._blockIndex = i;
            }
        });
    });
} 

return html`
<div>
       ${this._blockIndex}
</div>
`;