openstack-uicore-foundation/lib/components/forms/simple-form.js

ui reactjs components for openstack marketing site

!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define("openstack-uicore-foundation",[],t):"object"==typeof exports?exports["openstack-uicore-foundation"]=t():e["openstack-uicore-foundation"]=t()}(this,(()=>(()=>{"use strict";var e={7651:(e,t,r)=>{r.d(t,{default:()=>p});var a=r(6031),n=r.n(a),s=r(2462),o=r.n(s),l=r(2015),i=r.n(l);const c=["onChange","value","className","error","ariaLabelledBy","containerClassName"];class p extends i().Component{constructor(e){super(e),this.handleChange=this.handleChange.bind(this)}componentDidUpdate(e,t,r){this.props.value!==e.value&&(this.input.value=this.props.value)}handleChange(e){this.props.onChange(e)}render(){let e=this.props,{onChange:t,value:r,className:a,error:s,ariaLabelledBy:l,containerClassName:p}=e,h=o()(e,c),m=this.props.hasOwnProperty("error")&&""!==s,u=this.props.hasOwnProperty("className")?a:"form-control",d=this.props.hasOwnProperty("containerClassName")?p:"container-form-control";return i().createElement("div",{className:d},i().createElement("input",n()({className:`${u} ${m?"error":""}`,ref:e=>{this.input=e},defaultValue:r,"aria-labelledby":l,onChange:this.handleChange},h)),m&&i().createElement("p",{className:"error-label"},s))}}p.defaultProps={ariaLabelledBy:null}},9558:(e,t,r)=>{r.d(t,{hasErrors:()=>n,isEmpty:()=>o,scrollToError:()=>a,shallowEqual:()=>s});r(5812),r(8041);const a=e=>{if(Object.keys(e).length>0){const t=Object.keys(e)[0],r=document.getElementById(t);r&&window.scrollTo(0,(e=>{var t=-70;if(e.offsetParent){do{t+=e.offsetTop}while(e=e.offsetParent);return[t]}})(r))}},n=(e,t)=>e in t?t[e]:"",s=(e,t)=>{const r=Object.keys(e),a=Object.keys(t);if(r.length!==a.length)return!1;for(let a of r)if(e[a]!==t[a])return!1;return!0},o=e=>0===Object.keys(e).length},1116:e=>{e.exports=require("@babel/runtime/helpers/defineProperty")},6031:e=>{e.exports=require("@babel/runtime/helpers/extends")},2462:e=>{e.exports=require("@babel/runtime/helpers/objectWithoutProperties")},1536:e=>{e.exports=require("awesome-bootstrap-checkbox/awesome-bootstrap-checkbox.css")},6842:e=>{e.exports=require("i18n-react/dist/i18n-react")},5812:e=>{e.exports=require("moment-timezone")},2015:e=>{e.exports=require("react")},8041:e=>{e.exports=require("urijs")}},t={};function r(a){var n=t[a];if(void 0!==n)return n.exports;var s=t[a]={exports:{}};return e[a](s,s.exports,r),s.exports}(()=>{r.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return r.d(t,{a:t}),t}})(),(()=>{r.d=(e,t)=>{for(var a in t)r.o(t,a)&&!r.o(e,a)&&Object.defineProperty(e,a,{enumerable:!0,get:t[a]})}})(),(()=>{r.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t)})(),(()=>{r.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})}})();var a={};r.r(a),r.d(a,{default:()=>b});var n=r(1116),s=r.n(n),o=r(2015),l=r.n(o),i=r(6842),c=r.n(i),p=(r(1536),r(7651)),h=r(9558);function m(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);t&&(a=a.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,a)}return r}function u(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?m(Object(r),!0).forEach((function(t){s()(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):m(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}class d extends l().Component{constructor(e){super(e),this.state={entity:u({},e.entity),errors:e.errors},this.handleChange=this.handleChange.bind(this),this.handleSubmit=this.handleSubmit.bind(this)}componentDidUpdate(e,t,r){const a={};(0,h.scrollToError)(this.props.errors),e.entity.id!==this.props.entity.id&&(a.entity=u({},this.props.entity),a.errors={}),(0,h.shallowEqual)(e.errors,this.props.errors)||(a.errors=u({},this.props.errors)),(0,h.isEmpty)(a)||this.setState(u(u({},this.state),a))}handleChange(e){let t=u({},this.state.entity),r=u({},this.state.errors),{value:a,id:n}=e.target;"checkbox"===e.target.type&&(a=e.target.checked),r[n]="",t[n]=a,this.setState({entity:t,errors:r})}handleSubmit(e){u({},this.state.entity);e.preventDefault(),this.props.onSubmit(this.state.entity)}createField(e){let{entity:t,errors:r}=this.state;switch(e.type){case"text":return l().createElement("div",{key:"field_"+e.name,className:"row form-group"},l().createElement("div",{className:"col-md-6"},l().createElement("label",null," ",e.label," "),l().createElement(p.default,{id:e.name,value:t[e.name],onChange:this.handleChange,className:"form-control",error:(0,h.hasErrors)(e.name,r)})));case"textarea":return l().createElement("div",{key:"field_"+e.name,className:"row form-group"},l().createElement("div",{className:"col-md-6"},l().createElement("label",null," ",e.label," "),l().createElement("textarea",{id:e.name,value:t[e.name],onChange:this.handleChange,className:"form-control"})));case"checkbox":return l().createElement("div",{key:"field_"+e.name,className:"row form-group"},l().createElement("div",{className:"col-md-6"},l().createElement("div",{className:"form-check abc-checkbox"},l().createElement("input",{type:"checkbox",id:e.name,checked:t[e.name],onChange:this.handleChange,className:"form-check-input"}),l().createElement("label",{className:"form-check-label",htmlFor:e.name},e.label))))}}render(){let{entity:e}=this.state,{fields:t}=this.props;return l().createElement("form",{className:"simple-form"},l().createElement("input",{type:"hidden",id:"id",value:e.id}),t.map((e=>this.createField(e))),l().createElement("div",{className:"row"},l().createElement("div",{className:"col-md-12 submit-buttons"},l().createElement("input",{type:"button",onClick:this.handleSubmit,className:"btn btn-primary pull-right",value:c().translate("general.save")}))))}}const b=d;return a})()));
//# sourceMappingURL=simple-form.js.map