@performant-software/controlled-vocabulary 0.6.2-beta.3

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2022 Performant Software Solutions LLC
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/build/index.js

@@ -0,0 +1,2 @@
+!function(){"use strict";var e={n:function(t){var r=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(r,{a:r}),r},d:function(t,r){for(var n in r)e.o(r,n)&&!e.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:r[n]})},o:function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r:function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})}},t={};e.r(t),e.d(t,{Reference:function(){return Ee},ReferenceCodeDropdown:function(){return b},ReferenceCodeFormDropdown:function(){return D},ReferenceCodeFormLabel:function(){return w},ReferenceCodeModal:function(){return j},ReferenceCodesService:function(){return K},ReferenceCodesTransform:function(){return X},ReferenceTableTransform:function(){return fe},ReferenceTablesList:function(){return x},ReferenceTablesService:function(){return he},ReferencesTransform:function(){return Se}});var r=require("@performant-software/shared-components"),n=require("react"),o=e.n(n),c=require("semantic-ui-react"),u=require("underscore"),i=e.n(u);function a(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function l(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?a(Object(r),!0).forEach((function(t){f(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):a(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}function f(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function s(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var r=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=r){var n,o,c=[],u=!0,i=!1;try{for(r=r.call(e);!(u=(n=r.next()).done)&&(c.push(n.value),!t||c.length!==t);u=!0);}catch(e){i=!0,o=e}finally{try{u||null==r.return||r.return()}finally{if(i)throw o}}return c}}(e,t)||function(e,t){if(e){if("string"==typeof e)return p(e,t);var r=Object.prototype.toString.call(e).slice(8,-1);return"Object"===r&&e.constructor&&(r=e.constructor.name),"Map"===r||"Set"===r?Array.from(e):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?p(e,t):void 0}}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function p(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,n=new Array(t);r<t;r++)n[r]=e[r];return n}var y=function(e){var t=s((0,n.useState)(!1),2),u=t[0],a=t[1],f=s((0,n.useState)([]),2),p=f[0],y=f[1],b=(0,n.useMemo)((function(){var t=i().pluck(i().filter(e.value,(function(e){return!e._destroy})),"reference_code_id");return e.multiple?t:i().first(t)}),[e.multiple,e.value]),d=(0,n.useCallback)((function(e){return{reference_code_id:e,reference_code:{id:e,name:i().findWhere(p,{key:e}).text}}}),[p]),m=(0,n.useCallback)((function(e){return{key:e.id,value:e.id,text:e.name}}),[]),v=(0,n.useCallback)((function(t,r){var n;n=e.multiple?r.value:i().compact([r.value]);var o=[];i().each(n,(function(t){var r=i().findWhere(e.value,{reference_code_id:t});r||(r=d(t)),o.push(i().omit(r,"_destroy"))})),i().each(e.value,(function(e){e.id&&!i().contains(n,e.reference_code_id)&&o.push(l(l({},e),{},{_destroy:!0}))})),e.onChange(o)}),[d,e.multiple,e.onChange,e.value]);return(0,n.useEffect)((function(){a(!0);var t={per_page:0,reference_table:e.referenceTable,sort_by:"name"};r.ReferenceCodesService.fetchAll(t).then((function(e){var t=e.data;return y(i().map(t.reference_codes,m))})).finally((function(){return a(!1)}))}),[m]),o().createElement(c.Dropdown,{clearable:!0,disabled:u,fluid:e.fluid,loading:u,multiple:e.multiple,onChange:v,options:p,placeholder:e.placeholder,search:!0,selection:!0,selectOnBlur:!1,value:b})};y.defaultProps={fluid:!0,multiple:!1,placeholder:void 0};var b=y,d=require("@performant-software/semantic-components"),m=require("i18next"),v=e.n(m),h={en:{translation:JSON.parse('{"Common":{"buttons":{"edit":"Edit"}},"ReferenceCodeFormLabel":{"content":"The values in this list can be edited via the {{name}} reference table."},"ReferenceCodeModal":{"labels":{"name":"Name"},"title":{"add":"Add Reference Code","edit":"Edit Reference Code"}},"ReferenceTableModal":{"labels":{"key":"Key","name":"Name","referenceCodes":"Reference Codes"},"referenceCodes":{"columns":{"name":"Name"}},"title":{"add":"Add Reference Table","edit":"Edit Reference Table"}}}')}},O=v().createInstance();O.init({debug:!0,fallbackLng:"en",lng:"en",interpolation:{escapeValue:!1},resources:h});var g=O,w=function(e){return o().createElement(o().Fragment,null,o().createElement("label",{className:"reference-code-form-label",htmlFor:e.referenceTable},e.label),o().createElement(c.Popup,{hoverable:!0,trigger:o().createElement(c.Icon,{name:"info circle",style:{marginLeft:"0.3em"}})},o().createElement(c.Header,{content:e.label}),o().createElement("p",null,g.t("ReferenceCodeFormLabel.content",{name:e.label})),o().createElement(c.Button,{content:g.t("Common.buttons.edit"),icon:"edit",primary:!0,onClick:e.onClick})))},j=function(e){return o().createElement(d.ModalContext.Consumer,null,(function(t){return o().createElement(c.Modal,{as:c.Form,centered:!1,mountNode:t,open:!0},o().createElement(c.Modal.Header,{content:e.item.id?g.t("ReferenceCodeModal.title.edit"):g.t("ReferenceCodeModal.title.add")}),o().createElement(c.Modal.Content,null,o().createElement(c.Form.Input,{autoFocus:!0,error:e.isError("name"),label:g.t("ReferenceCodeModal.labels.name"),onChange:e.onTextInputChange.bind(void 0,"name"),required:e.isRequired("name"),value:e.item.name})),e.children)}))},P=void 0,_=function(e){return o().createElement(d.ModalContext.Consumer,null,(function(t){return o().createElement(c.Modal,{as:c.Form,centered:!1,className:"reference-table-modal",mountNode:t,open:!0},o().createElement(c.Modal.Header,{content:e.item.id?g.t("ReferenceTableModal.title.edit"):g.t("ReferenceTableModal.title.add")}),o().createElement(c.Modal.Content,null,o().createElement(c.Form.Input,{autoFocus:!0,error:e.isError("name"),label:g.t("ReferenceTableModal.labels.name"),onChange:e.onTextInputChange.bind(P,"name"),required:e.isRequired("name"),value:e.item.name}),o().createElement(c.Form.Input,{error:e.isError("key"),label:g.t("ReferenceTableModal.labels.key"),onChange:e.onTextInputChange.bind(P,"key"),required:e.isRequired("key"),value:e.item.key}),o().createElement(c.Header,{content:g.t("ReferenceTableModal.labels.referenceCodes")}),o().createElement(d.EmbeddedList,{actions:[{name:"edit"},{name:"copy"},{name:"delete"}],columns:[{name:"name",label:g.t("ReferenceTableModal.referenceCodes.columns.name")}],items:e.item.reference_codes,modal:{component:j,props:{required:["name"]}},onDelete:e.onDeleteChildAssociation.bind(P,"reference_codes"),onSave:e.onSaveChildAssociation.bind(P,"reference_codes")})),e.children)}))},R=["error","label","required","referenceTable"];function S(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function E(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?S(Object(r),!0).forEach((function(t){T(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):S(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}function T(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function C(){return C=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e},C.apply(this,arguments)}function k(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var r=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=r){var n,o,c=[],u=!0,i=!1;try{for(r=r.call(e);!(u=(n=r.next()).done)&&(c.push(n.value),!t||c.length!==t);u=!0);}catch(e){i=!0,o=e}finally{try{u||null==r.return||r.return()}finally{if(i)throw o}}return c}}(e,t)||function(e,t){if(e){if("string"==typeof e)return M(e,t);var r=Object.prototype.toString.call(e).slice(8,-1);return"Object"===r&&e.constructor&&(r=e.constructor.name),"Map"===r||"Set"===r?Array.from(e):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?M(e,t):void 0}}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function M(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,n=new Array(t);r<t;r++)n[r]=e[r];return n}var D=function(e){var t=e.error,u=e.label,i=e.required,a=e.referenceTable,l=function(e,t){if(null==e)return{};var r,n,o=function(e,t){if(null==e)return{};var r,n,o={},c=Object.keys(e);for(n=0;n<c.length;n++)r=c[n],t.indexOf(r)>=0||(o[r]=e[r]);return o}(e,t);if(Object.getOwnPropertySymbols){var c=Object.getOwnPropertySymbols(e);for(n=0;n<c.length;n++)r=c[n],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}(e,R),f=k((0,n.useState)(!1),2),s=f[0],p=f[1],y=k((0,n.useState)(0),2),m=y[0],v=y[1];return o().createElement(o().Fragment,null,o().createElement(c.Form.Input,{error:t,label:o().createElement(w,{label:u,onClick:function(){return p(!0)},referenceTable:a}),required:i},o().createElement(b,C({},l,{id:a,referenceTable:a,key:m}))),s&&o().createElement(d.EditModal,{component:_,item:{id:a,key:a},onClose:function(){return p(!1)},onInitialize:function(e){return r.ReferenceTablesService.fetchByKey(e).then((function(t){return E(E({},t.data.reference_table),{},{key:e})}))},onSave:function(e){return r.ReferenceTablesService.save(e).then((function(e){return e.data.reference_table})).then((function(){return v((function(e){return e+1}))})).finally((function(){return p(!1)}))}}))},x=function(){return o().createElement(d.ListTable,{actions:[{name:"edit"},{name:"copy"},{name:"delete"}],collectionName:"reference_tables",columns:[{name:"name",label:"Name",sortable:!0},{name:"key",label:"Key",sortable:!0}],modal:{component:_,props:{onInitialize:function(e){return r.ReferenceTablesService.fetchOne(e).then((function(e){return e.data.reference_table}))},required:["name","key"]}},onDelete:function(e){return r.ReferenceTablesService.delete(e)},onLoad:function(e){return r.ReferenceTablesService.fetchAll(e)},onSave:function(e){return r.ReferenceTablesService.save(e)}})};function A(e){return A="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},A(e)}function B(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function I(e,t){for(var r=0;r<t.length;r++){var n=t[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}function q(e,t){return q=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e},q(e,t)}function F(e,t){if(t&&("object"===A(t)||"function"==typeof t))return t;if(void 0!==t)throw new TypeError("Derived constructors may only return object or undefined");return function(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}(e)}function N(e){return N=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)},N(e)}var L=function(e){!function(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}}),Object.defineProperty(e,"prototype",{writable:!1}),t&&q(e,t)}(u,e);var t,r,n,o,c=(n=u,o=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}(),function(){var e,t=N(n);if(o){var r=N(this).constructor;e=Reflect.construct(t,arguments,r)}else e=t.apply(this,arguments);return F(this,e)});function u(){return B(this,u),c.apply(this,arguments)}return t=u,(r=[{key:"getBaseUrl",value:function(){return"/controlled_vocabulary/reference_codes"}},{key:"getTransform",value:function(){return{}}}])&&I(t.prototype,r),Object.defineProperty(t,"prototype",{writable:!1}),u}(r.BaseService),K=new L;function U(e){return U="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},U(e)}function H(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function V(e,t){for(var r=0;r<t.length;r++){var n=t[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}function z(){return z="undefined"!=typeof Reflect&&Reflect.get?Reflect.get:function(e,t,r){var n=W(e,t);if(n){var o=Object.getOwnPropertyDescriptor(n,t);return o.get?o.get.call(arguments.length<3?e:r):o.value}},z.apply(this,arguments)}function W(e,t){for(;!Object.prototype.hasOwnProperty.call(e,t)&&null!==(e=G(e)););return e}function $(e,t){return $=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e},$(e,t)}function J(e,t){if(t&&("object"===U(t)||"function"==typeof t))return t;if(void 0!==t)throw new TypeError("Derived constructors may only return object or undefined");return function(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}(e)}function G(e){return G=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)},G(e)}var Q=function(e){!function(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}}),Object.defineProperty(e,"prototype",{writable:!1}),t&&$(e,t)}(u,e);var t,r,n,o,c=(n=u,o=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}(),function(){var e,t=G(n);if(o){var r=G(this).constructor;e=Reflect.construct(t,arguments,r)}else e=t.apply(this,arguments);return J(this,e)});function u(){return H(this,u),c.apply(this,arguments)}return t=u,r=[{key:"getPayloadKeys",value:function(){return["id","name","_destroy"]}},{key:"toPayload",value:function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"reference_codes";return z(G(u.prototype),"toPayload",this).call(this,e,t)}}],r&&V(t.prototype,r),Object.defineProperty(t,"prototype",{writable:!1}),u}(r.NestedAttributesTransform),X=new Q;function Y(e){return Y="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},Y(e)}function Z(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function ee(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?Z(Object(r),!0).forEach((function(t){te(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):Z(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}function te(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function re(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function ne(e,t){for(var r=0;r<t.length;r++){var n=t[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}function oe(){return oe="undefined"!=typeof Reflect&&Reflect.get?Reflect.get:function(e,t,r){var n=ce(e,t);if(n){var o=Object.getOwnPropertyDescriptor(n,t);return o.get?o.get.call(arguments.length<3?e:r):o.value}},oe.apply(this,arguments)}function ce(e,t){for(;!Object.prototype.hasOwnProperty.call(e,t)&&null!==(e=ae(e)););return e}function ue(e,t){return ue=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e},ue(e,t)}function ie(e,t){if(t&&("object"===Y(t)||"function"==typeof t))return t;if(void 0!==t)throw new TypeError("Derived constructors may only return object or undefined");return function(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}(e)}function ae(e){return ae=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)},ae(e)}var le=function(e){!function(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}}),Object.defineProperty(e,"prototype",{writable:!1}),t&&ue(e,t)}(u,e);var t,r,n,o,c=(n=u,o=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}(),function(){var e,t=ae(n);if(o){var r=ae(this).constructor;e=Reflect.construct(t,arguments,r)}else e=t.apply(this,arguments);return ie(this,e)});function u(){return re(this,u),c.apply(this,arguments)}return t=u,r=[{key:"getParameterName",value:function(){return"reference_table"}},{key:"getPayloadKeys",value:function(){return["name","key"]}},{key:"toPayload",value:function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};return oe(ae(u.prototype),"toPayload",this).call(this,e,ee(ee({},t),X.toPayload(e)))}}],r&&ne(t.prototype,r),Object.defineProperty(t,"prototype",{writable:!1}),u}(r.BaseTransform),fe=new le;function se(e){return se="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},se(e)}function pe(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function ye(e,t){for(var r=0;r<t.length;r++){var n=t[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}function be(e,t){return be=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e},be(e,t)}function de(e,t){if(t&&("object"===se(t)||"function"==typeof t))return t;if(void 0!==t)throw new TypeError("Derived constructors may only return object or undefined");return function(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}(e)}function me(e){return me=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)},me(e)}var ve=function(e){!function(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}}),Object.defineProperty(e,"prototype",{writable:!1}),t&&be(e,t)}(u,e);var t,r,n,o,c=(n=u,o=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}(),function(){var e,t=me(n);if(o){var r=me(this).constructor;e=Reflect.construct(t,arguments,r)}else e=t.apply(this,arguments);return de(this,e)});function u(){return pe(this,u),c.apply(this,arguments)}return t=u,(r=[{key:"fetchByKey",value:function(e){return this.getAxios().get("".concat(this.getBaseUrl(),"/find_by_key"),{params:{key:e}})}},{key:"getBaseUrl",value:function(){return"/controlled_vocabulary/reference_tables"}},{key:"getTransform",value:function(){return fe}}])&&ye(t.prototype,r),Object.defineProperty(t,"prototype",{writable:!1}),u}(r.BaseService),he=new ve;function Oe(e){return Oe="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},Oe(e)}function ge(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function we(e,t){for(var r=0;r<t.length;r++){var n=t[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}function je(e,t){return je=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e},je(e,t)}function Pe(e,t){if(t&&("object"===Oe(t)||"function"==typeof t))return t;if(void 0!==t)throw new TypeError("Derived constructors may only return object or undefined");return function(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}(e)}function _e(e){return _e=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)},_e(e)}var Re=function(e){!function(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}}),Object.defineProperty(e,"prototype",{writable:!1}),t&&je(e,t)}(u,e);var t,r,n,o,c=(n=u,o=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}(),function(){var e,t=_e(n);if(o){var r=_e(this).constructor;e=Reflect.construct(t,arguments,r)}else e=t.apply(this,arguments);return Pe(this,e)});function u(){return ge(this,u),c.apply(this,arguments)}return t=u,(r=[{key:"getPayloadKeys",value:function(){return["id","reference_code_id","_destroy"]}}])&&we(t.prototype,r),Object.defineProperty(t,"prototype",{writable:!1}),u}(r.NestedAttributesTransform),Se=new Re,Ee={getViewValue:function(e){return i().map(i().filter(e,(function(e){return!e._destroy})),(function(e){var t;return null===(t=e.reference_code)||void 0===t?void 0:t.name})).join(", ")}};module.exports=t}();
+//# sourceMappingURL=index.js.map

package/build/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","mappings":"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","sources":["webpack://@performant-software/controlled-vocabulary/webpack/bootstrap","webpack://@performant-software/controlled-vocabulary/webpack/runtime/compat get default export","webpack://@performant-software/controlled-vocabulary/webpack/runtime/define property getters","webpack://@performant-software/controlled-vocabulary/webpack/runtime/hasOwnProperty shorthand","webpack://@performant-software/controlled-vocabulary/webpack/runtime/make namespace object","webpack://@performant-software/controlled-vocabulary/external commonjs \"@performant-software/shared-components\"","webpack://@performant-software/controlled-vocabulary/external commonjs2 \"react\"","webpack://@performant-software/controlled-vocabulary/external commonjs \"semantic-ui-react\"","webpack://@performant-software/controlled-vocabulary/external commonjs \"underscore\"","webpack://@performant-software/controlled-vocabulary/./src/components/ReferenceCodeDropdown.js","webpack://@performant-software/controlled-vocabulary/external commonjs \"@performant-software/semantic-components\"","webpack://@performant-software/controlled-vocabulary/external commonjs \"i18next\"","webpack://@performant-software/controlled-vocabulary/./src/i18n/i18n.js","webpack://@performant-software/controlled-vocabulary/./src/components/ReferenceCodeFormLabel.js","webpack://@performant-software/controlled-vocabulary/./src/components/ReferenceCodeModal.js","webpack://@performant-software/controlled-vocabulary/./src/components/ReferenceTableModal.js","webpack://@performant-software/controlled-vocabulary/./src/components/ReferenceCodeFormDropdown.js","webpack://@performant-software/controlled-vocabulary/./src/components/ReferenceTablesList.js","webpack://@performant-software/controlled-vocabulary/./src/services/ReferenceCodes.js","webpack://@performant-software/controlled-vocabulary/./src/transforms/ReferenceCodes.js","webpack://@performant-software/controlled-vocabulary/./src/transforms/ReferenceTable.js","webpack://@performant-software/controlled-vocabulary/./src/services/ReferenceTables.js","webpack://@performant-software/controlled-vocabulary/./src/transforms/References.js","webpack://@performant-software/controlled-vocabulary/./src/utils/Reference.js"],"sourcesContent":["// The require scope\nvar __webpack_require__ = {};\n\n","// getDefaultExport function for compatibility with non-harmony modules\n__webpack_require__.n = function(module) {\n\tvar getter = module && module.__esModule ?\n\t\tfunction() { return module['default']; } :\n\t\tfunction() { return module; };\n\t__webpack_require__.d(getter, { a: getter });\n\treturn getter;\n};","// define getter functions for harmony exports\n__webpack_require__.d = function(exports, definition) {\n\tfor(var key in definition) {\n\t\tif(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {\n\t\t\tObject.defineProperty(exports, key, { enumerable: true, get: definition[key] });\n\t\t}\n\t}\n};","__webpack_require__.o = function(obj, prop) { return Object.prototype.hasOwnProperty.call(obj, prop); }","// define __esModule on exports\n__webpack_require__.r = function(exports) {\n\tif(typeof Symbol !== 'undefined' && Symbol.toStringTag) {\n\t\tObject.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });\n\t}\n\tObject.defineProperty(exports, '__esModule', { value: true });\n};","var __WEBPACK_NAMESPACE_OBJECT__ = require(\"@performant-software/shared-components\");","var __WEBPACK_NAMESPACE_OBJECT__ = require(\"react\");","var __WEBPACK_NAMESPACE_OBJECT__ = require(\"semantic-ui-react\");","var __WEBPACK_NAMESPACE_OBJECT__ = require(\"underscore\");","// @flow\n\nimport { ReferenceCodesService } from '@performant-software/shared-components';\nimport React, {\n  useCallback,\n  useEffect,\n  useMemo,\n  useState\n} from 'react';\nimport { Dropdown } from 'semantic-ui-react';\nimport _ from 'underscore';\n\ntype Item = {\n  reference_table_id: number,\n  key: string\n};\n\ntype Props = {\n  fluid?: boolean,\n  multiple?: boolean,\n  onChange: (item: Item) => void,\n  placeholder?: string,\n  referenceTable: string,\n  value: Item | Array<Item>\n};\n\nconst ReferenceCodeDropdown = (props: Props) => {\n  const [loading, setLoading] = useState(false);\n  const [options, setOptions] = useState([]);\n\n  /**\n   * Sets the \"value\" variable for the Dropdown component.\n   */\n  const value = useMemo(() => {\n    const v = _.pluck(_.filter(props.value, (x) => !x._destroy), 'reference_code_id');\n    return props.multiple ? v : _.first(v);\n  }, [props.multiple, props.value]);\n\n  /**\n   * Converts the passed ID to a reference code item.\n   *\n   * @type {function(*): {reference_code_id: *}}\n   */\n  const toItem = useCallback((id) => {\n    const option = _.findWhere(options, { key: id });\n\n    return {\n      reference_code_id: id,\n      reference_code: {\n        id,\n        name: option.text\n      }\n    };\n  }, [options]);\n\n  /**\n   * Converts the passed reference code to a dropdown option.\n   *\n   * @type {function(*): {text: *, value: *, key: *}}\n   */\n  const toOption = useCallback((referenceCode) => ({\n    key: referenceCode.id,\n    value: referenceCode.id,\n    text: referenceCode.name\n  }), []);\n\n  /**\n   * Converts the selected values and calls the onChange prop.\n   *\n   * @type {(function(*, {value: *}): void)|*}\n   */\n  const onChange = useCallback((e, data) => {\n    let referenceCodeIds;\n\n    if (props.multiple) {\n      referenceCodeIds = data.value;\n    } else {\n      referenceCodeIds = _.compact([data.value]);\n    }\n\n    const items = [];\n\n    // Find existing records or create new records\n    _.each(referenceCodeIds, (referenceCodeId) => {\n      let newValue = _.findWhere(props.value, { reference_code_id: referenceCodeId });\n\n      if (!newValue) {\n        newValue = toItem(referenceCodeId);\n      }\n\n      items.push(_.omit(newValue, '_destroy'));\n    });\n\n    // Mark records for delete\n    _.each(props.value, (v) => {\n      if (v.id && !_.contains(referenceCodeIds, v.reference_code_id)) {\n        items.push({ ...v, _destroy: true });\n      }\n    });\n\n    props.onChange(items);\n  }, [toItem, props.multiple, props.onChange, props.value]);\n\n  /**\n   * Loads the list of reference codes from the server.\n   */\n  useEffect(() => {\n    setLoading(true);\n\n    const params = {\n      per_page: 0,\n      reference_table: props.referenceTable,\n      sort_by: 'name'\n    };\n\n    ReferenceCodesService\n      .fetchAll(params)\n      .then(({ data }) => setOptions(_.map(data.reference_codes, toOption)))\n      .finally(() => setLoading(false));\n  }, [toOption]);\n\n  return (\n    <Dropdown\n      clearable\n      disabled={loading}\n      fluid={props.fluid}\n      loading={loading}\n      multiple={props.multiple}\n      onChange={onChange}\n      options={options}\n      placeholder={props.placeholder}\n      search\n      selection\n      selectOnBlur={false}\n      value={value}\n    />\n  );\n};\n\nReferenceCodeDropdown.defaultProps = {\n  fluid: true,\n  multiple: false,\n  placeholder: undefined\n};\n\nexport default ReferenceCodeDropdown;\n","var __WEBPACK_NAMESPACE_OBJECT__ = require(\"@performant-software/semantic-components\");","var __WEBPACK_NAMESPACE_OBJECT__ = require(\"i18next\");","// @flow\n\nimport i18next from 'i18next';\n\nimport en from './en.json';\n\nconst resources = {\n  en: {\n    translation: en\n  }\n};\n\nconst i18n = i18next.createInstance();\n\ni18n\n  .init({\n    debug: true,\n    fallbackLng: 'en',\n    lng: 'en',\n    interpolation: {\n      escapeValue: false,\n    },\n    resources\n  });\n\nexport default i18n;\n","// @flow\n\nimport React, { type ComponentType } from 'react';\nimport {\n  Button,\n  Header,\n  Icon,\n  Popup\n} from 'semantic-ui-react';\nimport i18n from '../i18n/i18n';\nimport './ReferenceCodeFormLabel.css';\n\ntype Props = {\n  label: string,\n  onClick: () => void,\n  referenceTable: string\n};\n\nconst ReferenceCodeFormLabel: ComponentType<any> = (props: Props) => (\n  <>\n    <label\n      className='reference-code-form-label'\n      htmlFor={props.referenceTable}\n    >\n      { props.label }\n    </label>\n    <Popup\n      hoverable\n      trigger={(\n        <Icon\n          name='info circle'\n          style={{\n            marginLeft: '0.3em'\n          }}\n        />\n      )}\n    >\n      <Header\n        content={props.label}\n      />\n      <p>{ i18n.t('ReferenceCodeFormLabel.content', { name: props.label })}</p>\n      <Button\n        content={i18n.t('Common.buttons.edit')}\n        icon='edit'\n        primary\n        onClick={props.onClick}\n      />\n    </Popup>\n  </>\n);\n\nexport default ReferenceCodeFormLabel;\n","// @flow\n\nimport { ModalContext } from '@performant-software/semantic-components';\nimport type { EditContainerProps } from '@performant-software/shared-components';\nimport React from 'react';\nimport { Form, Modal } from 'semantic-ui-react';\nimport i18n from '../i18n/i18n';\n\nconst ReferenceCodeModal = (props: EditContainerProps) => (\n  <ModalContext.Consumer>\n    { (mountNode) => (\n      <Modal\n        as={Form}\n        centered={false}\n        mountNode={mountNode}\n        open\n      >\n        <Modal.Header\n          content={props.item.id\n            ? i18n.t('ReferenceCodeModal.title.edit')\n            : i18n.t('ReferenceCodeModal.title.add')}\n        />\n        <Modal.Content>\n          <Form.Input\n            autoFocus\n            error={props.isError('name')}\n            label={i18n.t('ReferenceCodeModal.labels.name')}\n            onChange={props.onTextInputChange.bind(this, 'name')}\n            required={props.isRequired('name')}\n            value={props.item.name}\n          />\n        </Modal.Content>\n        { props.children }\n      </Modal>\n    )}\n  </ModalContext.Consumer>\n);\n\nexport default ReferenceCodeModal;\n","// @flow\n\nimport { EmbeddedList, ModalContext } from '@performant-software/semantic-components';\nimport type { EditContainerProps } from '@performant-software/shared-components';\nimport React from 'react';\nimport { Form, Header, Modal } from 'semantic-ui-react';\nimport i18n from '../i18n/i18n';\nimport ReferenceCodeModal from './ReferenceCodeModal';\n\nconst ReferenceTableModal = (props: EditContainerProps) => (\n  <ModalContext.Consumer>\n    { (mountNode) => (\n      <Modal\n        as={Form}\n        centered={false}\n        className='reference-table-modal'\n        mountNode={mountNode}\n        open\n      >\n        <Modal.Header\n          content={props.item.id\n            ? i18n.t('ReferenceTableModal.title.edit')\n            : i18n.t('ReferenceTableModal.title.add')}\n        />\n        <Modal.Content>\n          <Form.Input\n            autoFocus\n            error={props.isError('name')}\n            label={i18n.t('ReferenceTableModal.labels.name')}\n            onChange={props.onTextInputChange.bind(this, 'name')}\n            required={props.isRequired('name')}\n            value={props.item.name}\n          />\n          <Form.Input\n            error={props.isError('key')}\n            label={i18n.t('ReferenceTableModal.labels.key')}\n            onChange={props.onTextInputChange.bind(this, 'key')}\n            required={props.isRequired('key')}\n            value={props.item.key}\n          />\n          <Header\n            content={i18n.t('ReferenceTableModal.labels.referenceCodes')}\n          />\n          <EmbeddedList\n            actions={[{\n              name: 'edit'\n            }, {\n              name: 'copy'\n            }, {\n              name: 'delete'\n            }]}\n            columns={[{\n              name: 'name',\n              label: i18n.t('ReferenceTableModal.referenceCodes.columns.name')\n            }]}\n            items={props.item.reference_codes}\n            modal={{\n              component: ReferenceCodeModal,\n              props: {\n                required: ['name']\n              }\n            }}\n            onDelete={props.onDeleteChildAssociation.bind(this, 'reference_codes')}\n            onSave={props.onSaveChildAssociation.bind(this, 'reference_codes')}\n          />\n        </Modal.Content>\n        { props.children }\n      </Modal>\n    )}\n  </ModalContext.Consumer>\n);\n\nexport default ReferenceTableModal;\n","// @flow\n\nimport { EditModal } from '@performant-software/semantic-components';\nimport { ReferenceTablesService } from '@performant-software/shared-components';\nimport React, { type ComponentType, useState } from 'react';\nimport { Form } from 'semantic-ui-react';\nimport ReferenceCodeDropdown from './ReferenceCodeDropdown';\nimport ReferenceCodeFormLabel from './ReferenceCodeFormLabel';\nimport ReferenceTableModal from './ReferenceTableModal';\n\ntype Props = {\n  error?: boolean,\n  label?: string,\n  required?: boolean,\n  referenceTable: string\n};\n\nconst ReferenceCodeFormDropdown: ComponentType<any> = (props: Props) => {\n  const {\n    error,\n    label,\n    required,\n    referenceTable,\n    ...rest\n  } = props;\n\n  const [modal, setModal] = useState(false);\n  const [dropdownKey, setDropdownKey] = useState(0);\n\n  return (\n    <>\n      <Form.Input\n        error={error}\n        label={(\n          <ReferenceCodeFormLabel\n            label={label}\n            onClick={() => setModal(true)}\n            referenceTable={referenceTable}\n          />\n        )}\n        required={required}\n      >\n        <ReferenceCodeDropdown\n          {...rest}\n          id={referenceTable}\n          referenceTable={referenceTable}\n          key={dropdownKey}\n        />\n      </Form.Input>\n      { modal && (\n        <EditModal\n          component={ReferenceTableModal}\n          item={{ id: referenceTable, key: referenceTable }}\n          onClose={() => setModal(false)}\n          onInitialize={(key) => (\n            ReferenceTablesService\n              .fetchByKey(key)\n              .then(({ data }) => ({\n                ...data.reference_table,\n                key\n              }))\n          )}\n          onSave={(record) => (\n            ReferenceTablesService\n              .save(record)\n              .then(({ data }) => data.reference_table)\n              .then(() => setDropdownKey((prevKey) => prevKey + 1))\n              .finally(() => setModal(false))\n          )}\n        />\n      )}\n    </>\n  );\n};\n\nexport default ReferenceCodeFormDropdown;\n","// @flow\n\nimport { ListTable } from '@performant-software/semantic-components';\nimport { ReferenceTablesService } from '@performant-software/shared-components';\nimport React from 'react';\nimport ReferenceTableModal from './ReferenceTableModal';\n\nconst ReferenceTablesList = () => (\n  <ListTable\n    actions={[{\n      name: 'edit'\n    }, {\n      name: 'copy'\n    }, {\n      name: 'delete'\n    }]}\n    collectionName='reference_tables'\n    columns={[{\n      name: 'name',\n      label: 'Name',\n      sortable: true\n    }, {\n      name: 'key',\n      label: 'Key',\n      sortable: true\n    }]}\n    modal={{\n      component: ReferenceTableModal,\n      props: {\n        onInitialize: (id) => (\n          ReferenceTablesService\n            .fetchOne(id)\n            .then(({ data }) => data.reference_table)\n        ),\n        required: ['name', 'key']\n      }\n    }}\n    onDelete={(referenceTable) => ReferenceTablesService.delete(referenceTable)}\n    onLoad={(params) => ReferenceTablesService.fetchAll(params)}\n    onSave={(referenceTable) => ReferenceTablesService.save(referenceTable)}\n  />\n);\n\nexport default ReferenceTablesList;\n","// @flow\n\nimport { BaseService } from '@performant-software/shared-components';\n\n/**\n * Class responsible for handling all reference code API requests.\n */\nclass ReferenceCodes extends BaseService {\n  /**\n   * Returns the reference codes base URL.\n   *\n   * @returns {string}\n   */\n  getBaseUrl() {\n    return '/controlled_vocabulary/reference_codes';\n  }\n\n  /**\n   * Returns the reference codes transform object.\n   *\n   * @returns {{}}\n   */\n  getTransform() {\n    return { }; // PUT/POST routes not implemented\n  }\n}\n\nexport default new ReferenceCodes();\n","// @flow\n\nimport { NestedAttributesTransform } from '@performant-software/shared-components';\n\n/**\n * Class for transforming reference codes nested objects for PUT/POST requests.\n */\nclass ReferenceCodes extends NestedAttributesTransform {\n  /**\n   * Returns the reference codes payload keys.\n   *\n   * @returns {string[]}\n   */\n  getPayloadKeys(): Array<string> {\n    return [\n      'id',\n      'name',\n      '_destroy'\n    ];\n  }\n\n  /**\n   * Calls the super method with a default value for the collection name.\n   *\n   * @param record\n   * @param collection\n   *\n   * @returns {{[p: string]: *}}\n   */\n  toPayload(record: any, collection: string = 'reference_codes') {\n    return super.toPayload(record, collection);\n  }\n}\n\nexport default new ReferenceCodes();\n","// @flow\n\nimport { BaseTransform } from '@performant-software/shared-components';\nimport ReferenceCodes from './ReferenceCodes';\n\ntype ReferenceTableType = {\n  id: number,\n  name: string,\n  key: string\n};\n\n/**\n * Class for transforming reference table objects for PUT/POST requests.\n */\nclass ReferenceTable extends BaseTransform {\n  /**\n   * Returns the reference table parameter name.\n   *\n   * @returns {string}\n   */\n  getParameterName() {\n    return 'reference_table';\n  }\n\n  /**\n   * Returns the reference table payload keys.\n   *\n   * @returns {string[]}\n   */\n  getPayloadKeys() {\n    return [\n      'name',\n      'key'\n    ];\n  }\n\n  /**\n   * Converts the passed reference table object to JSON for PUT/POST requests.\n   *\n   * @param referenceTable\n   * @param attributes\n   *\n   * @returns {*}\n   */\n  toPayload(referenceTable: ReferenceTableType, attributes: any = {}) {\n    return super.toPayload(referenceTable, {\n      ...attributes,\n      ...ReferenceCodes.toPayload(referenceTable)\n    });\n  }\n}\n\nexport default new ReferenceTable();\n","// @flow\n\nimport { BaseService } from '@performant-software/shared-components';\nimport ReferenceTable from '../transforms/ReferenceTable';\n\n/**\n * Class responsible for handling all reference table API requests.\n */\nclass ReferenceTables extends BaseService {\n  /**\n   * Calls the find_by_key API end point for reference tables.\n   *\n   * @param key\n   *\n   * @returns {Promise<AxiosResponse<any>>}\n   */\n  fetchByKey(key) {\n    return this.getAxios().get(`${this.getBaseUrl()}/find_by_key`, { params: { key } });\n  }\n\n  /**\n   * Returns the reference tables base URL.\n   *\n   * @returns {string}\n   */\n  getBaseUrl() {\n    return '/controlled_vocabulary/reference_tables';\n  }\n\n  /**\n   * Returns the reference table transform object.\n   *\n   * @returns {ReferenceTable}\n   */\n  getTransform() {\n    return ReferenceTable;\n  }\n}\n\nexport default new ReferenceTables();\n","// @flow\n\nimport { NestedAttributesTransform } from '@performant-software/shared-components';\n\n/**\n * Class for transforming references nested objects for PUT/POST requests.\n */\nclass References extends NestedAttributesTransform {\n  /**\n   * Returns the references payload keys.\n   *\n   * @returns {string[]}\n   */\n  getPayloadKeys(): Array<string> {\n    return [\n      'id',\n      'reference_code_id',\n      '_destroy'\n    ];\n  }\n}\n\nconst ReferencesTransform: References = new References();\nexport default ReferencesTransform;\n","// @flow\n\nimport _ from 'underscore';\n\nconst LIST_DELIMITER = ', ';\n\n/**\n * Returns the view value for the  passed array of references.\n *\n * @param references\n *\n * @returns {*}\n */\nconst getViewValue = (references) => _.map(\n  _.filter(references, (reference) => !reference._destroy),\n  (reference) => reference.reference_code?.name\n).join(LIST_DELIMITER);\n\nexport default {\n  getViewValue\n};\n"],"names":["__webpack_require__","module","getter","__esModule","d","a","exports","definition","key","o","Object","defineProperty","enumerable","get","obj","prop","prototype","hasOwnProperty","call","Symbol","toStringTag","value","require","ReferenceCodeDropdown","props","useState","loading","setLoading","options","setOptions","useMemo","v","_","x","_destroy","multiple","toItem","useCallback","id","reference_code_id","reference_code","name","text","toOption","referenceCode","onChange","e","data","referenceCodeIds","items","referenceCodeId","newValue","push","useEffect","params","per_page","reference_table","referenceTable","sort_by","ReferenceCodesService","then","reference_codes","finally","Dropdown","clearable","disabled","fluid","placeholder","search","selection","selectOnBlur","defaultProps","undefined","resources","en","translation","i18n","i18next","init","debug","fallbackLng","lng","interpolation","escapeValue","className","htmlFor","label","Popup","hoverable","trigger","Icon","style","marginLeft","Header","content","Button","icon","primary","onClick","ModalContext","mountNode","Modal","as","Form","centered","open","item","autoFocus","error","isError","onTextInputChange","bind","required","isRequired","children","EmbeddedList","actions","columns","modal","component","ReferenceCodeModal","onDelete","onDeleteChildAssociation","onSave","onSaveChildAssociation","rest","setModal","dropdownKey","setDropdownKey","EditModal","ReferenceTableModal","onClose","onInitialize","ReferenceTablesService","record","prevKey","ListTable","collectionName","sortable","onLoad","ReferenceCodes","BaseService","collection","NestedAttributesTransform","ReferenceTable","attributes","BaseTransform","ReferenceTables","this","getAxios","getBaseUrl","References","getViewValue","references","reference","join"],"sourceRoot":""}

package/build/main.css

@@ -0,0 +1,4 @@
+.ui.form .field > label.reference-code-form-label {
+  display: inline-block;
+}
+

package/index.js

@@ -0,0 +1 @@
+module.exports = require('./build/index');

package/package.json

@@ -0,0 +1,30 @@
+{
+  "name": "@performant-software/controlled-vocabulary",
+  "version": "0.6.2-beta.3",
+  "description": "A package of components to allow user to configure dropdown elements. Use with the \"controlled_vocabulary\" gem.",
+  "license": "MIT",
+  "main": "./build/index.js",
+  "style": [
+    "./build/main.css",
+    "./build/semantic-ui.css"
+  ],
+  "scripts": {
+    "build": "webpack --mode production && flow-copy-source -v src types"
+  },
+  "dependencies": {
+    "@performant-software/semantic-components": "^0.6.2-beta.3",
+    "@performant-software/shared-components": "^0.6.2-beta.3",
+    "i18next": "^21.9.2",
+    "semantic-ui-react": "^2.1.2",
+    "underscore": "^1.13.2"
+  },
+  "peerDependencies": {
+    "react": ">= 16.13.1 < 18.0.0",
+    "react-dom": ">= 16.13.1 < 18.0.0"
+  },
+  "devDependencies": {
+    "@performant-software/webpack-config": "^1.0.0",
+    "react": "^17.0.2",
+    "react-dom": "^17.0.2"
+  }
+}

package/src/components/ReferenceCodeDropdown.js

@@ -0,0 +1,146 @@
+// @flow
+
+import { ReferenceCodesService } from '@performant-software/shared-components';
+import React, {
+  useCallback,
+  useEffect,
+  useMemo,
+  useState
+} from 'react';
+import { Dropdown } from 'semantic-ui-react';
+import _ from 'underscore';
+
+type Item = {
+  reference_table_id: number,
+  key: string
+};
+
+type Props = {
+  fluid?: boolean,
+  multiple?: boolean,
+  onChange: (item: Item) => void,
+  placeholder?: string,
+  referenceTable: string,
+  value: Item | Array<Item>
+};
+
+const ReferenceCodeDropdown = (props: Props) => {
+  const [loading, setLoading] = useState(false);
+  const [options, setOptions] = useState([]);
+
+  /**
+   * Sets the "value" variable for the Dropdown component.
+   */
+  const value = useMemo(() => {
+    const v = _.pluck(_.filter(props.value, (x) => !x._destroy), 'reference_code_id');
+    return props.multiple ? v : _.first(v);
+  }, [props.multiple, props.value]);
+
+  /**
+   * Converts the passed ID to a reference code item.
+   *
+   * @type {function(*): {reference_code_id: *}}
+   */
+  const toItem = useCallback((id) => {
+    const option = _.findWhere(options, { key: id });
+
+    return {
+      reference_code_id: id,
+      reference_code: {
+        id,
+        name: option.text
+      }
+    };
+  }, [options]);
+
+  /**
+   * Converts the passed reference code to a dropdown option.
+   *
+   * @type {function(*): {text: *, value: *, key: *}}
+   */
+  const toOption = useCallback((referenceCode) => ({
+    key: referenceCode.id,
+    value: referenceCode.id,
+    text: referenceCode.name
+  }), []);
+
+  /**
+   * Converts the selected values and calls the onChange prop.
+   *
+   * @type {(function(*, {value: *}): void)|*}
+   */
+  const onChange = useCallback((e, data) => {
+    let referenceCodeIds;
+
+    if (props.multiple) {
+      referenceCodeIds = data.value;
+    } else {
+      referenceCodeIds = _.compact([data.value]);
+    }
+
+    const items = [];
+
+    // Find existing records or create new records
+    _.each(referenceCodeIds, (referenceCodeId) => {
+      let newValue = _.findWhere(props.value, { reference_code_id: referenceCodeId });
+
+      if (!newValue) {
+        newValue = toItem(referenceCodeId);
+      }
+
+      items.push(_.omit(newValue, '_destroy'));
+    });
+
+    // Mark records for delete
+    _.each(props.value, (v) => {
+      if (v.id && !_.contains(referenceCodeIds, v.reference_code_id)) {
+        items.push({ ...v, _destroy: true });
+      }
+    });
+
+    props.onChange(items);
+  }, [toItem, props.multiple, props.onChange, props.value]);
+
+  /**
+   * Loads the list of reference codes from the server.
+   */
+  useEffect(() => {
+    setLoading(true);
+
+    const params = {
+      per_page: 0,
+      reference_table: props.referenceTable,
+      sort_by: 'name'
+    };
+
+    ReferenceCodesService
+      .fetchAll(params)
+      .then(({ data }) => setOptions(_.map(data.reference_codes, toOption)))
+      .finally(() => setLoading(false));
+  }, [toOption]);
+
+  return (
+    <Dropdown
+      clearable
+      disabled={loading}
+      fluid={props.fluid}
+      loading={loading}
+      multiple={props.multiple}
+      onChange={onChange}
+      options={options}
+      placeholder={props.placeholder}
+      search
+      selection
+      selectOnBlur={false}
+      value={value}
+    />
+  );
+};
+
+ReferenceCodeDropdown.defaultProps = {
+  fluid: true,
+  multiple: false,
+  placeholder: undefined
+};
+
+export default ReferenceCodeDropdown;

package/src/components/ReferenceCodeFormDropdown.js

@@ -0,0 +1,76 @@
+// @flow
+
+import { EditModal } from '@performant-software/semantic-components';
+import { ReferenceTablesService } from '@performant-software/shared-components';
+import React, { type ComponentType, useState } from 'react';
+import { Form } from 'semantic-ui-react';
+import ReferenceCodeDropdown from './ReferenceCodeDropdown';
+import ReferenceCodeFormLabel from './ReferenceCodeFormLabel';
+import ReferenceTableModal from './ReferenceTableModal';
+
+type Props = {
+  error?: boolean,
+  label?: string,
+  required?: boolean,
+  referenceTable: string
+};
+
+const ReferenceCodeFormDropdown: ComponentType<any> = (props: Props) => {
+  const {
+    error,
+    label,
+    required,
+    referenceTable,
+    ...rest
+  } = props;
+
+  const [modal, setModal] = useState(false);
+  const [dropdownKey, setDropdownKey] = useState(0);
+
+  return (
+    <>
+      <Form.Input
+        error={error}
+        label={(
+          <ReferenceCodeFormLabel
+            label={label}
+            onClick={() => setModal(true)}
+            referenceTable={referenceTable}
+          />
+        )}
+        required={required}
+      >
+        <ReferenceCodeDropdown
+          {...rest}
+          id={referenceTable}
+          referenceTable={referenceTable}
+          key={dropdownKey}
+        />
+      </Form.Input>
+      { modal && (
+        <EditModal
+          component={ReferenceTableModal}
+          item={{ id: referenceTable, key: referenceTable }}
+          onClose={() => setModal(false)}
+          onInitialize={(key) => (
+            ReferenceTablesService
+              .fetchByKey(key)
+              .then(({ data }) => ({
+                ...data.reference_table,
+                key
+              }))
+          )}
+          onSave={(record) => (
+            ReferenceTablesService
+              .save(record)
+              .then(({ data }) => data.reference_table)
+              .then(() => setDropdownKey((prevKey) => prevKey + 1))
+              .finally(() => setModal(false))
+          )}
+        />
+      )}
+    </>
+  );
+};
+
+export default ReferenceCodeFormDropdown;

package/src/components/ReferenceCodeFormLabel.css

@@ -0,0 +1,3 @@
+.ui.form .field > label.reference-code-form-label {
+  display: inline-block;
+}

package/src/components/ReferenceCodeFormLabel.js

@@ -0,0 +1,52 @@
+// @flow
+
+import React, { type ComponentType } from 'react';
+import {
+  Button,
+  Header,
+  Icon,
+  Popup
+} from 'semantic-ui-react';
+import i18n from '../i18n/i18n';
+import './ReferenceCodeFormLabel.css';
+
+type Props = {
+  label: string,
+  onClick: () => void,
+  referenceTable: string
+};
+
+const ReferenceCodeFormLabel: ComponentType<any> = (props: Props) => (
+  <>
+    <label
+      className='reference-code-form-label'
+      htmlFor={props.referenceTable}
+    >
+      { props.label }
+    </label>
+    <Popup
+      hoverable
+      trigger={(
+        <Icon
+          name='info circle'
+          style={{
+            marginLeft: '0.3em'
+          }}
+        />
+      )}
+    >
+      <Header
+        content={props.label}
+      />
+      <p>{ i18n.t('ReferenceCodeFormLabel.content', { name: props.label })}</p>
+      <Button
+        content={i18n.t('Common.buttons.edit')}
+        icon='edit'
+        primary
+        onClick={props.onClick}
+      />
+    </Popup>
+  </>
+);
+
+export default ReferenceCodeFormLabel;

package/src/components/ReferenceCodeModal.js

@@ -0,0 +1,39 @@
+// @flow
+
+import { ModalContext } from '@performant-software/semantic-components';
+import type { EditContainerProps } from '@performant-software/shared-components';
+import React from 'react';
+import { Form, Modal } from 'semantic-ui-react';
+import i18n from '../i18n/i18n';
+
+const ReferenceCodeModal = (props: EditContainerProps) => (
+  <ModalContext.Consumer>
+    { (mountNode) => (
+      <Modal
+        as={Form}
+        centered={false}
+        mountNode={mountNode}
+        open
+      >
+        <Modal.Header
+          content={props.item.id
+            ? i18n.t('ReferenceCodeModal.title.edit')
+            : i18n.t('ReferenceCodeModal.title.add')}
+        />
+        <Modal.Content>
+          <Form.Input
+            autoFocus
+            error={props.isError('name')}
+            label={i18n.t('ReferenceCodeModal.labels.name')}
+            onChange={props.onTextInputChange.bind(this, 'name')}
+            required={props.isRequired('name')}
+            value={props.item.name}
+          />
+        </Modal.Content>
+        { props.children }
+      </Modal>
+    )}
+  </ModalContext.Consumer>
+);
+
+export default ReferenceCodeModal;

package/src/components/ReferenceTableModal.js

@@ -0,0 +1,73 @@
+// @flow
+
+import { EmbeddedList, ModalContext } from '@performant-software/semantic-components';
+import type { EditContainerProps } from '@performant-software/shared-components';
+import React from 'react';
+import { Form, Header, Modal } from 'semantic-ui-react';
+import i18n from '../i18n/i18n';
+import ReferenceCodeModal from './ReferenceCodeModal';
+
+const ReferenceTableModal = (props: EditContainerProps) => (
+  <ModalContext.Consumer>
+    { (mountNode) => (
+      <Modal
+        as={Form}
+        centered={false}
+        className='reference-table-modal'
+        mountNode={mountNode}
+        open
+      >
+        <Modal.Header
+          content={props.item.id
+            ? i18n.t('ReferenceTableModal.title.edit')
+            : i18n.t('ReferenceTableModal.title.add')}
+        />
+        <Modal.Content>
+          <Form.Input
+            autoFocus
+            error={props.isError('name')}
+            label={i18n.t('ReferenceTableModal.labels.name')}
+            onChange={props.onTextInputChange.bind(this, 'name')}
+            required={props.isRequired('name')}
+            value={props.item.name}
+          />
+          <Form.Input
+            error={props.isError('key')}
+            label={i18n.t('ReferenceTableModal.labels.key')}
+            onChange={props.onTextInputChange.bind(this, 'key')}
+            required={props.isRequired('key')}
+            value={props.item.key}
+          />
+          <Header
+            content={i18n.t('ReferenceTableModal.labels.referenceCodes')}
+          />
+          <EmbeddedList
+            actions={[{
+              name: 'edit'
+            }, {
+              name: 'copy'
+            }, {
+              name: 'delete'
+            }]}
+            columns={[{
+              name: 'name',
+              label: i18n.t('ReferenceTableModal.referenceCodes.columns.name')
+            }]}
+            items={props.item.reference_codes}
+            modal={{
+              component: ReferenceCodeModal,
+              props: {
+                required: ['name']
+              }
+            }}
+            onDelete={props.onDeleteChildAssociation.bind(this, 'reference_codes')}
+            onSave={props.onSaveChildAssociation.bind(this, 'reference_codes')}
+          />
+        </Modal.Content>
+        { props.children }
+      </Modal>
+    )}
+  </ModalContext.Consumer>
+);
+
+export default ReferenceTableModal;

package/src/components/ReferenceTablesList.js

@@ -0,0 +1,44 @@
+// @flow
+
+import { ListTable } from '@performant-software/semantic-components';
+import { ReferenceTablesService } from '@performant-software/shared-components';
+import React from 'react';
+import ReferenceTableModal from './ReferenceTableModal';
+
+const ReferenceTablesList = () => (
+  <ListTable
+    actions={[{
+      name: 'edit'
+    }, {
+      name: 'copy'
+    }, {
+      name: 'delete'
+    }]}
+    collectionName='reference_tables'
+    columns={[{
+      name: 'name',
+      label: 'Name',
+      sortable: true
+    }, {
+      name: 'key',
+      label: 'Key',
+      sortable: true
+    }]}
+    modal={{
+      component: ReferenceTableModal,
+      props: {
+        onInitialize: (id) => (
+          ReferenceTablesService
+            .fetchOne(id)
+            .then(({ data }) => data.reference_table)
+        ),
+        required: ['name', 'key']
+      }
+    }}
+    onDelete={(referenceTable) => ReferenceTablesService.delete(referenceTable)}
+    onLoad={(params) => ReferenceTablesService.fetchAll(params)}
+    onSave={(referenceTable) => ReferenceTablesService.save(referenceTable)}
+  />
+);
+
+export default ReferenceTablesList;