maille/components/input-group/component.js

Component library for MithrilJS

"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const mithril_1 = __importDefault(require("mithril")); // +standalone
const types_1 = require("../../types");
const component_1 = __importDefault(require("../text-input/component"));
const component_2 = __importDefault(require("../button/component"));
class InputGroup {
    view(vnode) {
        // Get the onInputEnterPress if present
        const onInputEnterPress = vnode.attrs.onInputEnterPress || types_1.NoOpFn;
        const onInputChange = vnode.attrs.onInputChange || types_1.NoOpFn;
        const onButtonClick = vnode.attrs.onButtonClick || types_1.NoOpFn;
        const disabled = vnode.attrs.disabled || false;
        const rounded = vnode.attrs.rounded || false;
        const bordered = vnode.attrs.bordered || false;
        const classes = new Set(["maille", "maille-input-group", "flex"]);
        if (rounded) {
            classes.add("rounded");
        }
        if (bordered) {
            classes.add("bordered");
        }
        if (disabled) {
            classes.add("disabled");
        }
        const className = [...classes].join(" ");
        const [id, inputId, buttonId] = [vnode.attrs.id, vnode.attrs.inputId, vnode.attrs.buttonId];
        // Build the container
        return mithril_1.default("span", { id, className }, [
            mithril_1.default(component_1.default, {
                id: inputId,
                className: vnode.attrs.inputClassName,
                onInputEnterPress,
                onInputChange,
            }),
            mithril_1.default(component_2.default, { id: buttonId, className: vnode.attrs.buttonClassName, onclick: onButtonClick }),
        ]);
    }
}
exports.default = InputGroup;