@public-ui/components
Version:
Contains all web components that belong to KoliBri - The accessible HTML-Standard.
93 lines (90 loc) • 3.84 kB
JavaScript
/*!
* KoliBri - The accessible HTML-Standard
*/
import { r as registerInstance, h, H as Host, g as getElement } from './index-BQlHOxik.js';
import { s as setState } from './common-Cx_AGO_M.js';
import { v as validateHasCloser } from './has-closer-B8w7bVjx.js';
import { v as validateLabel } from './label-Fyi30H9j.js';
import { t as translate } from './i18n-Br16IAnY.js';
import { w as watchHeadingLevel } from './validation-D6nATCh8.js';
import { b as KolButtonWcTag } from './component-names-Dy77vq43.js';
import './Alert-BP_7bRZF.js';
import { c as createUniqueId } from './dev.utils-02Sl9bQo.js';
import { K as KolHeadingFc } from './Heading-q2Ue3Ixd.js';
import './variant-quote-y0Z1TRdz.js';
import './component-DvjvBJeK.js';
import { d as dispatchDomEvent, K as KolEvent } from './events-VVvk1win.js';
import './i18n-B2d_exHc.js';
import './level-1jyaYIAE.js';
import './normalizers-m3s9sgmq.js';
import './_Uint8Array-kJHDjtoP.js';
import './isArray-CcrBs4JM.js';
import './tslib.es6-QNbPBOk5.js';
import './clsx-COFh-Vc8.js';
import './bem-registry-CWvl2xho.js';
import './component-DzaT2WlJ.js';
const KolCardWc = class {
constructor(hostRef) {
registerInstance(this, hostRef);
this.translateClose = translate('kol-close');
this.close = () => {
var _a;
if (((_a = this._on) === null || _a === void 0 ? void 0 : _a.onClose) !== undefined) {
this._on.onClose(new Event('Close'));
}
if (this.host) {
dispatchDomEvent(this.host, KolEvent.close);
}
};
this.on = {
onClick: this.close,
};
this._hasCloser = false;
this._headingId = createUniqueId('card-heading');
this._level = 0;
this.state = {
_label: '',
};
this.validateOnValue = (value) => typeof value === 'object' && value !== null && typeof value.onClose === 'function';
}
render() {
return (h(Host, { key: '909cc395209bdb2eba2f674f5fe9f4b8750fccef' }, h("article", { key: '8bbd3d853a4ea8bc6f83dedf245414e8d9421461', "aria-labelledby": this._headingId, class: "kol-card" }, h(KolHeadingFc, { key: '2609f6812d8d909de20b00162cb119b32c0d7f23', class: "kol-card__header", id: this._headingId, level: this.state._level }, this.state._label), h("div", { key: 'a953cb61794cf76980111256849685184cc5dcf9', class: "kol-card__content" }, h("slot", { key: '31d86a46cb4e9d9cee62692aeea43f08db236ccb' })), this.state._hasCloser && (h(KolButtonWcTag, { key: '763993312892b16856634e6d0d10de5cb1454629', class: "kol-card__close-button kol-close-button", "data-testid": "card-close-button", _hideLabel: true, _icons: {
left: {
icon: 'kolicon-cross',
},
}, _label: this.translateClose, _on: this.on, _tooltipAlign: "left" })))));
}
validateHasCloser(value) {
validateHasCloser(this, value);
}
validateLabel(value) {
validateLabel(this, value, {
required: true,
});
}
validateLevel(value) {
watchHeadingLevel(this, value);
}
validateOn(value) {
if (this.validateOnValue(value)) {
setState(this, '_on', {
onClose: value.onClose,
});
}
}
componentWillLoad() {
this.validateHasCloser(this._hasCloser);
this.validateLabel(this._label);
this.validateLevel(this._level);
this.validateOn(this._on);
}
get host() { return getElement(this); }
static get watchers() { return {
"_hasCloser": ["validateHasCloser"],
"_label": ["validateLabel"],
"_level": ["validateLevel"],
"_on": ["validateOn"]
}; }
};
export { KolCardWc as kol_card_wc };
//# sourceMappingURL=kol-card-wc.entry.js.map