semantic-ui-react-router
Version:
Semantic UI React components for React Router and several other extension
315 lines (314 loc) • 13.4 kB
JavaScript
"use strict";
var __extends = (this && this.__extends) || (function () {
var extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
return function (d, b) {
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
var __assign = (this && this.__assign) || Object.assign || function(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
return c > 3 && r && Object.defineProperty(target, key, r), r;
};
var __rest = (this && this.__rest) || function (s, e) {
var t = {};
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
t[p] = s[p];
if (s != null && typeof Object.getOwnPropertySymbols === "function")
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) if (e.indexOf(p[i]) < 0)
t[p[i]] = s[p[i]];
return t;
};
Object.defineProperty(exports, "__esModule", { value: true });
var React = require("react");
var formstate_1 = require("formstate");
var react_datepicker_1 = require("react-datepicker");
var mobx_react_1 = require("mobx-react");
var typestyle_1 = require("typestyle");
var es2015_i18n_tag_1 = require("es2015-i18n-tag");
var semantic_ui_react_1 = require("semantic-ui-react");
var omit = require("object.omit");
exports.Form = semantic_ui_react_1.Form;
exports.Field = semantic_ui_react_1.Form.Field;
exports.Group = semantic_ui_react_1.Form.Group;
var errorStyle = typestyle_1.style({
marginTop: '3px!important'
});
var FormControl = (function (_super) {
__extends(FormControl, _super);
function FormControl() {
var _this = _super !== null && _super.apply(this, arguments) || this;
_this.update = function (_e, formEvent) {
_this.props.owner.onChange(formEvent.value);
};
return _this;
}
Object.defineProperty(FormControl.prototype, "value", {
get: function () {
return this.props.owner.value;
},
enumerable: true,
configurable: true
});
return FormControl;
}(React.PureComponent));
exports.FormControl = FormControl;
var Error = function (_a) {
var owner = _a.owner;
return (React.createElement(semantic_ui_react_1.Label, { color: "red", className: errorStyle }, owner.error));
};
var Input = (function (_super) {
__extends(Input, _super);
function Input() {
return _super !== null && _super.apply(this, arguments) || this;
}
Input.prototype.render = function () {
return (React.createElement(exports.Form.Field, { error: this.props.owner.hasError, width: this.props.width, className: this.props.className },
this.props.label && React.createElement("label", null, this.props.label),
React.createElement(semantic_ui_react_1.Input, __assign({ onChange: this.update, value: this.value, placeholder: this.props.placeholder || this.props.label }, omit(this.props, ['owner', 'label', 'className']))),
this.props.owner.hasError && React.createElement(Error, { owner: this.props.owner })));
};
return Input;
}(FormControl));
Input = __decorate([
mobx_react_1.observer
], Input);
exports.Input = Input;
Input.displayName = 'BoundInput';
var TextArea = (function (_super) {
__extends(TextArea, _super);
function TextArea() {
return _super !== null && _super.apply(this, arguments) || this;
}
TextArea.prototype.render = function () {
return (React.createElement(exports.Form.Field, { error: this.props.owner.hasError, width: this.props.width, className: this.props.className },
this.props.label && React.createElement("label", null, this.props.label),
React.createElement(exports.Form.TextArea, __assign({ onChange: this.update, value: this.value, placeholder: this.props.placeholder || this.props.label }, omit(this.props, ['owner', 'label', 'className']))),
this.props.owner.hasError && React.createElement(Error, { owner: this.props.owner })));
};
return TextArea;
}(FormControl));
TextArea = __decorate([
mobx_react_1.observer
], TextArea);
exports.TextArea = TextArea;
;
TextArea.displayName = 'BoundTextArea';
var id_helper = 0;
function randomID() {
return (Date.now() + id_helper++).toString();
}
var DateControl = (function (_super) {
__extends(DateControl, _super);
function DateControl() {
return _super !== null && _super.apply(this, arguments) || this;
}
DateControl.prototype.focus = function () { };
DateControl.prototype.clear = function (e) {
if (e.keyCode === 8 || e.keyCode === 46) {
this.props.clear();
}
};
DateControl.prototype.render = function () {
return (React.createElement(semantic_ui_react_1.Input, __assign({}, omit(this.props, 'clear'), { icon: "calendar", readOnly: true, onKeyDown: this.clear.bind(this) })));
};
return DateControl;
}(React.Component));
var DatePicker = (function (_super) {
__extends(DatePicker, _super);
function DatePicker() {
var _this = _super !== null && _super.apply(this, arguments) || this;
_this.updateDate = function (moment) {
_this.update(null, { value: moment.toDate() });
};
return _this;
}
DatePicker.prototype.prohibit = function () {
return false;
};
DatePicker.prototype.clear = function () {
this.props.owner.value = null;
};
DatePicker.prototype.render = function () {
var _a = this.props, format = _a.format, placeholder = _a.placeholder, owner = _a.owner, rest = __rest(_a, ["format", "placeholder", "owner"]);
var moment = require('moment');
return (React.createElement("div", { className: "three wide field" },
this.props.label && React.createElement("label", null, this.props.label),
React.createElement(react_datepicker_1.default, __assign({}, rest, { customInput: React.createElement(DateControl, { clear: this.clear.bind(this) }), onChange: this.updateDate, dateFormat: format, placeholderText: placeholder, selected: this.value ? moment(this.value) : null }))));
};
return DatePicker;
}(FormControl));
DatePicker.defaultProps = {
format: 'DD MMM YYYY'
};
DatePicker = __decorate([
mobx_react_1.observer
], DatePicker);
exports.DatePicker = DatePicker;
;
DatePicker.displayName = 'DatePicker';
exports.Label = function (props) { return (React.createElement(exports.Form.Field, __assign({}, props),
React.createElement("label", null, props.label))); };
exports.Label.displayName = 'BoundLabel';
var Select = (function (_super) {
__extends(Select, _super);
function Select() {
var _this = _super !== null && _super.apply(this, arguments) || this;
_this.updateSelect = function (_e, selectValue) {
_this.props.owner.onChange(selectValue.value);
};
return _this;
}
Select.prototype.render = function () {
return (React.createElement(exports.Form.Field, { error: this.props.owner.hasError, width: this.props.width, className: this.props.className },
this.props.label && React.createElement("label", null, this.props.label),
React.createElement(exports.Form.Select, __assign({ onChange: this.updateSelect, value: this.value }, omit(this.props, ['owner', 'label', 'className']))),
this.props.owner.hasError && React.createElement(Error, { owner: this.props.owner })));
};
return Select;
}(FormControl));
Select = __decorate([
mobx_react_1.observer
], Select);
exports.Select = Select;
;
Select.displayName = 'BoundSelect';
var Radio = (function (_super) {
__extends(Radio, _super);
function Radio() {
var _this = _super !== null && _super.apply(this, arguments) || this;
_this.update = function (_e, formEvent) {
_this.props.owner.onChange(formEvent.checked);
};
return _this;
}
Radio.prototype.render = function () {
return (React.createElement(exports.Form.Radio, __assign({ onChange: this.update, value: 'radio' }, omit(this.props, 'owner'))));
};
return Radio;
}(FormControl));
Radio = __decorate([
mobx_react_1.observer
], Radio);
exports.Radio = Radio;
;
Radio.displayName = 'BoundRadio';
var Checkbox = (function (_super) {
__extends(Checkbox, _super);
function Checkbox() {
var _this = _super !== null && _super.apply(this, arguments) || this;
_this.update = function (_e, formEvent) {
_this.props.owner.onChange(formEvent.checked);
};
return _this;
}
Checkbox.prototype.render = function () {
return (React.createElement(exports.Form.Checkbox, __assign({ onChange: this.update, value: 'checkbox', checked: this.props.owner.value }, omit(this.props, 'owner'))));
};
return Checkbox;
}(FormControl));
Checkbox = __decorate([
mobx_react_1.observer
], Checkbox);
exports.Checkbox = Checkbox;
;
Checkbox.displayName = 'BoundCheckbox';
function requiredValidator(value) {
return value === '' || value == null ? (_a = ["This field is required"], _a.raw = ["This field is required"], es2015_i18n_tag_1.default(_a)) : '';
var _a;
}
exports.requiredValidator = requiredValidator;
function regExValidator(reg, format) {
return function (value) {
if (reg.exec(value)) {
return '';
}
if (format) {
return (_a = ["Expecting format: ", ""], _a.raw = ["Expecting format: ", ""], es2015_i18n_tag_1.default(_a, format));
}
return (_b = ["Unexpected format"], _b.raw = ["Unexpected format"], es2015_i18n_tag_1.default(_b));
var _a, _b;
};
}
exports.regExValidator = regExValidator;
var intReg = /^(\+|\-)?\d+$/;
function isInt(n) {
return intReg.test(n);
}
var positiveIntReg = /^(\+)?\d+$/;
function isPositiveInt(n) {
return positiveIntReg.test(n);
}
var nonZeroIntReg = /^(\+)?[1-9]\d*$/;
function isNonZeroInt(n) {
return nonZeroIntReg.test(n);
}
var floatReg = /^(\+|\-)?\d*\.?\d+$/;
function isFloat(n) {
return floatReg.test(n);
}
var positiveFloatReg = /^(\+)?\d*\.?\d+$/;
function isPositiveFloat(n) {
return floatReg.test(n);
}
var nonZeroFloatReg = /^(\+)?[1-9]\d*\.?\d+$/;
function isNonZeroFloat(n) {
return nonZeroFloatReg.test(n);
}
function intPositiveValidator(value) {
return value == null || value === '' || isPositiveInt(value.toString()) ? '' : (_a = ["Expected positive integer value"], _a.raw = ["Expected positive integer value"], es2015_i18n_tag_1.default(_a));
var _a;
}
exports.intPositiveValidator = intPositiveValidator;
function intValidator(value) {
return value == null || value === '' || isInt(value.toString()) ? '' : (_a = ["Expected integer value"], _a.raw = ["Expected integer value"], es2015_i18n_tag_1.default(_a));
var _a;
}
exports.intValidator = intValidator;
function intNonZeroValidator(value) {
return value == null || value === '' || isNonZeroInt(value.toString()) ? '' : (_a = ["Expected non-zero integer value"], _a.raw = ["Expected non-zero integer value"], es2015_i18n_tag_1.default(_a));
var _a;
}
exports.intNonZeroValidator = intNonZeroValidator;
function floatValidator(value) {
return value == null || value === '' || isFloat(value.toString()) ? '' : (_a = ["Expected float value"], _a.raw = ["Expected float value"], es2015_i18n_tag_1.default(_a));
var _a;
}
exports.floatValidator = floatValidator;
function floatPositiveValidator(value) {
return value == null || value === '' || isPositiveFloat(value.toString()) ? '' : (_a = ["Expected positive float value"], _a.raw = ["Expected positive float value"], es2015_i18n_tag_1.default(_a));
var _a;
}
exports.floatPositiveValidator = floatPositiveValidator;
function floatNonZeroValidator(value) {
return value == null || value === '' || isNonZeroFloat(value.toString()) ? '' : (_a = ["Expected non-zero float value"], _a.raw = ["Expected non-zero float value"], es2015_i18n_tag_1.default(_a));
var _a;
}
exports.floatNonZeroValidator = floatNonZeroValidator;
function requiredField(value, validators) {
validators = [requiredValidator].concat(validators || []);
return (_a = new formstate_1.FieldState(value)).validators.apply(_a, validators);
var _a;
}
exports.requiredField = requiredField;
function simpleField(value, validators) {
var fs = new formstate_1.FieldState(value);
if (validators) {
fs.validators.apply(fs, validators);
}
return fs;
}
exports.simpleField = simpleField;