'use strict';

var index = require('./index-BEF5cZxd.js');
var utils = require('./utils-NnC78QR3.js');
var sizes = require('./sizes-D5zsw2g5.js');
var template = require('./template-Cj6PcLmR.js');
var props = require('./props-CPENhBnM.js');
var attribute = require('./attribute-CH1-zDDl.js');
var string_utils = require('./string.utils-BG4pUfEi.js');
var accessibility = require('./accessibility-BQJmIVWV.js');
require('./gov.log-C5EH15b_.js');

const CollapsibleSizes = utils.pick(sizes.Sizes, ['_XS', '_S', '_M', '_L', '_XL']);
var CollapsibleDirection;
(function (CollapsibleDirection) {
    CollapsibleDirection["DOWN"] = "down";
    CollapsibleDirection["UP"] = "up";
})(CollapsibleDirection || (CollapsibleDirection = {}));
const CollapsibleClass = {
    root: 'gov-collapsible',
    content: 'gov-collapsible__content',
    disabled: 'gov-collapsible--disabled',
};

const GovCollapsible = class {
    constructor(hostRef) {
        index.registerInstance(this, hostRef);
        this.hydrated = false;
        /**
         * Element size.
         */
        this.size = 'm';
        /**
         * Makes component disabled.
         */
        this.disabled = false;
        /**
         * Defines whether the collapsible is open or closed
         */
        this.open = false;
        this.inheritedAttributes = {};
        this.h = template.govHost(this.host);
        this.triggerId = string_utils.createID("GovCollapsibleControl");
        this.contentId = string_utils.createID("GovCollapsibleContent");
    }
    validateSize(newValue) {
        props.validateProp(CollapsibleSizes, newValue, CollapsibleClass.root);
    }
    componentDidLoad() {
        this.attributeObserver = new attribute.AttributeObserver(this.host, (attributeName, newValue) => {
            this.onAriaAttributeChange(attributeName, newValue);
        });
        this.attributeObserver.startObserving(attribute.ariaAttributes);
    }
    componentWillLoad() {
        this.validateSize(this.size);
        this.inheritedAttributes = accessibility.inheritAriaAttributes(this.host);
    }
    onAriaAttributeChange(attributeName, newValue) {
        this.host.removeAttribute(attributeName);
        this.inheritedAttributes = Object.assign(Object.assign({}, this.inheritedAttributes), { [attributeName]: newValue });
    }
    disconnectedCallback() {
        var _a;
        (_a = this.attributeObserver) === null || _a === void 0 ? void 0 : _a.stopObserving();
    }
    connectedCallback() {
        this.hydrated = true;
    }
    render() {
        return (index.h(index.Host, { key: '3c9284a4fdbf445f402693b15c5269c8e5b98372', hydrated: this.hydrated, class: this.h.classes([CollapsibleClass.root, this.disabled && CollapsibleClass.disabled]), size: this.size }, index.h("gov-button", Object.assign({ key: 'db793476b0b8ed5ecc44dd2191b3cf26c0a97e86', color: 'primary', size: this.size, type: 'link', disabled: this.disabled, "onGov-click": (e) => {
                e.stopPropagation();
                e.preventDefault();
                this.open = !this.open;
            } }, this.inheritedAttributes, { identifier: this.triggerId, "aria-controls": this.contentId, "aria-expanded": template.booleanString(this.open), "aria-haspopup": "true" }), this.label, index.h("gov-icon", { key: 'c230a7d2553c0858ddf24c6f9c7afbc249cd7f8e', slot: 'icon-end', name: this.open ? 'chevron-up' : 'chevron-down', type: "components" })), index.h("div", { key: '64e787e14f8773dae11f0e54658984f3622b8b47', class: CollapsibleClass.content, hidden: !this.open, id: this.contentId, "aria-labelledby": this.triggerId, "aria-hidden": template.booleanString(!this.open) }, index.h("slot", { key: '1e09e5a7242946af30012b68beb38119865003ec' }))));
    }
    get host() { return index.getElement(this); }
    static get watchers() { return {
        "size": ["validateSize"]
    }; }
};

exports.gov_collapsible = GovCollapsible;
//# sourceMappingURL=gov-collapsible.entry.cjs.js.map

//# sourceMappingURL=gov-collapsible.cjs.entry.js.map