/*!
 * KoliBri - The accessible HTML-Standard
 */
import { a as __rest } from './tslib.es6.js';
import { h } from '@stencil/core/internal/client';
import { b as KolButtonWcTag } from './component-names.js';
import { c as clsx } from './clsx.js';
import { a as createRelatedUniqueId } from './dev.utils.js';
import { K as KolHeadingFc } from './Heading.js';

const KolCollapsibleFc = (props, children) => {
    const { id, class: classNames, label, level = 1, disabled, open, onClick, HeadingProps = {}, HeadingButtonProps = {}, ContentProps = {} } = props, other = __rest(props, ["id", "class", "label", "level", "disabled", "open", "onClick", "HeadingProps", "HeadingButtonProps", "ContentProps"]);
    const icon = open ? 'kolicon-chevron-down' : 'kolicon-chevron-right';
    const headingId = createRelatedUniqueId(id, 'heading');
    const controlId = createRelatedUniqueId(id, 'control');
    return (h("div", Object.assign({ id: id, class: clsx('collapsible', {
            'collapsible--disabled': disabled === true,
            'collapsible--open': open === true,
        }, classNames) }, other), h(KolHeadingFc, { ref: HeadingProps === null || HeadingProps === void 0 ? void 0 : HeadingProps.ref, level: level, class: clsx('collapsible__heading', HeadingProps === null || HeadingProps === void 0 ? void 0 : HeadingProps.class) }, h(KolButtonWcTag, { class: clsx('collapsible__heading-button', HeadingButtonProps === null || HeadingButtonProps === void 0 ? void 0 : HeadingButtonProps.class), ref: HeadingButtonProps === null || HeadingButtonProps === void 0 ? void 0 : HeadingButtonProps.ref, slot: "expert", id: headingId, _ariaControls: controlId, _ariaExpanded: open, _disabled: disabled, _icons: (HeadingButtonProps === null || HeadingButtonProps === void 0 ? void 0 : HeadingButtonProps._icons) || `${icon}`, _label: label, _on: { onClick } })), h("div", { class: clsx('collapsible__wrapper', ContentProps === null || ContentProps === void 0 ? void 0 : ContentProps.wrapperClass) }, h("div", { class: clsx('collapsible__wrapper-animation', ContentProps === null || ContentProps === void 0 ? void 0 : ContentProps.animationClass) }, h("div", { "aria-hidden": open === false ? 'true' : undefined, "aria-labelledby": headingId, role: "region", class: clsx('collapsible__content', ContentProps === null || ContentProps === void 0 ? void 0 : ContentProps.class), id: controlId }, children)))));
};

export { KolCollapsibleFc as K };
//# sourceMappingURL=Collapsible.js.map

//# sourceMappingURL=Collapsible.js.map