'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

const index = require('./index-58ea899e.js');
const globalSlimmerRegistry = require('./global-slimmer-registry-b3bce7e0.js');
const placeholder = require('./placeholder-cb6d37ad.js');
const componentUsageRuntimeMetrics = require('./component-usage-runtime-metrics-389d1548.js');
const component = require('./component-1e352960.js');
const designToken = require('./design-token-3bc36220.js');
const ui = require('./ui-3727d685.js');
const domNodeSubjectObserverFactory = require('./dom-node-subject-observer-factory-ba6a95f3.js');
const vegaEventId = require('./vega-event-id-f95480b7.js');
const chevronUp = require('./chevron-up-21465cf7.js');
const chevronDown = require('./chevron-down-9847bf78.js');
const internalIconManager = require('./internal-icon-manager-66c48800.js');
const observer = require('./observer-f49483e8.js');
const changeManager = require('./change-manager-a297e4d2.js');
const staticSubjectTitle = require('./static-subject-title-5829a298.js');
const typeGuard = require('./type-guard-c1195e50.js');
const eventEmitSlimmer = require('./event-emit-slimmer-73c42d7e.js');
const translationSlimmer = require('./translation-slimmer-a4a7f0eb.js');
require('./breakpoints-ebde4837.js');
require('./responsive-format-facade-9647775d.js');
require('./ui-32120990.js');
require('./breakpoints-1cc2c4c6.js');
require('./number-4816603d.js');
require('./pixel-98f2a10c.js');
require('./array-249289f2.js');
require('./feature-flag-controller-5fa21654.js');
require('./index-3ca118c4.js');
require('./typography-4560e7f1.js');
require('./state-border-formatter-1a483a9b.js');
require('./icon-manager-e855446d.js');
require('./create-public-api-runtime-metrics-slimmer-122350c3.js');
require('./dynamic-slimmer-f31fdfd7.js');
require('./misc-3d30df91.js');
require('./internal-translation-controller-f0da24b2.js');
require('./internal-vega-event-manager-063c17cb.js');
require('./try-get-document-c0ebd39a.js');

