Missing explanation where does @use come from

[MichalBryxi]

On this line in the docs we see following example:

import { createMachine } from 'xstate';

const buttonMachine = createMachine(
  {
    initial: 'idle',
    states: {
      idle: {
        on: {
          SUBMIT: 'busy'
        }
      },
      busy: {
        invoke: {
          src: 'handleSubmit',
          onDone: 'success',
          onError: 'error'
        }
      },
      success: {},
      error: {}
    }
  },
  {
    services: {
      handleSubmit: async (/* context, event */) {}
    }
  }
);

export default class MyComponent extends Component {
  // ...

  @use statechart = useMachine(this, () => {
    const { doSomethingAsync } = this;

    return {
      machine: buttonMachine
        .withConfig({
          services: {
            handleSubmit: doSomethingAsync
          }
        })
    }

  // ...

  @action
  buttonClicked() {
    this.statechart.send('SUBMIT');
  }
};

Although it's just an example, I think it should be complete and import @use from somewhere.

[MichalBryxi]

On a second read ... isn't it the other way around? We don't need @use at all anymore and this one instance should be deleted?