@performant-software/user-defined-fields 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,{UserDefinedFieldModal:function(){return E},UserDefinedFieldOptions:function(){return g},UserDefinedFieldTransform:function(){return B},UserDefinedFields:function(){return ue},UserDefinedFieldsEmbeddedList:function(){return D},UserDefinedFieldsForm:function(){return k},UserDefinedFieldsList:function(){return q},UserDefinedFieldsService:function(){return H},UserDefinedFieldsTransform:function(){return oe}});var r=require("@performant-software/shared-components"),n=require("react"),o=e.n(n),i=require("semantic-ui-react"),a=require("underscore"),u=e.n(a),l=require("i18next"),c=e.n(l),f={en:{translation:JSON.parse('{"UserDefinedFieldModal":{"labels":{"allowMultiple":"Allow multiple","dataType":"Data type","name":"Name","required":"Required","table":"Table"},"title":{"add":"Add User Defined Field","edit":"Edit User Defined Field"}},"UserDefinedFieldsEmbeddedList":{"columns":{"dataType":"Data type","name":"Name","required":"Required","table":"Table"}},"UserDefinedFieldsList":{"columns":{"dataType":"Data type","name":"Name","required":"Required","table":"Table"}}}')}},s=c().createInstance();s.init({debug:!0,fallbackLng:"en",lng:"en",interpolation:{escapeValue:!1},resources:f});var d=s,p=void 0;function y(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 m(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?y(Object(r),!0).forEach((function(t){b(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):y(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}function b(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function v(e,t){if(e){if("string"==typeof e)return h(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)?h(e,t):void 0}}function h(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 g=function(e){var t,r,a=(t=(0,n.useState)(u().map(e.options,(function(e){return{value:e}}))),r=2,function(e){if(Array.isArray(e))return e}(t)||function(e,t){var r=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=r){var n,o,i=[],a=!0,u=!1;try{for(r=r.call(e);!(a=(n=r.next()).done)&&(i.push(n.value),!t||i.length!==t);a=!0);}catch(e){u=!0,o=e}finally{try{a||null==r.return||r.return()}finally{if(u)throw o}}return i}}(t,r)||v(t,r)||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.")}()),l=a[0],c=a[1],f=(0,n.useCallback)((function(){c((function(e){return[].concat(function(e){return function(e){if(Array.isArray(e))return h(e)}(e)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||v(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}(e),[{new:!0}])}))}),[]),s=(0,n.useCallback)((function(e){c((function(t){return u().filter(t,(function(t,r){return r!==e}))}))}),[]),d=(0,n.useCallback)((function(e){c((function(t){return u().map(t,(function(t,r){return e!==r?t:m(m({},t),{},{new:!1})}))}))}),[l]),y=(0,n.useCallback)((function(e,t,r){var n=r.value;c((function(t){return u().map(t,(function(t,r){return r!==e?t:m(m({},t),{},{value:n})}))}))}),[]);return(0,n.useEffect)((function(){var t=u().filter(l,(function(e){return!e.new}));e.onChange(u().pluck(t,"value"))}),[l]),o().createElement("div",{className:"user-defined-field-options"},o().createElement(i.Button,{basic:!0,icon:"plus",onClick:f,type:"button"}),u().map(l,(function(e,t){return o().createElement(o().Fragment,null,e.new&&o().createElement(i.Label,null,o().createElement(i.Input,{autoFocus:!0,onChange:y.bind(p,t),value:e.value}),o().createElement(i.Button,{basic:!0,color:"green",icon:"checkmark",onClick:d.bind(p,t),type:"button",size:"tiny"})),!e.new&&o().createElement(i.Label,{content:e.value,onRemove:s.bind(p,t)}))})))},_=void 0;function O(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,i=[],a=!0,u=!1;try{for(r=r.call(e);!(a=(n=r.next()).done)&&(i.push(n.value),!t||i.length!==t);a=!0);}catch(e){u=!0,o=e}finally{try{a||null==r.return||r.return()}finally{if(u)throw o}}return i}}(e,t)||function(e,t){if(e){if("string"==typeof e)return w(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)?w(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 w(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 S="Select",E=function(e){var t=O((0,n.useState)([]),2),a=t[0],l=t[1],c=O((0,n.useState)([]),2),f=c[0],s=c[1],p=(0,n.useCallback)((function(e){return u().map(e,(function(e){return{key:e,value:e,text:e}}))}),[]);return(0,n.useEffect)((function(){r.UserDefinedFieldsService.fetchTables().then((function(e){var t=e.data;return s(p(t.tables))})),r.UserDefinedFieldsService.fetchDataTypes().then((function(e){var t=e.data;return l(p(t.data_types))}))}),[]),o().createElement(i.Modal,{as:i.Form,centered:!1,open:!0},o().createElement(i.Modal.Header,{content:e.item.id?d.t("UserDefinedFieldModal.title.edit"):d.t("UserDefinedFieldModal.title.add")}),o().createElement(i.Modal.Content,null,o().createElement(i.Form.Dropdown,{clearable:!0,error:e.isError("table_name"),label:d.t("UserDefinedFieldModal.labels.table"),onChange:e.onTextInputChange.bind(_,"table_name"),options:f,required:e.isRequired("table_name"),selection:!0,selectOnBlur:!1,value:e.item.table_name||""}),o().createElement(i.Form.Input,{error:e.isError("column_name"),label:d.t("UserDefinedFieldModal.labels.name"),onChange:e.onTextInputChange.bind(_,"column_name"),required:e.isRequired("column_name"),value:e.item.column_name||""}),o().createElement(i.Form.Dropdown,{clearable:!0,error:e.isError("data_type"),label:d.t("UserDefinedFieldModal.labels.dataType"),onChange:e.onTextInputChange.bind(_,"data_type"),options:a,required:e.isRequired("data_type"),selection:!0,selectOnBlur:!1,value:e.item.data_type||""}),o().createElement(i.Form.Group,null,o().createElement(i.Form.Checkbox,{error:e.isError("required"),checked:e.item.required,label:d.t("UserDefinedFieldModal.labels.required"),onChange:e.onCheckboxInputChange.bind(_,"required")}),e.item.data_type===S&&o().createElement(i.Form.Checkbox,{error:e.isError("allow_multiple"),checked:e.item.allow_multiple,label:d.t("UserDefinedFieldModal.labels.allowMultiple"),onChange:e.onCheckboxInputChange.bind(_,"allow_multiple")})),e.item.data_type===S&&o().createElement(g,{options:e.item.options,onChange:function(t){return e.onSetState({options:t})}})),e.children)},j=require("@performant-software/semantic-components"),D=function(e){return o().createElement(j.EmbeddedList,{actions:[{name:"edit"},{name:"delete"}],columns:[{name:"table_name",label:d.t("UserDefinedFieldsEmbeddedList.columns.table")},{name:"column_name",label:d.t("UserDefinedFieldsEmbeddedList.columns.name")},{name:"data_type",label:d.t("UserDefinedFieldsEmbeddedList.columns.dataType")},{name:"required",label:d.t("UserDefinedFieldsEmbeddedList.columns.required"),render:function(e){return o().createElement(j.BooleanIcon,{value:e.required})}}],items:e.items,modal:{component:E},onDelete:e.onDelete,onSave:e.onSave})};function F(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 P(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?F(Object(r),!0).forEach((function(t){C(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):F(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}function C(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function T(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 k=function(e){var t,a,l=(t=(0,n.useState)([]),a=2,function(e){if(Array.isArray(e))return e}(t)||function(e,t){var r=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=r){var n,o,i=[],a=!0,u=!1;try{for(r=r.call(e);!(a=(n=r.next()).done)&&(i.push(n.value),!t||i.length!==t);a=!0);}catch(e){u=!0,o=e}finally{try{a||null==r.return||r.return()}finally{if(u)throw o}}return i}}(t,a)||function(e,t){if(e){if("string"==typeof e)return T(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)?T(e,t):void 0}}(t,a)||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.")}()),c=l[0],f=l[1],s=(0,n.useMemo)((function(){var t={};return u().isString(e.item.user_defined)&&(t=JSON.parse(e.item.user_defined)),t}),[e.item.user_defined]),d=(0,n.useCallback)((function(e){return"user_defined[".concat(e.column_name,"]")}),[]),p=(0,n.useCallback)((function(t){return e.isError(d(t))}),[d,e.isError]),y=(0,n.useCallback)((function(t,r){e.onChange(JSON.stringify(P(P({},s),{},C({},t.column_name,r)))),e.onClearValidationError&&e.onClearValidationError(d(t))}),[d,s,e.onChange,e.onClearValidationError]),m=(0,n.useCallback)((function(e){var t,n=s&&s[e.column_name];return"String"===e.data_type&&(t=o().createElement(i.Form.Input,{error:p(e),label:e.column_name,required:e.required,onChange:function(t,r){var n=r.value;return y(e,n)},value:n})),"Number"===e.data_type&&(t=o().createElement(i.Form.Input,{error:p(e),label:e.column_name,required:e.required,onChange:function(t,r){var n=r.value;return y(e,n)},value:n,type:"number"})),"Select"===e.data_type&&(t=o().createElement(i.Form.Dropdown,{clearable:!0,error:p(e),label:e.column_name,multiple:e.allow_multiple,required:e.required,options:u().map(e.options,(function(e){return{key:e,value:e,text:e}})),onChange:function(t,r){var n=r.value;return y(e,n)},selectOnBlur:!1,selection:!0,value:n})),"Text"===e.data_type&&(t=o().createElement(i.Form.TextArea,{error:p(e),label:e.column_name,required:e.required,onChange:function(t,r){var n=r.value;return y(e,n)},value:n})),"Date"===e.data_type&&(t=o().createElement(i.Form.Input,{error:p(e),label:e.column_name,required:e.required},o().createElement(j.DatePicker,{onChange:function(t){return y(e,t&&t.toString())},value:n&&new Date(n)}))),"Boolean"===e.data_type&&(t=o().createElement(i.Form.Checkbox,{checked:!!n,error:p(e),label:e.column_name,onChange:function(t,r){var n=r.checked;return y(e,n)}})),"RichText"===e.data_type&&(t=o().createElement(i.Form.Input,{error:p(e),label:e.column_name,required:e.required},o().createElement(r.RichTextArea,{onChange:function(t){return y(e,t)},value:n}))),t}),[s,p,y]);return(0,n.useEffect)((function(){var t={defineable_id:e.defineableId,defineable_type:e.defineableType};r.UserDefinedFieldsService.fetchAll(t).then((function(e){var t=e.data;return f(t.user_defined_fields)}))}),[]),o().createElement(o().Fragment,null,u().map(c,m.bind(void 0)))},q=function(){return o().createElement(j.ListTable,{actions:[{name:"edit"},{name:"delete"}],columns:[{name:"table_name",label:d.t("UserDefinedFieldsList.columns.table")},{name:"column_name",label:d.t("UserDefinedFieldsList.columns.name")},{name:"data_type",label:d.t("UserDefinedFieldsList.columns.dataType")},{name:"required",label:d.t("UserDefinedFieldsList.columns.required"),render:function(e){return o().createElement(j.BooleanIcon,{value:e.required})}}],collectionName:"user_defined_fields",modal:{component:E},onLoad:function(e){return r.UserDefinedFieldsService.fetchAll(e)},onSave:function(e){return r.UserDefinedFieldsService.save(e)},onDelete:function(e){return r.UserDefinedFieldsService.delete(e)}})};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 A(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function R(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 I(e,t){return I=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e},I(e,t)}function x(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 M(e){return M=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)},M(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&&I(e,t)}(a,e);var t,r,n,o,i=(n=a,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=M(n);if(o){var r=M(this).constructor;e=Reflect.construct(t,arguments,r)}else e=t.apply(this,arguments);return x(this,e)});function a(){return A(this,a),i.apply(this,arguments)}return t=a,(r=[{key:"getPayloadKeys",value:function(){return["table_name","column_name","data_type","required","allow_multiple","options"]}},{key:"getParameterName",value:function(){return"user_defined_field"}}])&&R(t.prototype,r),Object.defineProperty(t,"prototype",{writable:!1}),a}(r.BaseTransform),B=new L;function N(e){return N="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},N(e)}function V(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function J(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 $(e,t){return $=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e},$(e,t)}function K(e,t){if(t&&("object"===N(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 z(e){return z=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)},z(e)}var G=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)}(a,e);var t,r,n,o,i=(n=a,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=z(n);if(o){var r=z(this).constructor;e=Reflect.construct(t,arguments,r)}else e=t.apply(this,arguments);return K(this,e)});function a(){return V(this,a),i.apply(this,arguments)}return t=a,(r=[{key:"fetchDataTypes",value:function(){return this.getAxios().get("/user_defined_fields/data_types")}},{key:"fetchTables",value:function(){return this.getAxios().get("/user_defined_fields/tables")}},{key:"getBaseUrl",value:function(){return"/user_defined_fields/user_defined_fields"}},{key:"getTransform",value:function(){return B}}])&&J(t.prototype,r),Object.defineProperty(t,"prototype",{writable:!1}),a}(r.BaseService),H=new G;function Q(e){return Q="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},Q(e)}function W(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function X(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 Y(){return Y="undefined"!=typeof Reflect&&Reflect.get?Reflect.get:function(e,t,r){var n=Z(e,t);if(n){var o=Object.getOwnPropertyDescriptor(n,t);return o.get?o.get.call(arguments.length<3?e:r):o.value}},Y.apply(this,arguments)}function Z(e,t){for(;!Object.prototype.hasOwnProperty.call(e,t)&&null!==(e=re(e)););return e}function ee(e,t){return ee=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e},ee(e,t)}function te(e,t){if(t&&("object"===Q(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 re(e){return re=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)},re(e)}var ne=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&&ee(e,t)}(a,e);var t,r,n,o,i=(n=a,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=re(n);if(o){var r=re(this).constructor;e=Reflect.construct(t,arguments,r)}else e=t.apply(this,arguments);return te(this,e)});function a(){return W(this,a),i.apply(this,arguments)}return t=a,r=[{key:"getPayloadKeys",value:function(){return["id","table_name","column_name","data_type","required","allow_multiple","options","_destroy"]}},{key:"toFormData",value:function(e,t,r){var n=arguments.length>3&&void 0!==arguments[3]?arguments[3]:"user_defined_fields";return Y(re(a.prototype),"toFormData",this).call(this,e,t,r,n)}},{key:"toPayload",value:function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"user_defined_fields";return Y(re(a.prototype),"toPayload",this).call(this,e,t)}}],r&&X(t.prototype,r),Object.defineProperty(t,"prototype",{writable:!1}),a}(r.NestedAttributesTransform),oe=new ne;function ie(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 ae="user_defined",ue={resolveError:function(e){var t=e.key,r=e.error;if(t!==ae||u().isEmpty(r))return{};var n,o,i=(o=2,function(e){if(Array.isArray(e))return e}(n=r)||function(e,t){var r=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=r){var n,o,i=[],a=!0,u=!1;try{for(r=r.call(e);!(a=(n=r.next()).done)&&(i.push(n.value),!t||i.length!==t);a=!0);}catch(e){u=!0,o=e}finally{try{a||null==r.return||r.return()}finally{if(u)throw o}}return i}}(n,o)||function(e,t){if(e){if("string"==typeof e)return ie(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)?ie(e,t):void 0}}(n,o)||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.")}()),a=i[0],l=i[1];return function(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}({},"".concat(ae,"[").concat(a,"]"),l)},resolveValue:function(e,t){var r={};return u().isString(e.user_defined)&&(r=JSON.parse(e.user_defined||"{}")),r[t]}};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/user-defined-fields/webpack/bootstrap","webpack://@performant-software/user-defined-fields/webpack/runtime/compat get default export","webpack://@performant-software/user-defined-fields/webpack/runtime/define property getters","webpack://@performant-software/user-defined-fields/webpack/runtime/hasOwnProperty shorthand","webpack://@performant-software/user-defined-fields/webpack/runtime/make namespace object","webpack://@performant-software/user-defined-fields/external commonjs \"@performant-software/shared-components\"","webpack://@performant-software/user-defined-fields/external commonjs2 \"react\"","webpack://@performant-software/user-defined-fields/external commonjs \"semantic-ui-react\"","webpack://@performant-software/user-defined-fields/external commonjs \"underscore\"","webpack://@performant-software/user-defined-fields/external commonjs \"i18next\"","webpack://@performant-software/user-defined-fields/./src/i18n/i18n.js","webpack://@performant-software/user-defined-fields/./src/components/UserDefinedFieldOptions.js","webpack://@performant-software/user-defined-fields/./src/components/UserDefinedFieldModal.js","webpack://@performant-software/user-defined-fields/external commonjs \"@performant-software/semantic-components\"","webpack://@performant-software/user-defined-fields/./src/components/UserDefinedFieldsEmbeddedList.js","webpack://@performant-software/user-defined-fields/./src/components/UserDefinedFieldsForm.js","webpack://@performant-software/user-defined-fields/./src/components/UserDefinedFieldsList.js","webpack://@performant-software/user-defined-fields/./src/transforms/UserDefinedField.js","webpack://@performant-software/user-defined-fields/./src/services/UserDefinedFields.js","webpack://@performant-software/user-defined-fields/./src/transforms/UserDefinedFields.js","webpack://@performant-software/user-defined-fields/./src/utils/UserDefinedFields.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\");","var __WEBPACK_NAMESPACE_OBJECT__ = require(\"i18next\");","import 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, {\n  useCallback,\n  useEffect,\n  useState,\n  type ComponentType\n} from 'react';\nimport { Button, Input, Label } from 'semantic-ui-react';\nimport _ from 'underscore';\nimport './UserDefinedFieldOptions.css';\n\ntype Props = {\n  options: Array<string>,\n  onChange: (options: Array<string>) => void\n};\n\nconst UserDefinedFieldOptions: ComponentType<any> = (props: Props) => {\n  const [options, setOptions] = useState(_.map(props.options, (option) => ({ value: option })));\n\n  /**\n   * Adds a new option to the list.\n   *\n   * @type {(function(): void)|*}\n   */\n  const onAddOption = useCallback(() => {\n    setOptions((prevOptions) => [...prevOptions, { new: true }]);\n  }, []);\n\n  /**\n   * Deletes the option at the passed index from the list.\n   *\n   * @type {(function(*): void)|*}\n   */\n  const onDeleteOption = useCallback((findIndex) => {\n    setOptions((prevOptions) => _.filter(prevOptions, (option, index) => index !== findIndex));\n  }, []);\n\n  /**\n   * Removes the \"new\" indicator from the option at the passed index.\n   *\n   * @type {(function(*): void)|*}\n   */\n  const onSaveOption = useCallback((findIndex) => {\n    setOptions((prevOptions) => _.map(\n      prevOptions,\n      (option, index) => (findIndex !== index ? option : ({ ...option, new: false }))\n    ));\n  }, [options]);\n\n  /**\n   * Updates the value of the option at the passed index.\n   *\n   * @type {(function(*, *, {value: *}): void)|*}\n   */\n  const onUpdateOption = useCallback((findIndex, e, { value }) => {\n    setOptions((prevOptions) => _.map(\n      prevOptions,\n      (option, index) => (index !== findIndex ? option : ({ ...option, value }))\n    ));\n  }, []);\n\n  /**\n   * Calls the onChange prop when the list of options changes.\n   */\n  useEffect(() => {\n    const savedOptions = _.filter(options, (option) => !option.new);\n    props.onChange(_.pluck(savedOptions, 'value'));\n  }, [options]);\n\n  return (\n    <div\n      className='user-defined-field-options'\n    >\n      <Button\n        basic\n        icon='plus'\n        onClick={onAddOption}\n        type='button'\n      />\n      { _.map(options, (option, index) => (\n        <>\n          { option.new && (\n            <Label>\n              <Input\n                autoFocus\n                onChange={onUpdateOption.bind(this, index)}\n                value={option.value}\n              />\n              <Button\n                basic\n                color='green'\n                icon='checkmark'\n                onClick={onSaveOption.bind(this, index)}\n                type='button'\n                size='tiny'\n              />\n            </Label>\n          )}\n          { !option.new && (\n            <Label\n              content={option.value}\n              onRemove={onDeleteOption.bind(this, index)}\n            />\n          )}\n        </>\n      ))}\n    </div>\n  );\n};\n\nexport default UserDefinedFieldOptions;\n","// @flow\n\nimport { UserDefinedFieldsService } from '@performant-software/shared-components';\nimport React, {\n  useCallback,\n  useEffect,\n  useState,\n  type ComponentType\n} from 'react';\nimport { Form, Modal } from 'semantic-ui-react';\nimport _ from 'underscore';\nimport i18n from '../i18n/i18n';\nimport UserDefinedFieldOptions from './UserDefinedFieldOptions';\n\nconst DataTypes = {\n  select: 'Select'\n};\n\nconst UserDefinedFieldModal: ComponentType<any> = (props) => {\n  const [dataTypeOptions, setDataTypeOptions] = useState([]);\n  const [tableOptions, setTableOptions] = useState([]);\n\n  /**\n   * Transforms the passed array of items into a Semantic UI option object.\n   *\n   * @type {function(*): *}\n   */\n  const transformOptions = useCallback((items) => (\n    _.map(items, (item) => ({ key: item, value: item, text: item }))\n  ), []);\n\n  /**\n   * Fetch the available tables and data types.\n   */\n  useEffect(() => {\n    UserDefinedFieldsService\n      .fetchTables()\n      .then(({ data }) => setTableOptions(transformOptions(data.tables)));\n\n    UserDefinedFieldsService\n      .fetchDataTypes()\n      .then(({ data }) => setDataTypeOptions(transformOptions(data.data_types)));\n  }, []);\n\n  return (\n    <Modal\n      as={Form}\n      centered={false}\n      open\n    >\n      <Modal.Header\n        content={props.item.id\n          ? i18n.t('UserDefinedFieldModal.title.edit')\n          : i18n.t('UserDefinedFieldModal.title.add')}\n      />\n      <Modal.Content>\n        <Form.Dropdown\n          clearable\n          error={props.isError('table_name')}\n          label={i18n.t('UserDefinedFieldModal.labels.table')}\n          onChange={props.onTextInputChange.bind(this, 'table_name')}\n          options={tableOptions}\n          required={props.isRequired('table_name')}\n          selection\n          selectOnBlur={false}\n          value={props.item.table_name || ''}\n        />\n        <Form.Input\n          error={props.isError('column_name')}\n          label={i18n.t('UserDefinedFieldModal.labels.name')}\n          onChange={props.onTextInputChange.bind(this, 'column_name')}\n          required={props.isRequired('column_name')}\n          value={props.item.column_name || ''}\n        />\n        <Form.Dropdown\n          clearable\n          error={props.isError('data_type')}\n          label={i18n.t('UserDefinedFieldModal.labels.dataType')}\n          onChange={props.onTextInputChange.bind(this, 'data_type')}\n          options={dataTypeOptions}\n          required={props.isRequired('data_type')}\n          selection\n          selectOnBlur={false}\n          value={props.item.data_type || ''}\n        />\n        <Form.Group>\n          <Form.Checkbox\n            error={props.isError('required')}\n            checked={props.item.required}\n            label={i18n.t('UserDefinedFieldModal.labels.required')}\n            onChange={props.onCheckboxInputChange.bind(this, 'required')}\n          />\n          { props.item.data_type === DataTypes.select && (\n            <Form.Checkbox\n              error={props.isError('allow_multiple')}\n              checked={props.item.allow_multiple}\n              label={i18n.t('UserDefinedFieldModal.labels.allowMultiple')}\n              onChange={props.onCheckboxInputChange.bind(this, 'allow_multiple')}\n            />\n          )}\n        </Form.Group>\n        { props.item.data_type === DataTypes.select && (\n          <UserDefinedFieldOptions\n            options={props.item.options}\n            onChange={(options) => props.onSetState({ options })}\n          />\n        )}\n      </Modal.Content>\n      { props.children }\n    </Modal>\n  );\n};\n\nexport default UserDefinedFieldModal;\n","var __WEBPACK_NAMESPACE_OBJECT__ = require(\"@performant-software/semantic-components\");","// @flow\n\nimport { BooleanIcon, EmbeddedList } from '@performant-software/semantic-components';\nimport React from 'react';\nimport i18n from '../i18n/i18n';\nimport UserDefinedFieldModal from './UserDefinedFieldModal';\n\ntype Props = {\n  items: Array<any>,\n  onDelete: (item: any) => Promise<any>,\n  onSave: (item: any) => Promise<any>\n};\n\nconst UserDefinedFieldsEmbeddedList = (props: Props) => (\n  <EmbeddedList\n    actions={[{\n      name: 'edit'\n    }, {\n      name: 'delete'\n    }]}\n    columns={[{\n      name: 'table_name',\n      label: i18n.t('UserDefinedFieldsEmbeddedList.columns.table')\n    }, {\n      name: 'column_name',\n      label: i18n.t('UserDefinedFieldsEmbeddedList.columns.name')\n    }, {\n      name: 'data_type',\n      label: i18n.t('UserDefinedFieldsEmbeddedList.columns.dataType')\n    }, {\n      name: 'required',\n      label: i18n.t('UserDefinedFieldsEmbeddedList.columns.required'),\n      render: (udf) => <BooleanIcon value={udf.required} />\n    }]}\n    items={props.items}\n    modal={{\n      component: UserDefinedFieldModal\n    }}\n    onDelete={props.onDelete}\n    onSave={props.onSave}\n  />\n);\n\nexport default UserDefinedFieldsEmbeddedList;\n","// @flow\n\nimport { DatePicker } from '@performant-software/semantic-components';\nimport { RichTextArea, UserDefinedFieldsService } from '@performant-software/shared-components';\nimport React, {\n  useCallback,\n  useEffect,\n  useMemo,\n  useState,\n  type ComponentType\n} from 'react';\nimport { Form } from 'semantic-ui-react';\nimport _ from 'underscore';\n\ntype Props = {\n  defineableId?: number,\n  defineableType?: string,\n  isError: (key: string) => boolean,\n  item: any,\n  onChange: (obj: any) => void,\n  onClearValidationError: (...keys: Array<string>) => void\n};\n\nconst DataTypes = {\n  boolean: 'Boolean',\n  date: 'Date',\n  number: 'Number',\n  richText: 'RichText',\n  select: 'Select',\n  string: 'String',\n  text: 'Text'\n};\n\nconst UserDefinedFieldsForm: ComponentType<any> = (props: Props) => {\n  const [fields, setFields] = useState([]);\n\n  /**\n   * Sets the parsed value by parsing the JSON stored in the \"user_defined\" prop of the item.\n   *\n   * @type {unknown}\n   */\n  const parsedValue = useMemo(() => {\n    let value = {};\n\n    if (_.isString(props.item.user_defined)) {\n      value = JSON.parse(props.item.user_defined);\n    }\n\n    return value;\n  }, [props.item.user_defined]);\n\n  /**\n   * Returns the key for the passed field.\n   *\n   * @type {function(*): string}\n   */\n  const getFieldKey = useCallback((field) => `user_defined[${field.column_name}]`, []);\n\n  /**\n   * Returns true if an error exists on the state for the passed field.\n   *\n   * @type {function(*): *}\n   */\n  const isError = useCallback((field) => props.isError(getFieldKey(field)), [getFieldKey, props.isError]);\n\n  /**\n   * Changes the value for the passed item.\n   *\n   * @type {(function(*, *): void)|*}\n   */\n  const onChange = useCallback((field, value) => {\n    props.onChange(JSON.stringify({ ...parsedValue, [field.column_name]: value }));\n\n    // Clear the validation error if one exists\n    if (props.onClearValidationError) {\n      props.onClearValidationError(getFieldKey(field));\n    }\n  }, [getFieldKey, parsedValue, props.onChange, props.onClearValidationError]);\n\n  /**\n   * Renders the passed item.\n   *\n   * @type {function(*): *}\n   */\n  const renderItem = useCallback((field) => {\n    let rendered;\n\n    const fieldValue = parsedValue && parsedValue[field.column_name];\n\n    if (field.data_type === DataTypes.string) {\n      rendered = (\n        <Form.Input\n          error={isError(field)}\n          label={field.column_name}\n          required={field.required}\n          onChange={(e, { value }) => onChange(field, value)}\n          value={fieldValue}\n        />\n      );\n    }\n\n    if (field.data_type === DataTypes.number) {\n      rendered = (\n        <Form.Input\n          error={isError(field)}\n          label={field.column_name}\n          required={field.required}\n          onChange={(e, { value }) => onChange(field, value)}\n          value={fieldValue}\n          type='number'\n        />\n      );\n    }\n\n    if (field.data_type === DataTypes.select) {\n      rendered = (\n        <Form.Dropdown\n          clearable\n          error={isError(field)}\n          label={field.column_name}\n          multiple={field.allow_multiple}\n          required={field.required}\n          options={_.map(field.options, (option) => ({ key: option, value: option, text: option }))}\n          onChange={(e, { value }) => onChange(field, value)}\n          selectOnBlur={false}\n          selection\n          value={fieldValue}\n        />\n      );\n    }\n\n    if (field.data_type === DataTypes.text) {\n      rendered = (\n        <Form.TextArea\n          error={isError(field)}\n          label={field.column_name}\n          required={field.required}\n          onChange={(e, { value }) => onChange(field, value)}\n          value={fieldValue}\n        />\n      );\n    }\n\n    if (field.data_type === DataTypes.date) {\n      rendered = (\n        <Form.Input\n          error={isError(field)}\n          label={field.column_name}\n          required={field.required}\n        >\n          <DatePicker\n            onChange={(date) => onChange(field, date && date.toString())}\n            value={fieldValue && new Date(fieldValue)}\n          />\n        </Form.Input>\n      );\n    }\n\n    if (field.data_type === DataTypes.boolean) {\n      rendered = (\n        <Form.Checkbox\n          checked={!!fieldValue}\n          error={isError(field)}\n          label={field.column_name}\n          onChange={(e, { checked }) => onChange(field, checked)}\n        />\n      );\n    }\n\n    if (field.data_type === DataTypes.richText) {\n      rendered = (\n        <Form.Input\n          error={isError(field)}\n          label={field.column_name}\n          required={field.required}\n        >\n          <RichTextArea\n            onChange={(value) => onChange(field, value)}\n            value={fieldValue}\n          />\n        </Form.Input>\n      );\n    }\n\n    return rendered;\n  }, [parsedValue, isError, onChange]);\n\n  /**\n   * Fetches the user defined fields when the component mounts.\n   */\n  useEffect(() => {\n    const params = {\n      defineable_id: props.defineableId,\n      defineable_type: props.defineableType\n    };\n\n    UserDefinedFieldsService\n      .fetchAll(params)\n      .then(({ data }) => setFields(data.user_defined_fields));\n  }, []);\n\n  return (\n    <>\n      { _.map(fields, renderItem.bind(this)) }\n    </>\n  );\n};\n\nexport default UserDefinedFieldsForm;\n","// @flow\n\nimport { BooleanIcon, ListTable } from '@performant-software/semantic-components';\nimport { UserDefinedFieldsService } from '@performant-software/shared-components';\nimport React, { type ComponentType } from 'react';\nimport i18n from '../i18n/i18n';\nimport UserDefinedFieldModal from './UserDefinedFieldModal';\n\nconst UserDefinedFieldsList: ComponentType<any> = () => (\n  <ListTable\n    actions={[{\n      name: 'edit'\n    }, {\n      name: 'delete'\n    }]}\n    columns={[{\n      name: 'table_name',\n      label: i18n.t('UserDefinedFieldsList.columns.table')\n    }, {\n      name: 'column_name',\n      label: i18n.t('UserDefinedFieldsList.columns.name')\n    }, {\n      name: 'data_type',\n      label: i18n.t('UserDefinedFieldsList.columns.dataType')\n    }, {\n      name: 'required',\n      label: i18n.t('UserDefinedFieldsList.columns.required'),\n      render: (udf) => <BooleanIcon value={udf.required} />\n    }]}\n    collectionName='user_defined_fields'\n    modal={{\n      component: UserDefinedFieldModal\n    }}\n    onLoad={(params) => UserDefinedFieldsService.fetchAll(params)}\n    onSave={(udf) => UserDefinedFieldsService.save(udf)}\n    onDelete={(udf) => UserDefinedFieldsService.delete(udf)}\n  />\n);\n\nexport default UserDefinedFieldsList;\n","// @flow\n\nimport { BaseTransform } from '@performant-software/shared-components';\n\n/**\n * Class for transforming user defined field objects for PUT/POST requests.\n */\nclass UserDefinedField extends BaseTransform {\n  /**\n   * Returns the user defined field payload keys.\n   *\n   * @returns {string[]}\n   */\n  getPayloadKeys(): Array<string> {\n    return [\n      'table_name',\n      'column_name',\n      'data_type',\n      'required',\n      'allow_multiple',\n      'options'\n    ];\n  }\n\n  /**\n   * Returns the user defined field parameter name.\n   *\n   * @returns {string}\n   */\n  getParameterName(): string {\n    return 'user_defined_field';\n  }\n}\n\nconst UserDefinedFieldTransform: UserDefinedField = new UserDefinedField();\nexport default UserDefinedFieldTransform;\n","// @flow\n\nimport { BaseService } from '@performant-software/shared-components';\nimport UserDefinedField from '../transforms/UserDefinedField';\n\n/**\n * Class responsible for handling all user defined field API requests.\n */\nclass UserDefinedFields extends BaseService {\n  /**\n   * Calls the /api/user_defined_fields/data_types API endpoint.\n   *\n   * @returns {Promise<AxiosResponse<any>>}\n   */\n  fetchDataTypes(): Promise<any> {\n    return this.getAxios().get('/user_defined_fields/data_types');\n  }\n\n  /**\n   * Calls the /api/user_defined_fields/tables API endpoint.\n   *\n   * @returns {Promise<AxiosResponse<any>>}\n   */\n  fetchTables(): Promise<any> {\n    return this.getAxios().get('/user_defined_fields/tables');\n  }\n\n  /**\n   * Returns the user defined fields base URL.\n   *\n   * @returns {string}\n   */\n  getBaseUrl(): string {\n    return '/user_defined_fields/user_defined_fields';\n  }\n\n  /**\n   * Returns the user defined fields transform object.\n   *\n   * @returns {UserDefinedField}\n   */\n  getTransform(): any {\n    return UserDefinedField;\n  }\n}\n\nconst UserDefinedFieldsService: UserDefinedFields = new UserDefinedFields();\nexport default UserDefinedFieldsService;\n","// @flow\n\nimport { NestedAttributesTransform } from '@performant-software/shared-components';\n\n/**\n * Class for transforming user defined field nested objects for PUT/POST requests.\n */\nclass UserDefinedFields extends NestedAttributesTransform {\n  /**\n   * Returns the user defined field payload keys.\n   *\n   * @returns {string[]}\n   */\n  getPayloadKeys(): Array<string> {\n    return [\n      'id',\n      'table_name',\n      'column_name',\n      'data_type',\n      'required',\n      'allow_multiple',\n      'options',\n      '_destroy'\n    ];\n  }\n\n  /**\n   * Converts the user defined field collection for the passed object to form data to be sent on\n   * the request as nested attributes.\n   *\n   * @param formData\n   * @param prefix\n   * @param record\n   * @param collection\n   */\n  toFormData(formData: FormData, prefix: string, record: any, collection: string = 'user_defined_fields'): void {\n    return super.toFormData(formData, prefix, record, collection);\n  }\n\n  /**\n   * Converts the user defined field collection for the passed object to JSON to be sent on\n   * the request as nested attributes.\n   *\n   * @param record\n   * @param collectionName\n   *\n   * @returns {{[p: string]: *}}\n   */\n  toPayload(record: any, collectionName: string = 'user_defined_fields'): any {\n    return super.toPayload(record, collectionName);\n  }\n}\n\nconst UserDefinedFieldsTransform: UserDefinedFields = new UserDefinedFields();\nexport default UserDefinedFieldsTransform;\n","// @flow\n\nimport _ from 'underscore';\n\ntype Item = {\n  user_defined: ?string\n};\n\ntype ErrorProps = {\n  key: string,\n  error: Array<string>\n};\n\ntype ErrorReturn = {\n  [key: string]: string\n};\n\nconst KEY_USER_DEFINED = 'user_defined';\n\n/**\n * Returns the error for the passed user defined field.\n *\n * @param key\n * @param error\n *\n * @returns {{}|{[p: string]: *}}\n */\nconst resolveError = ({ key, error }: ErrorProps): ErrorReturn => {\n  if (key !== KEY_USER_DEFINED || _.isEmpty(error)) {\n    return {};\n  }\n\n  const [field, message] = error;\n\n  return {\n    [`${KEY_USER_DEFINED}[${field}]`]: message\n  };\n};\n\n/**\n * Returns the value for the user defined field at the passed key for the passed item.\n *\n * @param item\n * @param key\n *\n * @returns {*}\n */\nconst resolveValue = (item: Item, key: string): string => {\n  let userDefined = {};\n\n  if (_.isString(item.user_defined)) {\n    userDefined = JSON.parse(item.user_defined || '{}');\n  }\n\n  return userDefined[key];\n};\n\nexport default {\n  resolveError,\n  resolveValue\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","resources","en","translation","i18n","i18next","init","debug","fallbackLng","lng","interpolation","escapeValue","props","useState","_","options","option","setOptions","onAddOption","useCallback","prevOptions","new","onDeleteOption","findIndex","index","onSaveOption","onUpdateOption","e","useEffect","savedOptions","onChange","className","Button","basic","icon","onClick","type","Label","Input","autoFocus","bind","color","size","content","onRemove","DataTypes","dataTypeOptions","setDataTypeOptions","tableOptions","setTableOptions","transformOptions","items","item","text","UserDefinedFieldsService","then","data","tables","data_types","Modal","as","Form","centered","open","id","clearable","error","isError","label","onTextInputChange","required","isRequired","selection","selectOnBlur","table_name","column_name","data_type","checked","onCheckboxInputChange","allow_multiple","onSetState","children","EmbeddedList","actions","name","columns","render","udf","BooleanIcon","modal","component","UserDefinedFieldModal","onDelete","onSave","fields","setFields","parsedValue","useMemo","user_defined","JSON","parse","getFieldKey","field","stringify","onClearValidationError","renderItem","rendered","fieldValue","multiple","DatePicker","date","toString","Date","RichTextArea","params","defineable_id","defineableId","defineable_type","defineableType","user_defined_fields","ListTable","collectionName","onLoad","UserDefinedField","BaseTransform","UserDefinedFields","this","getAxios","BaseService","formData","prefix","record","collection","NestedAttributesTransform","KEY_USER_DEFINED","resolveError","message","resolveValue","userDefined"],"sourceRoot":""}

package/build/main.css

@@ -0,0 +1,5 @@
+.user-defined-field-options .label .input {
+  margin-right: 0.5em;
+  width: unset;
+}
+

package/index.js

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

package/package.json

@@ -0,0 +1,27 @@
+{
+  "name": "@performant-software/user-defined-fields",
+  "version": "0.6.2-beta.3",
+  "description": "A package of components used for allowing end users to define fields on models. Use with the \"user_defined_fields\" gem.",
+  "license": "MIT",
+  "main": "./build/index.js",
+  "style": "./build/main.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.1",
+    "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/UserDefinedFieldModal.js

@@ -0,0 +1,114 @@
+// @flow
+
+import { UserDefinedFieldsService } from '@performant-software/shared-components';
+import React, {
+  useCallback,
+  useEffect,
+  useState,
+  type ComponentType
+} from 'react';
+import { Form, Modal } from 'semantic-ui-react';
+import _ from 'underscore';
+import i18n from '../i18n/i18n';
+import UserDefinedFieldOptions from './UserDefinedFieldOptions';
+
+const DataTypes = {
+  select: 'Select'
+};
+
+const UserDefinedFieldModal: ComponentType<any> = (props) => {
+  const [dataTypeOptions, setDataTypeOptions] = useState([]);
+  const [tableOptions, setTableOptions] = useState([]);
+
+  /**
+   * Transforms the passed array of items into a Semantic UI option object.
+   *
+   * @type {function(*): *}
+   */
+  const transformOptions = useCallback((items) => (
+    _.map(items, (item) => ({ key: item, value: item, text: item }))
+  ), []);
+
+  /**
+   * Fetch the available tables and data types.
+   */
+  useEffect(() => {
+    UserDefinedFieldsService
+      .fetchTables()
+      .then(({ data }) => setTableOptions(transformOptions(data.tables)));
+
+    UserDefinedFieldsService
+      .fetchDataTypes()
+      .then(({ data }) => setDataTypeOptions(transformOptions(data.data_types)));
+  }, []);
+
+  return (
+    <Modal
+      as={Form}
+      centered={false}
+      open
+    >
+      <Modal.Header
+        content={props.item.id
+          ? i18n.t('UserDefinedFieldModal.title.edit')
+          : i18n.t('UserDefinedFieldModal.title.add')}
+      />
+      <Modal.Content>
+        <Form.Dropdown
+          clearable
+          error={props.isError('table_name')}
+          label={i18n.t('UserDefinedFieldModal.labels.table')}
+          onChange={props.onTextInputChange.bind(this, 'table_name')}
+          options={tableOptions}
+          required={props.isRequired('table_name')}
+          selection
+          selectOnBlur={false}
+          value={props.item.table_name || ''}
+        />
+        <Form.Input
+          error={props.isError('column_name')}
+          label={i18n.t('UserDefinedFieldModal.labels.name')}
+          onChange={props.onTextInputChange.bind(this, 'column_name')}
+          required={props.isRequired('column_name')}
+          value={props.item.column_name || ''}
+        />
+        <Form.Dropdown
+          clearable
+          error={props.isError('data_type')}
+          label={i18n.t('UserDefinedFieldModal.labels.dataType')}
+          onChange={props.onTextInputChange.bind(this, 'data_type')}
+          options={dataTypeOptions}
+          required={props.isRequired('data_type')}
+          selection
+          selectOnBlur={false}
+          value={props.item.data_type || ''}
+        />
+        <Form.Group>
+          <Form.Checkbox
+            error={props.isError('required')}
+            checked={props.item.required}
+            label={i18n.t('UserDefinedFieldModal.labels.required')}
+            onChange={props.onCheckboxInputChange.bind(this, 'required')}
+          />
+          { props.item.data_type === DataTypes.select && (
+            <Form.Checkbox
+              error={props.isError('allow_multiple')}
+              checked={props.item.allow_multiple}
+              label={i18n.t('UserDefinedFieldModal.labels.allowMultiple')}
+              onChange={props.onCheckboxInputChange.bind(this, 'allow_multiple')}
+            />
+          )}
+        </Form.Group>
+        { props.item.data_type === DataTypes.select && (
+          <UserDefinedFieldOptions
+            options={props.item.options}
+            onChange={(options) => props.onSetState({ options })}
+          />
+        )}
+      </Modal.Content>
+      { props.children }
+    </Modal>
+  );
+};
+
+export default UserDefinedFieldModal;

package/src/components/UserDefinedFieldOptions.css

@@ -0,0 +1,4 @@
+.user-defined-field-options .label .input {
+  margin-right: 0.5em;
+  width: unset;
+}

package/src/components/UserDefinedFieldOptions.js

@@ -0,0 +1,112 @@
+// @flow
+
+import React, {
+  useCallback,
+  useEffect,
+  useState,
+  type ComponentType
+} from 'react';
+import { Button, Input, Label } from 'semantic-ui-react';
+import _ from 'underscore';
+import './UserDefinedFieldOptions.css';
+
+type Props = {
+  options: Array<string>,
+  onChange: (options: Array<string>) => void
+};
+
+const UserDefinedFieldOptions: ComponentType<any> = (props: Props) => {
+  const [options, setOptions] = useState(_.map(props.options, (option) => ({ value: option })));
+
+  /**
+   * Adds a new option to the list.
+   *
+   * @type {(function(): void)|*}
+   */
+  const onAddOption = useCallback(() => {
+    setOptions((prevOptions) => [...prevOptions, { new: true }]);
+  }, []);
+
+  /**
+   * Deletes the option at the passed index from the list.
+   *
+   * @type {(function(*): void)|*}
+   */
+  const onDeleteOption = useCallback((findIndex) => {
+    setOptions((prevOptions) => _.filter(prevOptions, (option, index) => index !== findIndex));
+  }, []);
+
+  /**
+   * Removes the "new" indicator from the option at the passed index.
+   *
+   * @type {(function(*): void)|*}
+   */
+  const onSaveOption = useCallback((findIndex) => {
+    setOptions((prevOptions) => _.map(
+      prevOptions,
+      (option, index) => (findIndex !== index ? option : ({ ...option, new: false }))
+    ));
+  }, [options]);
+
+  /**
+   * Updates the value of the option at the passed index.
+   *
+   * @type {(function(*, *, {value: *}): void)|*}
+   */
+  const onUpdateOption = useCallback((findIndex, e, { value }) => {
+    setOptions((prevOptions) => _.map(
+      prevOptions,
+      (option, index) => (index !== findIndex ? option : ({ ...option, value }))
+    ));
+  }, []);
+
+  /**
+   * Calls the onChange prop when the list of options changes.
+   */
+  useEffect(() => {
+    const savedOptions = _.filter(options, (option) => !option.new);
+    props.onChange(_.pluck(savedOptions, 'value'));
+  }, [options]);
+
+  return (
+    <div
+      className='user-defined-field-options'
+    >
+      <Button
+        basic
+        icon='plus'
+        onClick={onAddOption}
+        type='button'
+      />
+      { _.map(options, (option, index) => (
+        <>
+          { option.new && (
+            <Label>
+              <Input
+                autoFocus
+                onChange={onUpdateOption.bind(this, index)}
+                value={option.value}
+              />
+              <Button
+                basic
+                color='green'
+                icon='checkmark'
+                onClick={onSaveOption.bind(this, index)}
+                type='button'
+                size='tiny'
+              />
+            </Label>
+          )}
+          { !option.new && (
+            <Label
+              content={option.value}
+              onRemove={onDeleteOption.bind(this, index)}
+            />
+          )}
+        </>
+      ))}
+    </div>
+  );
+};
+
+export default UserDefinedFieldOptions;

package/src/components/UserDefinedFieldsEmbeddedList.js

@@ -0,0 +1,44 @@
+// @flow
+
+import { BooleanIcon, EmbeddedList } from '@performant-software/semantic-components';
+import React from 'react';
+import i18n from '../i18n/i18n';
+import UserDefinedFieldModal from './UserDefinedFieldModal';
+
+type Props = {
+  items: Array<any>,
+  onDelete: (item: any) => Promise<any>,
+  onSave: (item: any) => Promise<any>
+};
+
+const UserDefinedFieldsEmbeddedList = (props: Props) => (
+  <EmbeddedList
+    actions={[{
+      name: 'edit'
+    }, {
+      name: 'delete'
+    }]}
+    columns={[{
+      name: 'table_name',
+      label: i18n.t('UserDefinedFieldsEmbeddedList.columns.table')
+    }, {
+      name: 'column_name',
+      label: i18n.t('UserDefinedFieldsEmbeddedList.columns.name')
+    }, {
+      name: 'data_type',
+      label: i18n.t('UserDefinedFieldsEmbeddedList.columns.dataType')
+    }, {
+      name: 'required',
+      label: i18n.t('UserDefinedFieldsEmbeddedList.columns.required'),
+      render: (udf) => <BooleanIcon value={udf.required} />
+    }]}
+    items={props.items}
+    modal={{
+      component: UserDefinedFieldModal
+    }}
+    onDelete={props.onDelete}
+    onSave={props.onSave}
+  />
+);
+
+export default UserDefinedFieldsEmbeddedList;