var __decorate$2 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
  return c > 3 && r && Object.defineProperty(target, key, r), r;
};
class VegaAccordionRenderer extends globalSlimmerRegistry.VegaSlimmer {
  render() {
    return (index.h("div", { class: {
        'accordion': true,
        'background': this.drawsBackground,
        'expanded': this.expand,
        'collapsed': !this.expand,
        'icon-position-center': this.iconPosition === 'center',
      } },
      this.renderHeader(),
      this.renderContent()));
  }
  renderHeader() {
    const titleDom = (index.h(index.Fragment, null,
      this.renderPrefixIcon(),
      this.accordionTitle ? this.renderTitle() : this.renderTitleSlot()));
    return (index.h("div", { class: "accordion-header" },
      index.h("vega-flex", { gap: "size-8", "align-items": "start" },
        this.expandIconAlign === 'left' && this.renderExpandIcon(),
        titleDom,
        this.expandIconAlign === 'right' && this.renderExpandIcon())));
  }
  renderPrefixIcon() {
    return (this.prefixIcon && (index.h("div", { class: "accordion-prefix-icon" },
      index.h("vega-icon", { icon: this.prefixIcon, size: "size-24" }))));
  }
  renderTitle() {
    return index.h("div", { class: "accordion-title" }, this.accordionTitle);
  }
  renderExpandIcon() {
    const classes = [
      'accordion-expand-icon',
      `accordion-expand-icon-align-${this.expandIconAlign}`,
      designToken.formatAndValidResponsiveToken(this.showExpandIcon, 'display'),
    ];
    return (index.h("div", { class: `${ui.arrayToClassString(classes)}` },
      index.h("vega-button-circle", { size: "small", "icon-color": "text-link", variant: "icon-only", "data-aria-label": this.getExpandIconAriaLabel(), "data-aria-expanded": `${this.expand}`, icon: internalIconManager.VegaInternalIconManager.getIconKey(this.expandIconAlign === 'left' ? 'chevron-down' : 'chevron-up'), ref: (ref) => {
          domNodeSubjectObserverFactory.DomNodeSubjectObserverFactory.addUniqueObserverToNode(ref, vegaEventId.VegaClick, () => {
            this.expandController.flipExpand();
          });
        } })));
  }
  renderContent() {
    return (index.h("div", { class: "accordion-content" },
      index.h("slot", { name: "content" }),
      index.h("slot", { name: "accordion-content" })));
  }
  renderTitleSlot() {
    return (index.h("div", { class: "accordion-title-slot" },
      index.h("slot", { name: "title" }),
      index.h("slot", { name: "accordion-title" })));
  }
  getExpandIconAriaLabel() {
    if (this.accordionTitle) {
      return this.expand
        ? this.translationSlimmer.t('Collapse {0} accordion', this.accordionTitle)
        : this.translationSlimmer.t('Expand {0} accordion', this.accordionTitle);
    }
    return this.expand
      ? this.translationSlimmer.t('Collapse accordion')
      : this.translationSlimmer.t('Expand accordion');
  }
}
(() => {
  internalIconManager.VegaInternalIconManager.register({
    'chevron-up': chevronUp.chevronUp,
    'chevron-down': chevronDown.chevronDown,
  });
})();
__decorate$2([
  globalSlimmerRegistry.MapToComponentField()
], VegaAccordionRenderer.prototype, "drawsBackground", void 0);
__decorate$2([
  globalSlimmerRegistry.MapToComponentField()
], VegaAccordionRenderer.prototype, "prefixIcon", void 0);
__decorate$2([
  globalSlimmerRegistry.MapToComponentField()
], VegaAccordionRenderer.prototype, "accordionTitle", void 0);
__decorate$2([
  globalSlimmerRegistry.MapToComponentField()
], VegaAccordionRenderer.prototype, "expandIconAlign", void 0);
__decorate$2([
  globalSlimmerRegistry.MapToComponentField()
], VegaAccordionRenderer.prototype, "expand", void 0);
__decorate$2([
  globalSlimmerRegistry.MapToComponentField()
], VegaAccordionRenderer.prototype, "iconPosition", void 0);
__decorate$2([
  globalSlimmerRegistry.MapToComponentField()
], VegaAccordionRenderer.prototype, "showExpandIcon", void 0);
__decorate$2([
  globalSlimmerRegistry.MapToComponentField()
], VegaAccordionRenderer.prototype, "expandController", void 0);
__decorate$2([
  globalSlimmerRegistry.MapToComponentField()
], VegaAccordionRenderer.prototype, "translationSlimmer", void 0);

var __decorate$1 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
  return c > 3 && r && Object.defineProperty(target, key, r), r;
};
class VegaAccordionExpandController extends globalSlimmerRegistry.VegaSlimmer {
  flipExpand() {
    this.expand = !this.expand;
  }
  onExpand() {
    if (this.groupId && this.expand) {
      changeManager.ChangeManager.notify(staticSubjectTitle.ACCORDION_EXPAND_TOPIC, {
        groupId: this.groupId,
        element: this.host,
      });
    }
    this.expandEventEmitter.emit(this.expand);
  }
  registerObserver() {
    this.observer = new observer.Observer(typeGuard.isAccordionObserverPayload, this.shouldCollapseSelfIfOtherExpand.bind(this));
    changeManager.ChangeManager.register(staticSubjectTitle.ACCORDION_EXPAND_TOPIC, this.observer);
  }
  unregisterObserver() {
    if (this.observer) {
      changeManager.ChangeManager.unregister(staticSubjectTitle.ACCORDION_EXPAND_TOPIC, this.observer);
      this.observer = null;
    }
  }
  shouldCollapseSelfIfOtherExpand(payload) {
    if (this.groupId === payload.groupId && this.host !== payload.element) {
      this.expand = false;
    }
  }
}
__decorate$1([
  globalSlimmerRegistry.MapToComponentField()
], VegaAccordionExpandController.prototype, "host", void 0);
__decorate$1([
  globalSlimmerRegistry.MapToComponentField()
], VegaAccordionExpandController.prototype, "groupId", void 0);
__decorate$1([
  globalSlimmerRegistry.MapToComponentField({ writable: true })
], VegaAccordionExpandController.prototype, "expand", void 0);
__decorate$1([
  globalSlimmerRegistry.MapToComponentField()
], VegaAccordionExpandController.prototype, "expandEventEmitter", void 0);
__decorate$1([
  globalSlimmerRegistry.MapToComponentMethod('watchExpand')
], VegaAccordionExpandController.prototype, "onExpand", null);
__decorate$1([
  globalSlimmerRegistry.MapToComponentMethod('componentWillLoad')
], VegaAccordionExpandController.prototype, "registerObserver", null);
__decorate$1([
  globalSlimmerRegistry.MapToComponentMethod('disconnectedCallback')
], VegaAccordionExpandController.prototype, "unregisterObserver", null);

