react-easy-edit - npm Package Compare versions

Comparing version 1.10.0 to 1.11.0

build/react-easy-edit.min.js

@@ -1,1 +0,1 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("prop-types")):"function"==typeof define&&define.amd?define(["exports","react","prop-types"],t):t((e=e||self)["react-easy-edit"]={},e.React,e.PropTypes)}(this,function(e,t,a){"use strict";var c="default"in t?t.default:t;function n(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function s(e,t){for(var a=0;a<t.length;a++){var n=t[a];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}function r(e,t,a){return t&&s(e.prototype,t),a&&s(e,a),e}function o(e,t,a){return t in e?Object.defineProperty(e,t,{value:a,enumerable:!0,configurable:!0,writable:!0}):e[t]=a,e}function p(){return(p=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var a=arguments[t];for(var n in a)Object.prototype.hasOwnProperty.call(a,n)&&(e[n]=a[n])}return e}).apply(this,arguments)}function l(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),t&&u(e,t)}function i(e){return(i=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)})(e)}function u(e,t){return(u=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e})(e,t)}function d(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}function h(e,t){return!t||"object"!=typeof t&&"function"!=typeof t?d(e):t}a=a&&a.hasOwnProperty("default")?a.default:a;!function(e,t){void 0===t&&(t={});var a=t.insertAt;if(e&&"undefined"!=typeof document){var n=document.head||document.getElementsByTagName("head")[0],s=document.createElement("style");s.type="text/css","top"===a&&n.firstChild?n.insertBefore(s,n.firstChild):n.appendChild(s),s.styleSheet?s.styleSheet.cssText=e:s.appendChild(document.createTextNode(e))}}(".easy-edit-button-wrapper{display:inline}.easy-edit-hover-on{cursor:pointer;font-style:italic}.easy-edit-radio-label{display:block}.easy-edit-not-allowed{cursor:not-allowed}.easy-edit-checkbox-label{display:block}.easy-edit-textarea{min-height:40px}.easy-edit-button{border:none;display:inline-block;margin:0 2px;padding:4px;text-align:center;text-decoration:none}.easy-edit-component-wrapper{display:inline-grid}.easy-edit-validation-error{color:red}");function v(e){var t=e.options,a=e.value,n=e.onChange,s=e.placeholder,r=e.attributes,o=e.cssClassPrefix,l=e.onBlur;return c.createElement("div",{className:o+"easy-edit-component-wrapper"},c.createElement("select",p({value:a||"",onChange:n,onBlur:l},r),c.createElement("option",{key:"",value:"",disabled:"disabled"},s),t.map(function(e){return c.createElement("option",{value:e.value,key:e.value},e.label)})))}var f=Object.freeze({DEFAULT_PLACEHOLDER:"Click to edit",DEFAULT_SELECT_PLACEHOLDER:"Select ...",DEFAULT_SAVE_BUTTON_LABEL:"Save",DEFAULT_CANCEL_BUTTON_LABEL:"Cancel",DEFAULT_BUTTON_CSS_CLASS:"easy-edit-button",DEFAULT_ON_HOVER_CSS_CLASS:"easy-edit-hover-on",ERROR_UNSUPPORTED_TYPE:"Unsupported component type, please review documentation for supported HTML component types",FAILED_VALIDATION_MESSAGE:"Please provide a valid value",POSITION_AFTER:"after",POSITION_BEFORE:"before"});v.propTypes={options:a.array.isRequired,onChange:a.func,value:a.oneOfType([a.string,a.number]),placeholder:a.string,attributes:a.object,cssClassPrefix:a.string,onBlur:a.func},v.defaultProps={attributes:{},placeholder:f.DEFAULT_SELECT_PLACEHOLDER};function E(e){var t=e.type,a=e.value,n=e.placeholder,s=e.onChange,r=e.attributes,o=e.cssClassPrefix,l=e.onBlur;return c.createElement("div",{className:o+"easy-edit-component-wrapper"},c.createElement("input",p({autoFocus:r.autoFocus||!0,type:t,value:a||void 0,onChange:s,onBlur:l,placeholder:r.placeholder||n,autoComplete:r.autoComplete||"off"},r)))}E.propTypes={type:a.string.isRequired,onChange:a.func,value:a.string,placeholder:a.string,attributes:a.object,cssClassPrefix:a.string,onBlur:a.func},E.defaultProps={attributes:{},placeholder:f.DEFAULT_PLACEHOLDER};function C(e){var t=e.value,a=e.placeholder,n=e.onChange,s=e.attributes,r=e.cssClassPrefix,o=e.onBlur;return c.createElement("div",{className:r+"easy-edit-component-wrapper"},c.createElement("textarea",p({autoFocus:s.autoFocus||!0,value:t,onChange:n,onBlur:o,placeholder:a},s,{className:void 0!==s.className?s.className+" easy-edit-textarea":"easy-edit-textarea"})))}C.propTypes={onChange:a.func,value:a.string,placeholder:a.string,attributes:a.object,cssClassPrefix:a.string,onBlur:a.func},C.defaultProps={attributes:{},placeholder:f.DEFAULT_PLACEHOLDER};function m(e){var t=e.options,a=e.value,n=e.onChange,s=e.attributes,r=e.cssClassPrefix,o=e.onBlur,l=t.map(function(e){return c.createElement("label",{key:e.value,className:r+"easy-edit-radio-label"},c.createElement("input",p({type:"radio",value:e.value,onChange:n,onBlur:o,checked:e.value===a},s)),e.label)});return c.createElement("div",null,l)}m.propTypes={onChange:a.func,value:a.oneOfType([a.string,a.number]),attributes:a.object,cssClassPrefix:a.string,onBlur:a.func},m.defaultProps={attributes:{}};function y(e){var t=e.options,a=e.value,n=e.onChange,s=e.attributes,r=e.cssClassPrefix,o=e.onBlur;a=a||[];var l=t.map(function(e){return c.createElement("label",{key:e.value,className:r+"easy-edit-checkbox-label"},c.createElement("input",p({},s,{type:"checkbox",value:e.value,key:e.value,onChange:n,onBlur:o,checked:a.includes(e.value)})),e.label)});return c.createElement("div",null,l)}y.propTypes={onChange:a.func,options:a.array.isRequired,value:a.array,attributes:a.object,cssClassPrefix:a.string,onBlur:a.func},y.defaultProps={attributes:{}};function b(e){var t=e.value,a=void 0===t?"":t,n=e.onChange,s=e.attributes,r=e.cssClassPrefix,o=e.onBlur;return c.createElement("div",{className:r+"easy-edit-component-wrapper"},c.createElement("input",p({type:"color",defaultValue:a,onChange:n,onBlur:o},s)))}b.propTypes={onChange:a.func,value:a.string,attributes:a.object,cssClassPrefix:a.string,onBlur:a.func},b.defaultProps={attributes:{}};function T(e){var t=e.options,a=e.value,n=e.onChange,s=e.attributes,r=e.placeholder,o=e.cssClassPrefix,l=e.onBlur,i=c.createRef(),u=t.map(function(e){return c.createElement("option",{key:e.value,value:e.label})});return c.createElement("div",{className:o+"easy-edit-component-wrapper"},c.createElement("input",p({autoFocus:s.autoFocus||!0,value:a||void 0,onChange:n,onBlur:l,placeholder:r,autoComplete:s.autoComplete||"off"},s,{list:i})),c.createElement("datalist",{id:i},u))}T.propTypes={onChange:a.func,value:a.oneOfType([a.string,a.number]),attributes:a.object,cssClassPrefix:a.string,onBlur:a.func},T.defaultProps={attributes:{}};var g=function(){function a(e){var t;return n(this,a),(t=h(this,i(a).call(this,e))).state={value:e.value},t.setValue=t.setValue.bind(d(t)),t}return l(a,t.Component),r(a,[{key:"setValue",value:function(e){var t=this;this.setState({value:e},function(){return t.props.setValue(e)})}},{key:"render",value:function(){var e=this.state.value,t=this.props,a=t.children,n=t.cssClassPrefix,s=c.cloneElement(c.Children.only(a),{setParentValue:this.setValue,value:e});return c.createElement("div",{className:n+"easy-edit-component-wrapper"},s)}}]),a}(),O=function(){function u(e){var s;return n(this,u),o(d(s=h(this,i(u).call(this,e))),"onKeyDown",function(e){var t=s.props,a=t.type,n=t.disableAutoSubmit;t.disableAutoCancel||27!==e.keyCode||s._onCancel(),n||(13===e.keyCode&&a!==A.TEXTAREA||13===e.keyCode&&e.ctrlKey&&a===A.TEXTAREA)&&s._onSave()}),o(d(s),"_onSave",function(){var e=s.props,t=e.onSave,a=e.onValidate,n=s.state.tempValue;a(n)?s.setState({editing:!1,value:n,isValid:!0,hover:!1},function(){return t(s.state.value)}):s.setState({isValid:!1})}),o(d(s),"_onBlur",function(){var e=s.props,t=e.onBlur;e.saveOnBlur?(t(s.state.tempValue),s._onSave()):t(s.state.tempValue)}),o(d(s),"_onCancel",function(){var e=s.props.onCancel,t=s.state.value;s.setState({editing:!1,tempValue:t,hover:!1},function(){return e()})}),o(d(s),"onChange",function(e){s.setState({tempValue:e.target?e.target.value:e})}),o(d(s),"onCheckboxChange",function(e){var t=s.props.options,a=s.state.tempValue||[];e.target.checked&&!a.includes(e.target.value)?a.push(e.target.value):a.splice(a.indexOf(e.target.value),1);var n=t.map(function(e){return e.value});a=a.filter(function(e){return n.includes(e)}),s.setState({tempValue:a})}),o(d(s),"onClick",function(){s.props.allowEdit&&s.setState({editing:!0})}),o(d(s),"hoverOn",function(){s.props.allowEdit&&s.setState({hover:!0})}),o(d(s),"hoverOff",function(){s.setState({hover:!1})}),s.state={editing:!1,hover:!1,value:e.value,tempValue:e.value,isValid:!0},s.saveButton=c.createRef(),s.cancelButton=c.createRef(),s}return l(u,c.Component),r(u,[{key:"componentDidUpdate",value:function(e){this.props.value!==e.value&&this.setState({tempValue:this.props.value,value:this.props.value})}},{key:"renderInput",value:function(){var e=this.props,t=e.type,a=e.options,n=e.placeholder,s=e.attributes,r=e.editComponent,o=e.cssClassPrefix,l=this.state.editing;if(this.cullAttributes(),c.isValidElement(r))return c.createElement(g,{setValue:this.onChange,value:this.state.tempValue,cssClassPrefix:o},r);switch(t){case A.TEXT:case A.PASSWORD:case A.EMAIL:case A.NUMBER:case A.DATE:case A.DATETIME_LOCAL:case A.TIME:case A.MONTH:case A.WEEK:case A.RANGE:return c.createElement(E,{value:l?this.state.tempValue:this.state.value,placeholder:n,onChange:this.onChange,onBlur:this._onBlur,type:t,attributes:s,cssClassPrefix:o});case A.COLOR:return c.createElement(b,{value:l?this.state.tempValue:this.state.value,onChange:this.onChange,onBlur:this._onBlur,attributes:s,cssClassPrefix:o});case A.TEXTAREA:return c.createElement(C,{value:l?this.state.tempValue:this.state.value,placeholder:n,onChange:this.onChange,onBlur:this._onBlur,attributes:s,cssClassPrefix:o});case A.SELECT:return c.createElement(v,{value:l?this.state.tempValue:this.state.value,onChange:this.onChange,onBlur:this._onBlur,options:a,placeholder:n===f.DEFAULT_PLACEHOLDER?f.DEFAULT_SELECT_PLACEHOLDER:n,attributes:s,cssClassPrefix:o});case A.RADIO:return c.createElement(m,{value:l?this.state.tempValue:this.state.value,onChange:this.onChange,onBlur:this._onBlur,options:a,attributes:s,cssClassPrefix:o});case A.CHECKBOX:return c.createElement(y,{value:l?this.state.tempValue:this.state.value,onChange:this.onCheckboxChange,onBlur:this._onBlur,options:a,attributes:s,cssClassPrefix:o});case A.DATALIST:return c.createElement(T,{value:l?this.state.tempValue:this.state.value,onChange:this.onChange,onBlur:this._onBlur,options:a,attributes:s,cssClassPrefix:o});default:throw new Error(f.ERROR_UNSUPPORTED_TYPE)}}},{key:"renderButtons",value:function(){var e=this.props,t=e.saveOnBlur,a=e.saveButtonLabel,n=e.saveButtonStyle,s=e.cancelButtonLabel,r=e.cancelButtonStyle,o=e.cssClassPrefix,l=e.hideSaveButton,i=e.hideCancelButton;return c.createElement("div",{className:o+"easy-edit-button-wrapper"},!l&&u.generateButton(this.saveButton,this._onSave,a,null===n?o+f.DEFAULT_BUTTON_CSS_CLASS:n,"save",t),!i&&u.generateButton(this.cancelButton,this._onCancel,s,null===r?o+f.DEFAULT_BUTTON_CSS_CLASS:r,"cancel",t))}},{key:"renderValidationMessage",value:function(){var e=this.props,t=e.validationMessage,a=e.cssClassPrefix;if(!this.state.isValid)return c.createElement("div",{className:a+"easy-edit-validation-error"},t)}},{key:"renderInstructions",value:function(){var e=this.props,t=e.instructions,a=e.cssClassPrefix;if(this.state.editing&&null!==t)return c.createElement("div",{className:a+"easy-edit-instructions"},t)}},{key:"setCssClasses",value:function(e){var t=this.props,a=t.viewAttributes,n=t.cssClassPrefix,s=t.onHoverCssClass;return a.class&&(e+=" "+a.class),a.className&&(e+=" "+a.className),this.props.allowEdit?this.state.hover?s===f.DEFAULT_ON_HOVER_CSS_CLASS?n+"easy-edit-hover-on "+e:s+" "+e:e:n+"easy-edit-not-allowed "+e}},{key:"renderPlaceholder",value:function(){var e=this.props,t=e.type,a=e.placeholder,n=e.displayComponent,s=e.viewAttributes,r=e.cssClassPrefix;this.cullAttributes();var o=r+"easy-edit-wrapper";if(c.isValidElement(n))return c.createElement("div",p({},s,{className:this.setCssClasses(o),onClick:this.onClick,onMouseEnter:this.hoverOn,onMouseLeave:this.hoverOff}),this.state.value?c.cloneElement(n,{value:this.state.value}):a);switch(t){case A.TEXT:case A.DATALIST:case A.EMAIL:case A.TEXTAREA:case A.NUMBER:case A.DATE:case A.DATETIME_LOCAL:case A.TIME:case A.MONTH:case A.WEEK:case A.RANGE:case A.PASSWORD:return c.createElement("div",p({},s,{className:this.setCssClasses(o),onClick:this.onClick,onMouseEnter:this.hoverOn,onMouseLeave:this.hoverOff}),this.state.value?t===A.PASSWORD?"••••••••":this.state.value:a);case A.RADIO:case A.CHECKBOX:case A.SELECT:return c.createElement("div",p({},s,{className:this.setCssClasses(o),onClick:this.onClick,onMouseEnter:this.hoverOn,onMouseLeave:this.hoverOff}),this.renderComplexView());case A.COLOR:return c.createElement("input",p({},s,{type:t,value:this.state.value,onClick:this.onClick,readOnly:!0}));default:throw new Error(f.ERROR_UNSUPPORTED_TYPE)}}},{key:"renderComplexView",value:function(){var e,t=this,a=this.props,n=a.placeholder,s=a.options,r=a.type;return null===this.state.value||0===this.state.value.length?n:0!==(e=A.CHECKBOX===r?s.filter(function(e){return t.state.value.includes(e.value)}):s.filter(function(e){return t.state.value===e.value})).length?e.map(function(e){return e.label}).join(", "):this.state.value}},{key:"cullAttributes",value:function(){var e=this.props.attributes;delete e.type,delete e.onChange,delete e.value}},{key:"render",value:function(){var t=this,e=this.props,a=e.cssClassPrefix,n=e.buttonsPosition;return this.state.editing?c.createElement("div",{className:a+"easy-edit-inline-wrapper",tabIndex:"0",onKeyDown:function(e){return t.onKeyDown(e)}},n===f.POSITION_BEFORE&&this.renderButtons(),this.renderInput(),n===f.POSITION_AFTER&&this.renderButtons(),this.renderInstructions(),this.renderValidationMessage()):this.renderPlaceholder()}}],[{key:"generateButton",value:function(e,t,a,n,s,r){return r?"":c.createElement("button",{ref:e,onClick:t,className:n,name:s},a)}}]),u}(),A={COLOR:"color",CHECKBOX:"checkbox",DATALIST:"datalist",DATE:"date",DATETIME_LOCAL:"datetime-local",EMAIL:"email",MONTH:"month",NUMBER:"number",PASSWORD:"password",RADIO:"radio",RANGE:"range",SELECT:"select",TEXT:"text",TEXTAREA:"textarea",TIME:"time",WEEK:"week"};Object.freeze(A),O.propTypes={type:a.oneOf(["text","number","color","textarea","date","datetime-local","email","password","time","month","week","radio","checkbox","select","range","datalist"]).isRequired,value:a.oneOfType([a.string,a.number,a.array,a.object]),options:a.array,saveButtonLabel:a.oneOfType([a.string,a.element]),saveButtonStyle:a.string,cancelButtonLabel:a.oneOfType([a.string,a.element]),cancelButtonStyle:a.string,buttonsPosition:a.oneOf(["after","before"]),placeholder:a.string,onCancel:a.func,onValidate:a.func,onBlur:a.func,onSave:a.func.isRequired,validationMessage:a.string,allowEdit:a.bool,attributes:a.object,viewAttributes:a.object,instructions:a.string,editComponent:a.element,displayComponent:a.element,disableAutoSubmit:a.bool,disableAutoCancel:a.bool,cssClassPrefix:a.string,hideSaveButton:a.bool,hideCancelButton:a.bool,onHoverCssClass:a.string,saveOnBlur:a.bool},O.defaultProps={value:null,saveButtonLabel:f.DEFAULT_SAVE_BUTTON_LABEL,saveButtonStyle:null,cancelButtonLabel:f.DEFAULT_CANCEL_BUTTON_LABEL,cancelButtonStyle:null,buttonsPosition:f.POSITION_AFTER,placeholder:f.DEFAULT_PLACEHOLDER,allowEdit:!0,onCancel:function(){},onBlur:function(){},onValidate:function(){return!0},validationMessage:f.FAILED_VALIDATION_MESSAGE,attributes:{},viewAttributes:{},instructions:null,editComponent:null,placeholderComponent:null,disableAutoSubmit:!1,disableAutoCancel:!1,cssClassPrefix:"",hideSaveButton:!1,hideCancelButton:!1,onHoverCssClass:f.DEFAULT_ON_HOVER_CSS_CLASS,saveOnBlur:!1},e.Types=A,e.default=O,Object.defineProperty(e,"__esModule",{value:!0})});
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("prop-types")):"function"==typeof define&&define.amd?define(["exports","react","prop-types"],t):t((e=e||self)["react-easy-edit"]={},e.React,e.PropTypes)}(this,function(e,t,n){"use strict";var h="default"in t?t.default:t;function a(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function s(e,t){for(var n=0;n<t.length;n++){var a=t[n];a.enumerable=a.enumerable||!1,a.configurable=!0,"value"in a&&(a.writable=!0),Object.defineProperty(e,a.key,a)}}function o(e,t,n){return t&&s(e.prototype,t),n&&s(e,n),e}function r(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function p(){return(p=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&(e[a]=n[a])}return e}).apply(this,arguments)}function l(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),t&&u(e,t)}function i(e){return(i=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)})(e)}function u(e,t){return(u=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e})(e,t)}function c(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}function f(e,t){return!t||"object"!=typeof t&&"function"!=typeof t?c(e):t}n=n&&n.hasOwnProperty("default")?n.default:n;!function(e,t){void 0===t&&(t={});var n=t.insertAt;if(e&&"undefined"!=typeof document){var a=document.head||document.getElementsByTagName("head")[0],s=document.createElement("style");s.type="text/css","top"===n&&a.firstChild?a.insertBefore(s,a.firstChild):a.appendChild(s),s.styleSheet?s.styleSheet.cssText=e:s.appendChild(document.createTextNode(e))}}(".easy-edit-button-wrapper{display:inline}.easy-edit-hover-on{cursor:pointer;font-style:italic}.easy-edit-radio-label{display:block}.easy-edit-not-allowed{cursor:not-allowed}.easy-edit-checkbox-label{display:block}.easy-edit-textarea{min-height:40px}.easy-edit-button{border:none;display:inline-block;margin:0 2px;padding:4px;text-align:center;text-decoration:none}.easy-edit-component-wrapper{display:inline-grid}.easy-edit-validation-error{color:red}");function v(e){var t=e.options,n=e.value,a=e.onChange,s=e.placeholder,o=e.attributes,r=e.cssClassPrefix,l=e.onFocus,i=e.onBlur;return h.createElement("div",{className:r+"easy-edit-component-wrapper"},h.createElement("select",p({value:n||"",onChange:a,onFocus:l,onBlur:i},o),h.createElement("option",{key:"",value:"",disabled:"disabled"},s),t.map(function(e){return h.createElement("option",{value:e.value,key:e.value},e.label)})))}var E=Object.freeze({DEFAULT_PLACEHOLDER:"Click to edit",DEFAULT_SELECT_PLACEHOLDER:"Select ...",DEFAULT_SAVE_BUTTON_LABEL:"Save",DEFAULT_CANCEL_BUTTON_LABEL:"Cancel",DEFAULT_DELETE_BUTTON_LABEL:"Delete",DEFAULT_BUTTON_CSS_CLASS:"easy-edit-button",DEFAULT_ON_HOVER_CSS_CLASS:"easy-edit-hover-on",ERROR_UNSUPPORTED_TYPE:"Unsupported component type, please review documentation for supported HTML component types",FAILED_VALIDATION_MESSAGE:"Please provide a valid value",POSITION_AFTER:"after",POSITION_BEFORE:"before"});v.propTypes={options:n.array.isRequired,onChange:n.func,value:n.oneOfType([n.string,n.number]),placeholder:n.string,attributes:n.object,cssClassPrefix:n.string,onFocus:n.func,onBlur:n.func},v.defaultProps={attributes:{},placeholder:E.DEFAULT_SELECT_PLACEHOLDER};function C(e){var t=e.type,n=e.value,a=e.placeholder,s=e.onChange,o=e.attributes,r=e.cssClassPrefix,l=e.onFocus,i=e.onBlur;return h.createElement("div",{className:r+"easy-edit-component-wrapper"},h.createElement("input",p({autoFocus:o.autoFocus||!0,type:t,value:n||void 0,onChange:s,onFocus:l,onBlur:i,placeholder:o.placeholder||a,autoComplete:o.autoComplete||"off"},o)))}C.propTypes={type:n.string.isRequired,onChange:n.func,value:n.string,placeholder:n.string,attributes:n.object,cssClassPrefix:n.string,onFocus:n.func,onBlur:n.func},C.defaultProps={attributes:{},placeholder:E.DEFAULT_PLACEHOLDER,onfocus:function(){}};function m(e){var t=e.value,n=e.placeholder,a=e.onChange,s=e.attributes,o=e.cssClassPrefix,r=e.onFocus,l=e.onBlur;return h.createElement("div",{className:o+"easy-edit-component-wrapper"},h.createElement("textarea",p({autoFocus:s.autoFocus||!0,value:t,onChange:a,onFocus:r,onBlur:l,placeholder:n},s,{className:void 0!==s.className?s.className+" easy-edit-textarea":"easy-edit-textarea"})))}m.propTypes={onChange:n.func,value:n.string,placeholder:n.string,attributes:n.object,cssClassPrefix:n.string,onBlur:n.func,onFocus:n.func},m.defaultProps={attributes:{},placeholder:E.DEFAULT_PLACEHOLDER};function b(e){var t=e.options,n=e.value,a=e.onChange,s=e.attributes,o=e.cssClassPrefix,r=e.onFocus,l=e.onBlur,i=t.map(function(e){return h.createElement("label",{key:e.value,className:o+"easy-edit-radio-label"},h.createElement("input",p({type:"radio",value:e.value,onChange:a,onFocus:r,onBlur:l,checked:e.value===n},s)),e.label)});return h.createElement("div",null,i)}b.propTypes={onChange:n.func,value:n.oneOfType([n.string,n.number]),attributes:n.object,cssClassPrefix:n.string,onFocus:n.func,onBlur:n.func},b.defaultProps={attributes:{}};function y(e){var t=e.options,n=e.value,a=e.onChange,s=e.attributes,o=e.cssClassPrefix,r=e.onFocus,l=e.onBlur;n=n||[];var i=t.map(function(e){return h.createElement("label",{key:e.value,className:o+"easy-edit-checkbox-label"},h.createElement("input",p({},s,{type:"checkbox",value:e.value,key:e.value,onChange:a,onFocus:r,onBlur:l,checked:n.includes(e.value)})),e.label)});return h.createElement("div",null,i)}y.propTypes={onChange:n.func,options:n.array.isRequired,value:n.array,attributes:n.object,cssClassPrefix:n.string,onFocus:n.func,onBlur:n.func},y.defaultProps={attributes:{}};function T(e){var t=e.value,n=void 0===t?"":t,a=e.onChange,s=e.attributes,o=e.cssClassPrefix,r=e.onFocus,l=e.onBlur;return h.createElement("div",{className:o+"easy-edit-component-wrapper"},h.createElement("input",p({type:"color",defaultValue:n,onChange:a,onFocus:r,onBlur:l},s)))}T.propTypes={onChange:n.func,value:n.string,attributes:n.object,cssClassPrefix:n.string,onFocus:n.func,onBlur:n.func},T.defaultProps={attributes:{}};function g(e){var t=e.options,n=e.value,a=e.onChange,s=e.attributes,o=e.placeholder,r=e.cssClassPrefix,l=e.onFocus,i=e.onBlur,u=h.createRef(),c=t.map(function(e){return h.createElement("option",{key:e.value,value:e.label})});return h.createElement("div",{className:r+"easy-edit-component-wrapper"},h.createElement("input",p({autoFocus:s.autoFocus||!0,value:n||void 0,onChange:a,onFocus:l,onBlur:i,placeholder:o,autoComplete:s.autoComplete||"off"},s,{list:u})),h.createElement("datalist",{id:u},c))}g.propTypes={onChange:n.func,value:n.oneOfType([n.string,n.number]),attributes:n.object,cssClassPrefix:n.string,onFocus:n.func,onBlur:n.func},g.defaultProps={attributes:{}};var B=function(){function n(e){var t;return a(this,n),(t=f(this,i(n).call(this,e))).state={value:e.value},t.setValue=t.setValue.bind(c(t)),t}return l(n,t.Component),o(n,[{key:"setValue",value:function(e){var t=this;this.setState({value:e},function(){return t.props.setValue(e)})}},{key:"render",value:function(){var e=this.state.value,t=this.props,n=t.children,a=t.cssClassPrefix,s=h.cloneElement(h.Children.only(n),{setParentValue:this.setValue,value:e});return h.createElement("div",{className:a+"easy-edit-component-wrapper"},s)}}]),n}(),d=function(){function d(e){var s;return a(this,d),r(c(s=f(this,i(d).call(this,e))),"onKeyDown",function(e){var t=s.props,n=t.type,a=t.disableAutoSubmit;t.disableAutoCancel||27!==e.keyCode||s._onCancel(),a||(13===e.keyCode&&n!==A.TEXTAREA||13===e.keyCode&&e.ctrlKey&&n===A.TEXTAREA)&&s._onSave()}),r(c(s),"_onSave",function(){var e=s.props,t=e.onSave,n=e.onValidate,a=s.state.tempValue;n(a)?s.setState({editing:!1,value:a,isValid:!0,hover:!1},function(){return t(s.state.value)}):s.setState({isValid:!1})}),r(c(s),"_onBlur",function(){var e=s.props,t=e.onBlur;e.saveOnBlur?(t(s.state.tempValue),s._onSave()):t(s.state.tempValue)}),r(c(s),"_onFocus",function(){var e=s.props.onFocus;e&&e(s.state.tempValue)}),r(c(s),"_onCancel",function(){var e=s.props.onCancel,t=s.state.value;s.setState({editing:!1,tempValue:t,hover:!1},function(){return e()})}),r(c(s),"_onDelete",function(){var e=s.props.onDelete,t=s.state.value;s.setState({editing:!1,tempValue:t,hover:!1,isHidden:!0},function(){return e()})}),r(c(s),"onChange",function(e){s.setState({tempValue:e.target?e.target.value:e})}),r(c(s),"onCheckboxChange",function(e){var t=s.props.options,n=s.state.tempValue||[];e.target.checked&&!n.includes(e.target.value)?n.push(e.target.value):n.splice(n.indexOf(e.target.value),1);var a=t.map(function(e){return e.value});n=n.filter(function(e){return a.includes(e)}),s.setState({tempValue:n})}),r(c(s),"onClick",function(){s.props.allowEdit&&s.setState({editing:!0})}),r(c(s),"hoverOn",function(){s.props.allowEdit&&s.setState({hover:!0})}),r(c(s),"hoverOff",function(){s.setState({hover:!1})}),s.state={editing:e.editMode||!1,hover:!1,value:e.value,tempValue:e.value,isValid:!0,isHidden:!1},s.saveButton=h.createRef(),s.cancelButton=h.createRef(),s.deleteButton=h.createRef(),s}return l(d,h.Component),o(d,[{key:"componentDidUpdate",value:function(e){this.props.value!==e.value&&this.setState({tempValue:this.props.value,value:this.props.value})}},{key:"renderInput",value:function(){var e=this.props,t=e.type,n=e.options,a=e.placeholder,s=e.attributes,o=e.editComponent,r=e.cssClassPrefix,l=this.state.editing;if(this.cullAttributes(),h.isValidElement(o))return h.createElement(B,{setValue:this.onChange,value:this.state.tempValue,cssClassPrefix:r},o);switch(t){case A.TEXT:case A.PASSWORD:case A.EMAIL:case A.NUMBER:case A.DATE:case A.DATETIME_LOCAL:case A.TIME:case A.MONTH:case A.WEEK:case A.RANGE:return h.createElement(C,{value:l?this.state.tempValue:this.state.value,placeholder:a,onChange:this.onChange,onFocus:this._onFocus(),onBlur:this._onBlur,type:t,attributes:s,cssClassPrefix:r});case A.COLOR:return h.createElement(T,{value:l?this.state.tempValue:this.state.value,onChange:this.onChange,onFocus:this._onFocus(),onBlur:this._onBlur,attributes:s,cssClassPrefix:r});case A.TEXTAREA:return h.createElement(m,{value:l?this.state.tempValue:this.state.value,placeholder:a,onChange:this.onChange,onFocus:this._onFocus(),onBlur:this._onBlur,attributes:s,cssClassPrefix:r});case A.SELECT:return h.createElement(v,{value:l?this.state.tempValue:this.state.value,onChange:this.onChange,onFocus:this._onFocus(),onBlur:this._onBlur,options:n,placeholder:a===E.DEFAULT_PLACEHOLDER?E.DEFAULT_SELECT_PLACEHOLDER:a,attributes:s,cssClassPrefix:r});case A.RADIO:return h.createElement(b,{value:l?this.state.tempValue:this.state.value,onChange:this.onChange,onFocus:this._onFocus(),onBlur:this._onBlur,options:n,attributes:s,cssClassPrefix:r});case A.CHECKBOX:return h.createElement(y,{value:l?this.state.tempValue:this.state.value,onChange:this.onCheckboxChange,onFocus:this._onFocus(),onBlur:this._onBlur,options:n,attributes:s,cssClassPrefix:r});case A.DATALIST:return h.createElement(g,{value:l?this.state.tempValue:this.state.value,onChange:this.onChange,onFocus:this._onFocus(),onBlur:this._onBlur,options:n,attributes:s,cssClassPrefix:r});default:throw new Error(E.ERROR_UNSUPPORTED_TYPE)}}},{key:"renderButtons",value:function(){var e=this.props,t=e.saveOnBlur,n=e.saveButtonLabel,a=e.saveButtonStyle,s=e.cancelButtonLabel,o=e.cancelButtonStyle,r=e.deleteButtonLabel,l=e.deleteButtonStyle,i=e.cssClassPrefix,u=e.hideSaveButton,c=e.hideCancelButton,p=e.hideDeleteButton;return h.createElement("div",{className:i+"easy-edit-button-wrapper"},!u&&d.generateButton(this.saveButton,this._onSave,n,null===a?i+E.DEFAULT_BUTTON_CSS_CLASS:a,"save",t),!c&&d.generateButton(this.cancelButton,this._onCancel,s,null===o?i+E.DEFAULT_BUTTON_CSS_CLASS:o,"cancel",t),!p&&d.generateButton(this.deleteButton,this._onDelete,r,null===l?i+E.DEFAULT_BUTTON_CSS_CLASS:l,"delete",t))}},{key:"renderValidationMessage",value:function(){var e=this.props,t=e.validationMessage,n=e.cssClassPrefix;if(!this.state.isValid)return h.createElement("div",{className:n+"easy-edit-validation-error"},t)}},{key:"renderInstructions",value:function(){var e=this.props,t=e.instructions,n=e.cssClassPrefix,a=e.editMode;if((this.state.editing||a)&&null!==t)return h.createElement("div",{className:n+"easy-edit-instructions"},t)}},{key:"setCssClasses",value:function(e){var t=this.props,n=t.viewAttributes,a=t.cssClassPrefix,s=t.onHoverCssClass;return n.class&&(e+=" "+n.class),n.className&&(e+=" "+n.className),this.props.allowEdit?this.state.hover?s===E.DEFAULT_ON_HOVER_CSS_CLASS?a+"easy-edit-hover-on "+e:s+" "+e:e:a+"easy-edit-not-allowed "+e}},{key:"renderPlaceholder",value:function(){var e=this.props,t=e.type,n=e.placeholder,a=e.displayComponent,s=e.viewAttributes,o=e.cssClassPrefix;this.cullAttributes();var r=o+"easy-edit-wrapper";if(h.isValidElement(a))return h.createElement("div",p({},s,{className:this.setCssClasses(r),onClick:this.onClick,onMouseEnter:this.hoverOn,onMouseLeave:this.hoverOff}),this.state.value?h.cloneElement(a,{value:this.state.value}):n);switch(t){case A.TEXT:case A.DATALIST:case A.EMAIL:case A.TEXTAREA:case A.NUMBER:case A.DATE:case A.DATETIME_LOCAL:case A.TIME:case A.MONTH:case A.WEEK:case A.RANGE:case A.PASSWORD:return h.createElement("div",p({},s,{className:this.setCssClasses(r),onClick:this.onClick,onMouseEnter:this.hoverOn,onMouseLeave:this.hoverOff}),this.state.value?t===A.PASSWORD?"••••••••":this.state.value:n);case A.RADIO:case A.CHECKBOX:case A.SELECT:return h.createElement("div",p({},s,{className:this.setCssClasses(r),onClick:this.onClick,onMouseEnter:this.hoverOn,onMouseLeave:this.hoverOff}),this.renderComplexView());case A.COLOR:return h.createElement("input",p({},s,{type:t,value:this.state.value,onClick:this.onClick,readOnly:!0}));default:throw new Error(E.ERROR_UNSUPPORTED_TYPE)}}},{key:"renderComplexView",value:function(){var e,t=this,n=this.props,a=n.placeholder,s=n.options,o=n.type;return null===this.state.value||0===this.state.value.length?a:0!==(e=A.CHECKBOX===o?s.filter(function(e){return t.state.value.includes(e.value)}):s.filter(function(e){return t.state.value===e.value})).length?e.map(function(e){return e.label}).join(", "):this.state.value}},{key:"cullAttributes",value:function(){var e=this.props.attributes;delete e.type,delete e.onChange,delete e.value}},{key:"render",value:function(){var t=this,e=this.props,n=e.cssClassPrefix,a=e.buttonsPosition,s=e.editMode;return this.state.isHidden?"":this.state.editing||s?h.createElement("div",{className:n+"easy-edit-inline-wrapper",tabIndex:"0",onKeyDown:function(e){return t.onKeyDown(e)}},a===E.POSITION_BEFORE&&this.renderButtons(),this.renderInput(),a===E.POSITION_AFTER&&this.renderButtons(),this.renderInstructions(),this.renderValidationMessage()):this.renderPlaceholder()}}],[{key:"generateButton",value:function(e,t,n,a,s,o){return o?"":h.createElement("button",{ref:e,onClick:t,className:a,name:s},n)}}]),d}(),A={COLOR:"color",CHECKBOX:"checkbox",DATALIST:"datalist",DATE:"date",DATETIME_LOCAL:"datetime-local",EMAIL:"email",MONTH:"month",NUMBER:"number",PASSWORD:"password",RADIO:"radio",RANGE:"range",SELECT:"select",TEXT:"text",TEXTAREA:"textarea",TIME:"time",WEEK:"week"};Object.freeze(A),d.propTypes={type:n.oneOf(["text","number","color","textarea","date","datetime-local","email","password","time","month","week","radio","checkbox","select","range","datalist"]).isRequired,value:n.oneOfType([n.string,n.number,n.array,n.object]),options:n.array,saveButtonLabel:n.oneOfType([n.string,n.element]),saveButtonStyle:n.string,cancelButtonLabel:n.oneOfType([n.string,n.element]),cancelButtonStyle:n.string,deleteButtonLabel:n.oneOfType([n.string,n.element]),deleteButtonStyle:n.string,buttonsPosition:n.oneOf(["after","before"]),placeholder:n.string,onCancel:n.func,onDelete:n.func,onValidate:n.func,onFocus:n.func,onBlur:n.func,onSave:n.func.isRequired,validationMessage:n.string,allowEdit:n.bool,attributes:n.object,viewAttributes:n.object,instructions:n.string,editComponent:n.element,displayComponent:n.element,disableAutoSubmit:n.bool,disableAutoCancel:n.bool,cssClassPrefix:n.string,hideSaveButton:n.bool,hideCancelButton:n.bool,hideDeleteButton:n.bool,onHoverCssClass:n.string,saveOnBlur:n.bool,editMode:n.bool},d.defaultProps={value:null,saveButtonLabel:E.DEFAULT_SAVE_BUTTON_LABEL,saveButtonStyle:null,cancelButtonLabel:E.DEFAULT_CANCEL_BUTTON_LABEL,cancelButtonStyle:null,deleteButtonLabel:E.DEFAULT_DELETE_BUTTON_LABEL,deleteButtonStyle:null,buttonsPosition:E.POSITION_AFTER,placeholder:E.DEFAULT_PLACEHOLDER,allowEdit:!0,onCancel:function(){},onDelete:function(){},onfocus:function(){},onBlur:function(){},onValidate:function(){return!0},validationMessage:E.FAILED_VALIDATION_MESSAGE,attributes:{},viewAttributes:{},instructions:null,editComponent:null,placeholderComponent:null,disableAutoSubmit:!1,disableAutoCancel:!1,cssClassPrefix:"",hideSaveButton:!1,hideCancelButton:!1,hideDeleteButton:!0,onHoverCssClass:E.DEFAULT_ON_HOVER_CSS_CLASS,saveOnBlur:!1,editMode:!1},e.Types=A,e.default=d,Object.defineProperty(e,"__esModule",{value:!0})});

