@public-ui/components
Version:
Contains all web components that belong to KoliBri - The accessible HTML-Standard.
33 lines (32 loc) • 1.87 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 InputAdornment from "../InputAdornment";
function hasItems(items) {
if (!items) {
return false;
}
return Array.isArray(items) ? items.length > 0 : Boolean(items);
}
const Container = (_a, children) => {
var { class: className } = _a, other = __rest(_a, ["class"]);
return (h("div", Object.assign({ class: clsx('kol-input-container__container', className) }, other), children));
};
const KolInputContainerFc = (props, children) => {
const { class: classNames, startAdornment, endAdornment, disabled, msg, touched, containerProps, startAdornmentProps, endAdornmentProps } = props, other = __rest(props, ["class", "startAdornment", "endAdornment", "disabled", "msg", "touched", "containerProps", "startAdornmentProps", "endAdornmentProps"]);
const stateCssClasses = {
['kol-input-container--disabled']: disabled,
[`kol-input-container--${getMsgType(msg)}`]: isMsgDefinedAndInputTouched(msg, touched),
};
const baseProps = Object.assign({ class: clsx('kol-input-container', stateCssClasses, classNames) }, other);
if (!hasItems(startAdornment) && !hasItems(endAdornment)) {
return (h("div", Object.assign({}, baseProps), h(Container, Object.assign({}, containerProps), children)));
}
return (h("div", Object.assign({}, baseProps), h(InputAdornment, Object.assign({}, startAdornmentProps, { position: "start" }), startAdornment), h(Container, Object.assign({}, containerProps), children), h(InputAdornment, Object.assign({}, endAdornmentProps, { position: "end" }), endAdornment)));
};
export default KolInputContainerFc;
//# sourceMappingURL=InputContainer.js.map