@hashicorp/design-system-components/dist/components/hds/disclosure-primitive/index.js

Helios Design System Components

import Component from '@glimmer/component';
import { tracked } from '@glimmer/tracking';
import { schedule } from '@ember/runloop';
import { guidFor } from '@ember/object/internals';
import { hash } from '@ember/helper';
import didUpdate from '@ember/render-modifiers/modifiers/did-update';
import { precompileTemplate } from '@ember/template-compilation';
import { setComponentTemplate } from '@ember/component';
import { g, i } from 'decorator-transforms/runtime';

/**
 * Copyright IBM Corp. 2021, 2025
 * SPDX-License-Identifier: MPL-2.0
 */
class HdsDisclosurePrimitive extends Component {
  static {
    g(this.prototype, "_isOpen", [tracked], function () {
      return false;
    });
  }
  #_isOpen = (i(this, "_isOpen"), void 0);
  static {
    g(this.prototype, "_isControlled", [tracked], function () {
      return this.args.isOpen !== undefined;
    });
  }
  #_isControlled = (i(this, "_isControlled"), void 0);
  _contentId = 'content-' + guidFor(this);
  get isOpen() {
    if (this._isControlled) {
      // if the state is controlled from outside, the argument overrides the internal state
      return this.args.isOpen ?? this._isOpen;
    } else {
      // if the state changes internally, the internal state overrides the argument
      return this._isOpen;
    }
  }
  set isOpen(value) {
    this._isOpen = value || false;
  }
  onClickToggle = () => {
    this.isOpen = !this.isOpen;
    this._isControlled = false;
    // we call the "onClickToggle" callback if it exists and it's a function
    if (this.args.onClickToggle && typeof this.args.onClickToggle === 'function') {
      this.args.onClickToggle(this.isOpen);
    }
  };
  onStateChange = () => {
    if (this.args.isOpen !== undefined) {
      this.isOpen = this.args.isOpen;
    }
    this._isControlled = true;
  };
  close = () => {
    // we schedule this afterRender to avoid an error in tests caused by updating `isOpen` multiple times in the same computation
    // eslint-disable-next-line ember/no-runloop
    schedule('afterRender', () => {
      this.isOpen = false;
      // we call the "onClose" callback if it exists (and is a function)
      if (this.args.onClose && typeof this.args.onClose === 'function') {
        this.args.onClose();
      }
    });
  };
  static {
    setComponentTemplate(precompileTemplate("<div class=\"hds-disclosure-primitive\" {{didUpdate this.onStateChange @isOpen}} ...attributes>\n  <div class=\"hds-disclosure-primitive__toggle\">\n    {{yield (hash onClickToggle=this.onClickToggle isOpen=this.isOpen contentId=this._contentId) to=\"toggle\"}}\n  </div>\n  <div class=\"hds-disclosure-primitive__content\" id={{this._contentId}}>\n    {{#if this.isOpen}}\n      {{yield (hash close=this.close) to=\"content\"}}\n    {{/if}}\n  </div>\n</div>", {
      strictMode: true,
      scope: () => ({
        didUpdate,
        hash
      })
    }), this);
  }
}

export { HdsDisclosurePrimitive as default };
//# sourceMappingURL=index.js.map