@public-ui/components
Version:
Contains all web components that belong to KoliBri - The accessible HTML-Standard.
20 lines (19 loc) • 1.65 kB
JavaScript
/*!
* KoliBri - The accessible HTML-Standard
*/
import { __rest } from "tslib";
import { h } from "@stencil/core";
import { translate } from "../../i18n";
import { SpanFC } from "../../internal/functional-components/span/component";
import { buildBadgeTextString } from "../../schema";
import clsx from "../../utils/clsx";
import { createRelatedUniqueId } from "../../utils/dev.utils";
const KolFormFieldLabelFc = (_a) => {
var { component: Component = 'label', id, baseClassName = 'kol-form-field', class: classNames, accessKey, shortKey, label, hideLabel, hasExpertSlot, showBadge = true, readOnly } = _a, other = __rest(_a, ["component", "id", "baseClassName", "class", "accessKey", "shortKey", "label", "hideLabel", "hasExpertSlot", "showBadge", "readOnly"]);
const useTooltipInsteadOfLabel = !hasExpertSlot && hideLabel;
const translateReadOnly = translate('kol-readonly');
const badgeText = showBadge === false ? undefined : buildBadgeTextString(accessKey, shortKey);
return (h(Component, Object.assign({}, other, { class: clsx(`${baseClassName}__label`, classNames), id: !useTooltipInsteadOfLabel ? createRelatedUniqueId(id, 'label') : undefined, hidden: useTooltipInsteadOfLabel, htmlFor: id }), h(SpanFC, { class: `${baseClassName}__label-text`, label: hasExpertSlot ? '' : (label !== null && label !== void 0 ? label : ''), badgeText: badgeText }, h("slot", { name: "expert" })), !hasExpertSlot && readOnly ? (h("span", { class: `${baseClassName}__label__read-only`, "aria-hidden": "true" }, "(", translateReadOnly, ")")) : null));
};
export default KolFormFieldLabelFc;
//# sourceMappingURL=FormFieldLabel.js.map