import { html } from 'lit';
import { property } from 'lit/decorators.js';
import { boolean } from '../../internal/boolean.mjs';
import FlowRdfElement from '../../internal/flow-ui-rdf-element.mjs';
import { watch } from '../../internal/watch.mjs';
import styles from './mutation-observer.styles.mjs';

var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __decorateClass = (decorators, target, key, kind) => {
  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
  for (var i = decorators.length - 1, decorator; i >= 0; i--)
    if (decorator = decorators[i])
      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
  if (kind && result)
    __defProp(target, key, result);
  return result;
};
class FlowUiMutationObserver extends FlowRdfElement {
  constructor() {
    super(...arguments);
    this.attrOldValue = false;
    this.charData = false;
    this.charDataOldValue = false;
    this.childList = false;
    this.disabled = false;
  }
  connectedCallback() {
    super.connectedCallback();
    this.attrOldValue = boolean(this.attrOldValue, true);
    this.charData = boolean(this.charData, true);
    this.charDataOldValue = boolean(this.charDataOldValue, true);
    this.childList = boolean(this.childList, true);
    this.disabled = boolean(this.disabled, true);
    this.handleMutation = this.handleMutation.bind(this);
    this.mutationObserver = new MutationObserver(this.handleMutation);
    if (!this.disabled) {
      this.startObserver();
    }
  }
  disconnectedCallback() {
    this.stopObserver();
  }
  handleMutation(mutationList) {
    this.emit("flow-ui-mutation", {
      detail: { mutationList }
    });
  }
  startObserver() {
    const observeAttributes = typeof this.attr === "string" && this.attr.length > 0;
    const attributeFilter = observeAttributes && this.attr !== "*" ? this.attr.split(" ") : void 0;
    try {
      this.mutationObserver.observe(this, {
        subtree: true,
        childList: this.childList,
        attributes: observeAttributes,
        attributeFilter,
        attributeOldValue: this.attrOldValue,
        characterData: this.charData,
        characterDataOldValue: this.charDataOldValue
      });
    } catch {
    }
  }
  stopObserver() {
    this.mutationObserver.disconnect();
  }
  handleDisabledChange() {
    if (this.disabled) {
      this.stopObserver();
    } else {
      this.startObserver();
    }
  }
  handleChange() {
    this.stopObserver();
    this.startObserver();
  }
  render() {
    return html`
      <slot></slot>
    `;
  }
}
FlowUiMutationObserver.styles = styles;
__decorateClass([
  property({ reflect: true })
], FlowUiMutationObserver.prototype, "attr", 2);
__decorateClass([
  property({ attribute: "attr-old-value", type: Boolean, reflect: true })
], FlowUiMutationObserver.prototype, "attrOldValue", 2);
__decorateClass([
  property({ attribute: "char-data", type: Boolean, reflect: true })
], FlowUiMutationObserver.prototype, "charData", 2);
__decorateClass([
  property({ attribute: "char-data-old-value", type: Boolean, reflect: true })
], FlowUiMutationObserver.prototype, "charDataOldValue", 2);
__decorateClass([
  property({ attribute: "child-list", type: Boolean, reflect: true })
], FlowUiMutationObserver.prototype, "childList", 2);
__decorateClass([
  property({ type: Boolean, reflect: true })
], FlowUiMutationObserver.prototype, "disabled", 2);
__decorateClass([
  watch("disabled")
], FlowUiMutationObserver.prototype, "handleDisabledChange", 1);
__decorateClass([
  watch("attr", { waitUntilFirstUpdate: true }),
  watch("attr-old-value", { waitUntilFirstUpdate: true }),
  watch("char-data", { waitUntilFirstUpdate: true }),
  watch("char-data-old-value", { waitUntilFirstUpdate: true }),
  watch("childList", { waitUntilFirstUpdate: true })
], FlowUiMutationObserver.prototype, "handleChange", 1);

export { FlowUiMutationObserver as default };
