import { UmbContextToken } from '@umbraco-cms/backoffice/context-api';
import type { MyGlobalContext } from './my-global-context.js';

export const MY_GLOBAL_CONTEXT = new UmbContextToken<MyGlobalContext>(
  'My.GlobalContext'
);

import { UmbContextBase } from '@umbraco-cms/backoffice/class-api';
import type { UmbControllerHost } from '@umbraco-cms/backoffice/controller-api';
import { MY_GLOBAL_CONTEXT } from './my-global-context.token.js';

export class MyGlobalContext extends UmbContextBase {
  #currentValue = '';

  constructor(host: UmbControllerHost) {
    super(host, MY_GLOBAL_CONTEXT);
  }

  getValue(): string {
    return this.#currentValue;
  }

  setValue(value: string): void {
    this.#currentValue = value;
  }
}

{
  "name": "My Global Context Package",
  "extensions": [
    {
      "type": "globalContext",
      "alias": "My.GlobalContext",
      "name": "My Global Context",
      "js": "/App_Plugins/MyPackage/my-global-context.js"
    }
  ]
}

import { UmbElementMixin } from '@umbraco-cms/backoffice/element-api';
import { MY_GLOBAL_CONTEXT } from './my-global-context.token.js';

class MyElement extends UmbElementMixin(LitElement) {
  #myContext?: MyGlobalContext;

  constructor() {
    super();
    this.consumeContext(MY_GLOBAL_CONTEXT, (instance) => {
      this.#myContext = instance;
    });
  }
}