import { r as registerInstance, e as createEvent, h, g as getElement } from './index-06929dd0.js';

const accordionCss = ".accordion_header{display:grid;grid-auto-flow:column;gap:24px;-ms-flex-pack:start;justify-content:start;-ms-flex-align:center;align-items:center;padding:24px;padding-right:56px;position:relative;color:var(--color-content-default, #454545);cursor:pointer}.accordion_header::before{content:\"\";position:absolute;inset:0;z-index:0}.accordion_header *{position:relative;z-index:1}.accordion_header:hover::before{background-color:var(--color-content-default, #454545);opacity:0.08}.accordion_header .accButton{position:absolute;right:24px;top:calc(50% - 16px);border-radius:8px;contain:inherit;-webkit-transition:height 0.5s, all 0.3s;-moz-transition:height 0.5s, all 0.3s;transition:height 0.5s, all 0.3s;z-index:1}.accordion_header .accButton__isopen{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.accordion_header .accButton::before{content:\"\";position:absolute;inset:-4px;border:2px solid transparent;border-radius:4px}.accordion_header .accButton:focus-visible{outline:none}.accordion_header .accButton:focus-visible::before{border-color:var(--color-focus, #c226fb)}.accordion_header .accButton:hover{background-color:var(--color-surface-1, #f6f6f6)}.accordion_header .accButton:active{background-color:var(--color-surface-1, #f6f6f6)}.accordion_body{height:0;overflow:hidden;border-bottom:1px solid var(--color-border-1, #c9c9c9);-webkit-transition:height 0.5s;-moz-transition:height 0.5s;transition:height 0.5s}.accordion_body::-webkit-scrollbar{width:16px;background-color:transparent}.accordion_body::-webkit-scrollbar-thumb{border-radius:10px;border:4px solid transparent;border-radius:10px;background-clip:content-box;background-color:#b9cbd3}.accordion_body_isOpen{overflow:overlay}.accordion_body .container{padding:8px 24px 48px;position:relative;color:var(--color-content-default, #454545)}";

const Accordion = class {
  constructor(hostRef) {
    registerInstance(this, hostRef);
    this.bdsToggle = createEvent(this, "bdsToggle", 7);
    this.bdsAccordionOpen = createEvent(this, "bdsAccordionOpen", 7);
    this.bdsAccordionClose = createEvent(this, "bdsAccordionClose", 7);
    this.accGroup = null;
    this.accheaders = null;
    this.accBodies = null;
    this.isOpen = false;
    this.numberElement = null;
    this.condition = false;
    this.startOpen = false;
  }
  async toggle() {
    this.isOpen = !this.isOpen;
    this.bdsToggle.emit({ value: this.isOpen });
  }
  async open() {
    this.isOpen = true;
  }
  async close() {
    var _a, _b;
    (_a = this.accheaders) === null || _a === void 0 ? void 0 : _a.close();
    (_b = this.accBodies) === null || _b === void 0 ? void 0 : _b.close();
    this.isOpen = false;
  }
  // Método interno
  async notStart() {
    this.startOpen = false;
  }
  // Método interno
  async reciveNumber(number) {
    this.numberElement = number;
  }
  isOpenChanged(value) {
    var _a, _b, _c, _d, _e, _f, _g;
    if (this.accGroup.collapse == 'single' && this.condition === false) {
      (_a = this.accheaders) === null || _a === void 0 ? void 0 : _a.toggle();
      (_b = this.accBodies) === null || _b === void 0 ? void 0 : _b.toggle();
      (_c = this.accGroup) === null || _c === void 0 ? void 0 : _c.closeAll(this.numberElement);
    }
    else {
      if (value) {
        (_d = this.accheaders) === null || _d === void 0 ? void 0 : _d.open();
        (_e = this.accBodies) === null || _e === void 0 ? void 0 : _e.open();
        this.bdsAccordionOpen.emit();
      }
      else {
        (_f = this.accheaders) === null || _f === void 0 ? void 0 : _f.close();
        (_g = this.accBodies) === null || _g === void 0 ? void 0 : _g.close();
        this.bdsAccordionClose.emit();
      }
    }
    this.condition = false;
  }
  componentWillLoad() {
    this.accGroup =
      this.element.parentElement.tagName == 'BDS-ACCORDION-GROUP' &&
        this.element.parentElement;
    this.accheaders = this.element.children[0];
    this.accBodies = this.element.children[1];
    if (this.startOpen === true) {
      this.condition = true;
      this.isOpen = true;
    }
  }
  render() {
    return (h("div", { class: "accordion_group" }, h("slot", null)));
  }
  get element() { return getElement(this); }
  static get watchers() { return {
    "isOpen": ["isOpenChanged"]
  }; }
};
Accordion.style = accordionCss;

export { Accordion as bds_accordion };
