maille
Version:
Component library for MithrilJS
77 lines (76 loc) • 2.78 kB
JavaScript
"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");
class RadioInput {
constructor(vnode) {
this.checked = false;
this.value = undefined;
this.internalOnInput = () => undefined;
if (vnode) {
if (vnode.attrs.oninput) {
this.internalOnInput = vnode.attrs.oninput;
}
if (vnode.attrs.value) {
this.value = vnode.attrs.value;
}
}
this.checked = vnode && "checked" in vnode.attrs ? vnode.attrs.checked : false;
}
view(vnode) {
const classes = ["maille", "maille-radio-input"];
// If outlined, add the outline class
if (vnode.attrs.rounded) {
classes.push("rounded");
}
if (vnode.attrs.round) {
classes.push("round");
}
if (vnode.attrs.disabled) {
classes.push("disabled");
}
// Update the value if it's changed
if (vnode.attrs.value !== this.value) {
this.value = vnode.attrs.value;
}
// Add additional styling classes
const size = vnode.attrs.size || types_1.Size.Medium;
classes.push(`size-${size}`);
const className = classes.join(" ");
const checked = "checked" in vnode.attrs ? vnode.attrs.checked : this.checked;
const name = vnode.attrs.name;
return mithril_1.default("label", { className }, [
// The radio input itself
mithril_1.default("input[type='radio']", {
id: vnode.attrs.id,
checked,
name,
disabled: vnode.attrs.disabled,
oninput: (e) => this.oninput(e),
}),
// Label
vnode.children,
]);
}
// OnInput handler that enhanced passed in oninput function
oninput(e) {
this.checked = true;
// If there is no oninput then exit early
if (!this.internalOnInput) {
return Promise.resolve();
}
// Perform oninput logic, converting the result to a promise if it isn't one
const result = Promise.resolve(this.internalOnInput(this.checked, this.value, e));
// Resolve the promise and then reset the loading status
return result
.then(res => {
// Trigger redraw that should change the radio input's state
mithril_1.default.redraw();
return res;
});
}
}
exports.default = RadioInput;