@public-ui/components
Version:
Contains all web components that belong to KoliBri - The accessible HTML-Standard.
26 lines (25 loc) • 1.96 kB
JavaScript
/*!
* KoliBri - The accessible HTML-Standard
*/
import { __rest } from "tslib";
import { h } from "@stencil/core";
import { IconFC } from "../../../internal/functional-components/icon/component";
import { getMsgType, isMsgDefinedAndInputTouched } from "../../../schema";
import clsx from "../../../utils/clsx";
import KolInputFc from "../Input";
const CheckboxFc = (_a) => {
var { class: classNames, variant = 'default', icon, inputProps } = _a, other = __rest(_a, ["class", "variant", "icon", "inputProps"]);
const { class: inputClass } = inputProps, restInputProps = __rest(inputProps, ["class"]);
const cssVariants = {
[`kol-checkbox--variant-${variant}`]: true,
[`kol-checkbox--checked`]: inputProps === null || inputProps === void 0 ? void 0 : inputProps.checked,
[`kol-checkbox--indeterminate`]: inputProps === null || inputProps === void 0 ? void 0 : inputProps.indeterminate,
['kol-checkbox--disabled']: Boolean(inputProps === null || inputProps === void 0 ? void 0 : inputProps.disabled),
['kol-checkbox--required']: Boolean(inputProps === null || inputProps === void 0 ? void 0 : inputProps.required),
['kol-checkbox--touched']: Boolean(inputProps === null || inputProps === void 0 ? void 0 : inputProps.touched),
[`kol-checkbox--${getMsgType(inputProps === null || inputProps === void 0 ? void 0 : inputProps.msg)}`]: Boolean(isMsgDefinedAndInputTouched(inputProps === null || inputProps === void 0 ? void 0 : inputProps.msg, inputProps === null || inputProps === void 0 ? void 0 : inputProps.touched)),
};
return (h("label", Object.assign({ class: clsx('kol-checkbox', cssVariants, classNames) }, other), h(IconFC, { label: "", icons: icon, class: clsx('kol-checkbox__icon') }), h(KolInputFc, Object.assign({ class: clsx('kol-checkbox__input', inputClass) }, restInputProps, { type: "checkbox" }))));
};
export default CheckboxFc;
//# sourceMappingURL=Checkbox.js.map