package.json

 {
   "name": "react-easy-edit",
-  "version": "1.10.0",
+  "version": "1.11.0",
   "description": "A react library for inline editing components",
@@ -5,0 +5,0 @@ "homepage": "https://github.com/giorgosart/react-easy-edit#readme",

README.md

 [![Test](https://img.shields.io/npm/v/react-easy-edit.svg?style=flat)](https://www.npmjs.com/package/react-easy-edit)
 [![NPM](https://img.shields.io/npm/dm/react-easy-edit.svg)](https://www.npmjs.com/package/react-easy-edit)
 [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
-[![CircleCI](https://circleci.com/gh/giorgosart/react-easy-edit.svg?style=shield)](https://circleci.com/gh/giorgosart/react-easy-edit) [![Greenkeeper badge](https://badges.greenkeeper.io/giorgosart/react-easy-edit.svg)](https://greenkeeper.io/)
+[![CircleCI](https://circleci.com/gh/giorgosart/react-easy-edit.svg?style=shield)](https://circleci.com/gh/giorgosart/react-easy-edit) 
+[![Known Vulnerabilities](https://snyk.io/test/github/giorgosart/react-easy-edit/badge.svg?targetFile=package.json)](https://snyk.io/test/github/giorgosart/react-easy-edit?targetFile=package.json)
 [![install size](https://packagephobia.now.sh/badge?p=react-easy-edit@latest)](https://packagephobia.now.sh/result?p=react-easy-edit@latest)
@@ -6,0 +7,0 @@ [![DeepScan grade](https://deepscan.io/api/teams/6030/projects/7886/branches/87202/badge/grade.svg)](https://deepscan.io/dashboard#view=project&tid=6030&pid=7886&bid=87202)

No alert changes

Improved metrics

Total package byte prevSize

26490

increased by5.5%

Lines of code

68

increased by7.94%

Number of lines in readme file

166

increased by0.61%

No dependency changes