simplr-forms-dom
Version:
DOM components for simplr-forms.
488 lines (456 loc) • 17.8 kB
JavaScript
(function webpackUniversalModuleDefinition(root, factory) {
if(typeof exports === 'object' && typeof module === 'object')
module.exports = factory(require("simplr-forms"), require("react"), require("typed-immutable-record"), require("./abstractions"));
else if(typeof define === 'function' && define.amd)
define(["simplr-forms", "react", "typed-immutable-record", "./abstractions"], factory);
else {
var a = typeof exports === 'object' ? factory(require("simplr-forms"), require("react"), require("typed-immutable-record"), require("./abstractions")) : factory(root["simplr-forms"], root["react"], root["typed-immutable-record"], root["./abstractions"]);
for(var i in a) (typeof exports === 'object' ? exports : root)[i] = a[i];
}
})(this, function(__WEBPACK_EXTERNAL_MODULE_0__, __WEBPACK_EXTERNAL_MODULE_1__, __WEBPACK_EXTERNAL_MODULE_2__, __WEBPACK_EXTERNAL_MODULE_11__) {
return /******/ (function(modules) { // webpackBootstrap
/******/ // The module cache
/******/ var installedModules = {};
/******/
/******/ // The require function
/******/ function __webpack_require__(moduleId) {
/******/
/******/ // Check if module is in cache
/******/ if(installedModules[moduleId]) {
/******/ return installedModules[moduleId].exports;
/******/ }
/******/ // Create a new module (and put it into the cache)
/******/ var module = installedModules[moduleId] = {
/******/ i: moduleId,
/******/ l: false,
/******/ exports: {}
/******/ };
/******/
/******/ // Execute the module function
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
/******/
/******/ // Flag the module as loaded
/******/ module.l = true;
/******/
/******/ // Return the exports of the module
/******/ return module.exports;
/******/ }
/******/
/******/
/******/ // expose the modules object (__webpack_modules__)
/******/ __webpack_require__.m = modules;
/******/
/******/ // expose the module cache
/******/ __webpack_require__.c = installedModules;
/******/
/******/ // identity function for calling harmony imports with the correct context
/******/ __webpack_require__.i = function(value) { return value; };
/******/
/******/ // define getter function for harmony exports
/******/ __webpack_require__.d = function(exports, name, getter) {
/******/ if(!__webpack_require__.o(exports, name)) {
/******/ Object.defineProperty(exports, name, {
/******/ configurable: false,
/******/ enumerable: true,
/******/ get: getter
/******/ });
/******/ }
/******/ };
/******/
/******/ // getDefaultExport function for compatibility with non-harmony modules
/******/ __webpack_require__.n = function(module) {
/******/ var getter = module && module.__esModule ?
/******/ function getDefault() { return module['default']; } :
/******/ function getModuleExports() { return module; };
/******/ __webpack_require__.d(getter, 'a', getter);
/******/ return getter;
/******/ };
/******/
/******/ // Object.prototype.hasOwnProperty.call
/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
/******/
/******/ // __webpack_public_path__
/******/ __webpack_require__.p = "";
/******/
/******/ // Load entry module and return exports
/******/ return __webpack_require__(__webpack_require__.s = 10);
/******/ })
/************************************************************************/
/******/ ([
/* 0 */
/***/ (function(module, exports) {
module.exports = __WEBPACK_EXTERNAL_MODULE_0__;
/***/ }),
/* 1 */
/***/ (function(module, exports) {
module.exports = __WEBPACK_EXTERNAL_MODULE_1__;
/***/ }),
/* 2 */
/***/ (function(module, exports) {
module.exports = __WEBPACK_EXTERNAL_MODULE_2__;
/***/ }),
/* 3 */,
/* 4 */
/***/ (function(module, exports, __webpack_require__) {
;
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 __());
};
})();
Object.defineProperty(exports, "__esModule", { value: true });
var React = __webpack_require__(1);
var typed_immutable_record_1 = __webpack_require__(2);
var simplr_forms_1 = __webpack_require__(0);
var Clear = (function (_super) {
__extends(Clear, _super);
function Clear(props) {
var _this = _super.call(this, props) || this;
_this.OnButtonClick = function (event) {
event.persist();
_this.FormStore.ClearFields(_this.props.fieldIds);
if (_this.props.onClick != null) {
_this.props.onClick(event);
}
};
_this.state = typed_immutable_record_1.recordify({
Submitting: false
});
return _this;
}
Clear.prototype.OnStoreUpdated = function () {
var formStore = this.FormStore.GetState();
var newState = typed_immutable_record_1.recordify({
Submitting: formStore.Form.Submitting
});
if (!newState.equals(this.state)) {
this.setState(function () { return newState; });
}
};
Object.defineProperty(Clear.prototype, "Disabled", {
get: function () {
if (this.props.disabled != null) {
return this.props.disabled;
}
return this.state.Submitting;
},
enumerable: true,
configurable: true
});
Clear.prototype.render = function () {
// TODO: Pass all other props.
return React.createElement("button", { type: "button", disabled: this.Disabled, onClick: this.OnButtonClick }, this.props.children);
};
return Clear;
}(simplr_forms_1.BaseContainer));
exports.Clear = Clear;
/***/ }),
/* 5 */
/***/ (function(module, exports, __webpack_require__) {
;
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;
};
Object.defineProperty(exports, "__esModule", { value: true });
var React = __webpack_require__(1);
var simplr_forms_1 = __webpack_require__(0);
var Form = (function (_super) {
__extends(Form, _super);
function Form() {
var _this = _super !== null && _super.apply(this, arguments) || this;
_this.SetElementRef = function (element) {
_this.Element = element;
_this.FormStore.SetFormSubmitCallback(function () {
element.dispatchEvent(new Event("submit"));
});
};
_this.FormSubmitHandler = function (event) {
if (_this.props.preventSubmitDefaultAndPropagation) {
event.preventDefault();
event.stopPropagation();
}
if (!_this.ShouldFormSubmit()) {
return;
}
// TODO: Touch all fields to validate
if (_this.props.onSubmit == null) {
return;
}
event.persist();
var result = _this.props.onSubmit(event, _this.FormStore);
_this.FormStore.SubmitForm(result);
};
return _this;
}
Form.prototype.render = function () {
return React.createElement("form", { ref: this.SetElementRef, onSubmit: this.FormSubmitHandler }, this.props.children);
};
return Form;
}(simplr_forms_1.BaseForm));
Form.defaultProps = __assign({}, simplr_forms_1.BaseForm.defaultProps, { preventSubmitDefaultAndPropagation: true });
exports.Form = Form;
/***/ }),
/* 6 */
/***/ (function(module, exports, __webpack_require__) {
;
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 __());
};
})();
Object.defineProperty(exports, "__esModule", { value: true });
var React = __webpack_require__(1);
var typed_immutable_record_1 = __webpack_require__(2);
var simplr_forms_1 = __webpack_require__(0);
var Reset = (function (_super) {
__extends(Reset, _super);
function Reset(props) {
var _this = _super.call(this, props) || this;
_this.OnButtonClick = function (event) {
event.persist();
_this.FormStore.ResetFields(_this.props.fieldIds);
if (_this.props.onClick != null) {
_this.props.onClick(event);
}
};
_this.state = typed_immutable_record_1.recordify({
Submitting: false
});
return _this;
}
Reset.prototype.OnStoreUpdated = function () {
var formStore = this.FormStore.GetState();
var newState = typed_immutable_record_1.recordify({
Submitting: formStore.Form.Submitting
});
if (!newState.equals(this.state)) {
this.setState(function () { return newState; });
}
};
Object.defineProperty(Reset.prototype, "Disabled", {
get: function () {
if (this.props.disabled != null) {
return this.props.disabled;
}
return this.state.Submitting;
},
enumerable: true,
configurable: true
});
Reset.prototype.render = function () {
// TODO: Pass all other props.
return React.createElement("button", { type: "button", disabled: this.Disabled, onClick: this.OnButtonClick }, this.props.children);
};
return Reset;
}(simplr_forms_1.BaseContainer));
exports.Reset = Reset;
/***/ }),
/* 7 */
/***/ (function(module, exports, __webpack_require__) {
;
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 __());
};
})();
Object.defineProperty(exports, "__esModule", { value: true });
var React = __webpack_require__(1);
var typed_immutable_record_1 = __webpack_require__(2);
var simplr_forms_1 = __webpack_require__(0);
var Submit = (function (_super) {
__extends(Submit, _super);
function Submit() {
return _super !== null && _super.apply(this, arguments) || this;
}
Submit.prototype.OnStoreUpdated = function () {
var formStore = this.FormStore.GetState();
var newState = {
Error: formStore.Form.Error,
Validating: formStore.Form.Validating,
Submitting: formStore.Form.Submitting,
Pristine: formStore.Pristine
};
var newStateRecord = typed_immutable_record_1.recordify(newState);
if (!newStateRecord.equals(this.state)) {
this.setState(function (prevState) {
// newStateRecord becomes an empty object after setState
// This happens because of an underlying Immutable.Record
return newState;
});
}
};
Object.defineProperty(Submit.prototype, "Disabled", {
get: function () {
if (this.props.disabled != null) {
return this.props.disabled;
}
if (this.state != null) {
if (this.props.disableOnError === true &&
this.state.Error != null) {
console.log("Disabling submit on error.");
return true;
}
if (this.props.disableOnBusy === true &&
this.Busy) {
console.log("Disabling submit on busy.");
return true;
}
if (this.props.disableOnPristine === true &&
this.state.Pristine === true) {
return true;
}
}
return false;
},
enumerable: true,
configurable: true
});
Object.defineProperty(Submit.prototype, "Busy", {
get: function () {
return this.props.busy === true ||
this.state != null &&
(this.state.Validating ||
this.state.Submitting);
},
enumerable: true,
configurable: true
});
Object.defineProperty(Submit.prototype, "InlineStyles", {
get: function () {
var inlineStyles = {};
if (this.props.style != null) {
inlineStyles = this.props.style;
}
if (this.Busy && !this.props.disabled) {
inlineStyles.cursor = this.props.busyClass;
}
return inlineStyles;
},
enumerable: true,
configurable: true
});
Submit.prototype.render = function () {
return React.createElement("button", { type: "submit", disabled: this.Disabled, style: this.InlineStyles }, this.props.children);
};
return Submit;
}(simplr_forms_1.BaseContainer));
Submit.defaultProps = {
disableOnBusy: true,
disableOnError: true,
disableOnPristine: false,
busyClass: "busy"
};
exports.Submit = Submit;
/***/ }),
/* 8 */
/***/ (function(module, exports, __webpack_require__) {
;
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 __());
};
})();
Object.defineProperty(exports, "__esModule", { value: true });
var React = __webpack_require__(1);
var base_dom_field_1 = __webpack_require__(11);
var Text = (function (_super) {
__extends(Text, _super);
function Text() {
var _this = _super !== null && _super.apply(this, arguments) || this;
_this.OnChangeHandler = function (event) {
_this.OnValueChange(_this.GetValueFromEvent(event));
var newValue = _this.FormStore.GetField(_this.FieldId).Value;
if (_this.props.onChange != null) {
_this.props.onChange(event, newValue, _this.FieldId, _this.FormId);
}
// TODO: FormProps.OnFieldChange
};
return _this;
}
Text.prototype.GetValueFromEvent = function (event) {
return event.currentTarget.value;
};
Object.defineProperty(Text.prototype, "RawDefaultValue", {
get: function () {
if (this.props.defaultValue != null) {
return this.props.defaultValue;
}
return "";
},
enumerable: true,
configurable: true
});
Object.defineProperty(Text.prototype, "IsDisabled", {
get: function () {
var disabled;
// TODO: FormProps.Disabled and FieldsGroupProps.Disabled
if (this.props.disabled != null) {
disabled = this.props.disabled;
}
return disabled;
},
enumerable: true,
configurable: true
});
Text.prototype.renderField = function () {
return React.createElement("input", { type: "text", name: this.FieldId, value: this.Value, onChange: this.OnChangeHandler, disabled: this.IsDisabled });
};
return Text;
}(base_dom_field_1.BaseDomField));
exports.Text = Text;
/***/ }),
/* 9 */,
/* 10 */
/***/ (function(module, exports, __webpack_require__) {
;
function __export(m) {
for (var p in m) if (!exports.hasOwnProperty(p)) exports[p] = m[p];
}
Object.defineProperty(exports, "__esModule", { value: true });
__export(__webpack_require__(5));
__export(__webpack_require__(8));
__export(__webpack_require__(7));
__export(__webpack_require__(6));
__export(__webpack_require__(4));
/***/ }),
/* 11 */
/***/ (function(module, exports) {
module.exports = __WEBPACK_EXTERNAL_MODULE_11__;
/***/ })
/******/ ]);
});