UNPKG

@transact-open-ux/react

Version:

Library to integrate React with Transact Open UX

3 lines (2 loc) 9.02 kB
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@transact-open-ux/core"),require("formik"),require("react")):"function"==typeof define&&define.amd?define(["exports","@transact-open-ux/core","formik","react"],t):t((e=e||self)["transact-open-ux-react"]={},e["@transact-open-ux/core"],e.formik,e.React)}(this,function(e,t,r,a){"use strict";var n="default"in a?a.default:a;function o(e,t){var r={};for(var a in e)Object.prototype.hasOwnProperty.call(e,a)&&t.indexOf(a)<0&&(r[a]=e[a]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var n=0;for(a=Object.getOwnPropertySymbols(e);n<a.length;n++)t.indexOf(a[n])<0&&(r[a[n]]=e[a[n]])}return r}function i(e,t,r,a){return new(r||(r=Promise))(function(n,o){function i(e){try{c(a.next(e))}catch(e){o(e)}}function s(e){try{c(a.throw(e))}catch(e){o(e)}}function c(e){e.done?n(e.value):new r(function(t){t(e.value)}).then(i,s)}c((a=a.apply(e,t||[])).next())})}const s=n.createContext({}),c={error:null,formData:{},formError:null,formLoaded:!1,isLoading:!1,revisionNumber:0,saveChallengeLoading:!1,validationErrors:[]},l=(e,r)=>{switch(r.type){case"SET_LOADING":return Object.assign({},e,{isLoading:r.payload});case"SET_FORM_LOADED":return Object.assign({},e,{formLoaded:!0,saveChallengeLoading:!1});case"SET_NARRATIVE_DATA":return Object.assign({},e,{formData:t.setDataFromPath(`SFMData.NarrativeMeta.${r.payload.path}`,e.formData,r.payload.value)});case"SET_SAVE_CHALLENGE_LOADING":return Object.assign({},e,{saveChallengeLoading:r.payload});case"SET_VALIDATION_ERRORS":return Object.assign({},e,{validationErrors:r.payload});case"SET_RESPONSE_STATE":return Object.assign({},e,r.payload,{isLoading:!1});case"SET_STATE":return Object.assign({},e,r.payload);default:return e}},u=s.Consumer,d=()=>a.useContext(s),f=e=>"number"==typeof e||"boolean"==typeof e||!!e;let g={};const m=n.createContext({}),p={currentPage:null,disableBack:!1,disableSubmit:!1,index:0,navPages:[],pageMap:{},pages:[],validatePage:null},y=(e,t)=>{switch(t.type){case"SET_INDEX":return Object.assign({},e,{index:t.payload});case"SET_CURRENT_PAGE":return Object.assign({},e,{currentPage:t.payload});case"SET_STATE":return Object.assign({},e,t.payload);default:return e}},E=m.Consumer,v=()=>a.useContext(m);e.Page=(({children:e,loadingComponent:t})=>t?n.createElement(a.Suspense,{fallback:t},e):n.createElement(a.Fragment,null,e)),e.PageConsumer=E,e.PageController=(({children:e})=>{const{getCurrentPage:t,initPages:o,getFormApi:s}=v();return a.useEffect(()=>{const t=n.Children.toArray(e);o(t,function(){return i(this,void 0,void 0,function*(){const e=s();let t=!0;e.setSubmitting(!0);try{return(t=!Object.keys(yield e.validateForm()).length)?e.setTouched({}):e.setTouched(r.setNestedObjectValues(e.values,!0)),e.setSubmitting(!1),t}catch(r){return e.setSubmitting(!1),t}})})},[]),t()}),e.PageProvider=(({children:e,skipValidate:r})=>{const[o,s]=a.useReducer(y,p),{formUpdate:c,getFormApi:l,getNarrativeData:u,saveChallengeLoading:f}=d(),{navPages:g,pageMap:E,validatePage:v,tafEnabled:S}=o,h=u("CurrentPage"),b=()=>{const{index:e,pages:t}=o;return!f&&t&&t.length?t[e]:null};a.useEffect(()=>{if(h&&h!==o.currentPage&&E.hasOwnProperty(h)){const{index:e}=E[h];s({payload:e,type:"SET_INDEX"}),s({payload:h,type:"SET_CURRENT_PAGE"})}},[h]);const O=b(),T=u()||{},{DisableSubmit:P=!(!O||g.indexOf(O)===g.length-1),DisableBack:A=!(!O||0!==g.indexOf(O)),RedirectUrl:C}=T;C&&t.redirect(C);const _=Object.assign({},o,{currentPageMeta:(()=>{const e=b();if(e){const{props:{id:t,label:r,offMenu:a}}=e,n=g.indexOf(e);return{id:t,label:r,offMenu:a,stepNumber:n>=0?n+1:null}}return{offMenu:!0}})(),disableBack:A,disableSubmit:P,getCurrentPage:b,getFormApi:l,goToPage:function(e,r,a){return i(this,void 0,void 0,function*(){const n=l&&l()||{};if(r||(yield v())){"number"==typeof e&&(e-=1),t.setDataFromPath("SFMData.NarrativeMeta.CurrentPage",n.values,e);const{index:r}=E[e];s({payload:r,type:"SET_INDEX"}),a&&c(n.values)}})},initPages:(e,t)=>{const r=[],a={};e.forEach((e,t)=>{const{props:{id:n,offMenu:o}}=e;a[n||t]={index:t,page:e},o||r.push(e)}),s({payload:{navPages:r,pageMap:a,pages:e,tafEnabled:Object.keys(u()||{}).length>=2,validatePage:t},type:"SET_STATE"})},navigate:function(e="forward"){return i(this,void 0,void 0,function*(){const a=l&&l()||{};if(!r&&"back"!==e&&"function"==typeof v){const e=yield v();if(!e)return Promise.resolve(e)}if(S)t.setDataFromPath("SFMData.NarrativeMeta.Action",a.values,e);else{const{pages:r}=o;let{index:n}=o;n="forward"===e?Math.min(n+1,r.length):Math.max(n-1,0);const{props:{id:i}}=r[n];t.setDataFromPath("SFMData.NarrativeMeta.CurrentPage",a.values,i||n),s({payload:n,type:"SET_INDEX"})}return c(a.values)})}});return n.createElement(m.Provider,{value:_},e)}),e.TransactConsumer=u,e.TransactForm=(e=>{const i=a.useRef({current:null}),{render:s,children:c,validate:l,validationSchema:u,loadingComponent:m,sendEmailFormReceipt:p,submissionEmailAddress:y,submissionMilestone:E}=e,v=o(e,["render","children","validate","validationSchema","loadingComponent","sendEmailFormReceipt","submissionEmailAddress","submissionMilestone"]),{formData:S={},formLoaded:h,formStatus:b,userSubmit:O,setFormApi:T}=d(),P=e=>{const{inner:t}=e,{fields:a={},state:n={}}=i.current,{touched:o,isSubmitting:s}=n,c=[];if(e.inner=t.filter(e=>{const{path:t,value:n,message:i}=e,l=!!r.getIn(o,t);let u;const d=(u=Array.isArray(n)?a.hasOwnProperty(`${t}[0]`):n&&"object"==typeof n?Object.keys(n).every(e=>a.hasOwnProperty(`${t}.${e}`)):a.hasOwnProperty(t))&&(s||l&&(g[t]||f(n)));return d&&(g[t]||(g[t]=!0),c.push(i)),d}),c.length)throw e.errors=c,r.yupToFormErrors(e)};return a.useEffect(()=>{g={}},[]),h?n.createElement(r.Formik,Object.assign({initialValues:Object.assign({$SaveChallenge:{TrackingCode:t.getUrlQueryParam("trackingCode")}},S)},v,{validate:(u||l)&&(e=>{if(u){const{fields:t={},state:a={}}=i.current,{touched:n}=a;return Object.keys(t).forEach(t=>{r.getIn(n,t)&&f(r.getIn(e,t))&&!g[t]&&(g[t]=!0)}),u.validate(e,{abortEarly:!1}).then(()=>({})).catch(P)}return l(e)}),enableReinitialize:!0,onSubmit:e=>{"Completed"!==b&&O(e,p,y,E)},render:t=>(T&&T(t),"function"==typeof s?s(Object.assign({},e,t)):"function"==typeof c?c(Object.assign({},e,t)):null),ref:i})):m?n.createElement(m,null):null}),e.TransactProvider=(({children:e,onSaveChallengeRequired:r,formCode:o,formVersion:u,endpoint:d,trackingCode:f})=>{const[g,m]=a.useReducer(l,c);let p;function y(e){return i(this,void 0,void 0,function*(){try{m({type:"SET_LOADING",payload:!0});const t=yield e;return m({payload:t,type:"SET_RESPONSE_STATE"}),t}catch(e){return m({payload:e,type:"SET_RESPONSE_STATE"}),e}})}const E=(e,t)=>{m({payload:{path:e,value:t},type:"SET_NARRATIVE_DATA"})};function v(...e){return i(this,void 0,void 0,function*(){try{const r=yield y(t.formLoad(...e));return m({type:"SET_FORM_LOADED"}),r}catch(e){return e}})}function S(e,t,...r){return i(this,void 0,void 0,function*(){const a=yield y(e(...r));return t&&E("CurrentPage",t),a})}const h=e=>{const{validationErrors:t}=g;"string"==typeof e&&(e=[e]);const r=t.filter(({errorKey:t})=>-1===e.indexOf(t));r.length!==t.length&&m({type:"SET_VALIDATION_ERRORS",payload:r})};a.useEffect(()=>{!function(){i(this,void 0,void 0,function*(){try{d&&(o||f)&&(yield t.formNew(d,o,u,f)),t.isSaveChallengeRequired()?("function"==typeof r&&r(),m({type:"SET_FORM_LOADED"})):yield v()}catch(e){m({payload:e,type:"SET_RESPONSE_STATE"})}})}()},[]);const b=Object.assign({},g,{formError:(e,r)=>y(t.formError(e,r)),formFunction:t.formFunction,formIneligible:(e,...r)=>y(t.formIneligible(e,...r)),formInit:()=>y(t.formInit()),formLoad:v,formNew:(e,...r)=>y(t.formNew(e,...r)),formStart:(e,...r)=>y(t.formStart(e,...r)),formUpdate:(e,...r)=>y(t.formUpdate(e,...r)),getFormApi:()=>p,getInsightsProfile:()=>t.getDataFromPath("SFMData.SystemProfile.Insights",g.formData),getNarrativeData:e=>t.getDataFromPath(`SFMData.NarrativeMeta${e?"."+e:""}`,g.formData),getValidationError:e=>{const{validationErrors:t}=g,r=t.filter(({errorKey:t})=>e===t);return r.length?r[0]:void 0},resumeForm:function(e,t,r){return i(this,void 0,void 0,function*(){m({type:"SET_SAVE_CHALLENGE_LOADING",payload:!0});const a=yield v(e,t,r),{validationErrors:n,formData:o}=a;return n||"object"!=typeof o?a:(h(["stdErrs.formSaveChallengeInvalidAnswer","stdErrs.formTrackingCodeNotFound"]),Object.assign({},a,{SaveChallengeSuccess:!0}))})},setFormApi:e=>{p=e},userCancel:(e,r)=>S(t.userCancel,"CancelSuccess",e,r),userSave:(e,...r)=>S(t.userSave,"SaveSuccess",e,...r),userSubmit:(e,...r)=>S(t.userSubmit,"SubmitSuccess",e,...r)});return n.createElement(s.Provider,{value:b},e)}),e.Visibility=(({children:e,condition:t})=>n.createElement(r.FormikConsumer,null,({values:r})=>((e,t)=>{let r=!0;try{r=!!t(e)}catch(e){return r}return r})(r,t)?e:null)),e.usePageContext=v,e.useTransactContext=d,e.withTransact=(e=>t=>n.createElement(u,null,r=>n.createElement(e,Object.assign({},t,{transact:r})))),Object.defineProperty(e,"__esModule",{value:!0})}); //# sourceMappingURL=open-ux-react.min.js.map