/*!
 * KoliBri - The accessible HTML-Standard
 */
import { h, H as Host, r as registerInstance, g as getElement } from './index-Brmny3Vg.js';
import { _ as __decorate } from './tslib.es6-QNbPBOk5.js';
import { e as watchBoolean, b as watchValidator, R as mapStringOrBoolean2String, S as mapBoolean2String, M as setEventTarget, g as watchString, s as setState } from './common-DEEjER7G.js';
import { S as SpanFC, s as showExpertSlot } from './component-CQaxTS4u.js';
import { v as validateAccessKey, a as validateAccessAndShortKey, b as validateShortKey, c as validateTabIndex } from './access-and-short-key-CnWGdP5U.js';
import { v as validateAriaControls, a as validateAriaDescription, b as validateAriaExpanded, c as validateAlternativeButtonLinkRole } from './aria-expanded--y6Ce39-.js';
import { v as validateCustomClass } from './custom-class-RTVG26D_.js';
import { v as validateDisabled } from './disabled-CtaJsBT2.js';
import { v as validateHideLabel } from './hide-label-CWFMK5Iz.js';
import { v as validateIcons } from './icons-DOGnS2Iv.js';
import { v as validateInline } from './inline-D3v7pifU.js';
import { a as validateLabelWithExpertSlot } from './label-Cg7TG_7b.js';
import { v as validateTooltipAlign } from './tooltip-align-DzHPWEpv.js';
import { v as validateVariantClassName } from './variant-class-name-CkfE8oGZ.js';
import { B as BaseWebComponent } from './variant-quote-BMV8GZX8.js';
import { T as TooltipFC } from './component-DTx6ZVqq.js';
import { T as TooltipController } from './controller-oT8Y98Yc.js';
import { c as clsx } from './clsx-COFh-Vc8.js';
import { b as directFocus, e as directClick, c as createCtaRef } from './element-interaction-C5-6aPzz.js';
import { d as dispatchDomEvent, K as KolEvent } from './events-BhfZTW2e.js';
import { p as propagateSubmitEventToForm, a as propagateResetEventToForm } from './controller-D0y9uwX0.js';
import { A as AssociatedInputController } from './associated.controller-D55JWKjs.js';
import './bem-registry-B9CzNnO1.js';
import './component-DHo2YdSx.js';
import './isArray-CcrBs4JM.js';
import './align-ChLoh-Dq.js';
import './normalizers-pgU77mXp.js';
import './_Uint8Array-kJHDjtoP.js';
import './align-floating-elements-DTTpkCAK.js';
import './tooltip-open-tracking-D3tCiiGP.js';
import './label-DPd4-fag.js';
import './base-controller-CXhqh4cR.js';
import './element-focus-BQXzaLL9.js';
import './component-names-Dy77vq43.js';
import './bootstrap-UOb6OarC.js';
import './i18n-B2d_exHc.js';

const validateAriaSelected = (component, value) => {
    watchBoolean(component, '_ariaSelected', value);
};

const validateButtonCallbacks = (component, value) => {
    watchValidator(component, `_on`, (value) => typeof value === 'object' && value !== null, new Set(['ButtonCallbacksPropType {Events.onClick, Events.onMouseDown, Events.onFocus, Events.onBlur}']), value);
};

const buttonTypePropTypeOptions = ['button', 'reset', 'submit'];
const validateButtonType = (component, value) => {
    watchValidator(component, `_type`, (value) => typeof value === 'string' && buttonTypePropTypeOptions.includes(value), new Set([`KoliBriButtonType {${buttonTypePropTypeOptions.join(', ')}`]), value);
};

