x-component name shows in rendered output html

[PoZeWuCarQnpsHrX]

I am using Symfony 5.3. Installed the extension.

I tried to add the extension in my services.yaml like this

E_USER_DEPRECATED

The "Twig\TokenParser\IncludeTokenParser" class is considered internal. It may change without further notice. You should not use it from "Performing\TwigComponents\ComponentTokenParser".

parameters:
  app.name: '%env(APP_NAME)%'
  app.upload_dir: '%kernel.project_dir%/%env(APP_UPLOAD_DIR)%'
  app.upload_uri: '%env(APP_UPLOAD_DIR)%'
  app.upload_max_filesize: '%env(APP_UPLOAD_MAX_FILESIZE)%'

services:
  _defaults:
    autowire: true      # Automatically injects dependencies in your services.
    autoconfigure: true # Automatically registers your services as commands, event subscribers, etc.

  App\:
    resource: '../src/'
    exclude:
      - '../src/DependencyInjection/'
      - '../src/Entity/'
      - '../src/Kernel.php'
      - '../src/Tests/'

  componentextension:
    lazy: false
    class: Performing\TwigComponents\ComponentExtension
    tags:
      - {name: twig.extension}
    arguments:
      $relativePath: '%kernel.project_dir%/templates/components/'

when i try to use it in my template it shows like

code for my button.twig component

<button {{ attributes.merge({ class:'text-white rounded-md px-4 py-2' }) }}>
  {{ slot }}
</button>