tonyair
/
silverstripe-tagfield
mirror of https://github.com/silverstripe/silverstripe-tagfield
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Adds back onBlur handler 

removed in 249842fab8
This commit is contained in:
Bernie Hamlin 2023-08-18 16:15:11 +12:00
parent cc2016a8e5
commit 92823c790a
2 changed files with 2 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
client/dist/js/bundle.js vendored
View File

@ -1 +1 @@
!function(){"use strict";var e={274:function(e,t,n){var o,a=(o=n(521))&&o.__esModule?o:{default:o};window.document.addEventListener("DOMContentLoaded",(()=>{(0,a.default)()}))},521:function(e,t,n){Object.defineProperty(t,"__esModule",{value:!0}),t.default=void 0;var o=i(n(648)),a=i(n(157));function i(e){return e&&e.__esModule?e:{default:e}}t.default=()=>{o.default.component.registerMany({TagField:a.default})}},157:function(e,t,n){Object.defineProperty(t,"__esModule",{value:!0}),t.default=t.Component=void 0;var o=function(e,t){if(!t&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var n=v(t);if(n&&n.has(e))return n.get(e);var o={},a=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var i in e)if("default"!==i&&Object.prototype.hasOwnProperty.call(e,i)){var s=a?Object.getOwnPropertyDescriptor(e,i):null;s&&(s.get||s.set)?Object.defineProperty(o,i,s):o[i]=e[i]}o.default=e,n&&n.set(e,o);return o}(n(363)),a=g(n(967)),i=g(n(493)),s=g(n(198)),r=g(n(453)),l=g(n(78)),u=g(n(754)),c=g(n(875)),f=g(n(42)),d=g(n(872)),p=g(n(496)),h=g(n(86));function g(e){return e&&e.__esModule?e:{default:e}}function v(e){if("function"!=typeof WeakMap)return null;var t=new WeakMap,n=new WeakMap;return(v=function(e){return e?n:t})(e)}function m(){return m=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(e[o]=n[o])}return e},m.apply(this,arguments)}class y extends o.Component{constructor(e){super(e),this.selectComponentRef=o.default.createRef(),this.state={initalState:e.value?e.value:[],hasChanges:!1},this.isControlled()||(this.state={...this.state,value:e.value}),this.handleChange=this.handleChange.bind(this),this.handleOnBlur=this.handleOnBlur.bind(this),this.isValidNewOption=this.isValidNewOption.bind(this),this.getOptions=this.getOptions.bind(this),this.fetchOptions=(0,p.default)(this.fetchOptions,500)}componentDidUpdate(e,t){if(t.hasChanges!==this.state.hasChanges){const e=this.selectComponentRef.current.inputRef,t=new Event("change",{bubbles:!0});e.dispatchEvent(t)}}getOptions(e){const{lazyLoad:t,options:n}=this.props;return t?e?this.fetchOptions(e):Promise.resolve([]):Promise.resolve(n)}handleChange(e){this.setState({hasChanges:!1}),JSON.stringify(this.state.initalState)!==JSON.stringify(e)&&this.setState({hasChanges:!0}),this.isControlled()?this.props.onChange(e):this.setState({value:e})}isControlled(){return"function"==typeof this.props.onChange}handleOnBlur(){}fetchOptions(e){const{optionUrl:t,labelKey:n,valueKey:o}=this.props,a=d.default.parse(t,!0);return a.query.term=e,(0,c.default)(d.default.format(a),{credentials:"same-origin"}).then((e=>e.json())).then((e=>e.items.map((e=>({[n]:e.Title,[o]:e.Value,Selected:e.Selected})))))}isValidNewOption(e,t,n){const{valueKey:o}=this.props;if(!e)return!1;if(Array.isArray(t)){if(this.valueInOptions(e,t,o))return!1}else if(e===t[o])return!1;return!this.valueInOptions(e,n,o)}valueInOptions(e,t,n){for(const o of t)if(e===o[n])return!0;return!1}render(){const{lazyLoad:e,options:t,creatable:n,multi:a,disabled:i,labelKey:s,valueKey:r,SelectComponent:c,AsyncCreatableSelectComponent:f,AsyncSelectComponent:d,CreatableSelectComponent:p,...h}=this.props,g=e?{loadOptions:this.getOptions}:{options:t};let v=c;if(e&&n?v=f:e?v=d:n&&(v=p),this.isControlled()||(h.value=this.state.value),!a&&h.value&&Object.keys(h.value).length>0){const e=h.value[Object.keys(h.value)[0]];"object"==typeof e&&(h.value=e)}const y=this.state.hasChanges?"":"no-change-track";return o.default.createElement(l.default,null,o.default.createElement(v,m({},h,{isMulti:a,isDisabled:i,cacheOptions:!0,onChange:this.handleChange},g,{getOptionLabel:e=>e[s],getOptionValue:e=>e[r],noOptionsMessage:e=>{let{inputValue:t}=e;return t?u.default._t("TagField.NO_OPTIONS","No options"):u.default._t("TagField.TYPE_TO_SEARCH","Type to search")},isValidNewOption:this.isValidNewOption,getNewOptionData:(e,t)=>({[s]:t,[r]:e}),classNamePrefix:"ss-tag-field",className:y,ref:this.selectComponentRef})))}}t.Component=y,y.propTypes={name:h.default.string.isRequired,labelKey:h.default.string.isRequired,valueKey:h.default.string.isRequired,lazyLoad:h.default.bool,creatable:h.default.bool,multi:h.default.bool,disabled:h.default.bool,options:h.default.arrayOf(h.default.object),optionUrl:h.default.string,value:h.default.any,onChange:h.default.func,onBlur:h.default.func,SelectComponent:h.default.oneOfType([h.default.object,h.default.func]),AsyncCreatableSelectComponent:h.default.oneOfType([h.default.object,h.default.func]),AsyncSelectComponent:h.default.oneOfType([h.default.object,h.default.func]),CreatableSelectComponent:h.default.oneOfType([h.default.object,h.default.func])},y.defaultProps={labelKey:"Title",valueKey:"Value",disabled:!1,lazyLoad:!1,creatable:!1,multi:!1,SelectComponent:a.default,AsyncCreatableSelectComponent:s.default,AsyncSelectComponent:i.default,CreatableSelectComponent:r.default};var O=(0,f.default)(y);t.default=O},265:function(e,t,n){var o,a=(o=n(363))&&o.__esModule?o:{default:o},i=n(691),s=n(648);function r(){return r=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(e[o]=n[o])}return e},r.apply(this,arguments)}window.jQuery.entwine("ss",(e=>{e(".js-injector-boot .ss-tag-field.entwine").entwine({ReactRoot:null,onmatch(){const e=this.closest(".cms-content").attr("id"),t=e?{context:e}:{},n=(0,s.loadComponent)("TagField",t),o={...this.data("schema"),onBlur:()=>{this.parents(".cms-edit-form:first").trigger("change")}};let l=this.getReactRoot();l||(l=(0,i.createRoot)(this[0]),this.setReactRoot(l)),l.render(a.default.createElement(n,r({noHolder:!0},o)))},onunmatch(){const e=this.getReactRoot();e&&(e.unmount(),this.setReactRoot(null))}}),e(".cms-edit-form").entwine({getChangeTrackerOptions(){const t=void 0===this.entwineData("ChangeTrackerOptions");let n=this._super();return t&&(n=e.extend({},n),n.ignoreFieldSelector+=", .ss-tag-field .no-change-track :input",this.setChangeTrackerOptions(n)),n}})}))},496:function(e){function t(e){return"function"==typeof e?e():e}function n(){var e={};return e.promise=new Promise((function(t,n){e.resolve=t,e.reject=n})),e}e.exports=function(e){var o=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0,a=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{},i=void 0,s=void 0,r=void 0,l=[];return function(){var c=t(o),f=(new Date).getTime(),d=!i||f-i>c;i=f;for(var p=arguments.length,h=Array(p),g=0;g<p;g++)h[g]=arguments[g];if(d&&a.leading)return a.accumulate?Promise.resolve(e.call(this,[h])).then((function(e){return e[0]})):Promise.resolve(e.call.apply(e,[this].concat(h)));if(s?clearTimeout(r):s=n(),l.push(h),r=setTimeout(u.bind(this),c),a.accumulate){var v=l.length-1;return s.promise.then((function(e){return e[v]}))}return s.promise};function u(){var t=s;clearTimeout(r),Promise.resolve(a.accumulate?e.call(this,l):e.apply(this,l[l.length-1])).then(t.resolve,t.reject),l=[],s=null}}},78:function(e){e.exports=EmotionCssCacheProvider},42:function(e){e.exports=FieldHolder},648:function(e){e.exports=Injector},875:function(e){e.exports=IsomorphicFetch},872:function(e){e.exports=NodeUrl},86:function(e){e.exports=PropTypes},363:function(e){e.exports=React},691:function(e){e.exports=ReactDomClient},967:function(e){e.exports=ReactSelect},493:function(e){e.exports=ReactSelectAsync},198:function(e){e.exports=ReactSelectAsyncCreatable},453:function(e){e.exports=ReactSelectCreatable},754:function(e){e.exports=i18n}},t={};function n(o){var a=t[o];if(void 0!==a)return a.exports;var i=t[o]={exports:{}};return e[o](i,i.exports,n),i.exports}n(265),n(274)}();
!function(){"use strict";var e={274:function(e,t,n){var o,a=(o=n(521))&&o.__esModule?o:{default:o};window.document.addEventListener("DOMContentLoaded",(()=>{(0,a.default)()}))},521:function(e,t,n){Object.defineProperty(t,"__esModule",{value:!0}),t.default=void 0;var o=i(n(648)),a=i(n(157));function i(e){return e&&e.__esModule?e:{default:e}}t.default=()=>{o.default.component.registerMany({TagField:a.default})}},157:function(e,t,n){Object.defineProperty(t,"__esModule",{value:!0}),t.default=t.Component=void 0;var o=function(e,t){if(!t&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var n=v(t);if(n&&n.has(e))return n.get(e);var o={},a=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var i in e)if("default"!==i&&Object.prototype.hasOwnProperty.call(e,i)){var s=a?Object.getOwnPropertyDescriptor(e,i):null;s&&(s.get||s.set)?Object.defineProperty(o,i,s):o[i]=e[i]}o.default=e,n&&n.set(e,o);return o}(n(363)),a=g(n(967)),i=g(n(493)),s=g(n(198)),r=g(n(453)),l=g(n(78)),u=g(n(754)),c=g(n(875)),f=g(n(42)),d=g(n(872)),p=g(n(496)),h=g(n(86));function g(e){return e&&e.__esModule?e:{default:e}}function v(e){if("function"!=typeof WeakMap)return null;var t=new WeakMap,n=new WeakMap;return(v=function(e){return e?n:t})(e)}function m(){return m=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(e[o]=n[o])}return e},m.apply(this,arguments)}class y extends o.Component{constructor(e){super(e),this.selectComponentRef=o.default.createRef(),this.state={initalState:e.value?e.value:[],hasChanges:!1},this.isControlled()||(this.state={...this.state,value:e.value}),this.handleChange=this.handleChange.bind(this),this.handleOnBlur=this.handleOnBlur.bind(this),this.isValidNewOption=this.isValidNewOption.bind(this),this.getOptions=this.getOptions.bind(this),this.fetchOptions=(0,p.default)(this.fetchOptions,500)}componentDidUpdate(e,t){if(t.hasChanges!==this.state.hasChanges){const e=this.selectComponentRef.current.inputRef,t=new Event("change",{bubbles:!0});e.dispatchEvent(t)}}getOptions(e){const{lazyLoad:t,options:n}=this.props;return t?e?this.fetchOptions(e):Promise.resolve([]):Promise.resolve(n)}handleChange(e){this.setState({hasChanges:!1}),JSON.stringify(this.state.initalState)!==JSON.stringify(e)&&this.setState({hasChanges:!0}),this.isControlled()?this.props.onChange(e):this.setState({value:e})}isControlled(){return"function"==typeof this.props.onChange}handleOnBlur(){}fetchOptions(e){const{optionUrl:t,labelKey:n,valueKey:o}=this.props,a=d.default.parse(t,!0);return a.query.term=e,(0,c.default)(d.default.format(a),{credentials:"same-origin"}).then((e=>e.json())).then((e=>e.items.map((e=>({[n]:e.Title,[o]:e.Value,Selected:e.Selected})))))}isValidNewOption(e,t,n){const{valueKey:o}=this.props;if(!e)return!1;if(Array.isArray(t)){if(this.valueInOptions(e,t,o))return!1}else if(e===t[o])return!1;return!this.valueInOptions(e,n,o)}valueInOptions(e,t,n){for(const o of t)if(e===o[n])return!0;return!1}render(){const{lazyLoad:e,options:t,creatable:n,multi:a,disabled:i,labelKey:s,valueKey:r,SelectComponent:c,AsyncCreatableSelectComponent:f,AsyncSelectComponent:d,CreatableSelectComponent:p,...h}=this.props,g=e?{loadOptions:this.getOptions}:{options:t};let v=c;if(e&&n?v=f:e?v=d:n&&(v=p),this.isControlled()||(h.value=this.state.value),!a&&h.value&&Object.keys(h.value).length>0){const e=h.value[Object.keys(h.value)[0]];"object"==typeof e&&(h.value=e)}const y=this.state.hasChanges?"":"no-change-track";return o.default.createElement(l.default,null,o.default.createElement(v,m({},h,{isMulti:a,isDisabled:i,cacheOptions:!0,onChange:this.handleChange,onBlur:this.handleOnBlur},g,{getOptionLabel:e=>e[s],getOptionValue:e=>e[r],noOptionsMessage:e=>{let{inputValue:t}=e;return t?u.default._t("TagField.NO_OPTIONS","No options"):u.default._t("TagField.TYPE_TO_SEARCH","Type to search")},isValidNewOption:this.isValidNewOption,getNewOptionData:(e,t)=>({[s]:t,[r]:e}),classNamePrefix:"ss-tag-field",className:y,ref:this.selectComponentRef})))}}t.Component=y,y.propTypes={name:h.default.string.isRequired,labelKey:h.default.string.isRequired,valueKey:h.default.string.isRequired,lazyLoad:h.default.bool,creatable:h.default.bool,multi:h.default.bool,disabled:h.default.bool,options:h.default.arrayOf(h.default.object),optionUrl:h.default.string,value:h.default.any,onChange:h.default.func,onBlur:h.default.func,SelectComponent:h.default.oneOfType([h.default.object,h.default.func]),AsyncCreatableSelectComponent:h.default.oneOfType([h.default.object,h.default.func]),AsyncSelectComponent:h.default.oneOfType([h.default.object,h.default.func]),CreatableSelectComponent:h.default.oneOfType([h.default.object,h.default.func])},y.defaultProps={labelKey:"Title",valueKey:"Value",disabled:!1,lazyLoad:!1,creatable:!1,multi:!1,SelectComponent:a.default,AsyncCreatableSelectComponent:s.default,AsyncSelectComponent:i.default,CreatableSelectComponent:r.default};var O=(0,f.default)(y);t.default=O},265:function(e,t,n){var o,a=(o=n(363))&&o.__esModule?o:{default:o},i=n(691),s=n(648);function r(){return r=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(e[o]=n[o])}return e},r.apply(this,arguments)}window.jQuery.entwine("ss",(e=>{e(".js-injector-boot .ss-tag-field.entwine").entwine({ReactRoot:null,onmatch(){const e=this.closest(".cms-content").attr("id"),t=e?{context:e}:{},n=(0,s.loadComponent)("TagField",t),o={...this.data("schema"),onBlur:()=>{this.parents(".cms-edit-form:first").trigger("change")}};let l=this.getReactRoot();l||(l=(0,i.createRoot)(this[0]),this.setReactRoot(l)),l.render(a.default.createElement(n,r({noHolder:!0},o)))},onunmatch(){const e=this.getReactRoot();e&&(e.unmount(),this.setReactRoot(null))}}),e(".cms-edit-form").entwine({getChangeTrackerOptions(){const t=void 0===this.entwineData("ChangeTrackerOptions");let n=this._super();return t&&(n=e.extend({},n),n.ignoreFieldSelector+=", .ss-tag-field .no-change-track :input",this.setChangeTrackerOptions(n)),n}})}))},496:function(e){function t(e){return"function"==typeof e?e():e}function n(){var e={};return e.promise=new Promise((function(t,n){e.resolve=t,e.reject=n})),e}e.exports=function(e){var o=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0,a=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{},i=void 0,s=void 0,r=void 0,l=[];return function(){var c=t(o),f=(new Date).getTime(),d=!i||f-i>c;i=f;for(var p=arguments.length,h=Array(p),g=0;g<p;g++)h[g]=arguments[g];if(d&&a.leading)return a.accumulate?Promise.resolve(e.call(this,[h])).then((function(e){return e[0]})):Promise.resolve(e.call.apply(e,[this].concat(h)));if(s?clearTimeout(r):s=n(),l.push(h),r=setTimeout(u.bind(this),c),a.accumulate){var v=l.length-1;return s.promise.then((function(e){return e[v]}))}return s.promise};function u(){var t=s;clearTimeout(r),Promise.resolve(a.accumulate?e.call(this,l):e.apply(this,l[l.length-1])).then(t.resolve,t.reject),l=[],s=null}}},78:function(e){e.exports=EmotionCssCacheProvider},42:function(e){e.exports=FieldHolder},648:function(e){e.exports=Injector},875:function(e){e.exports=IsomorphicFetch},872:function(e){e.exports=NodeUrl},86:function(e){e.exports=PropTypes},363:function(e){e.exports=React},691:function(e){e.exports=ReactDomClient},967:function(e){e.exports=ReactSelect},493:function(e){e.exports=ReactSelectAsync},198:function(e){e.exports=ReactSelectAsyncCreatable},453:function(e){e.exports=ReactSelectCreatable},754:function(e){e.exports=i18n}},t={};function n(o){var a=t[o];if(void 0!==a)return a.exports;var i=t[o]={exports:{}};return e[o](i,i.exports,n),i.exports}n(265),n(274)}();

1
client/src/components/TagField.js
View File

@ -235,6 +235,7 @@ class TagField extends Component {
isDisabled={disabled}
cacheOptions
onChange={this.handleChange}
onBlur={this.handleOnBlur}
{...optionAttributes}
getOptionLabel={(option) => option[labelKey]}
getOptionValue={(option) => option[valueKey]}