const KolButtonWc = class {
    async focus(options) { }
    async click() { }
    render() {
        var _a;
        const hasExpertSlot = showExpertSlot(this.state._label);
        const ariaDescription = (_a = this.state._ariaDescription) === null || _a === void 0 ? void 0 : _a.trim();
        const badgeText = this.state._accessKey || this.state._shortKey;
        const isDisabled = this.state._disabled === true;
        const hideLabel = this.state._hideLabel === true;
        return (h(Host, { key: 'c1d7f928a7e82f9101c1da0929b2f17670c45bbf' }, h("button", { key: '2ffa65db67b8c7ba0c4aa5b3bd44cf2e9c3d6820', ref: this.ctaRef, accessKey: this.state._accessKey, "aria-controls": this.state._ariaControls, "aria-description": ariaDescription || undefined, "aria-expanded": mapBoolean2String(this.state._ariaExpanded), "aria-haspopup": this._ariaHasPopup, "aria-keyshortcuts": this.state._shortKey, "aria-label": hideLabel && typeof this.state._label === 'string' && this.state._label.length > 0 ? this.state._label : undefined, "aria-selected": mapStringOrBoolean2String(this.state._ariaSelected), class: clsx('kol-button', {
                'kol-button--disabled': isDisabled,
                [`kol-button--${this.state._variant}`]: this.state._variant !== 'custom',
                'kol-button--inline': this.state._inline === true,
                'kol-button--standalone': this.state._inline === false,
                'kol-button--hide-label': hideLabel,
                [this.state._customClass]: typeof this.state._customClass === 'string' && this.state._customClass.length > 0,
            }), disabled: isDisabled, id: this.state._id, name: this.state._name, onClick: this.onClick, onMouseDown: this.onMouseDown, onFocus: this.onFocus, onBlur: this.onBlur, role: this.state._role, tabIndex: this.state._tabIndex, type: this.state._type }, h(SpanFC, { key: '86eae862c2e73e86fc146974a90a4a693a04020f', class: "kol-button__text", badgeText: badgeText, icons: this.state._icons, hideLabel: hideLabel, label: hasExpertSlot ? '' : this.state._label }, h("slot", { key: '021615c5514837c984b8a89eef6c43cc03db13b6', name: "expert", slot: "expert" }))), hideLabel && typeof this.state._label === 'string' && this.state._label.length > 0 && (h("div", { key: '6a9c6f55dec04a4bc2f32f366617b36bfbb1254c', class: "kol-button__tooltip" }, h(TooltipFC, { key: 'bc1e41aec24688ba853a0e25c432764ca8b07e30', badgeText: badgeText || '', label: this.state._label, id: this.tooltipCtrl.getRenderProp('id'), refFloating: this.tooltipCtrl.setTooltipElementRef })))));
    }
    constructor(hostRef) {
        registerInstance(this, hostRef);
        this.ctaRef = createCtaRef();
        this.tooltipCtrl = new TooltipController(BaseWebComponent.stateLess);
        this.onClick = (event) => {
            var _a, _b;
            event.stopPropagation();
            this.tooltipCtrl.hideTooltip();
            if (this.state._type === 'submit') {
                propagateSubmitEventToForm({
                    form: this.host});
            }
            else if (this.state._type === 'reset') {
                propagateResetEventToForm({
                    form: this.host});
            }
            else {
                this.controller.setFormAssociatedValue(this.state._value);
                if (typeof ((_a = this.state._on) === null || _a === void 0 ? void 0 : _a.onClick) === 'function') {
                    setEventTarget(event, this.ctaRef.el);
                    (_b = this.state._on) === null || _b === void 0 ? void 0 : _b.onClick(event, this.state._value);
                }
            }
            if (this.host) {
                dispatchDomEvent(this.host, KolEvent.click, this.state._value);
            }
        };
        this.onMouseDown = (event) => {
            var _a, _b, _c;
            (_c = (_b = (_a = this.state) === null || _a === void 0 ? void 0 : _a._on) === null || _b === void 0 ? void 0 : _b.onMouseDown) === null || _c === void 0 ? void 0 : _c.call(_b, event);
            if (this.host) {
                dispatchDomEvent(this.host, KolEvent.mousedown);
            }
        };
        this.onFocus = (event) => {
            var _a, _b, _c;
            (_c = (_b = (_a = this.state) === null || _a === void 0 ? void 0 : _a._on) === null || _b === void 0 ? void 0 : _b.onFocus) === null || _c === void 0 ? void 0 : _c.call(_b, event);
            if (this.host) {
                dispatchDomEvent(this.host, KolEvent.focus);
            }
        };
        this.onBlur = (event) => {
            var _a, _b, _c;
            (_c = (_b = (_a = this.state) === null || _a === void 0 ? void 0 : _a._on) === null || _b === void 0 ? void 0 : _b.onBlur) === null || _c === void 0 ? void 0 : _c.call(_b, event);
            if (this.host) {
                dispatchDomEvent(this.host, KolEvent.blur);
            }
        };
        this._disabled = false;
        this._hideLabel = false;
        this._inline = false;
        this._tooltipAlign = 'top';
        this._type = 'button';
        this.state = {
            _icons: {},
            _label: '',
            _on: {},
            _type: 'button',
            _variant: 'normal',
        };
        this.controller = new AssociatedInputController(this, 'button', this.host);
    }
    validateAccessKey(value) {
        validateAccessKey(this, value);
        validateAccessAndShortKey(value, this._shortKey);
    }
    validateAriaControls(value) {
        validateAriaControls(this, value);
    }
    validateAriaDescription(value) {
        validateAriaDescription(this, value);
    }
    validateAriaExpanded(value) {
        validateAriaExpanded(this, value);
    }
    validateAriaSelected(value) {
        validateAriaSelected(this, value);
    }
    validateCustomClass(value) {
        validateCustomClass(this, value);
    }
    validateDisabled(value) {
        validateDisabled(this, value);
    }
    validateHideLabel(value) {
        validateHideLabel(this, value);
    }
    validateIcons(value) {
        validateIcons(this, value);
    }
    validateId(value) {
        watchString(this, '_id', value);
    }
    validateInline(value) {
        validateInline(this, value, {
            defaultValue: false,
        });
    }
    validateLabel(value) {
        validateLabelWithExpertSlot(this, value, {
            required: true,
        });
        this.tooltipCtrl.watchLabel(typeof value === 'string' ? value : undefined);
    }
    validateName(value) {
        this.controller.validateName(value);
    }
    validateOn(value) {
        validateButtonCallbacks(this, value);
    }
    validateRole(value) {
        validateAlternativeButtonLinkRole(this, value);
    }
    validateShortKey(value) {
        validateShortKey(this, value);
        validateAccessAndShortKey(this._accessKey, value);
    }
    validateSyncValueBySelector(value) {
        this.controller.validateSyncValueBySelector(value);
    }
    validateTabIndex(value) {
        validateTabIndex(this, value);
    }
    validateTooltipAlign(value) {
        validateTooltipAlign(this, value);
        this.tooltipCtrl.watchAlign(value);
    }
    validateType(value) {
        validateButtonType(this, value);
    }
    validateValue(value) {
        setState(this, '_value', value);
        this.controller.setFormAssociatedValue(this.state._value);
    }
    validateVariant(value) {
        validateVariantClassName(this, value);
    }
    componentWillLoad() {
        this.validateAccessKey(this._accessKey);
        this.validateAriaControls(this._ariaControls);
        this.validateAriaDescription(this._ariaDescription);
        this.validateAriaExpanded(this._ariaExpanded);
        this.validateAriaSelected(this._ariaSelected);
        this.validateCustomClass(this._customClass);
        this.validateDisabled(this._disabled);
        this.validateHideLabel(this._hideLabel);
        this.validateIcons(this._icons);
        this.validateId(this._id);
        this.validateInline(this._inline);
        this.validateLabel(this._label);
        this.validateName(this._name);
        this.validateOn(this._on);
        this.validateRole(this._role);
        this.validateShortKey(this._shortKey);
        this.validateSyncValueBySelector(this._syncValueBySelector);
        this.validateTabIndex(this._tabIndex);
        this.validateTooltipAlign(this._tooltipAlign);
        this.validateType(this._type);
        this.validateValue(this._value);
        this.validateVariant(this._variant);
        validateAccessAndShortKey(this._accessKey, this._shortKey);
        this.tooltipCtrl.componentWillLoad({
            label: typeof this.state._label === 'string' ? this.state._label : '',
            align: this._tooltipAlign,
        });
    }
    componentDidRender() {
        if (this.ctaRef.el) {
            this.tooltipCtrl.syncListeners(undefined, this.ctaRef.el, true);
        }
    }
    disconnectedCallback() {
        this.tooltipCtrl.destroy();
    }
    get host() { return getElement(this); }
    static get watchers() { return {
        "_accessKey": ["validateAccessKey"],
        "_ariaControls": ["validateAriaControls"],
        "_ariaDescription": ["validateAriaDescription"],
        "_ariaExpanded": ["validateAriaExpanded"],
        "_ariaSelected": ["validateAriaSelected"],
        "_customClass": ["validateCustomClass"],
        "_disabled": ["validateDisabled"],
        "_hideLabel": ["validateHideLabel"],
        "_icons": ["validateIcons"],
        "_id": ["validateId"],
        "_inline": ["validateInline"],
        "_label": ["validateLabel"],
        "_name": ["validateName"],
        "_on": ["validateOn"],
        "_role": ["validateRole"],
        "_shortKey": ["validateShortKey"],
        "_syncValueBySelector": ["validateSyncValueBySelector"],
        "_tabIndex": ["validateTabIndex"],
        "_tooltipAlign": ["validateTooltipAlign"],
        "_type": ["validateType"],
        "_value": ["validateValue"],
        "_variant": ["validateVariant"]
    }; }
};
__decorate([
    directFocus('ctaRef')
], KolButtonWc.prototype, "focus", null);
__decorate([
    directClick('ctaRef')
], KolButtonWc.prototype, "click", null);

export { KolButtonWc as kol_button_wc };
//# sourceMappingURL=kol-button-wc.entry.js.map
