<commit_before>declare var customElements;

export const customElement = (componentClass, options = {}) => class extends HTMLElement {
  private _shadowRoot;
  private _component;
  public on;
  public run;
  constructor() {
    super();
  }
  get component() { return this._component; }
  get state() { return this._component.state; }

  static get observedAttributes() {
    return { ...options }['observedAttributes'];
  }

  connectedCallback() {
    if (this.isConnected && !this._component) {
      const opts = { render: true, shadow: false, ...options };
      this._shadowRoot = opts.shadow ?
        this.attachShadow({ mode: 'open' }) : this;
      const props = {}
      Array.from(this.attributes).forEach(item => props[item.name] = item.value);
      const children = this.children ? Array.from(this.children) : [];
      children.forEach(el => el.parentElement.removeChild(el));
      this._component = new componentClass(props).mount(this._shadowRoot, opts);
      this._component.mounted(props, children);
      this.on = this._component.on.bind(this._component);
      this.run = this._component.run.bind(this._component);
    }
  }

  disconnectedCallback() {
    this._component.unmount();
    this._component = null;<commit_msg>pass children to component constructor in web component<commit_after>declare var customElements;

export const customElement = (componentClass, options = {}) => class extends HTMLElement {
  private _shadowRoot;
  private _component;
  public on;
  public run;
  constructor() {
    super();
  }
  get component() { return this._component; }
  get state() { return this._component.state; }

  static get observedAttributes() {
    return { ...options }['observedAttributes'];
  }

  connectedCallback() {
    if (this.isConnected && !this._component) {
      const opts = { render: true, shadow: false, ...options };
      this._shadowRoot = opts.shadow ?
        this.attachShadow({ mode: 'open' }) : this;
      const props = {}
      Array.from(this.attributes).forEach(item => props[item.name] = item.value);
      const children = this.children ? Array.from(this.children) : [];
      children.forEach(el => el.parentElement.removeChild(el));
      this._component = new componentClass({ ...props, children }).mount(this._shadowRoot, opts);
      this._component.mounted(props, children);
      this.on = this._component.on.bind(this._component);
      this.run = this._component.run.bind(this._component);
    }
  }

  disconnectedCallback() {
    this._component.unmount();
    this._component = null;
{'fraction_non_alphanumeric': 0.13844348846304264, 'fraction_numerical': 0.0, 'mean_word_length': 3.4409722222222223, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 9, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '618734', 'n_tokens_mistral': 723, 'n_tokens_neox': 713, 'n_words': 163}