import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';

const snkCustomSlotGuideCss = ".sc-snk-custom-slot-guide-h{display:none}";

const SnkCustomSlotGuide$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
  constructor() {
    super();
    this.__registerHost();
    this.snkCustomSlotGuideLoaded = createEvent(this, "snkCustomSlotGuideLoaded", 7);
    this.slotName = 'CUSTOM_SLOT_GUIDE';
  }
  onGuideChange(evt) {
    const guideName = evt.detail;
    if (guideName === this.slotName) {
      this._element.style.setProperty('display', 'block');
    }
    else {
      this._element.style.setProperty('display', 'none');
    }
  }
  onFormConfigVisibilityChange(evt) {
    const isFormConfigVisible = evt.detail;
    if (isFormConfigVisible) {
      this._element.style.setProperty('display', 'none');
    }
  }
  componentDidLoad() {
    this.snkCustomSlotGuideLoaded.emit(this.slotName);
  }
  render() {
    return (h(Host, { slot: this.slotName, id: this.slotName, class: "custom-slot-guide-container" }, h("slot", null)));
  }
  get _element() { return this; }
  static get style() { return snkCustomSlotGuideCss; }
}, [6, "snk-custom-slot-guide", {
    "slotName": [1, "slot-name"]
  }, [[8, "snkShowGuide", "onGuideChange"], [8, "formConfigVisibilityChanged", "onFormConfigVisibilityChange"]]]);
function defineCustomElement$1() {
  if (typeof customElements === "undefined") {
    return;
  }
  const components = ["snk-custom-slot-guide"];
  components.forEach(tagName => { switch (tagName) {
    case "snk-custom-slot-guide":
      if (!customElements.get(tagName)) {
        customElements.define(tagName, SnkCustomSlotGuide$1);
      }
      break;
  } });
}

const SnkCustomSlotGuide = SnkCustomSlotGuide$1;
const defineCustomElement = defineCustomElement$1;

export { SnkCustomSlotGuide, defineCustomElement };