const vegaAccordionCss = ":host(.v-block),.v-block{display:block}:host(.v-inline-block),.v-inline-block{display:inline-block}:host(.v-hidden),.v-hidden{display:none}@media (min-width: 320px){:host(.S\\:v-block),.S\\:v-block{display:block}:host(.S\\:v-inline-block),.S\\:v-inline-block{display:inline-block}:host(.S\\:v-hidden),.S\\:v-hidden{display:none}}@media (min-width: 768px){:host(.M\\:v-block),.M\\:v-block{display:block}:host(.M\\:v-inline-block),.M\\:v-inline-block{display:inline-block}:host(.M\\:v-hidden),.M\\:v-hidden{display:none}}@media (min-width: 1024px){:host(.L\\:v-block),.L\\:v-block{display:block}:host(.L\\:v-inline-block),.L\\:v-inline-block{display:inline-block}:host(.L\\:v-hidden),.L\\:v-hidden{display:none}}@media (min-width: 1440px){:host(.XL\\:v-block),.XL\\:v-block{display:block}:host(.XL\\:v-inline-block),.XL\\:v-inline-block{display:inline-block}:host(.XL\\:v-hidden),.XL\\:v-hidden{display:none}}:host{display:block;text-align:left;line-height:normal}.accordion{display:block;border-radius:16px}.accordion-title,.accordion-title-slot{font-family:\"Inter\", sans-serif;font-size:20px;font-weight:700;line-height:28px;letter-spacing:0px;color:rgba(var(--v-text-primary, 32, 54, 69, 1));overflow:hidden;flex-basis:0;flex-grow:1;padding-top:2px;padding-bottom:2px}@media screen and (min-width: 768px) and (max-width: 1023px){.accordion-title,.accordion-title-slot{font-family:\"Inter\", sans-serif;font-size:20px;font-weight:700;line-height:28px;letter-spacing:0px}}@media screen and (min-width: 1024px) and (max-width: 1439px){.accordion-title,.accordion-title-slot{font-family:\"Inter\", sans-serif;font-size:20px;font-weight:700;line-height:28px;letter-spacing:0px}}@media screen and (min-width: 1440px) and (max-width: 9999px){.accordion-title,.accordion-title-slot{font-family:\"Inter\", sans-serif;font-size:20px;font-weight:700;line-height:28px;letter-spacing:0px}}.accordion-prefix-icon{width:24px;height:32px;color:rgba(var(--v-text-primary, 32, 54, 69, 1));box-sizing:border-box;padding-top:4px;padding-bottom:4px;min-width:-webkit-min-content;min-width:-moz-min-content;min-width:min-content;flex-shrink:0}.icon-position-center .accordion-prefix-icon{align-self:center}.accordion-content{transition-property:all;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms}.accordion.background{padding:24px;background-color:rgba(var(--v-bg-primary, 252, 252, 252, 1))}.accordion.expanded .accordion-content{margin-top:24px}.accordion.collapsed .accordion-content{max-height:0px;overflow:hidden;display:none}.accordion.collapsed .accordion-expand-icon-align-left{transform:rotate(-90deg)}.accordion.collapsed .accordion-expand-icon-align-right{transform:rotate(180deg)}.accordion-expand-icon{transition-property:transform;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms;min-width:-webkit-min-content;min-width:-moz-min-content;min-width:min-content;flex-shrink:0}.icon-position-center .accordion-expand-icon{align-self:center}.hidden{display:none}";

