How to use the tiptap-extensions.Placeholder function in tiptap-extensions

// пополнение доступных действий для конкретного renderIn
      this.availableActions[paramsFinal.renderIn].push(...extension.availableActions)

      // Сбор нативных расширений
      if (extension.nativeExtensionInstance) {
        nativeExtensionsInstances.push(extension.nativeExtensionInstance)
      }
    })
    const extensions = [
      ...this[PROPS.NATIVE_EXTENSIONS],
      ...nativeExtensionsInstances
    ]

    if (this[PROPS.PLACEHOLDER]) {
      // !!!!!!!!!!!!!!!!! TODO ONLY FOR TEST (update: не помню что это, возможно и не нужно убирать код ниже)
      extensions.push(new Placeholder({
        emptyNodeClass: 'tiptap-vuetify-editor__paragraph--is-empty',
        emptyNodeText: this[PROPS.PLACEHOLDER],
        showOnlyWhenEditable: true
      }))
    }

    this.editor = new Editor({
      extensions,
      ...this[PROPS.EDITOR_PROPERTIES],
      content: this[PROPS.VALUE],
      onUpdate: this.onUpdate.bind(this)
    })

    this.$emit(EVENTS.INIT, {
      editor: this.editor
    })

setup(props) {
    const state = reactive({
      editor: useEditor({
        extensions: [
          new OnEscape(() => {
            state.editing = false
            state.editor.blur()
          }),
        ].concat(
          props.placeholder ? new Placeholder({
            emptyNodeText: props.placeholder,
            emptyNodeClass: 'sm-RichText-placeholder',
            showOnlyWhenEditable: false,
          }) : [],
        ),
        editable: !props.readonly,
        content: props.content,
        onUpdate: async(content: string) => {
          state.saveState = saveStates.SAVING
          try {
            // wait a minimum of 500ms for the transition
            await Promise.all([
              props.update(content),
              new Promise(resolve => setTimeout(resolve, 500)),
            ])
            state.saveState = saveStates.SAVED

const { placeholder, $t, $apollo } = component
  return [
    new Heading(),
    new HardBreak(),
    new Blockquote(),
    new BulletList(),
    new OrderedList(),
    new HorizontalRule(),
    new Bold(),
    new Italic(),
    new Strike(),
    new Underline(),
    new Link(),
    new Heading({ levels: [3, 4] }),
    new ListItem(),
    new Placeholder({
      emptyNodeClass: 'is-empty',
      emptyNodeText: placeholder || $t('editor.placeholder'),
    }),
    new Embed({
      onEmbed: async ({ url }) => {
        const {
          data: { embed },
        } = await $apollo.query({ query: EmbedQuery(), variables: { url } })
        return embed
      },
    }),
    new LegacyEmbed({
      onEmbed: async ({ url }) => {
        const {
          data: { embed },
        } = await $apollo.query({ query: EmbedQuery(), variables: { url } })

beforeMount () {
      const content = this.value || ''
      const extensions = [
        new History(),
        new HardBreak()
      ]

      if (this.placeholder && this.placeholder.length > 0) {
        extensions.push(new Placeholder({
          emptyNodeClass: 'is-empty',
          emptyNodeText: this.placeHolder,
          showOnlyWhenEditable: true
        }))
      }

      if (this.toolbar.ordered || this.toolbar.bullet) {
        extensions.push(new ListItem())
      }

      Object.keys(this.toolbar).forEach(tool => {
        switch (tool) {
          case 'header': {
            const levels = this.toolbar[tool].filter(level => typeof level === 'number')
            levels.forEach(level => {
              this.headingOptions.push(level)