@public-ui/components
Version:
Contains all web components that belong to KoliBri - The accessible HTML-Standard.
23 lines (22 loc) • 1.49 kB
JavaScript
/*!
* KoliBri - The accessible HTML-Standard
*/
import { __rest } from "tslib";
import { h } from "@stencil/core";
import { getMsgType, isMsgDefinedAndInputTouched } from "../../../schema";
import clsx from "../../../utils/clsx";
import { getDefaultProps } from "../_helpers/getDefaultProps";
import NativeOptionListFc from "../NativeOptionList";
const NativeSelectFc = (props) => {
const { class: classNames, msg, touched, disabled, required, options, value, OptionProps, OptionGroupProps, ariaDescribedBy, hideLabel, label } = props, other = __rest(props, ["class", "msg", "touched", "disabled", "required", "options", "value", "OptionProps", "OptionGroupProps", "ariaDescribedBy", "hideLabel", "label"]);
const stateCssClasses = {
['kol-select--disabled']: Boolean(disabled),
['kol-select--required']: Boolean(required),
['kol-select--touched']: Boolean(touched),
[`kol-select--${getMsgType(msg)}`]: isMsgDefinedAndInputTouched(msg, touched),
};
const inputProps = Object.assign(Object.assign({ class: clsx('kol-select', stateCssClasses, classNames), required: required, disabled: disabled }, getDefaultProps({ ariaDescribedBy, hideLabel, label })), other);
return (h("select", Object.assign({}, inputProps), h(NativeOptionListFc, { baseClassName: "kol-select", options: options, value: value, OptionGroupProps: OptionGroupProps, OptionProps: OptionProps })));
};
export default NativeSelectFc;
//# sourceMappingURL=NativeSelect.js.map