var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
  if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
    r = Reflect.decorate(decorators, target, key, desc);
  else
    for (var i = decorators.length - 1; i >= 0; i--)
      if (d = decorators[i])
        r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
  return c > 3 && r && Object.defineProperty(target, key, r), r;
};
const VegaAccordion = class {
  constructor(hostRef) {
    index.registerInstance(this, hostRef);
    this.vegaExpand = index.createEvent(this, "vegaExpand", 7);
    this.accordionExpand = index.createEvent(this, "accordionExpand", 7);
    this.globalSlimmers = {};
    this.renderer = new VegaAccordionRenderer();
    this.expandController = new VegaAccordionExpandController();
    this.translationSlimmer = new translationSlimmer.TranslationSlimmer();
    this.expandEventEmitter = eventEmitSlimmer.createEventEmitSlimmer(VegaAccordion, vegaEventId.VegaExpand, 'accordionExpand');
    this.vegaComponentUsageRuntimeMetricsSlimmer = new componentUsageRuntimeMetrics.VegaComponentUsageRuntimeMetricsSlimmer();
    /**
     * Determines whether the accordion block should be displayed
     *    with its default background color `bg-primary`
     *    and padding of `size-24`.
     *
     * @vegaVersion 1.3.0
     */
    this.drawsBackground = true;
    /**
     * Specifies the placement of the expand icon in the accordion.
     *
     * @vegaVersion 1.3.0
     */
    this.expandIconAlign = 'right';
    /* this property is modified by a slimmer */
    /**
     * Controls whether the accordion is expanded.
     *
     * @vegaVersion 1.0.4
     */
    /* eslint-disable-next-line @stencil/strict-mutable */
    this.expand = true;
    /**
     * Specifies the vertical placement of the prefix icon
     *    and expand icon within the accordion.
     *
     * @vegaVersion 1.8.1
     */
    this.iconPosition = 'top';
    /**
     * Specifies whether to display or hide the expand icon in the accordion.
     *
     * It can be provided as a ResponsiveType or boolean value.
     *
     * @vegaVersion 1.3.0
     */
    this.showExpandIcon = true;
  }
  watchExpand() {
  }
  render() {
    placeholder.slotPlaceholder(index.h("slot", null));
    return component.sanitizeVegaComponent(index.h(index.Host, null, this.renderer.render()), this.host);
  }
  get host() { return index.getElement(this); }
  static get watchers() { return {
    "expand": ["watchExpand"]
  }; }
};
__decorate([
  componentUsageRuntimeMetrics.InjectVegaGlobalSlimmer()
], VegaAccordion.prototype, "globalSlimmers", void 0);
__decorate([
  globalSlimmerRegistry.InjectVegaSlimmer()
], VegaAccordion.prototype, "renderer", void 0);
__decorate([
  globalSlimmerRegistry.InjectVegaSlimmer()
], VegaAccordion.prototype, "expandController", void 0);
__decorate([
  globalSlimmerRegistry.InjectVegaSlimmer()
], VegaAccordion.prototype, "translationSlimmer", void 0);
__decorate([
  globalSlimmerRegistry.InjectVegaSlimmer()
], VegaAccordion.prototype, "expandEventEmitter", void 0);
__decorate([
  globalSlimmerRegistry.InjectVegaSlimmer()
], VegaAccordion.prototype, "vegaComponentUsageRuntimeMetricsSlimmer", void 0);
VegaAccordion.style = vegaAccordionCss;

exports.vega_accordion = VegaAccordion;
