import React from 'react';
import { Root, createRoot } from 'react-dom/client';
import { AnimatedListDemo } from './AnimatedListDemo';

class AnimatedListComponent extends HTMLElement {
  root: Root;

  constructor() {
    super();
  }

  connectedCallback() {
    const rootNode = document.createElement('main');
    this.appendChild(rootNode);
    this.root = createRoot(rootNode);
    this.root.render(<AnimatedListDemo />);
  }
}

customElements.define('react-animated-list-demo', AnimatedListComponent);