@integry/sdk 4.5.6 → 4.5.7

package/dist/esm/index.csm.d.ts

@@ -710,7 +710,7 @@ declare class IntegryJS {
         containerId: string;
         multipurposeFieldProps: MultipurposeFieldType;
     }) => void;
-    renderFlowStep: (containerId: string, step: any, connectedAccountId: string, tagsTree?: {}) => void;
+    renderFlowStep: (containerId: string, step: any, connectedAccountId: string, tagsTree?: {}, onFieldChangeCallback?: ((fieldId: string, value: string) => void) | undefined) => void;
     verifyAuthConfig: () => Promise<{
         config_verified: boolean;
         meta: any;

package/dist/esm/index.csm.js

@@ -3052,7 +3052,7 @@ var e,t,n,i,o,s,a,l={},r=[],d=/acit|ex(?:s|g|n|p|$)|rph|grid|ows|mnc|ntw|ine[ch]
                   </div>
                 `:R`Step data could not be loaded`}
           `}
-    `}}),Fs={listboxGroupWrapper:"styles-module_listboxGroupWrapper__3Q2Xd",listbox:"styles-module_listbox__1E5tZ",customSelect:"styles-module_customSelect__3QYon",open:"styles-module_open__1-1Dc",customOptions:"styles-module_customOptions__3I04v",readonlyHint:"styles-module_readonlyHint__2HncX",disabled:"styles-module_disabled__3EKAC",customSelectTrigger:"styles-module_customSelectTrigger__3iJvU",selected:"styles-module_selected__2U-SH",arrow:"styles-module_arrow__3AlJS",close:"styles-module_close__1fyDZ",readonly:"styles-module_readonly__3h13u",isTagged:"styles-module_isTagged__3CQCR",searchInput:"styles-module_searchInput__3_5bE",noResults:"styles-module_noResults__2Y6Q9",listboxItem:"styles-module_listboxItem__1g19y",highlighted:"styles-module_highlighted__26fzM"};ue(".styles-module_listboxGroupWrapper__3Q2Xd fieldset {\n  margin: 0;\n  padding: 0;\n  border: none;\n  margin-bottom: 16px !important;\n}\n\n.styles-module_listbox__1E5tZ {\n  position: relative;\n  max-width: 100%;\n  -webkit-user-select: none;\n          user-select: none;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelect__3QYon {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  font-size: 14px;\n  font-family: inherit;\n  letter-spacing: -0.2px;\n  color: #999999;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelect__3QYon.styles-module_open__1-1Dc .styles-module_customOptions__3I04v {\n  opacity: 1;\n  visibility: visible;\n  pointer-events: auto;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelect__3QYon .styles-module_readonlyHint__2HncX {\n  width: 100%;\n  height: 100%;\n  z-index: 99;\n  position: absolute;\n}\n.styles-module_listbox__1E5tZ .styles-module_disabled__3EKAC {\n  background: #eee;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU {\n  position: relative;\n  display: flex;\n  align-items: center;\n  box-sizing: border-box;\n  height: 40px;\n  padding: 0 10px;\n  justify-content: space-between;\n  cursor: pointer;\n  font-size: 12px;\n  font-family: inherit;\n  border: 1px solid #e2e0db;\n  border-radius: 4px;\n  /*  &.searchable {\n    // cursor: text;\n  } */\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU span {\n  display: flex;\n  flex: 1;\n  align-items: center;\n  height: 100%;\n  padding-right: 10px;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU span.styles-module_selected__2U-SH {\n  color: #333333;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU:focus {\n  outline: none;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU .styles-module_arrow__3AlJS {\n  transform: rotate(0);\n  cursor: pointer;\n  transition-property: transform;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 150ms;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU .styles-module_arrow__3AlJS.styles-module_close__1fyDZ {\n  transform: rotate(180deg);\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU .styles-module_arrow__3AlJS.styles-module_readonly__3h13u {\n  cursor: auto;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU .styles-module_arrow__3AlJS.styles-module_isTagged__3CQCR {\n  margin-right: 40px;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU .styles-module_searchInput__3_5bE {\n  border: 0;\n  outline: none;\n  width: 100%;\n  color: #333;\n  font-size: 12px;\n  font-family: inherit;\n  padding: 0;\n  margin: 0;\n  height: 100%;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU .styles-module_searchInput__3_5bE::placeholder {\n  color: #999999;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU.styles-module_readonly__3h13u {\n  cursor: auto;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU button {\n  margin-bottom: -1px;\n  margin-right: -1px;\n}\n.styles-module_listbox__1E5tZ .styles-module_customOptions__3I04v {\n  position: absolute;\n  top: 100%;\n  left: 0px;\n  right: 0px;\n  z-index: 10;\n  margin-top: 10px;\n  display: block;\n  overflow: hidden;\n  background-color: #fff;\n  font-family: inherit;\n  font-size: 14px;\n  line-height: 20px;\n  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);\n  transition-property: all;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 150ms;\n  pointer-events: none;\n  visibility: hidden;\n  max-height: 132px;\n  min-height: 100%;\n  overflow-y: auto;\n  border-width: 1px;\n  border-style: solid;\n  border-color: #e2e0db;\n  opacity: 0;\n  border-radius: 4px;\n  /* Track */\n  /* Handle */\n  /* Handle on hover */\n}\n.styles-module_listbox__1E5tZ .styles-module_customOptions__3I04v::-webkit-scrollbar {\n  width: 7px;\n}\n.styles-module_listbox__1E5tZ .styles-module_customOptions__3I04v::-webkit-scrollbar-track {\n  background: transparent;\n  border-radius: 10px;\n}\n.styles-module_listbox__1E5tZ .styles-module_customOptions__3I04v::-webkit-scrollbar-thumb {\n  background: #ededed;\n  border: 1px solid #e7e7e7;\n  border-radius: 10px;\n}\n.styles-module_listbox__1E5tZ .styles-module_customOptions__3I04v::-webkit-scrollbar-thumb:hover {\n  background: rgb(116, 116, 116);\n}\n\n.styles-module_noResults__2Y6Q9 {\n  padding-top: 0.5rem;\n  padding-bottom: 0.5rem;\n  padding-left: 0.5rem;\n}\n\n.styles-module_listboxItem__1g19y {\n  position: relative;\n  display: block;\n  cursor: pointer;\n  border-width: 0px;\n  border-bottom-width: 1px;\n  border-style: solid;\n  border-color: #e2e0db;\n  transition-property: all;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 150ms;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  overflow: hidden;\n  padding: 8px 10px;\n}\n.styles-module_listboxItem__1g19y svg {\n  position: absolute;\n  height: 100%;\n  width: 12px;\n  left: 16px;\n  top: 0;\n}\n.styles-module_listboxItem__1g19y:last-child {\n  border: none;\n}\n.styles-module_listboxItem__1g19y:hover {\n  color: #333;\n  background: #ececec;\n}\n.styles-module_listboxItem__1g19y.styles-module_selected__2U-SH {\n  color: #333;\n  font-weight: 500;\n  background: #ececec;\n}\n.styles-module_listboxItem__1g19y.styles-module_highlighted__26fzM {\n  color: #333;\n  background: #ececec;\n}");const Es=e=>{const{title:t,description:n,items:i=[],value:o=null,isOpen:s=!1,isDynamic:a=!1,endpointData:l,isSearchable:r=!1,isRequired:d=!1,isHidden:p=!1,placeholder:c,onChange:u=(()=>null),showStepValidation:_=!1,responseMapper:m=(e=>e),isReadOnly:h=!1,isChanged:g=!1,tagValue:y="",taggedSelect:f=!1,skipOptionFetch:v=!1,onAddTag:x,activityOutputData:w={},type:b,appName:$,fieldId:C="dropdown-field",isConfigMode:I=!1,isMappable:L=!1,isEditable:S=!1,allowTagsInText:k=!1,labelTags:M=[],endpointUrl:A,hideTabs:D=!0,sourceFlowData:T={},sourceFlowIntegrataionInvocationUrl:F="",selectedAuthId:E="",disabled:O=!1,isMultiSelect:N=!1,dataSourceBody:W={}}=e,[z,H]=Ce(""),[P,B]=Ce(i),[V,U]=Ce(-1),[Z,j]=Ce(i),[K,q]=Ce(a&&!i.length&&!o&&""!==E),[G,J]=Ce(s),[X,Y]=Ce(""),[Q,ee]=Ce(""),[te,ne]=Ce(o),[ie,oe]=Ce(!1),[se,ae]=Ce(""),[le,re]=Ce(""),[de]=qi(),[pe]=qi(),[ce]=qi(),ue=Le(z);Qe(pe,(e=>{const t=e.target,n=document.getElementById(C)?.contains(t);Y(""),n||G&&(J(!1),U(-1),ee(""))})),Ie((()=>{ue.current=z}),[z]),Ie((()=>{o&&u&&u(o)}),[C]),Ie((()=>{if(V>-1&&G){const e=Z[V];if(e){document.querySelector(`[data-value="${e.id}"]`)?.scrollIntoView({block:"nearest",inline:"nearest"})}}}),[V,G]),Ie((()=>{y&&y!==z&&H(y)}),[y]),Ie((()=>(de&&de.current&&!0===G&&de&&de.current&&de.current?.addEventListener("keyup",he),document.addEventListener("keydown",_e),()=>{de&&de.current&&de.current.removeEventListener("keyup",he),document.removeEventListener("keydown",_e)})),[G,de,V]),Ie((()=>{let e=null;Array.isArray(P)||B([]);const t=P.find((e=>e.id===o));return G||!z||o?!G&&o&&t?H(t.value):G||!y||v||H(y):(H(""),e=setTimeout((()=>{ge(P)}),250)),()=>{e&&clearTimeout(e)}}),[G]),Ie((()=>{if(z&&r){const e=Hi.go(z,P,{keys:["value"],scoreFn:e=>{const t=e[0],n=e[1];return Math.max(t?t.score+100:-1/0,n?n.score:-1/0)}}).map((e=>e.obj));U(-1),ge(e),1===e.length&&U(0)}else G&&(U(-1),ge(P))}),[z]),Ie((()=>{const t=[{id:"1",value:"Yes"},{id:"0",value:"No"}];if(v&&a)return q(!1),j([]),B([]),H(""),void(ce.current&&(ce.current.value=""));const{apiHandler:n}=e;if(a&&F&&!O)be();else if(a&&A&&!O){let e;q(!0);try{e=JSON.parse(l)||{},E&&(e.connected_account_id=E)}catch(t){e=""}const t="object"==typeof W&&Object.keys(W).length>0?W:w;n.callDynamicDataEndpointWithTags(new URL(A),e,t).then((e=>{if(e){if(B(me(e)),e.hasOwnProperty("_cursor")&&null!==e._cursor){let t=me(e);j(t),1===t.length&&(ne(t[0].value),u(t[0].id,!0))}else ge(me(e));if(o&&r){const t=me(e).find((e=>e.id===o));H(t?t.value:""),q(!1)}else H(""),q(!1)}else oe(!0),q(!1)}))}else if(a&&A&&O)q(!1);else if(!a&&A)try{const e=JSON.parse(A);"CHECKBOX"===b&&1===e.length&&"1"===e[0].id?(ge(m(t)),B(m(t)),q(!1)):(B(m(e)),ge(m(e)),q(!1))}catch(e){console.error(e)}else"CHECKBOX"===b&&(ge(m(t)),B(m(t)),q(!1))}),[l,v,A,E]);const _e=e=>{"Tab"===e.key&&J(!1)},me=t=>{const n=e.optionKeyPath||"id",i=e.valueKeyPath||"value",o=t.hasOwnProperty("output")?t.output:t;return Array.isArray(o)?(t.hasOwnProperty("_cursor")&&ae(t._cursor),o.map((e=>{const t=t=>{if(/{([^}]+)}/.test(t))return t.replace(/{([^}]+)}/g,((t,n)=>n.split(".").reduce(((e,t)=>e&&e[t]),e)||""));return t.split(".").reduce(((e,t)=>e&&e[t]),e)};let o=t(n),s=t(i);return void 0!==s&&""!==s||(s=o),{id:o,value:s}}))):[]},he=ke((e=>{let{key:t}=e;switch(t){case"Enter":ye(Z[V]);break;case"Escape":J(!1),ce.current?.blur();break;case"ArrowDown":V<0?U(0):V<Z.length-1?U((e=>e+1)):U(0);break;case"ArrowUp":V<0?U(Z.length-1):V<Z.length&&V>0?U((e=>e-1)):U(Z.length-1)}}),[V,Z]),ge=e=>{if("SELECT"===b){const t=ji({comparer:new Intl.Collator(void 0,{numeric:!0,sensitivity:"base"}).compare})(e).asc((e=>e.value));j(t)}else j(e)},ye=e=>{Y(""),ee("");let t=e.value;if(N){const n=o?JSON.parse(o):[];if(n.includes(e.id)){const t=n.indexOf(e.id);n.splice(t,1)}else n.push(e.id);let i=-1,s=[];n.map((e=>{i=P.findIndex((t=>t.id===e)),s.push(i)})),s.length>0&&(t=s.map((e=>P[e].value)).join(", ")),u(JSON.stringify(n)),ne(JSON.stringify(n))}else u(e.id),ne(t);J(!1),r&&(H(t),ce.current?.blur())},fe=Se((()=>{let e=-1;if(N){const t=o?JSON.parse(o):[],n=[];if(t.map((t=>{e=P.findIndex((e=>e.id===t)),n.push(e)})),n.length>0&&P.length>0)return n.map((e=>P[e].value)).join(", ")}else{try{e=P.findIndex((e=>e.id===o))}catch(t){e=-1}if(L&&"AppFields"===le)return e>-1?P[e].value:o}return e>-1?P[e].value:""}),[P,o]),ve=e=>{if(Y(""),e.currentTarget instanceof HTMLInputElement){const{value:t}=e.currentTarget;if(S){const n=(e=>{let t={id:e,value:e},n=!1;return P.forEach((i=>{i.id!==e||n||(t=i,n=!0)})),n||P.forEach((i=>{i.value!==e||n||(t=i,n=!0)})),t})(t);u(n.id),ne(n.value),we(e)}else u(t),ne(t);ee(""===t||S?"":t.trim())}},xe=e=>{e.stopPropagation(),G||h||(H(""),J(!0));const t=fe?.startsWith("{")&&fe?.endsWith("}");let n=P;Array.isArray(P)||(B([]),n=[]);const i=n.find((e=>e.id===o));(S&&!k&&t||S&&i)&&Y(fe||"")},we=e=>{e.currentTarget instanceof HTMLInputElement&&(ee(e.currentTarget.value.trim()),H(e.currentTarget.value.trim()))},be=function(){let t=arguments.length>0&&void 0!==arguments[0]&&arguments[0],n=arguments.length>1?arguments[1]:void 0;const{apiHandler:i}=e;t||q(!0),E&&i.callSourceFlowIntegrationInvocationUrl(new URL(F),{authorization_id:E},T).then((e=>{if(e)if(B(m(e)),ge(m(e)),o&&r){const i=m(e).find((e=>e.id===o));H(i&&!t?i.value:""),q(!1),n&&n()}else H(""),q(!1),n&&n();else oe(!0)}))},$e=function(){let t=arguments.length>0&&void 0!==arguments[0]&&arguments[0],n=arguments.length>1?arguments[1]:void 0,i=arguments.length>2?arguments[2]:void 0,s=arguments.length>3?arguments[3]:void 0;const{apiHandler:d}=e;if(a&&F)be(t,n);else if(A){let e;t||q(!0);try{e=JSON.parse(l)}catch(t){e=""}d.callDynamicDataEndpoint(new URL(A),e,"POST",s).then((e=>{if(e)if(i?(B([...P,...me(e)]),j([...P,...me(e)])):(B(me(e)),ge(me(e))),o&&r){const i=me(e).find((e=>e.id===o));H(i&&!t?i.value:""),q(!1),n&&n()}else H(""),q(!1),n&&n();else oe(!0)}))}},Me=(e,t)=>{const n="object"==typeof W&&Object.keys(W).length>0?W:w,i=t?{...n,_cursor:t}:n;t?$e(!0,e,!0,i):(j([]),$e(!0,e,!1,i)),r&&ce.current?.blur()};return R`
+    `}}),Fs={listboxGroupWrapper:"styles-module_listboxGroupWrapper__3Q2Xd",listbox:"styles-module_listbox__1E5tZ",customSelect:"styles-module_customSelect__3QYon",open:"styles-module_open__1-1Dc",customOptions:"styles-module_customOptions__3I04v",readonlyHint:"styles-module_readonlyHint__2HncX",disabled:"styles-module_disabled__3EKAC",customSelectTrigger:"styles-module_customSelectTrigger__3iJvU",selected:"styles-module_selected__2U-SH",arrow:"styles-module_arrow__3AlJS",close:"styles-module_close__1fyDZ",readonly:"styles-module_readonly__3h13u",isTagged:"styles-module_isTagged__3CQCR",searchInput:"styles-module_searchInput__3_5bE",noResults:"styles-module_noResults__2Y6Q9",listboxItem:"styles-module_listboxItem__1g19y",highlighted:"styles-module_highlighted__26fzM"};ue(".styles-module_listboxGroupWrapper__3Q2Xd fieldset {\n  margin: 0;\n  padding: 0;\n  border: none;\n  margin-bottom: 16px !important;\n}\n\n.styles-module_listbox__1E5tZ {\n  position: relative;\n  max-width: 100%;\n  -webkit-user-select: none;\n          user-select: none;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelect__3QYon {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  font-size: 14px;\n  font-family: inherit;\n  letter-spacing: -0.2px;\n  color: #999999;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelect__3QYon.styles-module_open__1-1Dc .styles-module_customOptions__3I04v {\n  opacity: 1;\n  visibility: visible;\n  pointer-events: auto;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelect__3QYon .styles-module_readonlyHint__2HncX {\n  width: 100%;\n  height: 100%;\n  z-index: 99;\n  position: absolute;\n}\n.styles-module_listbox__1E5tZ .styles-module_disabled__3EKAC {\n  background: #eee;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU {\n  position: relative;\n  display: flex;\n  align-items: center;\n  box-sizing: border-box;\n  height: 40px;\n  padding: 0 10px;\n  justify-content: space-between;\n  cursor: pointer;\n  font-size: 12px;\n  font-family: inherit;\n  border: 1px solid #e2e0db;\n  border-radius: 4px;\n  /*  &.searchable {\n    // cursor: text;\n  } */\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU span {\n  display: flex;\n  flex: 1;\n  align-items: center;\n  height: 100%;\n  padding-right: 10px;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU span.styles-module_selected__2U-SH {\n  color: #333333;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU:focus {\n  outline: none;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU .styles-module_arrow__3AlJS {\n  transform: rotate(0);\n  cursor: pointer;\n  transition-property: transform;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 150ms;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU .styles-module_arrow__3AlJS.styles-module_close__1fyDZ {\n  transform: rotate(180deg);\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU .styles-module_arrow__3AlJS.styles-module_readonly__3h13u {\n  cursor: auto;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU .styles-module_arrow__3AlJS.styles-module_isTagged__3CQCR {\n  margin-right: 40px;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU .styles-module_searchInput__3_5bE {\n  border: 0;\n  outline: none;\n  width: 100%;\n  color: #333;\n  font-size: 12px;\n  font-family: inherit;\n  padding: 0;\n  margin: 0;\n  height: 100%;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU .styles-module_searchInput__3_5bE::placeholder {\n  color: #999999;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU.styles-module_readonly__3h13u {\n  cursor: auto;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU button {\n  margin-bottom: -1px;\n  margin-right: -1px;\n}\n.styles-module_listbox__1E5tZ .styles-module_customOptions__3I04v {\n  position: absolute;\n  top: 100%;\n  left: 0px;\n  right: 0px;\n  z-index: 10;\n  margin-top: 10px;\n  display: block;\n  overflow: hidden;\n  background-color: #fff;\n  font-family: inherit;\n  font-size: 14px;\n  line-height: 20px;\n  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);\n  transition-property: all;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 150ms;\n  pointer-events: none;\n  visibility: hidden;\n  max-height: 132px;\n  min-height: 100%;\n  overflow-y: auto;\n  border-width: 1px;\n  border-style: solid;\n  border-color: #e2e0db;\n  opacity: 0;\n  border-radius: 4px;\n  /* Track */\n  /* Handle */\n  /* Handle on hover */\n}\n.styles-module_listbox__1E5tZ .styles-module_customOptions__3I04v::-webkit-scrollbar {\n  width: 7px;\n}\n.styles-module_listbox__1E5tZ .styles-module_customOptions__3I04v::-webkit-scrollbar-track {\n  background: transparent;\n  border-radius: 10px;\n}\n.styles-module_listbox__1E5tZ .styles-module_customOptions__3I04v::-webkit-scrollbar-thumb {\n  background: #ededed;\n  border: 1px solid #e7e7e7;\n  border-radius: 10px;\n}\n.styles-module_listbox__1E5tZ .styles-module_customOptions__3I04v::-webkit-scrollbar-thumb:hover {\n  background: rgb(116, 116, 116);\n}\n\n.styles-module_noResults__2Y6Q9 {\n  padding-top: 0.5rem;\n  padding-bottom: 0.5rem;\n  padding-left: 0.5rem;\n}\n\n.styles-module_listboxItem__1g19y {\n  position: relative;\n  display: block;\n  cursor: pointer;\n  border-width: 0px;\n  border-bottom-width: 1px;\n  border-style: solid;\n  border-color: #e2e0db;\n  transition-property: all;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 150ms;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  overflow: hidden;\n  padding: 8px 10px;\n}\n.styles-module_listboxItem__1g19y svg {\n  position: absolute;\n  height: 100%;\n  width: 12px;\n  left: 16px;\n  top: 0;\n}\n.styles-module_listboxItem__1g19y:last-child {\n  border: none;\n}\n.styles-module_listboxItem__1g19y:hover {\n  color: #333;\n  background: #ececec;\n}\n.styles-module_listboxItem__1g19y.styles-module_selected__2U-SH {\n  color: #333;\n  font-weight: 500;\n  background: #ececec;\n}\n.styles-module_listboxItem__1g19y.styles-module_highlighted__26fzM {\n  color: #333;\n  background: #ececec;\n}");const Es=e=>{const{title:t,description:n,items:i=[],value:o=null,isOpen:s=!1,isDynamic:a=!1,endpointData:l,isSearchable:r=!1,isRequired:d=!1,isHidden:p=!1,placeholder:c,onChange:u=(()=>null),showStepValidation:_=!1,responseMapper:m=(e=>e),isReadOnly:h=!1,isChanged:g=!1,tagValue:y="",taggedSelect:f=!1,skipOptionFetch:v=!1,onAddTag:x,activityOutputData:w={},type:b,appName:$,fieldId:C="dropdown-field",isConfigMode:I=!1,isMappable:L=!1,isEditable:S=!1,allowTagsInText:k=!1,labelTags:M=[],endpointUrl:A,hideTabs:D=!0,sourceFlowData:T={},sourceFlowIntegrataionInvocationUrl:F="",selectedAuthId:E="",disabled:O=!1,isMultiSelect:N=!1,dataSourceBody:W={}}=e,[z,H]=Ce(""),[P,B]=Ce(i),[V,U]=Ce(-1),[Z,j]=Ce(i),[K,q]=Ce(a&&!i.length&&!o&&""!==E),[G,J]=Ce(s),[X,Y]=Ce(""),[Q,ee]=Ce(""),[te,ne]=Ce(o),[ie,oe]=Ce(!1),[se,ae]=Ce(""),[le,re]=Ce(""),[de]=qi(),[pe]=qi(),[ce]=qi(),ue=Le(z);Qe(pe,(e=>{const t=e.target,n=document.getElementById(C)?.contains(t);Y(""),n||G&&(J(!1),U(-1),ee(""))})),Ie((()=>{ue.current=z}),[z]),Ie((()=>{o&&u&&u(o)}),[C]),Ie((()=>{if(V>-1&&G){const e=Z[V];if(e){document.querySelector(`[data-value="${e.id}"]`)?.scrollIntoView({block:"nearest",inline:"nearest"})}}}),[V,G]),Ie((()=>{y&&y!==z&&H(y)}),[y]),Ie((()=>(de&&de.current&&!0===G&&de&&de.current&&de.current?.addEventListener("keyup",he),document.addEventListener("keydown",_e),()=>{de&&de.current&&de.current.removeEventListener("keyup",he),document.removeEventListener("keydown",_e)})),[G,de,V]),Ie((()=>{let e=null;Array.isArray(P)||B([]);const t=P.find((e=>e.id===o));return G||!z||o?!G&&o&&t?H(t.value):G||!y||v||H(y):(H(""),e=setTimeout((()=>{ge(P)}),250)),()=>{e&&clearTimeout(e)}}),[G]),Ie((()=>{if(z&&r){const e=Hi.go(z,P,{keys:["value"],scoreFn:e=>{const t=e[0],n=e[1];return Math.max(t?t.score+100:-1/0,n?n.score:-1/0)}}).map((e=>e.obj));U(-1),ge(e),1===e.length&&U(0)}else G&&(U(-1),ge(P))}),[z]),Ie((()=>{const t=[{id:"1",value:"Yes"},{id:"0",value:"No"}];if(v&&a)return q(!1),j([]),B([]),H(""),void(ce.current&&(ce.current.value=""));const{apiHandler:n}=e;if(a&&F&&!O)be();else if(a&&A&&!O){let e;q(!0);try{e=JSON.parse(l)||{},E&&(e.connected_account_id=E,e.authorization_id=E)}catch(t){e=""}const t="object"==typeof W&&Object.keys(W).length>0?W:w;n.callDynamicDataEndpointWithTags(new URL(A),e,t).then((e=>{if(e){if(B(me(e)),e.hasOwnProperty("_cursor")&&null!==e._cursor){let t=me(e);j(t),1===t.length&&(ne(t[0].value),u(t[0].id,!0))}else ge(me(e));if(o&&r){const t=me(e).find((e=>e.id===o));H(t?t.value:""),q(!1)}else H(""),q(!1)}else oe(!0),q(!1)}))}else if(a&&A&&O)q(!1);else if(!a&&A)try{const e=JSON.parse(A);"CHECKBOX"===b&&1===e.length&&"1"===e[0].id?(ge(m(t)),B(m(t)),q(!1)):(B(m(e)),ge(m(e)),q(!1))}catch(e){console.error(e)}else"CHECKBOX"===b&&(ge(m(t)),B(m(t)),q(!1))}),[l,v,A,E]);const _e=e=>{"Tab"===e.key&&J(!1)},me=t=>{const n=e.optionKeyPath||"id",i=e.valueKeyPath||"value",o=t.hasOwnProperty("output")?t.output:t;return Array.isArray(o)?(t.hasOwnProperty("_cursor")&&ae(t._cursor),o.map((e=>{const t=t=>{if(/{([^}]+)}/.test(t))return t.replace(/{([^}]+)}/g,((t,n)=>n.split(".").reduce(((e,t)=>e&&e[t]),e)||""));return t.split(".").reduce(((e,t)=>e&&e[t]),e)};let o=t(n),s=t(i);return void 0!==s&&""!==s||(s=o),{id:o,value:s}}))):[]},he=ke((e=>{let{key:t}=e;switch(t){case"Enter":ye(Z[V]);break;case"Escape":J(!1),ce.current?.blur();break;case"ArrowDown":V<0?U(0):V<Z.length-1?U((e=>e+1)):U(0);break;case"ArrowUp":V<0?U(Z.length-1):V<Z.length&&V>0?U((e=>e-1)):U(Z.length-1)}}),[V,Z]),ge=e=>{if("SELECT"===b){const t=ji({comparer:new Intl.Collator(void 0,{numeric:!0,sensitivity:"base"}).compare})(e).asc((e=>e.value));j(t)}else j(e)},ye=e=>{Y(""),ee("");let t=e.value;if(N){const n=o?JSON.parse(o):[];if(n.includes(e.id)){const t=n.indexOf(e.id);n.splice(t,1)}else n.push(e.id);let i=-1,s=[];n.map((e=>{i=P.findIndex((t=>t.id===e)),s.push(i)})),s.length>0&&(t=s.map((e=>P[e].value)).join(", ")),u(JSON.stringify(n)),ne(JSON.stringify(n))}else u(e.id),ne(t);J(!1),r&&(H(t),ce.current?.blur())},fe=Se((()=>{let e=-1;if(N){const t=o?JSON.parse(o):[],n=[];if(t.map((t=>{e=P.findIndex((e=>e.id===t)),n.push(e)})),n.length>0&&P.length>0)return n.map((e=>P[e].value)).join(", ")}else{try{e=P.findIndex((e=>e.id===o))}catch(t){e=-1}if(L&&"AppFields"===le)return e>-1?P[e].value:o}return e>-1?P[e].value:""}),[P,o]),ve=e=>{if(Y(""),e.currentTarget instanceof HTMLInputElement){const{value:t}=e.currentTarget;if(S){const n=(e=>{let t={id:e,value:e},n=!1;return P.forEach((i=>{i.id!==e||n||(t=i,n=!0)})),n||P.forEach((i=>{i.value!==e||n||(t=i,n=!0)})),t})(t);u(n.id),ne(n.value),we(e)}else u(t),ne(t);ee(""===t||S?"":t.trim())}},xe=e=>{e.stopPropagation(),G||h||(H(""),J(!0));const t=fe?.startsWith("{")&&fe?.endsWith("}");let n=P;Array.isArray(P)||(B([]),n=[]);const i=n.find((e=>e.id===o));(S&&!k&&t||S&&i)&&Y(fe||"")},we=e=>{e.currentTarget instanceof HTMLInputElement&&(ee(e.currentTarget.value.trim()),H(e.currentTarget.value.trim()))},be=function(){let t=arguments.length>0&&void 0!==arguments[0]&&arguments[0],n=arguments.length>1?arguments[1]:void 0;const{apiHandler:i}=e;t||q(!0),E&&i.callSourceFlowIntegrationInvocationUrl(new URL(F),{authorization_id:E},T).then((e=>{if(e)if(B(m(e)),ge(m(e)),o&&r){const i=m(e).find((e=>e.id===o));H(i&&!t?i.value:""),q(!1),n&&n()}else H(""),q(!1),n&&n();else oe(!0)}))},$e=function(){let t=arguments.length>0&&void 0!==arguments[0]&&arguments[0],n=arguments.length>1?arguments[1]:void 0,i=arguments.length>2?arguments[2]:void 0,s=arguments.length>3?arguments[3]:void 0;const{apiHandler:d}=e;if(a&&F)be(t,n);else if(A){let e;t||q(!0);try{e=JSON.parse(l)}catch(t){e=""}d.callDynamicDataEndpoint(new URL(A),e,"POST",s).then((e=>{if(e)if(i?(B([...P,...me(e)]),j([...P,...me(e)])):(B(me(e)),ge(me(e))),o&&r){const i=me(e).find((e=>e.id===o));H(i&&!t?i.value:""),q(!1),n&&n()}else H(""),q(!1),n&&n();else oe(!0)}))}},Me=(e,t)=>{const n="object"==typeof W&&Object.keys(W).length>0?W:w,i=t?{...n,_cursor:t}:n;t?$e(!0,e,!0,i):(j([]),$e(!0,e,!1,i)),r&&ce.current?.blur()};return R`
     <${Pe} dismissOnClick=${!1} position="top" deltaY=${0}>
       <div ref=${de} class="${Fs.listboxGroupWrapper}">
         <fieldset>
@@ -3377,7 +3377,7 @@ var e,t,n,i,o,s,a,l={},r=[],d=/acit|ex(?:s|g|n|p|$)|rph|grid|ows|mnc|ntw|ine[ch]
           `;var i,o}))}
       ${l&&R` <a onClick=${()=>{u([...c,{}])}}>+ Add another ${t.title}</a> `}
     </div>
-  `};var Js={actionFormWrap:"styles-module_actionFormWrap__1--9G",noStepFields:"styles-module_noStepFields__1NQe1",actionFormWrapAutoWidth:"styles-module_actionFormWrapAutoWidth__2Vs2x",unsupported:"styles-module_unsupported__2swxl",actionFormLoader:"styles-module_actionFormLoader__2AXe4"};ue('.styles-module_actionFormWrap__1--9G {\n  width: 100%;\n}\n.styles-module_actionFormWrap__1--9G .styles-module_noStepFields__1NQe1 {\n  font-family: "Inter";\n  font-weight: 400;\n  font-size: 14px;\n  line-height: 24px;\n  color: #999999;\n}\n\n.styles-module_actionFormWrapAutoWidth__2Vs2x {\n  margin-left: 24px;\n  margin-right: 24px;\n  width: auto;\n}\n\n.styles-module_unsupported__2swxl {\n  font-size: 12px;\n  color: #ca8c1b;\n}\n\n.styles-module_actionFormLoader__2AXe4 {\n  width: 15px;\n  margin: 0 auto;\n}');var Xs=B.connect(["stepState","stepMapping","stepDataMapping","parentChildMapping","fieldListMapping","conditionalFieldMapping","embedConfig","activityOutputData","genericData","userConfig","authMapping"],re)(class extends g{constructor(e){super(e),this.state={loading:!1,dynamicFieldDataState:{},tagsTree:this.props.tagsTree&&Object.keys(this.props.tagsTree).length>0?Yo(this.props.tagsTree):{}}}componentDidMount(){const{step:e,verifyStepValidity:t}=this.props;t(e.id);const n=this.props.genericData.stepWithActivityOutput;if(n){const{id:e}=n,t=this.getVisibleFieldsDataOnRootStep(e);this.setRootStepData(t)}else this.setRootStepData({})}componentDidUpdate(e){const{step:t,verifyStepValidity:n}=this.props;if(e.step.id!==t.id){n(t.id);const e=this.props.genericData.stepWithActivityOutput;if(e){const{id:t}=e,n=this.getVisibleFieldsDataOnRootStep(t);this.setRootStepData(n)}else this.setRootStepData({})}}getVisibleFieldsDataOnRootStep=e=>{const t=this.props.stepDataMapping[e];return Object.keys(t).filter((e=>t[Number(e)].value)).reduce(((e,n)=>{const i=t[Number(n)];return{...e,[i.machineName]:i.value}}),{})};refreshRootStepData=async e=>{const t=this.props.genericData.stepWithActivityOutput;if(t){const{id:n}=t,i=this.getVisibleFieldsDataOnRootStep(n);this.setRootStepData(i,!0,e)}else this.setRootStepData({},!0,e)};setActivityOutputFromSourceStep=(e,t,n)=>{const{setDynamicData:i}=this,o=this.setState.bind(this),s=this.props.step.source_steps,{stepMapping:a}=this.props,{props:l}=this;Object.keys(s).forEach((s=>{const r=l.step.source_steps[s];let d=!1;return Object.keys(a).every((p=>{const c=a[p].step.id;if(c&&(a[c].step.machine_name===s||a[c].step.machine_name===r.form_step_machine_name)&&!l.genericData.isTestIntegration){if(d=!0,r.activity_output_url){e||o({loading:!0});const n={},a=Object.keys(l.stepDataMapping[c]);for(let e=0;e<a.length;e+=1){const t=a[e],i=l.stepDataMapping[c][t];i.value&&(n[i.machineName]=i.value)}const d=r.activity_output_url.includes("functions/"),p=d?"POST":"GET";l.apiHandler.callDynamicDataEndpoint(new URL(r.activity_output_url),{authorization_id:`${l.stepMapping[c].selectedAuthId}`,...n},p).then((e=>{o({loading:!1});let n=!1;if(e){const t=e;d&&"output"in t?this.setActivityOutputFromIntegryObjectOrRawActivityOutput(t.output,r,s,!0):l.setActivityOutputData({activityOutputData:r.loop_variable_name?this.replaceContactPrefix(e,s,r):e})}else n=!0;t&&t(n)})),r.sample_data_endpoint_url&&c&&i(r.sample_data_endpoint_url,c,{...n})}else r.activity_output&&(o({loading:!1}),t&&t(),this.setActivityOutputFromIntegryObjectOrRawActivityOutput(n,r,s));return!1}return!((l.genericData.isTestIntegration||!r.app_id&&!this.canOverrideIntegryObject(n))&&r.activity_output)||(o({loading:!1}),t&&t(),d=!0,this.setActivityOutputFromRawActivityOutput(r,s),!1)})),!d&&r.activity_output?(this.setActivityOutputFromIntegryObjectOrRawActivityOutput(n,r,s),o({loading:!1}),t&&t(),d=!0,!1):!d}))};replaceContactPrefix=(e,t,n)=>{const i=`steps.${t}.out.${n.loop_variable_name?`${n.loop_variable_name}`:""}`;return e.map((e=>({...e,value:e.value.replace("contact_v1",i)})))};setActivityOutputFromRawActivityOutput=(()=>{var e=this;return function(t){let n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"";try{let i={};i=t.activity_output;const o=Yo(i,"",`steps.${n}.out.${t.loop_variable_name?`${t.loop_variable_name}.`:""}`),s=Qo(i,"",`steps.${n}.out.${t.loop_variable_name?`${t.loop_variable_name}.`:""}`);e.props.setIncomingWebhookPayload({incomingWebhookPayload:i}),e.props.setActivityOutputData({activityOutputData:o||[]}),e.props.setDynamicFieldData({dynamicFieldData:s||{}}),e.setState({dynamicFieldDataState:s||{}})}catch(e){console.error(e)}}})();setDynamicData=(e,t,n)=>{this.props.apiHandler.callDynamicDataEndpoint(new URL(e),{authorization_id:`${this.props.stepMapping[t].selectedAuthId}`,...n}).then((e=>{e&&(this.props.setDynamicFieldData({dynamicFieldData:e}),this.setState({dynamicFieldDataState:e}))}))};canOverrideIntegryObject=e=>{if(e)try{const t=JSON.parse(e);if(this.props.userConfig?.objects?.[t.name])return!0}catch(e){return!1}return!1};setActivityOutputFromIntegryObjectOrRawActivityOutput=(()=>{var e=this;return function(t,n){let i=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"",o=arguments.length>3&&void 0!==arguments[3]&&arguments[3];if(t)try{let s={};if(o)s=t;else{const n=JSON.parse(t);s=e.props.userConfig?.objects?.[n.name]?e.props.userConfig?.objects?.[n.name]:JSON.parse(n.payload)}const a=Yo(s,"",`steps.${i}.out.${n.loop_variable_name?`${n.loop_variable_name}.`:""}`),l=Qo(s,"",`steps.${i}.out.${n.loop_variable_name?`${n.loop_variable_name}.`:""}`);e.props.setIncomingWebhookPayload({incomingWebhookPayload:s}),e.props.setActivityOutputData({activityOutputData:a||[]}),e.props.setDynamicFieldData({dynamicFieldData:l||{}}),e.setState({dynamicFieldDataState:l||{}})}catch(e){console.error(e)}else e.setActivityOutputFromRawActivityOutput(n,i)}})();setRootStepData=async(e,t,n)=>{const i=this.props.genericData.stepWithActivityOutput;let o=i?.template_fields.find((e=>"integry_webhook_object"===e.activity_field?.machine_name))?.default_value;if(o){let e={};try{e=JSON.parse(o||"{}")}catch(t){e={}}e={payload:o||"{}",name:i?.template_fields.find((e=>"payload_name"===e.activity_field?.machine_name))?.default_value||"payload"},o=JSON.stringify(e)}if(this.props.setActivityOutputData({activityOutputData:[]}),this.props.step.source_steps&&Object.keys(this.props.step.source_steps).length>0)this.setActivityOutputFromSourceStep(t,n,o);else if(i){const{id:s}=i;i.activity.activity_output_url?(t||this.setState({loading:!0}),this.props.apiHandler.callDynamicDataEndpoint(new URL(i.activity.activity_output_url),{authorization_id:`${this.props.stepMapping[s].selectedAuthId}`,...e}).then((e=>{this.setState({loading:!1}),n&&n(),e&&this.props.setActivityOutputData({activityOutputData:e})}))):i.activity.activity_output?(this.setActivityOutputFromIntegryObjectOrRawActivityOutput(o,i.activity),this.setState({loading:!1}),n&&n()):(this.setState({loading:!1}),n&&n()),i.activity.dynamic_field_data_endpoint&&this.setDynamicData(i.activity.dynamic_field_data_endpoint,s,e)}};removeCurlyBraces=e=>e.replace(/^{(.*)}$/,"$1");isNotJSON=e=>{try{return!(Array.isArray(e)&&e.length>0&&"object"==typeof e[0])&&(JSON.parse(e),!!Number(e))}catch(e){return!0}};arrayToNestedJSONWithFirstValue=(e,t)=>{let n={},i=[];e&&Array.isArray(e)&&(i=e),Object.keys(t||{}).forEach((e=>{const i=this.removeCurlyBraces(e);n={...n,[i]:t[e]||""}}));let o={};(i||[]).forEach((e=>{o={...o,[e.text]:t[e.value]||""}}));const s={};return(i||[]).forEach((e=>{if(!e.text||!e.value)return;const t=e.text.split(".");let i=s;t.forEach(((o,s)=>{i[o]||(s===t.length-1?n[e.value]&&n[e.value][0]&&this.isNotJSON(n[e.value][0])?i[o]=n[e.value][0]||"":i[o]="":i[o]={}),i=i[o]}))})),s};getFieldValFromActivityOutputRaw=(e,t)=>{const n=t.match(/{([^}]+)}/g);let i=t;return(n||[]).forEach((t=>{const n=t.replace(/{|}/g,"");(e||[]).forEach((e=>{e.text===n&&(i=i.replace(t,`{${e.value}}`))}))})),i};getStepVisibleFieldsData=e=>{const t=this.props.stepDataMapping[e];return Object.keys(t).filter((e=>t[Number(e)].value)).reduce(((e,n)=>{const i=t[Number(n)];return{...e,[i.machineName]:i.value}}),{})};areParentValuesFilled=(e,t)=>{let n=!0;for(let i=0;i<t.length;i+=1){const o=t[i];let s=null;this.props.parentChildMapping[e][o]&&(s=this.props.parentChildMapping[e][o].fieldId);const a=s&&this.props.stepDataMapping[e]&&this.props.stepDataMapping[e][s];if(!a||!a.value){n=!1;break}}return n};doParentFieldsHaveValues=(e,t)=>{let n=!0;const i=this.props.parentChildMapping[e][t];if(i&&i.parentFields)for(let t=0;t<i.parentFields.length;t+=1){const o=this.props.parentChildMapping[e][i.parentFields[t]],s=o&&this.props.stepDataMapping[e]&&this.props.stepDataMapping[e][o.fieldId];if(!s||!s.value){n=!1;break}}return n};shouldShowStep=e=>{if(!this.props.showStepValidation)return!0;const t=this.props.step.id,n=this.props.stepMapping&&this.props.stepMapping[t];if("BUTTON"===e.type||"HTML"===e.type||"SECTION"===e.type)return!0;if(n&&e.activity_field){if(this.props.userConfig&&this.props.userConfig.viewAsIU)return!0;const n=!e.is_hidden,i=!0,{parentFields:o}=this.props.parentChildMapping[t][e.activity_field.machine_name],s=this.props.conditionalFieldMapping[t][e.activity_field.machine_name];let a=!0,l=!0;o&&(a=this.areParentValuesFilled(t,o)),s&&(l=ae(t,s,this.props.stepDataMapping));const r=a&&l;return n&&i&&r}return!1};stepIsOfType=e=>{const t=this.props.step.id,n=this.props.stepMapping&&this.props.stepMapping[t]||{step:this.props.step};return e.indexOf(n.step.activity?.type)>-1};textFieldParentHasValues=e=>{const t=this.props.step.id,n=this.props.stepMapping&&this.props.stepMapping[t]||{step:this.props.step},i=n.step.template_fields.filter((e=>e.is_visible)),o=!(!this.props?.userConfig||!this.props?.userConfig.viewAsIU)||n.selectedAuthId;if(!i.filter((e=>e.activity_field&&"DYNAMIC"===e.activity_field.type))[0])return!0;let s=!1;return i.forEach((t=>{const{activity_field:n}=t,{activity_field:i}=e;n?.child_fields?.includes(i.machine_name)&&(s=!0)})),!s||!!(i.length>0&&e&&e.activity_field&&o&&this.doParentFieldsHaveValues(t,e.activity_field.machine_name))};shouldShowOldMapping=()=>{const e=this.props.step.id,t=this.props.stepMapping&&this.props.stepMapping[e];if(this.stepIsOfType(["ADAPTER","ACTION"])){const n=t.step.template_fields.filter((e=>e.is_visible)),i=t.step.template_fields.filter((e=>e.is_visible&&"TEXTFIELD"===e.activity_field?.type)),o=t.selectedAuthId,s=n.filter((e=>e.activity_field&&"DYNAMIC"===e.activity_field.type))[0];if(i.length>0&&o&&!s&&!this.shouldShowNewMapping())return!0;if(!s)return!1;if(n.length>0&&o&&s&&s.activity_field&&this.doParentFieldsHaveValues(e,s.activity_field.machine_name)){const t=this.props.conditionalFieldMapping[e][s.activity_field.machine_name];return!t||ae(e,t,this.props.stepDataMapping)}return!1}return!1};shouldShowNewMapping=()=>{const{step:e,stepMapping:t}=this.props,n=t[e.id];if(this.stepIsOfType(["ADAPTER","ACTION"])){const e=n.step.template_fields.filter((e=>e.is_visible));if(e){if(e.filter((e=>e.activity_field&&"FIELD_MAPPING"===e.activity_field.type))[0])return!0}}return!1};getMappingDataInput=()=>{const e=this.props.step.id;return{authId:(this.props.stepMapping&&this.props.stepMapping[e]).selectedAuthId,fieldsData:this.getStepVisibleFieldsData(e)}};onFieldChange=e=>{let{stepId:t,fieldId:n,value:i,isRequired:o}=e;this.props.setStepFieldData({stepId:`${t}`,fieldId:`${n}`,value:i,isRequired:o}),this.props.clearChildFields({stepId:t,fieldId:n}),this.props.verifyStepValidity(Number(t))};fieldDynamicData=e=>{const t=this.props.step.id;if(this.props.stepMapping&&this.props.stepMapping[t]&&e.activity_field){const n=this.props.parentChildMapping[t][e.activity_field.machine_name]?.parentFields||null;if(n){return n.reduce(((e,n)=>{const{fieldId:i}=this.props.parentChildMapping[t][n];return i?{...e,[n]:this.props.stepDataMapping[t][i].value}:e}),{})}}return null};sourceFlowData=e=>{if(e.source_flow_integration_invocation_url){const{stepMapping:e,stepDataMapping:t}=this.props;return{steps:{...Object.keys(e).reduce(((n,i)=>{const{machine_name:o,id:s}=e[i].step;return o?{...n,[o]:{in:Object.keys(t[s]).reduce(((e,n)=>{const i=parseInt(n,10);if(t[s][i]){const{value:n,machineName:o}=t[s][i];return{...e,[o]:n}}return e}),{})}}:n}),{})}}}return null};isHTML=e=>!!/<\/?[a-z][\s\S]*>/i.test(e);getPlaceholder=e=>{let t="Incoming Webhook"===this.props.genericData.stepWithActivityOutput?.activity?.app?.name?this.props.genericData.selfAppName:this.props.genericData.stepWithActivityOutput?.activity?.app?.name||"";if(!t||t.includes("Webhook")){const e=this.props.step.source_steps,{stepMapping:n}=this.props,{props:i}=this;let o=null;Object.keys(e).forEach((e=>{const s=i.step.source_steps[e];o=s.app_id,s.app_name?t=s.app_name:Object.keys(n).every((e=>(n[e].step.authorization_type.app.id===s.app_id&&(t=n[e].step.activity.app.name),!0)))})),t?.includes("Incoming Webhook")&&null===o&&(t="Webhook")}return"TEXTAREA"===e.activity_field?.type||"TEXTFIELD"===e.activity_field?.type||"DYNAMIC"===e.activity_field?.type?!e.is_editable||e.is_mappable||e.allow_tags_in_text?!e.is_editable&&e.is_mappable?`Map to a ${t} field...`:e.is_editable&&(e.is_mappable||e.allow_tags_in_text)?`Enter text or map to a ${t} field...`:"Please enter a value":"Enter text...":"CHECKBOX"===e.activity_field?.type||"SELECT"===e.activity_field?.type||"RADIO"===e.activity_field?.type?!e.is_editable||e.is_mappable||e.allow_tags_in_text?!e.is_editable&&e.is_mappable?`Select a value or map to a ${t} field...`:e.is_editable&&e.allow_tags_in_text?`Enter text with ${t} fields or select a value...`:e.is_editable&&e.is_mappable?`Enter text, select a value or map to a ${t} field...`:"Select a value...":"Enter text or select a value...":"TEXTAREA"===e.activity_field?.type||"TEXTFIELD"===e.activity_field?.type?"Enter text...":"CHECKBOX"===e.activity_field?.type||"SELECT"===e.activity_field?.type||"RADIO"===e.activity_field?.type?"Select a value...":""};replacePlaceholders=(e,t)=>{const n={};return Object.entries(e).forEach((e=>{let[i,o]=e;if("string"==typeof o&&o.includes("{")){const e=o.match(/{(.*?)}/);if(e&&e[1]){const s=e[1],a=s.split(".").pop();void 0!==t[s]?n[i]=o.replace(e[0],t[s]):a&&void 0!==t[a]&&(n[i]=o.replace(e[0],t[a]))}}else"string"==typeof o&&o&&(n[i]=o)})),n};render(){const{step:e,stepMapping:t,stepDataMapping:n,setStepFieldData:i,showStepValidation:o,isReadOnly:s,accountConnected:a}=this.props,l=t[e.id]&&t[e.id].step||e,r=n&&n[e.id]||{},d={}||this.props.activityOutputData||{},p=0===l.template_fields?.length||!(this.props.userConfig&&this.props.userConfig.viewAsIU)&&0===l.template_fields?.filter((e=>e.is_visible)).length;return R`
+  `};var Js={actionFormWrap:"styles-module_actionFormWrap__1--9G",noStepFields:"styles-module_noStepFields__1NQe1",actionFormWrapAutoWidth:"styles-module_actionFormWrapAutoWidth__2Vs2x",unsupported:"styles-module_unsupported__2swxl",actionFormLoader:"styles-module_actionFormLoader__2AXe4"};ue('.styles-module_actionFormWrap__1--9G {\n  width: 100%;\n}\n.styles-module_actionFormWrap__1--9G .styles-module_noStepFields__1NQe1 {\n  font-family: "Inter";\n  font-weight: 400;\n  font-size: 14px;\n  line-height: 24px;\n  color: #999999;\n}\n\n.styles-module_actionFormWrapAutoWidth__2Vs2x {\n  margin-left: 24px;\n  margin-right: 24px;\n  width: auto;\n}\n\n.styles-module_unsupported__2swxl {\n  font-size: 12px;\n  color: #ca8c1b;\n}\n\n.styles-module_actionFormLoader__2AXe4 {\n  width: 15px;\n  margin: 0 auto;\n}');var Xs=B.connect(["stepState","stepMapping","stepDataMapping","parentChildMapping","fieldListMapping","conditionalFieldMapping","embedConfig","activityOutputData","genericData","userConfig","authMapping"],re)(class extends g{constructor(e){super(e),this.state={loading:!1,dynamicFieldDataState:{},tagsTree:this.props.tagsTree&&Object.keys(this.props.tagsTree).length>0?Yo(this.props.tagsTree):{}}}componentDidMount(){const{step:e,verifyStepValidity:t}=this.props;t(e.id);const n=this.props.genericData.stepWithActivityOutput;if(n){const{id:e}=n,t=this.getVisibleFieldsDataOnRootStep(e);this.setRootStepData(t)}else this.setRootStepData({})}componentDidUpdate(e){const{step:t,verifyStepValidity:n}=this.props;if(e.step.id!==t.id){n(t.id);const e=this.props.genericData.stepWithActivityOutput;if(e){const{id:t}=e,n=this.getVisibleFieldsDataOnRootStep(t);this.setRootStepData(n)}else this.setRootStepData({})}}getVisibleFieldsDataOnRootStep=e=>{const t=this.props.stepDataMapping[e];return Object.keys(t).filter((e=>t[Number(e)].value)).reduce(((e,n)=>{const i=t[Number(n)];return{...e,[i.machineName]:i.value}}),{})};refreshRootStepData=async e=>{const t=this.props.genericData.stepWithActivityOutput;if(t){const{id:n}=t,i=this.getVisibleFieldsDataOnRootStep(n);this.setRootStepData(i,!0,e)}else this.setRootStepData({},!0,e)};setActivityOutputFromSourceStep=(e,t,n)=>{const{setDynamicData:i}=this,o=this.setState.bind(this),s=this.props.step.source_steps,{stepMapping:a}=this.props,{props:l}=this;Object.keys(s).forEach((s=>{const r=l.step.source_steps[s];let d=!1;return Object.keys(a).every((p=>{const c=a[p].step.id;if(c&&(a[c].step.machine_name===s||a[c].step.machine_name===r.form_step_machine_name)&&!l.genericData.isTestIntegration){if(d=!0,r.activity_output_url){e||o({loading:!0});const n={},a=Object.keys(l.stepDataMapping[c]);for(let e=0;e<a.length;e+=1){const t=a[e],i=l.stepDataMapping[c][t];i.value&&(n[i.machineName]=i.value)}const d=r.activity_output_url.includes("functions/"),p=d?"POST":"GET";l.apiHandler.callDynamicDataEndpoint(new URL(r.activity_output_url),{authorization_id:`${l.stepMapping[c].selectedAuthId}`,...n},p).then((e=>{o({loading:!1});let n=!1;if(e){const t=e;d&&"output"in t?this.setActivityOutputFromIntegryObjectOrRawActivityOutput(t.output,r,s,!0):l.setActivityOutputData({activityOutputData:r.loop_variable_name?this.replaceContactPrefix(e,s,r):e})}else n=!0;t&&t(n)})),r.sample_data_endpoint_url&&c&&i(r.sample_data_endpoint_url,c,{...n})}else r.activity_output&&(o({loading:!1}),t&&t(),this.setActivityOutputFromIntegryObjectOrRawActivityOutput(n,r,s));return!1}return!((l.genericData.isTestIntegration||!r.app_id&&!this.canOverrideIntegryObject(n))&&r.activity_output)||(o({loading:!1}),t&&t(),d=!0,this.setActivityOutputFromRawActivityOutput(r,s),!1)})),!d&&r.activity_output?(this.setActivityOutputFromIntegryObjectOrRawActivityOutput(n,r,s),o({loading:!1}),t&&t(),d=!0,!1):!d}))};replaceContactPrefix=(e,t,n)=>{const i=`steps.${t}.out.${n.loop_variable_name?`${n.loop_variable_name}`:""}`;return e.map((e=>({...e,value:e.value.replace("contact_v1",i)})))};setActivityOutputFromRawActivityOutput=(()=>{var e=this;return function(t){let n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"";try{let i={};i=t.activity_output;const o=Yo(i,"",`steps.${n}.out.${t.loop_variable_name?`${t.loop_variable_name}.`:""}`),s=Qo(i,"",`steps.${n}.out.${t.loop_variable_name?`${t.loop_variable_name}.`:""}`);e.props.setIncomingWebhookPayload({incomingWebhookPayload:i}),e.props.setActivityOutputData({activityOutputData:o||[]}),e.props.setDynamicFieldData({dynamicFieldData:s||{}}),e.setState({dynamicFieldDataState:s||{}})}catch(e){console.error(e)}}})();setDynamicData=(e,t,n)=>{this.props.apiHandler.callDynamicDataEndpoint(new URL(e),{authorization_id:`${this.props.stepMapping[t].selectedAuthId}`,...n}).then((e=>{e&&(this.props.setDynamicFieldData({dynamicFieldData:e}),this.setState({dynamicFieldDataState:e}))}))};canOverrideIntegryObject=e=>{if(e)try{const t=JSON.parse(e);if(this.props.userConfig?.objects?.[t.name])return!0}catch(e){return!1}return!1};setActivityOutputFromIntegryObjectOrRawActivityOutput=(()=>{var e=this;return function(t,n){let i=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"",o=arguments.length>3&&void 0!==arguments[3]&&arguments[3];if(t)try{let s={};if(o)s=t;else{const n=JSON.parse(t);s=e.props.userConfig?.objects?.[n.name]?e.props.userConfig?.objects?.[n.name]:JSON.parse(n.payload)}const a=Yo(s,"",`steps.${i}.out.${n.loop_variable_name?`${n.loop_variable_name}.`:""}`),l=Qo(s,"",`steps.${i}.out.${n.loop_variable_name?`${n.loop_variable_name}.`:""}`);e.props.setIncomingWebhookPayload({incomingWebhookPayload:s}),e.props.setActivityOutputData({activityOutputData:a||[]}),e.props.setDynamicFieldData({dynamicFieldData:l||{}}),e.setState({dynamicFieldDataState:l||{}})}catch(e){console.error(e)}else e.setActivityOutputFromRawActivityOutput(n,i)}})();setRootStepData=async(e,t,n)=>{const i=this.props.genericData.stepWithActivityOutput;let o=i?.template_fields.find((e=>"integry_webhook_object"===e.activity_field?.machine_name))?.default_value;if(o){let e={};try{e=JSON.parse(o||"{}")}catch(t){e={}}e={payload:o||"{}",name:i?.template_fields.find((e=>"payload_name"===e.activity_field?.machine_name))?.default_value||"payload"},o=JSON.stringify(e)}if(this.props.setActivityOutputData({activityOutputData:[]}),this.props.step.source_steps&&Object.keys(this.props.step.source_steps).length>0)this.setActivityOutputFromSourceStep(t,n,o);else if(i){const{id:s}=i;i.activity.activity_output_url?(t||this.setState({loading:!0}),this.props.apiHandler.callDynamicDataEndpoint(new URL(i.activity.activity_output_url),{authorization_id:`${this.props.stepMapping[s].selectedAuthId}`,...e}).then((e=>{this.setState({loading:!1}),n&&n(),e&&this.props.setActivityOutputData({activityOutputData:e})}))):i.activity.activity_output?(this.setActivityOutputFromIntegryObjectOrRawActivityOutput(o,i.activity),this.setState({loading:!1}),n&&n()):(this.setState({loading:!1}),n&&n()),i.activity.dynamic_field_data_endpoint&&this.setDynamicData(i.activity.dynamic_field_data_endpoint,s,e)}};removeCurlyBraces=e=>e.replace(/^{(.*)}$/,"$1");isNotJSON=e=>{try{return!(Array.isArray(e)&&e.length>0&&"object"==typeof e[0])&&(JSON.parse(e),!!Number(e))}catch(e){return!0}};arrayToNestedJSONWithFirstValue=(e,t)=>{let n={},i=[];e&&Array.isArray(e)&&(i=e),Object.keys(t||{}).forEach((e=>{const i=this.removeCurlyBraces(e);n={...n,[i]:t[e]||""}}));let o={};(i||[]).forEach((e=>{o={...o,[e.text]:t[e.value]||""}}));const s={};return(i||[]).forEach((e=>{if(!e.text||!e.value)return;const t=e.text.split(".");let i=s;t.forEach(((o,s)=>{i[o]||(s===t.length-1?n[e.value]&&n[e.value][0]&&this.isNotJSON(n[e.value][0])?i[o]=n[e.value][0]||"":i[o]="":i[o]={}),i=i[o]}))})),s};getFieldValFromActivityOutputRaw=(e,t)=>{const n=t.match(/{([^}]+)}/g);let i=t;return(n||[]).forEach((t=>{const n=t.replace(/{|}/g,"");(e||[]).forEach((e=>{e.text===n&&(i=i.replace(t,`{${e.value}}`))}))})),i};getStepVisibleFieldsData=e=>{const t=this.props.stepDataMapping[e];return Object.keys(t).filter((e=>t[Number(e)].value)).reduce(((e,n)=>{const i=t[Number(n)];return{...e,[i.machineName]:i.value}}),{})};areParentValuesFilled=(e,t)=>{let n=!0;for(let i=0;i<t.length;i+=1){const o=t[i];let s=null;this.props.parentChildMapping[e][o]&&(s=this.props.parentChildMapping[e][o].fieldId);const a=s&&this.props.stepDataMapping[e]&&this.props.stepDataMapping[e][s];if(!a||!a.value){n=!1;break}}return n};doParentFieldsHaveValues=(e,t)=>{let n=!0;const i=this.props.parentChildMapping[e][t];if(i&&i.parentFields)for(let t=0;t<i.parentFields.length;t+=1){const o=this.props.parentChildMapping[e][i.parentFields[t]],s=o&&this.props.stepDataMapping[e]&&this.props.stepDataMapping[e][o.fieldId];if(!s||!s.value){n=!1;break}}return n};shouldShowStep=e=>{if(!this.props.showStepValidation)return!0;const t=this.props.step.id,n=this.props.stepMapping&&this.props.stepMapping[t];if("BUTTON"===e.type||"HTML"===e.type||"SECTION"===e.type)return!0;if(n&&e.activity_field){if(this.props.userConfig&&this.props.userConfig.viewAsIU)return!0;const n=!e.is_hidden,i=!0,{parentFields:o}=this.props.parentChildMapping[t][e.activity_field.machine_name],s=this.props.conditionalFieldMapping[t][e.activity_field.machine_name];let a=!0,l=!0;o&&(a=this.areParentValuesFilled(t,o)),s&&(l=ae(t,s,this.props.stepDataMapping));const r=a&&l;return n&&i&&r}return!1};stepIsOfType=e=>{const t=this.props.step.id,n=this.props.stepMapping&&this.props.stepMapping[t]||{step:this.props.step};return e.indexOf(n.step.activity?.type)>-1};textFieldParentHasValues=e=>{const t=this.props.step.id,n=this.props.stepMapping&&this.props.stepMapping[t]||{step:this.props.step},i=n.step.template_fields.filter((e=>e.is_visible)),o=!(!this.props?.userConfig||!this.props?.userConfig.viewAsIU)||n.selectedAuthId;if(!i.filter((e=>e.activity_field&&"DYNAMIC"===e.activity_field.type))[0])return!0;let s=!1;return i.forEach((t=>{const{activity_field:n}=t,{activity_field:i}=e;n?.child_fields?.includes(i.machine_name)&&(s=!0)})),!s||!!(i.length>0&&e&&e.activity_field&&o&&this.doParentFieldsHaveValues(t,e.activity_field.machine_name))};shouldShowOldMapping=()=>{const e=this.props.step.id,t=this.props.stepMapping&&this.props.stepMapping[e];if(this.stepIsOfType(["ADAPTER","ACTION"])){const n=t.step.template_fields.filter((e=>e.is_visible)),i=t.step.template_fields.filter((e=>e.is_visible&&"TEXTFIELD"===e.activity_field?.type)),o=t.selectedAuthId,s=n.filter((e=>e.activity_field&&"DYNAMIC"===e.activity_field.type))[0];if(i.length>0&&o&&!s&&!this.shouldShowNewMapping())return!0;if(!s)return!1;if(n.length>0&&o&&s&&s.activity_field&&this.doParentFieldsHaveValues(e,s.activity_field.machine_name)){const t=this.props.conditionalFieldMapping[e][s.activity_field.machine_name];return!t||ae(e,t,this.props.stepDataMapping)}return!1}return!1};shouldShowNewMapping=()=>{const{step:e,stepMapping:t}=this.props,n=t[e.id];if(this.stepIsOfType(["ADAPTER","ACTION"])){const e=n.step.template_fields.filter((e=>e.is_visible));if(e){if(e.filter((e=>e.activity_field&&"FIELD_MAPPING"===e.activity_field.type))[0])return!0}}return!1};getMappingDataInput=()=>{const e=this.props.step.id;return{authId:(this.props.stepMapping&&this.props.stepMapping[e]).selectedAuthId,fieldsData:this.getStepVisibleFieldsData(e)}};onFieldChange=e=>{let{stepId:t,fieldId:n,value:i,isRequired:o,machineName:s}=e;this.props.onFieldChangeCallback?this.props.onFieldChangeCallback(s||"",i):(this.props.setStepFieldData({stepId:`${t}`,fieldId:`${n}`,value:i,isRequired:o}),this.props.clearChildFields({stepId:t,fieldId:n}),this.props.verifyStepValidity(Number(t)))};fieldDynamicData=e=>{const t=this.props.step.id;if(this.props.stepMapping&&this.props.stepMapping[t]&&e.activity_field){const n=this.props.parentChildMapping[t][e.activity_field.machine_name]?.parentFields||null;if(n){return n.reduce(((e,n)=>{const{fieldId:i}=this.props.parentChildMapping[t][n];return i?{...e,[n]:this.props.stepDataMapping[t][i].value}:e}),{})}}return null};sourceFlowData=e=>{if(e.source_flow_integration_invocation_url){const{stepMapping:e,stepDataMapping:t}=this.props;return{steps:{...Object.keys(e).reduce(((n,i)=>{const{machine_name:o,id:s}=e[i].step;return o?{...n,[o]:{in:Object.keys(t[s]).reduce(((e,n)=>{const i=parseInt(n,10);if(t[s][i]){const{value:n,machineName:o}=t[s][i];return{...e,[o]:n}}return e}),{})}}:n}),{})}}}return null};isHTML=e=>!!/<\/?[a-z][\s\S]*>/i.test(e);getPlaceholder=e=>{let t="Incoming Webhook"===this.props.genericData.stepWithActivityOutput?.activity?.app?.name?this.props.genericData.selfAppName:this.props.genericData.stepWithActivityOutput?.activity?.app?.name||"";if(!t||t.includes("Webhook")){const e=this.props.step.source_steps,{stepMapping:n}=this.props,{props:i}=this;let o=null;Object.keys(e).forEach((e=>{const s=i.step.source_steps[e];o=s.app_id,s.app_name?t=s.app_name:Object.keys(n).every((e=>(n[e].step.authorization_type.app.id===s.app_id&&(t=n[e].step.activity.app.name),!0)))})),t?.includes("Incoming Webhook")&&null===o&&(t="Webhook")}return"TEXTAREA"===e.activity_field?.type||"TEXTFIELD"===e.activity_field?.type||"DYNAMIC"===e.activity_field?.type?!e.is_editable||e.is_mappable||e.allow_tags_in_text?!e.is_editable&&e.is_mappable?`Map to a ${t} field...`:e.is_editable&&(e.is_mappable||e.allow_tags_in_text)?`Enter text or map to a ${t} field...`:"Please enter a value":"Enter text...":"CHECKBOX"===e.activity_field?.type||"SELECT"===e.activity_field?.type||"RADIO"===e.activity_field?.type?!e.is_editable||e.is_mappable||e.allow_tags_in_text?!e.is_editable&&e.is_mappable?`Select a value or map to a ${t} field...`:e.is_editable&&e.allow_tags_in_text?`Enter text with ${t} fields or select a value...`:e.is_editable&&e.is_mappable?`Enter text, select a value or map to a ${t} field...`:"Select a value...":"Enter text or select a value...":"TEXTAREA"===e.activity_field?.type||"TEXTFIELD"===e.activity_field?.type?"Enter text...":"CHECKBOX"===e.activity_field?.type||"SELECT"===e.activity_field?.type||"RADIO"===e.activity_field?.type?"Select a value...":""};replacePlaceholders=(e,t)=>{const n={};return Object.entries(e).forEach((e=>{let[i,o]=e;if("string"==typeof o&&o.includes("{")){const e=o.match(/{(.*?)}/);if(e&&e[1]){const s=e[1],a=s.split(".").pop();void 0!==t[s]?n[i]=o.replace(e[0],t[s]):a&&void 0!==t[a]&&(n[i]=o.replace(e[0],t[a]))}}else"string"==typeof o&&o&&(n[i]=o)})),n};render(){const{step:e,stepMapping:t,stepDataMapping:n,setStepFieldData:i,showStepValidation:o,isReadOnly:s,accountConnected:a}=this.props,l=t[e.id]&&t[e.id].step||e,r=n&&n[e.id]||{},d={}||this.props.activityOutputData||{},p=0===l.template_fields?.length||!(this.props.userConfig&&this.props.userConfig.viewAsIU)&&0===l.template_fields?.filter((e=>e.is_visible)).length;return R`
       ${this.state.loading?R`<div class=${Js.actionFormLoader}><${Ye} /></div>`:R`
             ${l?R`
                   <div
@@ -3404,7 +3404,7 @@ var e,t,n,i,o,s,a,l={},r=[],d=/acit|ex(?:s|g|n|p|$)|rph|grid|ows|mnc|ntw|ine[ch]
                                   isHidden=${t.is_hidden}
                                   isSearchable=${!0}
                                   value=${r&&r[t.id]&&r[t.id].value||t.default_value||""}
-                                  onChange=${n=>{this.onFieldChange({stepId:e.id,fieldId:t.id,value:n,isRequired:t.is_required})}}
+                                  onChange=${n=>{this.onFieldChange({stepId:e.id,fieldId:t.id,value:n,isRequired:t.is_required,machineName:t.activity_field?.machine_name})}}
                                   endpointUrl=${_||t.source_flow_integration_invocation_url||t.activity_field?.data_src}
                                   isDynamic=${t.activity_field?.is_dynamic}
                                   endpointData=${JSON.stringify({authorization_id:this.props.stepMapping&&this.props.stepMapping[this.props.step.id]?.selectedAuthId,...this.fieldDynamicData(t)})}
@@ -3465,7 +3465,7 @@ var e,t,n,i,o,s,a,l={},r=[],d=/acit|ex(?:s|g|n|p|$)|rph|grid|ows|mnc|ntw|ine[ch]
                                     regexErrorMessage=${r[t.id]?r[t.id].regexErrorMessage:""}
                                     isRequired=${t.is_required}
                                     isHidden=${t.is_hidden}
-                                    onChange=${(n,o)=>{i({stepId:`${e.id}`,fieldId:`${t.id}`,value:this.getFieldValFromActivityOutputRaw(this.props.activityOutputData,n),isRequired:t.is_required,passesRegexTest:o}),this.props.verifyStepValidity(e.id)}}
+                                    onChange=${(n,o)=>{this.props.onFieldChangeCallback?this.props.onFieldChangeCallback(t.activity_field?.machine_name||"",n):(i({stepId:`${e.id}`,fieldId:`${t.id}`,value:this.getFieldValFromActivityOutputRaw(this.props.activityOutputData,n),isRequired:t.is_required,passesRegexTest:o}),this.props.verifyStepValidity(e.id))}}
                                     isReadOnly=${s}
                                     isChanged=${n&&n.isChanged}
                                     type=${t.activity_field?.type}
@@ -3612,7 +3612,7 @@ var e,t,n,i,o,s,a,l={},r=[],d=/acit|ex(?:s|g|n|p|$)|rph|grid|ows|mnc|ntw|ine[ch]
                                   showStepValidation=${o}
                                   isRequired=${t.is_required}
                                   isHidden=${t.is_hidden}
-                                  onChange=${(n,o)=>{i({stepId:`${e.id}`,fieldId:`${t.id}`,value:n,isRequired:t.is_required,passesRegexTest:o}),this.props.verifyStepValidity(e.id)}}
+                                  onChange=${(n,o)=>{this.props.onFieldChangeCallback?this.props.onFieldChangeCallback(t.activity_field?.machine_name||"",n):(i({stepId:`${e.id}`,fieldId:`${t.id}`,value:n,isRequired:t.is_required,passesRegexTest:o}),this.props.verifyStepValidity(e.id))}}
                                   isReadOnly=${s}
                                   isChanged=${n&&n.isChanged}
                                   type=${t.activity_field?.type}
@@ -7000,7 +7000,7 @@ var e,t,n,i,o,s,a,l={},r=[],d=/acit|ex(?:s|g|n|p|$)|rph|grid|ows|mnc|ntw|ine[ch]
               </div>
             </div>
           `}
-    `}});const Rd={getAuthHash:async function(e,t){const n=e=>new Uint8Array([...unescape(encodeURIComponent(e))].map((e=>e.charCodeAt(0)))),i=n(t),o=n(e),s=await crypto.subtle.importKey("raw",i,{name:"HMAC",hash:"SHA-256"},!0,["sign"]),a=await crypto.subtle.sign("HMAC",s,o);return[...new Uint8Array(a)].map((e=>e.toString(16).padStart(2,"0"))).join("")}};class Wd{static SDK_VERSION="4.5.6";config;apiHandler;initConfig;eventEmitter=(()=>new G)();static html=(()=>R)();static RenderModes=(()=>ee)();static TemplateFormRenderModes=(()=>Y)();static Layouts=(()=>X)();static ViewStyles=(()=>J)();static MarketplaceRenderModes=(()=>Q)();static Helpers;authModalId="";forceRerender=!1;constructor(e){let t;const n=e.baseUrl||"https://app.integry.io",i=e;if(i.user){const{userId:e,apiKey:t,...n}=i.user;"userId"in i||(i.userId=""),"userId"in i&&(i.userId=e.toString()),i.xIntegryConfig||(i.xIntegryConfig={}),i.xIntegryConfig.appAuth||(i.xIntegryConfig.appAuth={}),i.xIntegryConfig.appAuth.extras||(i.xIntegryConfig.appAuth.extras={}),i.xIntegryConfig.appAuth.apiKey=(t||"").toString(),i.xIntegryConfig.appAuth.extras=n}const o={oauthVerifyPath:"auth/verify",endpointsUrl:"https://integry-app.appspot.com",baseUrl:n,baseUrlv2:`${n}/v2`,baseAPIUrl:"https://api.integry.io",apiKey:i.xIntegryConfig?.appAuth?.apiKey,authId:i.xIntegryConfig?.appAuth?.authId,extras:i.xIntegryConfig?.appAuth?.extras},s=i.options||i.userConfig||{};if(i.options&&i.payloads&&(i.options.objects=e.payloads),"appKey"in i)t={...i,...o,appKey:i.appKey,hash:i.hash,userId:i.userId},this.config={...i,...o,appKey:i.appKey,hash:i.hash,userId:i.userId,deploymentId:i.deploymentId,userConfig:i.deploymentId?{...s,tags:s?.tags?[...s?.tags,`${i.deploymentId}`]:[`${i.deploymentId}`]}:s};else{const e=this.getAuthParamsFromUrl()||{};t={...o,...e},this.config={...o,...e,userConfig:i.userConfig}}this.authModalId=this.getRandomFlowId(6),this.apiHandler=new j(t),this.verifyAuthConfig().then((e=>{e?.config_verified?this.eventEmitter.emit("ready",{isReady:!0}):console.error("IntegrySDK: Auth config verification failed, are your auth parameters correct?")})).catch((e=>console.error(e))),this.initConfig={containerId:"",renderMode:Y.INLINE}}SDKFailedHandler=(e,t)=>{const n=e.options||e.userConfig||{},i=document.getElementById(t);throw i&&T(R`
+    `}});const Rd={getAuthHash:async function(e,t){const n=e=>new Uint8Array([...unescape(encodeURIComponent(e))].map((e=>e.charCodeAt(0)))),i=n(t),o=n(e),s=await crypto.subtle.importKey("raw",i,{name:"HMAC",hash:"SHA-256"},!0,["sign"]),a=await crypto.subtle.sign("HMAC",s,o);return[...new Uint8Array(a)].map((e=>e.toString(16).padStart(2,"0"))).join("")}};class Wd{static SDK_VERSION="4.5.7";config;apiHandler;initConfig;eventEmitter=(()=>new G)();static html=(()=>R)();static RenderModes=(()=>ee)();static TemplateFormRenderModes=(()=>Y)();static Layouts=(()=>X)();static ViewStyles=(()=>J)();static MarketplaceRenderModes=(()=>Q)();static Helpers;authModalId="";forceRerender=!1;constructor(e){let t;const n=e.baseUrl||"https://app.integry.io",i=e;if(i.user){const{userId:e,apiKey:t,...n}=i.user;"userId"in i||(i.userId=""),"userId"in i&&(i.userId=e.toString()),i.xIntegryConfig||(i.xIntegryConfig={}),i.xIntegryConfig.appAuth||(i.xIntegryConfig.appAuth={}),i.xIntegryConfig.appAuth.extras||(i.xIntegryConfig.appAuth.extras={}),i.xIntegryConfig.appAuth.apiKey=(t||"").toString(),i.xIntegryConfig.appAuth.extras=n}const o={oauthVerifyPath:"auth/verify",endpointsUrl:"https://integry-app.appspot.com",baseUrl:n,baseUrlv2:`${n}/v2`,baseAPIUrl:"https://api.integry.io",apiKey:i.xIntegryConfig?.appAuth?.apiKey,authId:i.xIntegryConfig?.appAuth?.authId,extras:i.xIntegryConfig?.appAuth?.extras},s=i.options||i.userConfig||{};if(i.options&&i.payloads&&(i.options.objects=e.payloads),"appKey"in i)t={...i,...o,appKey:i.appKey,hash:i.hash,userId:i.userId},this.config={...i,...o,appKey:i.appKey,hash:i.hash,userId:i.userId,deploymentId:i.deploymentId,userConfig:i.deploymentId?{...s,tags:s?.tags?[...s?.tags,`${i.deploymentId}`]:[`${i.deploymentId}`]}:s};else{const e=this.getAuthParamsFromUrl()||{};t={...o,...e},this.config={...o,...e,userConfig:i.userConfig}}this.authModalId=this.getRandomFlowId(6),this.apiHandler=new j(t),this.verifyAuthConfig().then((e=>{e?.config_verified?this.eventEmitter.emit("ready",{isReady:!0}):console.error("IntegrySDK: Auth config verification failed, are your auth parameters correct?")})).catch((e=>console.error(e))),this.initConfig={containerId:"",renderMode:Y.INLINE}}SDKFailedHandler=(e,t)=>{const n=e.options||e.userConfig||{},i=document.getElementById(t);throw i&&T(R`
           <${nl}
             message="SDK failed to load"
             debug=${n.debug}
@@ -7277,7 +7277,7 @@ var e,t,n,i,o,s,a,l={},r=[],d=/acit|ex(?:s|g|n|p|$)|rph|grid|ows|mnc|ntw|ine[ch]
                 fieldId=${n.fieldId}
                 enableTagify=${n.enableTagify}
               />`}
-        </div>`,i):console.warn(`Integry SDK render target with id ${t} was not found`)};renderFlowStep=(()=>{var e=this;return function(t,n,i){let o=arguments.length>3&&void 0!==arguments[3]?arguments[3]:{};const s=document.getElementById(t);if(s){const t=de();T(R`<div>
+        </div>`,i):console.warn(`Integry SDK render target with id ${t} was not found`)};renderFlowStep=(()=>{var e=this;return function(t,n,i){let o=arguments.length>3&&void 0!==arguments[3]?arguments[3]:{},s=arguments.length>4?arguments[4]:void 0;const a=document.getElementById(t);if(a){const t=de();T(R`<div>
           <${ne.Provider}
             value=${{apiHandler:e.apiHandler,eventEmitter:e.eventEmitter,isPreviewMode:!1}}
           >
@@ -7292,7 +7292,8 @@ var e,t,n,i,o,s,a,l={},r=[],d=/acit|ex(?:s|g|n|p|$)|rph|grid|ows|mnc|ntw|ine[ch]
                 selectedAuthId="${i}"
                 accountConnected=${!0}
                 tagsTree=${o}
+                onFieldChangeCallback=${s}
               />
             <//>
           <//>
-        </div>`,s)}else console.warn(`Integry SDK render target with id ${t} was not found`)}})();verifyAuthConfig=()=>this.apiHandler.verifyAuthConfig({deploymentId:this.config.deploymentId});getUserVariables=async()=>{try{const e=await this.apiHandler.getUserVariables();return e?e.results:[]}catch(e){return console.error(e),[]}};destroy=()=>{try{this.eventEmitter.offAll();const e=document.getElementById(this.authModalId);e&&e.remove()}catch(e){console.error("There was an error unsubscribing from all events")}};static setFieldValue=(e,t)=>{const n=document.getElementById(e)?.querySelector("input");if(n&&n instanceof HTMLInputElement){n.value=t;const e=new KeyboardEvent("keyup",{key:"a",bubbles:!0,cancelable:!0});n.dispatchEvent(e)}const i=document.getElementById(`tagify_${e}`);if(i&&i instanceof HTMLInputElement){i.value=t;const e=new KeyboardEvent("keyup",{key:"a",bubbles:!0,cancelable:!0});i.dispatchEvent(e)}};getMethod=()=>"POST";getBaseAPIUrl=()=>"https://api.integry.io";getHeaders=()=>({"Content-Type":"application/json"})}export{Rd as Helpers,Wd as IntegryJS,R as html};
+        </div>`,a)}else console.warn(`Integry SDK render target with id ${t} was not found`)}})();verifyAuthConfig=()=>this.apiHandler.verifyAuthConfig({deploymentId:this.config.deploymentId});getUserVariables=async()=>{try{const e=await this.apiHandler.getUserVariables();return e?e.results:[]}catch(e){return console.error(e),[]}};destroy=()=>{try{this.eventEmitter.offAll();const e=document.getElementById(this.authModalId);e&&e.remove()}catch(e){console.error("There was an error unsubscribing from all events")}};static setFieldValue=(e,t)=>{const n=document.getElementById(e)?.querySelector("input");if(n&&n instanceof HTMLInputElement){n.value=t;const e=new KeyboardEvent("keyup",{key:"a",bubbles:!0,cancelable:!0});n.dispatchEvent(e)}const i=document.getElementById(`tagify_${e}`);if(i&&i instanceof HTMLInputElement){i.value=t;const e=new KeyboardEvent("keyup",{key:"a",bubbles:!0,cancelable:!0});i.dispatchEvent(e)}};getMethod=()=>"POST";getBaseAPIUrl=()=>"https://api.integry.io";getHeaders=()=>({"Content-Type":"application/json"})}export{Rd as Helpers,Wd as IntegryJS,R as html};

package/dist/umd/index.umd.d.ts

@@ -697,7 +697,7 @@ declare class IntegryJS {
         containerId: string;
         multipurposeFieldProps: MultipurposeFieldType;
     }) => void;
-    renderFlowStep: (containerId: string, step: any, connectedAccountId: string, tagsTree?: {}) => void;
+    renderFlowStep: (containerId: string, step: any, connectedAccountId: string, tagsTree?: {}, onFieldChangeCallback?: ((fieldId: string, value: string) => void) | undefined) => void;
     verifyAuthConfig: () => Promise<{
         config_verified: boolean;
         meta: any;

package/dist/umd/index.umd.js

@@ -3052,7 +3052,7 @@
                   </div>
                 `:R`Step data could not be loaded`}
           `}
-    `}}),Fs={listboxGroupWrapper:"styles-module_listboxGroupWrapper__3Q2Xd",listbox:"styles-module_listbox__1E5tZ",customSelect:"styles-module_customSelect__3QYon",open:"styles-module_open__1-1Dc",customOptions:"styles-module_customOptions__3I04v",readonlyHint:"styles-module_readonlyHint__2HncX",disabled:"styles-module_disabled__3EKAC",customSelectTrigger:"styles-module_customSelectTrigger__3iJvU",selected:"styles-module_selected__2U-SH",arrow:"styles-module_arrow__3AlJS",close:"styles-module_close__1fyDZ",readonly:"styles-module_readonly__3h13u",isTagged:"styles-module_isTagged__3CQCR",searchInput:"styles-module_searchInput__3_5bE",noResults:"styles-module_noResults__2Y6Q9",listboxItem:"styles-module_listboxItem__1g19y",highlighted:"styles-module_highlighted__26fzM"};ue(".styles-module_listboxGroupWrapper__3Q2Xd fieldset {\n  margin: 0;\n  padding: 0;\n  border: none;\n  margin-bottom: 16px !important;\n}\n\n.styles-module_listbox__1E5tZ {\n  position: relative;\n  max-width: 100%;\n  -webkit-user-select: none;\n          user-select: none;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelect__3QYon {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  font-size: 14px;\n  font-family: inherit;\n  letter-spacing: -0.2px;\n  color: #999999;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelect__3QYon.styles-module_open__1-1Dc .styles-module_customOptions__3I04v {\n  opacity: 1;\n  visibility: visible;\n  pointer-events: auto;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelect__3QYon .styles-module_readonlyHint__2HncX {\n  width: 100%;\n  height: 100%;\n  z-index: 99;\n  position: absolute;\n}\n.styles-module_listbox__1E5tZ .styles-module_disabled__3EKAC {\n  background: #eee;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU {\n  position: relative;\n  display: flex;\n  align-items: center;\n  box-sizing: border-box;\n  height: 40px;\n  padding: 0 10px;\n  justify-content: space-between;\n  cursor: pointer;\n  font-size: 12px;\n  font-family: inherit;\n  border: 1px solid #e2e0db;\n  border-radius: 4px;\n  /*  &.searchable {\n    // cursor: text;\n  } */\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU span {\n  display: flex;\n  flex: 1;\n  align-items: center;\n  height: 100%;\n  padding-right: 10px;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU span.styles-module_selected__2U-SH {\n  color: #333333;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU:focus {\n  outline: none;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU .styles-module_arrow__3AlJS {\n  transform: rotate(0);\n  cursor: pointer;\n  transition-property: transform;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 150ms;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU .styles-module_arrow__3AlJS.styles-module_close__1fyDZ {\n  transform: rotate(180deg);\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU .styles-module_arrow__3AlJS.styles-module_readonly__3h13u {\n  cursor: auto;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU .styles-module_arrow__3AlJS.styles-module_isTagged__3CQCR {\n  margin-right: 40px;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU .styles-module_searchInput__3_5bE {\n  border: 0;\n  outline: none;\n  width: 100%;\n  color: #333;\n  font-size: 12px;\n  font-family: inherit;\n  padding: 0;\n  margin: 0;\n  height: 100%;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU .styles-module_searchInput__3_5bE::placeholder {\n  color: #999999;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU.styles-module_readonly__3h13u {\n  cursor: auto;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU button {\n  margin-bottom: -1px;\n  margin-right: -1px;\n}\n.styles-module_listbox__1E5tZ .styles-module_customOptions__3I04v {\n  position: absolute;\n  top: 100%;\n  left: 0px;\n  right: 0px;\n  z-index: 10;\n  margin-top: 10px;\n  display: block;\n  overflow: hidden;\n  background-color: #fff;\n  font-family: inherit;\n  font-size: 14px;\n  line-height: 20px;\n  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);\n  transition-property: all;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 150ms;\n  pointer-events: none;\n  visibility: hidden;\n  max-height: 132px;\n  min-height: 100%;\n  overflow-y: auto;\n  border-width: 1px;\n  border-style: solid;\n  border-color: #e2e0db;\n  opacity: 0;\n  border-radius: 4px;\n  /* Track */\n  /* Handle */\n  /* Handle on hover */\n}\n.styles-module_listbox__1E5tZ .styles-module_customOptions__3I04v::-webkit-scrollbar {\n  width: 7px;\n}\n.styles-module_listbox__1E5tZ .styles-module_customOptions__3I04v::-webkit-scrollbar-track {\n  background: transparent;\n  border-radius: 10px;\n}\n.styles-module_listbox__1E5tZ .styles-module_customOptions__3I04v::-webkit-scrollbar-thumb {\n  background: #ededed;\n  border: 1px solid #e7e7e7;\n  border-radius: 10px;\n}\n.styles-module_listbox__1E5tZ .styles-module_customOptions__3I04v::-webkit-scrollbar-thumb:hover {\n  background: rgb(116, 116, 116);\n}\n\n.styles-module_noResults__2Y6Q9 {\n  padding-top: 0.5rem;\n  padding-bottom: 0.5rem;\n  padding-left: 0.5rem;\n}\n\n.styles-module_listboxItem__1g19y {\n  position: relative;\n  display: block;\n  cursor: pointer;\n  border-width: 0px;\n  border-bottom-width: 1px;\n  border-style: solid;\n  border-color: #e2e0db;\n  transition-property: all;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 150ms;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  overflow: hidden;\n  padding: 8px 10px;\n}\n.styles-module_listboxItem__1g19y svg {\n  position: absolute;\n  height: 100%;\n  width: 12px;\n  left: 16px;\n  top: 0;\n}\n.styles-module_listboxItem__1g19y:last-child {\n  border: none;\n}\n.styles-module_listboxItem__1g19y:hover {\n  color: #333;\n  background: #ececec;\n}\n.styles-module_listboxItem__1g19y.styles-module_selected__2U-SH {\n  color: #333;\n  font-weight: 500;\n  background: #ececec;\n}\n.styles-module_listboxItem__1g19y.styles-module_highlighted__26fzM {\n  color: #333;\n  background: #ececec;\n}");const Es=e=>{const{title:t,description:n,items:i=[],value:o=null,isOpen:s=!1,isDynamic:a=!1,endpointData:l,isSearchable:r=!1,isRequired:d=!1,isHidden:p=!1,placeholder:c,onChange:u=(()=>null),showStepValidation:_=!1,responseMapper:m=(e=>e),isReadOnly:h=!1,isChanged:g=!1,tagValue:y="",taggedSelect:f=!1,skipOptionFetch:v=!1,onAddTag:x,activityOutputData:w={},type:b,appName:$,fieldId:C="dropdown-field",isConfigMode:I=!1,isMappable:L=!1,isEditable:S=!1,allowTagsInText:k=!1,labelTags:M=[],endpointUrl:A,hideTabs:D=!0,sourceFlowData:T={},sourceFlowIntegrataionInvocationUrl:F="",selectedAuthId:E="",disabled:O=!1,isMultiSelect:N=!1,dataSourceBody:W={}}=e,[z,H]=Ce(""),[P,B]=Ce(i),[V,U]=Ce(-1),[Z,j]=Ce(i),[K,q]=Ce(a&&!i.length&&!o&&""!==E),[G,J]=Ce(s),[X,Y]=Ce(""),[Q,ee]=Ce(""),[te,ne]=Ce(o),[ie,oe]=Ce(!1),[se,ae]=Ce(""),[le,re]=Ce(""),[de]=qi(),[pe]=qi(),[ce]=qi(),ue=Le(z);Qe(pe,(e=>{const t=e.target,n=document.getElementById(C)?.contains(t);Y(""),n||G&&(J(!1),U(-1),ee(""))})),Ie((()=>{ue.current=z}),[z]),Ie((()=>{o&&u&&u(o)}),[C]),Ie((()=>{if(V>-1&&G){const e=Z[V];if(e){document.querySelector(`[data-value="${e.id}"]`)?.scrollIntoView({block:"nearest",inline:"nearest"})}}}),[V,G]),Ie((()=>{y&&y!==z&&H(y)}),[y]),Ie((()=>(de&&de.current&&!0===G&&de&&de.current&&de.current?.addEventListener("keyup",he),document.addEventListener("keydown",_e),()=>{de&&de.current&&de.current.removeEventListener("keyup",he),document.removeEventListener("keydown",_e)})),[G,de,V]),Ie((()=>{let e=null;Array.isArray(P)||B([]);const t=P.find((e=>e.id===o));return G||!z||o?!G&&o&&t?H(t.value):G||!y||v||H(y):(H(""),e=setTimeout((()=>{ge(P)}),250)),()=>{e&&clearTimeout(e)}}),[G]),Ie((()=>{if(z&&r){const e=Hi.go(z,P,{keys:["value"],scoreFn:e=>{const t=e[0],n=e[1];return Math.max(t?t.score+100:-1/0,n?n.score:-1/0)}}).map((e=>e.obj));U(-1),ge(e),1===e.length&&U(0)}else G&&(U(-1),ge(P))}),[z]),Ie((()=>{const t=[{id:"1",value:"Yes"},{id:"0",value:"No"}];if(v&&a)return q(!1),j([]),B([]),H(""),void(ce.current&&(ce.current.value=""));const{apiHandler:n}=e;if(a&&F&&!O)be();else if(a&&A&&!O){let e;q(!0);try{e=JSON.parse(l)||{},E&&(e.connected_account_id=E)}catch(t){e=""}const t="object"==typeof W&&Object.keys(W).length>0?W:w;n.callDynamicDataEndpointWithTags(new URL(A),e,t).then((e=>{if(e){if(B(me(e)),e.hasOwnProperty("_cursor")&&null!==e._cursor){let t=me(e);j(t),1===t.length&&(ne(t[0].value),u(t[0].id,!0))}else ge(me(e));if(o&&r){const t=me(e).find((e=>e.id===o));H(t?t.value:""),q(!1)}else H(""),q(!1)}else oe(!0),q(!1)}))}else if(a&&A&&O)q(!1);else if(!a&&A)try{const e=JSON.parse(A);"CHECKBOX"===b&&1===e.length&&"1"===e[0].id?(ge(m(t)),B(m(t)),q(!1)):(B(m(e)),ge(m(e)),q(!1))}catch(e){console.error(e)}else"CHECKBOX"===b&&(ge(m(t)),B(m(t)),q(!1))}),[l,v,A,E]);const _e=e=>{"Tab"===e.key&&J(!1)},me=t=>{const n=e.optionKeyPath||"id",i=e.valueKeyPath||"value",o=t.hasOwnProperty("output")?t.output:t;return Array.isArray(o)?(t.hasOwnProperty("_cursor")&&ae(t._cursor),o.map((e=>{const t=t=>{if(/{([^}]+)}/.test(t))return t.replace(/{([^}]+)}/g,((t,n)=>n.split(".").reduce(((e,t)=>e&&e[t]),e)||""));return t.split(".").reduce(((e,t)=>e&&e[t]),e)};let o=t(n),s=t(i);return void 0!==s&&""!==s||(s=o),{id:o,value:s}}))):[]},he=ke((e=>{let{key:t}=e;switch(t){case"Enter":ye(Z[V]);break;case"Escape":J(!1),ce.current?.blur();break;case"ArrowDown":V<0?U(0):V<Z.length-1?U((e=>e+1)):U(0);break;case"ArrowUp":V<0?U(Z.length-1):V<Z.length&&V>0?U((e=>e-1)):U(Z.length-1)}}),[V,Z]),ge=e=>{if("SELECT"===b){const t=ji({comparer:new Intl.Collator(void 0,{numeric:!0,sensitivity:"base"}).compare})(e).asc((e=>e.value));j(t)}else j(e)},ye=e=>{Y(""),ee("");let t=e.value;if(N){const n=o?JSON.parse(o):[];if(n.includes(e.id)){const t=n.indexOf(e.id);n.splice(t,1)}else n.push(e.id);let i=-1,s=[];n.map((e=>{i=P.findIndex((t=>t.id===e)),s.push(i)})),s.length>0&&(t=s.map((e=>P[e].value)).join(", ")),u(JSON.stringify(n)),ne(JSON.stringify(n))}else u(e.id),ne(t);J(!1),r&&(H(t),ce.current?.blur())},fe=Se((()=>{let e=-1;if(N){const t=o?JSON.parse(o):[],n=[];if(t.map((t=>{e=P.findIndex((e=>e.id===t)),n.push(e)})),n.length>0&&P.length>0)return n.map((e=>P[e].value)).join(", ")}else{try{e=P.findIndex((e=>e.id===o))}catch(t){e=-1}if(L&&"AppFields"===le)return e>-1?P[e].value:o}return e>-1?P[e].value:""}),[P,o]),ve=e=>{if(Y(""),e.currentTarget instanceof HTMLInputElement){const{value:t}=e.currentTarget;if(S){const n=(e=>{let t={id:e,value:e},n=!1;return P.forEach((i=>{i.id!==e||n||(t=i,n=!0)})),n||P.forEach((i=>{i.value!==e||n||(t=i,n=!0)})),t})(t);u(n.id),ne(n.value),we(e)}else u(t),ne(t);ee(""===t||S?"":t.trim())}},xe=e=>{e.stopPropagation(),G||h||(H(""),J(!0));const t=fe?.startsWith("{")&&fe?.endsWith("}");let n=P;Array.isArray(P)||(B([]),n=[]);const i=n.find((e=>e.id===o));(S&&!k&&t||S&&i)&&Y(fe||"")},we=e=>{e.currentTarget instanceof HTMLInputElement&&(ee(e.currentTarget.value.trim()),H(e.currentTarget.value.trim()))},be=function(){let t=arguments.length>0&&void 0!==arguments[0]&&arguments[0],n=arguments.length>1?arguments[1]:void 0;const{apiHandler:i}=e;t||q(!0),E&&i.callSourceFlowIntegrationInvocationUrl(new URL(F),{authorization_id:E},T).then((e=>{if(e)if(B(m(e)),ge(m(e)),o&&r){const i=m(e).find((e=>e.id===o));H(i&&!t?i.value:""),q(!1),n&&n()}else H(""),q(!1),n&&n();else oe(!0)}))},$e=function(){let t=arguments.length>0&&void 0!==arguments[0]&&arguments[0],n=arguments.length>1?arguments[1]:void 0,i=arguments.length>2?arguments[2]:void 0,s=arguments.length>3?arguments[3]:void 0;const{apiHandler:d}=e;if(a&&F)be(t,n);else if(A){let e;t||q(!0);try{e=JSON.parse(l)}catch(t){e=""}d.callDynamicDataEndpoint(new URL(A),e,"POST",s).then((e=>{if(e)if(i?(B([...P,...me(e)]),j([...P,...me(e)])):(B(me(e)),ge(me(e))),o&&r){const i=me(e).find((e=>e.id===o));H(i&&!t?i.value:""),q(!1),n&&n()}else H(""),q(!1),n&&n();else oe(!0)}))}},Me=(e,t)=>{const n="object"==typeof W&&Object.keys(W).length>0?W:w,i=t?{...n,_cursor:t}:n;t?$e(!0,e,!0,i):(j([]),$e(!0,e,!1,i)),r&&ce.current?.blur()};return R`
+    `}}),Fs={listboxGroupWrapper:"styles-module_listboxGroupWrapper__3Q2Xd",listbox:"styles-module_listbox__1E5tZ",customSelect:"styles-module_customSelect__3QYon",open:"styles-module_open__1-1Dc",customOptions:"styles-module_customOptions__3I04v",readonlyHint:"styles-module_readonlyHint__2HncX",disabled:"styles-module_disabled__3EKAC",customSelectTrigger:"styles-module_customSelectTrigger__3iJvU",selected:"styles-module_selected__2U-SH",arrow:"styles-module_arrow__3AlJS",close:"styles-module_close__1fyDZ",readonly:"styles-module_readonly__3h13u",isTagged:"styles-module_isTagged__3CQCR",searchInput:"styles-module_searchInput__3_5bE",noResults:"styles-module_noResults__2Y6Q9",listboxItem:"styles-module_listboxItem__1g19y",highlighted:"styles-module_highlighted__26fzM"};ue(".styles-module_listboxGroupWrapper__3Q2Xd fieldset {\n  margin: 0;\n  padding: 0;\n  border: none;\n  margin-bottom: 16px !important;\n}\n\n.styles-module_listbox__1E5tZ {\n  position: relative;\n  max-width: 100%;\n  -webkit-user-select: none;\n          user-select: none;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelect__3QYon {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  font-size: 14px;\n  font-family: inherit;\n  letter-spacing: -0.2px;\n  color: #999999;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelect__3QYon.styles-module_open__1-1Dc .styles-module_customOptions__3I04v {\n  opacity: 1;\n  visibility: visible;\n  pointer-events: auto;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelect__3QYon .styles-module_readonlyHint__2HncX {\n  width: 100%;\n  height: 100%;\n  z-index: 99;\n  position: absolute;\n}\n.styles-module_listbox__1E5tZ .styles-module_disabled__3EKAC {\n  background: #eee;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU {\n  position: relative;\n  display: flex;\n  align-items: center;\n  box-sizing: border-box;\n  height: 40px;\n  padding: 0 10px;\n  justify-content: space-between;\n  cursor: pointer;\n  font-size: 12px;\n  font-family: inherit;\n  border: 1px solid #e2e0db;\n  border-radius: 4px;\n  /*  &.searchable {\n    // cursor: text;\n  } */\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU span {\n  display: flex;\n  flex: 1;\n  align-items: center;\n  height: 100%;\n  padding-right: 10px;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU span.styles-module_selected__2U-SH {\n  color: #333333;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU:focus {\n  outline: none;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU .styles-module_arrow__3AlJS {\n  transform: rotate(0);\n  cursor: pointer;\n  transition-property: transform;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 150ms;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU .styles-module_arrow__3AlJS.styles-module_close__1fyDZ {\n  transform: rotate(180deg);\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU .styles-module_arrow__3AlJS.styles-module_readonly__3h13u {\n  cursor: auto;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU .styles-module_arrow__3AlJS.styles-module_isTagged__3CQCR {\n  margin-right: 40px;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU .styles-module_searchInput__3_5bE {\n  border: 0;\n  outline: none;\n  width: 100%;\n  color: #333;\n  font-size: 12px;\n  font-family: inherit;\n  padding: 0;\n  margin: 0;\n  height: 100%;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU .styles-module_searchInput__3_5bE::placeholder {\n  color: #999999;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU.styles-module_readonly__3h13u {\n  cursor: auto;\n}\n.styles-module_listbox__1E5tZ .styles-module_customSelectTrigger__3iJvU button {\n  margin-bottom: -1px;\n  margin-right: -1px;\n}\n.styles-module_listbox__1E5tZ .styles-module_customOptions__3I04v {\n  position: absolute;\n  top: 100%;\n  left: 0px;\n  right: 0px;\n  z-index: 10;\n  margin-top: 10px;\n  display: block;\n  overflow: hidden;\n  background-color: #fff;\n  font-family: inherit;\n  font-size: 14px;\n  line-height: 20px;\n  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);\n  transition-property: all;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 150ms;\n  pointer-events: none;\n  visibility: hidden;\n  max-height: 132px;\n  min-height: 100%;\n  overflow-y: auto;\n  border-width: 1px;\n  border-style: solid;\n  border-color: #e2e0db;\n  opacity: 0;\n  border-radius: 4px;\n  /* Track */\n  /* Handle */\n  /* Handle on hover */\n}\n.styles-module_listbox__1E5tZ .styles-module_customOptions__3I04v::-webkit-scrollbar {\n  width: 7px;\n}\n.styles-module_listbox__1E5tZ .styles-module_customOptions__3I04v::-webkit-scrollbar-track {\n  background: transparent;\n  border-radius: 10px;\n}\n.styles-module_listbox__1E5tZ .styles-module_customOptions__3I04v::-webkit-scrollbar-thumb {\n  background: #ededed;\n  border: 1px solid #e7e7e7;\n  border-radius: 10px;\n}\n.styles-module_listbox__1E5tZ .styles-module_customOptions__3I04v::-webkit-scrollbar-thumb:hover {\n  background: rgb(116, 116, 116);\n}\n\n.styles-module_noResults__2Y6Q9 {\n  padding-top: 0.5rem;\n  padding-bottom: 0.5rem;\n  padding-left: 0.5rem;\n}\n\n.styles-module_listboxItem__1g19y {\n  position: relative;\n  display: block;\n  cursor: pointer;\n  border-width: 0px;\n  border-bottom-width: 1px;\n  border-style: solid;\n  border-color: #e2e0db;\n  transition-property: all;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 150ms;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  overflow: hidden;\n  padding: 8px 10px;\n}\n.styles-module_listboxItem__1g19y svg {\n  position: absolute;\n  height: 100%;\n  width: 12px;\n  left: 16px;\n  top: 0;\n}\n.styles-module_listboxItem__1g19y:last-child {\n  border: none;\n}\n.styles-module_listboxItem__1g19y:hover {\n  color: #333;\n  background: #ececec;\n}\n.styles-module_listboxItem__1g19y.styles-module_selected__2U-SH {\n  color: #333;\n  font-weight: 500;\n  background: #ececec;\n}\n.styles-module_listboxItem__1g19y.styles-module_highlighted__26fzM {\n  color: #333;\n  background: #ececec;\n}");const Es=e=>{const{title:t,description:n,items:i=[],value:o=null,isOpen:s=!1,isDynamic:a=!1,endpointData:l,isSearchable:r=!1,isRequired:d=!1,isHidden:p=!1,placeholder:c,onChange:u=(()=>null),showStepValidation:_=!1,responseMapper:m=(e=>e),isReadOnly:h=!1,isChanged:g=!1,tagValue:y="",taggedSelect:f=!1,skipOptionFetch:v=!1,onAddTag:x,activityOutputData:w={},type:b,appName:$,fieldId:C="dropdown-field",isConfigMode:I=!1,isMappable:L=!1,isEditable:S=!1,allowTagsInText:k=!1,labelTags:M=[],endpointUrl:A,hideTabs:D=!0,sourceFlowData:T={},sourceFlowIntegrataionInvocationUrl:F="",selectedAuthId:E="",disabled:O=!1,isMultiSelect:N=!1,dataSourceBody:W={}}=e,[z,H]=Ce(""),[P,B]=Ce(i),[V,U]=Ce(-1),[Z,j]=Ce(i),[K,q]=Ce(a&&!i.length&&!o&&""!==E),[G,J]=Ce(s),[X,Y]=Ce(""),[Q,ee]=Ce(""),[te,ne]=Ce(o),[ie,oe]=Ce(!1),[se,ae]=Ce(""),[le,re]=Ce(""),[de]=qi(),[pe]=qi(),[ce]=qi(),ue=Le(z);Qe(pe,(e=>{const t=e.target,n=document.getElementById(C)?.contains(t);Y(""),n||G&&(J(!1),U(-1),ee(""))})),Ie((()=>{ue.current=z}),[z]),Ie((()=>{o&&u&&u(o)}),[C]),Ie((()=>{if(V>-1&&G){const e=Z[V];if(e){document.querySelector(`[data-value="${e.id}"]`)?.scrollIntoView({block:"nearest",inline:"nearest"})}}}),[V,G]),Ie((()=>{y&&y!==z&&H(y)}),[y]),Ie((()=>(de&&de.current&&!0===G&&de&&de.current&&de.current?.addEventListener("keyup",he),document.addEventListener("keydown",_e),()=>{de&&de.current&&de.current.removeEventListener("keyup",he),document.removeEventListener("keydown",_e)})),[G,de,V]),Ie((()=>{let e=null;Array.isArray(P)||B([]);const t=P.find((e=>e.id===o));return G||!z||o?!G&&o&&t?H(t.value):G||!y||v||H(y):(H(""),e=setTimeout((()=>{ge(P)}),250)),()=>{e&&clearTimeout(e)}}),[G]),Ie((()=>{if(z&&r){const e=Hi.go(z,P,{keys:["value"],scoreFn:e=>{const t=e[0],n=e[1];return Math.max(t?t.score+100:-1/0,n?n.score:-1/0)}}).map((e=>e.obj));U(-1),ge(e),1===e.length&&U(0)}else G&&(U(-1),ge(P))}),[z]),Ie((()=>{const t=[{id:"1",value:"Yes"},{id:"0",value:"No"}];if(v&&a)return q(!1),j([]),B([]),H(""),void(ce.current&&(ce.current.value=""));const{apiHandler:n}=e;if(a&&F&&!O)be();else if(a&&A&&!O){let e;q(!0);try{e=JSON.parse(l)||{},E&&(e.connected_account_id=E,e.authorization_id=E)}catch(t){e=""}const t="object"==typeof W&&Object.keys(W).length>0?W:w;n.callDynamicDataEndpointWithTags(new URL(A),e,t).then((e=>{if(e){if(B(me(e)),e.hasOwnProperty("_cursor")&&null!==e._cursor){let t=me(e);j(t),1===t.length&&(ne(t[0].value),u(t[0].id,!0))}else ge(me(e));if(o&&r){const t=me(e).find((e=>e.id===o));H(t?t.value:""),q(!1)}else H(""),q(!1)}else oe(!0),q(!1)}))}else if(a&&A&&O)q(!1);else if(!a&&A)try{const e=JSON.parse(A);"CHECKBOX"===b&&1===e.length&&"1"===e[0].id?(ge(m(t)),B(m(t)),q(!1)):(B(m(e)),ge(m(e)),q(!1))}catch(e){console.error(e)}else"CHECKBOX"===b&&(ge(m(t)),B(m(t)),q(!1))}),[l,v,A,E]);const _e=e=>{"Tab"===e.key&&J(!1)},me=t=>{const n=e.optionKeyPath||"id",i=e.valueKeyPath||"value",o=t.hasOwnProperty("output")?t.output:t;return Array.isArray(o)?(t.hasOwnProperty("_cursor")&&ae(t._cursor),o.map((e=>{const t=t=>{if(/{([^}]+)}/.test(t))return t.replace(/{([^}]+)}/g,((t,n)=>n.split(".").reduce(((e,t)=>e&&e[t]),e)||""));return t.split(".").reduce(((e,t)=>e&&e[t]),e)};let o=t(n),s=t(i);return void 0!==s&&""!==s||(s=o),{id:o,value:s}}))):[]},he=ke((e=>{let{key:t}=e;switch(t){case"Enter":ye(Z[V]);break;case"Escape":J(!1),ce.current?.blur();break;case"ArrowDown":V<0?U(0):V<Z.length-1?U((e=>e+1)):U(0);break;case"ArrowUp":V<0?U(Z.length-1):V<Z.length&&V>0?U((e=>e-1)):U(Z.length-1)}}),[V,Z]),ge=e=>{if("SELECT"===b){const t=ji({comparer:new Intl.Collator(void 0,{numeric:!0,sensitivity:"base"}).compare})(e).asc((e=>e.value));j(t)}else j(e)},ye=e=>{Y(""),ee("");let t=e.value;if(N){const n=o?JSON.parse(o):[];if(n.includes(e.id)){const t=n.indexOf(e.id);n.splice(t,1)}else n.push(e.id);let i=-1,s=[];n.map((e=>{i=P.findIndex((t=>t.id===e)),s.push(i)})),s.length>0&&(t=s.map((e=>P[e].value)).join(", ")),u(JSON.stringify(n)),ne(JSON.stringify(n))}else u(e.id),ne(t);J(!1),r&&(H(t),ce.current?.blur())},fe=Se((()=>{let e=-1;if(N){const t=o?JSON.parse(o):[],n=[];if(t.map((t=>{e=P.findIndex((e=>e.id===t)),n.push(e)})),n.length>0&&P.length>0)return n.map((e=>P[e].value)).join(", ")}else{try{e=P.findIndex((e=>e.id===o))}catch(t){e=-1}if(L&&"AppFields"===le)return e>-1?P[e].value:o}return e>-1?P[e].value:""}),[P,o]),ve=e=>{if(Y(""),e.currentTarget instanceof HTMLInputElement){const{value:t}=e.currentTarget;if(S){const n=(e=>{let t={id:e,value:e},n=!1;return P.forEach((i=>{i.id!==e||n||(t=i,n=!0)})),n||P.forEach((i=>{i.value!==e||n||(t=i,n=!0)})),t})(t);u(n.id),ne(n.value),we(e)}else u(t),ne(t);ee(""===t||S?"":t.trim())}},xe=e=>{e.stopPropagation(),G||h||(H(""),J(!0));const t=fe?.startsWith("{")&&fe?.endsWith("}");let n=P;Array.isArray(P)||(B([]),n=[]);const i=n.find((e=>e.id===o));(S&&!k&&t||S&&i)&&Y(fe||"")},we=e=>{e.currentTarget instanceof HTMLInputElement&&(ee(e.currentTarget.value.trim()),H(e.currentTarget.value.trim()))},be=function(){let t=arguments.length>0&&void 0!==arguments[0]&&arguments[0],n=arguments.length>1?arguments[1]:void 0;const{apiHandler:i}=e;t||q(!0),E&&i.callSourceFlowIntegrationInvocationUrl(new URL(F),{authorization_id:E},T).then((e=>{if(e)if(B(m(e)),ge(m(e)),o&&r){const i=m(e).find((e=>e.id===o));H(i&&!t?i.value:""),q(!1),n&&n()}else H(""),q(!1),n&&n();else oe(!0)}))},$e=function(){let t=arguments.length>0&&void 0!==arguments[0]&&arguments[0],n=arguments.length>1?arguments[1]:void 0,i=arguments.length>2?arguments[2]:void 0,s=arguments.length>3?arguments[3]:void 0;const{apiHandler:d}=e;if(a&&F)be(t,n);else if(A){let e;t||q(!0);try{e=JSON.parse(l)}catch(t){e=""}d.callDynamicDataEndpoint(new URL(A),e,"POST",s).then((e=>{if(e)if(i?(B([...P,...me(e)]),j([...P,...me(e)])):(B(me(e)),ge(me(e))),o&&r){const i=me(e).find((e=>e.id===o));H(i&&!t?i.value:""),q(!1),n&&n()}else H(""),q(!1),n&&n();else oe(!0)}))}},Me=(e,t)=>{const n="object"==typeof W&&Object.keys(W).length>0?W:w,i=t?{...n,_cursor:t}:n;t?$e(!0,e,!0,i):(j([]),$e(!0,e,!1,i)),r&&ce.current?.blur()};return R`
     <${Pe} dismissOnClick=${!1} position="top" deltaY=${0}>
       <div ref=${de} class="${Fs.listboxGroupWrapper}">
         <fieldset>
@@ -3377,7 +3377,7 @@
           `;var i,o}))}
       ${l&&R` <a onClick=${()=>{u([...c,{}])}}>+ Add another ${t.title}</a> `}
     </div>
-  `};var Js={actionFormWrap:"styles-module_actionFormWrap__1--9G",noStepFields:"styles-module_noStepFields__1NQe1",actionFormWrapAutoWidth:"styles-module_actionFormWrapAutoWidth__2Vs2x",unsupported:"styles-module_unsupported__2swxl",actionFormLoader:"styles-module_actionFormLoader__2AXe4"};ue('.styles-module_actionFormWrap__1--9G {\n  width: 100%;\n}\n.styles-module_actionFormWrap__1--9G .styles-module_noStepFields__1NQe1 {\n  font-family: "Inter";\n  font-weight: 400;\n  font-size: 14px;\n  line-height: 24px;\n  color: #999999;\n}\n\n.styles-module_actionFormWrapAutoWidth__2Vs2x {\n  margin-left: 24px;\n  margin-right: 24px;\n  width: auto;\n}\n\n.styles-module_unsupported__2swxl {\n  font-size: 12px;\n  color: #ca8c1b;\n}\n\n.styles-module_actionFormLoader__2AXe4 {\n  width: 15px;\n  margin: 0 auto;\n}');var Xs=B.connect(["stepState","stepMapping","stepDataMapping","parentChildMapping","fieldListMapping","conditionalFieldMapping","embedConfig","activityOutputData","genericData","userConfig","authMapping"],re)(class extends g{constructor(e){super(e),this.state={loading:!1,dynamicFieldDataState:{},tagsTree:this.props.tagsTree&&Object.keys(this.props.tagsTree).length>0?Yo(this.props.tagsTree):{}}}componentDidMount(){const{step:e,verifyStepValidity:t}=this.props;t(e.id);const n=this.props.genericData.stepWithActivityOutput;if(n){const{id:e}=n,t=this.getVisibleFieldsDataOnRootStep(e);this.setRootStepData(t)}else this.setRootStepData({})}componentDidUpdate(e){const{step:t,verifyStepValidity:n}=this.props;if(e.step.id!==t.id){n(t.id);const e=this.props.genericData.stepWithActivityOutput;if(e){const{id:t}=e,n=this.getVisibleFieldsDataOnRootStep(t);this.setRootStepData(n)}else this.setRootStepData({})}}getVisibleFieldsDataOnRootStep=e=>{const t=this.props.stepDataMapping[e];return Object.keys(t).filter((e=>t[Number(e)].value)).reduce(((e,n)=>{const i=t[Number(n)];return{...e,[i.machineName]:i.value}}),{})};refreshRootStepData=async e=>{const t=this.props.genericData.stepWithActivityOutput;if(t){const{id:n}=t,i=this.getVisibleFieldsDataOnRootStep(n);this.setRootStepData(i,!0,e)}else this.setRootStepData({},!0,e)};setActivityOutputFromSourceStep=(e,t,n)=>{const{setDynamicData:i}=this,o=this.setState.bind(this),s=this.props.step.source_steps,{stepMapping:a}=this.props,{props:l}=this;Object.keys(s).forEach((s=>{const r=l.step.source_steps[s];let d=!1;return Object.keys(a).every((p=>{const c=a[p].step.id;if(c&&(a[c].step.machine_name===s||a[c].step.machine_name===r.form_step_machine_name)&&!l.genericData.isTestIntegration){if(d=!0,r.activity_output_url){e||o({loading:!0});const n={},a=Object.keys(l.stepDataMapping[c]);for(let e=0;e<a.length;e+=1){const t=a[e],i=l.stepDataMapping[c][t];i.value&&(n[i.machineName]=i.value)}const d=r.activity_output_url.includes("functions/"),p=d?"POST":"GET";l.apiHandler.callDynamicDataEndpoint(new URL(r.activity_output_url),{authorization_id:`${l.stepMapping[c].selectedAuthId}`,...n},p).then((e=>{o({loading:!1});let n=!1;if(e){const t=e;d&&"output"in t?this.setActivityOutputFromIntegryObjectOrRawActivityOutput(t.output,r,s,!0):l.setActivityOutputData({activityOutputData:r.loop_variable_name?this.replaceContactPrefix(e,s,r):e})}else n=!0;t&&t(n)})),r.sample_data_endpoint_url&&c&&i(r.sample_data_endpoint_url,c,{...n})}else r.activity_output&&(o({loading:!1}),t&&t(),this.setActivityOutputFromIntegryObjectOrRawActivityOutput(n,r,s));return!1}return!((l.genericData.isTestIntegration||!r.app_id&&!this.canOverrideIntegryObject(n))&&r.activity_output)||(o({loading:!1}),t&&t(),d=!0,this.setActivityOutputFromRawActivityOutput(r,s),!1)})),!d&&r.activity_output?(this.setActivityOutputFromIntegryObjectOrRawActivityOutput(n,r,s),o({loading:!1}),t&&t(),d=!0,!1):!d}))};replaceContactPrefix=(e,t,n)=>{const i=`steps.${t}.out.${n.loop_variable_name?`${n.loop_variable_name}`:""}`;return e.map((e=>({...e,value:e.value.replace("contact_v1",i)})))};setActivityOutputFromRawActivityOutput=(()=>{var e=this;return function(t){let n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"";try{let i={};i=t.activity_output;const o=Yo(i,"",`steps.${n}.out.${t.loop_variable_name?`${t.loop_variable_name}.`:""}`),s=Qo(i,"",`steps.${n}.out.${t.loop_variable_name?`${t.loop_variable_name}.`:""}`);e.props.setIncomingWebhookPayload({incomingWebhookPayload:i}),e.props.setActivityOutputData({activityOutputData:o||[]}),e.props.setDynamicFieldData({dynamicFieldData:s||{}}),e.setState({dynamicFieldDataState:s||{}})}catch(e){console.error(e)}}})();setDynamicData=(e,t,n)=>{this.props.apiHandler.callDynamicDataEndpoint(new URL(e),{authorization_id:`${this.props.stepMapping[t].selectedAuthId}`,...n}).then((e=>{e&&(this.props.setDynamicFieldData({dynamicFieldData:e}),this.setState({dynamicFieldDataState:e}))}))};canOverrideIntegryObject=e=>{if(e)try{const t=JSON.parse(e);if(this.props.userConfig?.objects?.[t.name])return!0}catch(e){return!1}return!1};setActivityOutputFromIntegryObjectOrRawActivityOutput=(()=>{var e=this;return function(t,n){let i=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"",o=arguments.length>3&&void 0!==arguments[3]&&arguments[3];if(t)try{let s={};if(o)s=t;else{const n=JSON.parse(t);s=e.props.userConfig?.objects?.[n.name]?e.props.userConfig?.objects?.[n.name]:JSON.parse(n.payload)}const a=Yo(s,"",`steps.${i}.out.${n.loop_variable_name?`${n.loop_variable_name}.`:""}`),l=Qo(s,"",`steps.${i}.out.${n.loop_variable_name?`${n.loop_variable_name}.`:""}`);e.props.setIncomingWebhookPayload({incomingWebhookPayload:s}),e.props.setActivityOutputData({activityOutputData:a||[]}),e.props.setDynamicFieldData({dynamicFieldData:l||{}}),e.setState({dynamicFieldDataState:l||{}})}catch(e){console.error(e)}else e.setActivityOutputFromRawActivityOutput(n,i)}})();setRootStepData=async(e,t,n)=>{const i=this.props.genericData.stepWithActivityOutput;let o=i?.template_fields.find((e=>"integry_webhook_object"===e.activity_field?.machine_name))?.default_value;if(o){let e={};try{e=JSON.parse(o||"{}")}catch(t){e={}}e={payload:o||"{}",name:i?.template_fields.find((e=>"payload_name"===e.activity_field?.machine_name))?.default_value||"payload"},o=JSON.stringify(e)}if(this.props.setActivityOutputData({activityOutputData:[]}),this.props.step.source_steps&&Object.keys(this.props.step.source_steps).length>0)this.setActivityOutputFromSourceStep(t,n,o);else if(i){const{id:s}=i;i.activity.activity_output_url?(t||this.setState({loading:!0}),this.props.apiHandler.callDynamicDataEndpoint(new URL(i.activity.activity_output_url),{authorization_id:`${this.props.stepMapping[s].selectedAuthId}`,...e}).then((e=>{this.setState({loading:!1}),n&&n(),e&&this.props.setActivityOutputData({activityOutputData:e})}))):i.activity.activity_output?(this.setActivityOutputFromIntegryObjectOrRawActivityOutput(o,i.activity),this.setState({loading:!1}),n&&n()):(this.setState({loading:!1}),n&&n()),i.activity.dynamic_field_data_endpoint&&this.setDynamicData(i.activity.dynamic_field_data_endpoint,s,e)}};removeCurlyBraces=e=>e.replace(/^{(.*)}$/,"$1");isNotJSON=e=>{try{return!(Array.isArray(e)&&e.length>0&&"object"==typeof e[0])&&(JSON.parse(e),!!Number(e))}catch(e){return!0}};arrayToNestedJSONWithFirstValue=(e,t)=>{let n={},i=[];e&&Array.isArray(e)&&(i=e),Object.keys(t||{}).forEach((e=>{const i=this.removeCurlyBraces(e);n={...n,[i]:t[e]||""}}));let o={};(i||[]).forEach((e=>{o={...o,[e.text]:t[e.value]||""}}));const s={};return(i||[]).forEach((e=>{if(!e.text||!e.value)return;const t=e.text.split(".");let i=s;t.forEach(((o,s)=>{i[o]||(s===t.length-1?n[e.value]&&n[e.value][0]&&this.isNotJSON(n[e.value][0])?i[o]=n[e.value][0]||"":i[o]="":i[o]={}),i=i[o]}))})),s};getFieldValFromActivityOutputRaw=(e,t)=>{const n=t.match(/{([^}]+)}/g);let i=t;return(n||[]).forEach((t=>{const n=t.replace(/{|}/g,"");(e||[]).forEach((e=>{e.text===n&&(i=i.replace(t,`{${e.value}}`))}))})),i};getStepVisibleFieldsData=e=>{const t=this.props.stepDataMapping[e];return Object.keys(t).filter((e=>t[Number(e)].value)).reduce(((e,n)=>{const i=t[Number(n)];return{...e,[i.machineName]:i.value}}),{})};areParentValuesFilled=(e,t)=>{let n=!0;for(let i=0;i<t.length;i+=1){const o=t[i];let s=null;this.props.parentChildMapping[e][o]&&(s=this.props.parentChildMapping[e][o].fieldId);const a=s&&this.props.stepDataMapping[e]&&this.props.stepDataMapping[e][s];if(!a||!a.value){n=!1;break}}return n};doParentFieldsHaveValues=(e,t)=>{let n=!0;const i=this.props.parentChildMapping[e][t];if(i&&i.parentFields)for(let t=0;t<i.parentFields.length;t+=1){const o=this.props.parentChildMapping[e][i.parentFields[t]],s=o&&this.props.stepDataMapping[e]&&this.props.stepDataMapping[e][o.fieldId];if(!s||!s.value){n=!1;break}}return n};shouldShowStep=e=>{if(!this.props.showStepValidation)return!0;const t=this.props.step.id,n=this.props.stepMapping&&this.props.stepMapping[t];if("BUTTON"===e.type||"HTML"===e.type||"SECTION"===e.type)return!0;if(n&&e.activity_field){if(this.props.userConfig&&this.props.userConfig.viewAsIU)return!0;const n=!e.is_hidden,i=!0,{parentFields:o}=this.props.parentChildMapping[t][e.activity_field.machine_name],s=this.props.conditionalFieldMapping[t][e.activity_field.machine_name];let a=!0,l=!0;o&&(a=this.areParentValuesFilled(t,o)),s&&(l=ae(t,s,this.props.stepDataMapping));const r=a&&l;return n&&i&&r}return!1};stepIsOfType=e=>{const t=this.props.step.id,n=this.props.stepMapping&&this.props.stepMapping[t]||{step:this.props.step};return e.indexOf(n.step.activity?.type)>-1};textFieldParentHasValues=e=>{const t=this.props.step.id,n=this.props.stepMapping&&this.props.stepMapping[t]||{step:this.props.step},i=n.step.template_fields.filter((e=>e.is_visible)),o=!(!this.props?.userConfig||!this.props?.userConfig.viewAsIU)||n.selectedAuthId;if(!i.filter((e=>e.activity_field&&"DYNAMIC"===e.activity_field.type))[0])return!0;let s=!1;return i.forEach((t=>{const{activity_field:n}=t,{activity_field:i}=e;n?.child_fields?.includes(i.machine_name)&&(s=!0)})),!s||!!(i.length>0&&e&&e.activity_field&&o&&this.doParentFieldsHaveValues(t,e.activity_field.machine_name))};shouldShowOldMapping=()=>{const e=this.props.step.id,t=this.props.stepMapping&&this.props.stepMapping[e];if(this.stepIsOfType(["ADAPTER","ACTION"])){const n=t.step.template_fields.filter((e=>e.is_visible)),i=t.step.template_fields.filter((e=>e.is_visible&&"TEXTFIELD"===e.activity_field?.type)),o=t.selectedAuthId,s=n.filter((e=>e.activity_field&&"DYNAMIC"===e.activity_field.type))[0];if(i.length>0&&o&&!s&&!this.shouldShowNewMapping())return!0;if(!s)return!1;if(n.length>0&&o&&s&&s.activity_field&&this.doParentFieldsHaveValues(e,s.activity_field.machine_name)){const t=this.props.conditionalFieldMapping[e][s.activity_field.machine_name];return!t||ae(e,t,this.props.stepDataMapping)}return!1}return!1};shouldShowNewMapping=()=>{const{step:e,stepMapping:t}=this.props,n=t[e.id];if(this.stepIsOfType(["ADAPTER","ACTION"])){const e=n.step.template_fields.filter((e=>e.is_visible));if(e){if(e.filter((e=>e.activity_field&&"FIELD_MAPPING"===e.activity_field.type))[0])return!0}}return!1};getMappingDataInput=()=>{const e=this.props.step.id;return{authId:(this.props.stepMapping&&this.props.stepMapping[e]).selectedAuthId,fieldsData:this.getStepVisibleFieldsData(e)}};onFieldChange=e=>{let{stepId:t,fieldId:n,value:i,isRequired:o}=e;this.props.setStepFieldData({stepId:`${t}`,fieldId:`${n}`,value:i,isRequired:o}),this.props.clearChildFields({stepId:t,fieldId:n}),this.props.verifyStepValidity(Number(t))};fieldDynamicData=e=>{const t=this.props.step.id;if(this.props.stepMapping&&this.props.stepMapping[t]&&e.activity_field){const n=this.props.parentChildMapping[t][e.activity_field.machine_name]?.parentFields||null;if(n){return n.reduce(((e,n)=>{const{fieldId:i}=this.props.parentChildMapping[t][n];return i?{...e,[n]:this.props.stepDataMapping[t][i].value}:e}),{})}}return null};sourceFlowData=e=>{if(e.source_flow_integration_invocation_url){const{stepMapping:e,stepDataMapping:t}=this.props;return{steps:{...Object.keys(e).reduce(((n,i)=>{const{machine_name:o,id:s}=e[i].step;return o?{...n,[o]:{in:Object.keys(t[s]).reduce(((e,n)=>{const i=parseInt(n,10);if(t[s][i]){const{value:n,machineName:o}=t[s][i];return{...e,[o]:n}}return e}),{})}}:n}),{})}}}return null};isHTML=e=>!!/<\/?[a-z][\s\S]*>/i.test(e);getPlaceholder=e=>{let t="Incoming Webhook"===this.props.genericData.stepWithActivityOutput?.activity?.app?.name?this.props.genericData.selfAppName:this.props.genericData.stepWithActivityOutput?.activity?.app?.name||"";if(!t||t.includes("Webhook")){const e=this.props.step.source_steps,{stepMapping:n}=this.props,{props:i}=this;let o=null;Object.keys(e).forEach((e=>{const s=i.step.source_steps[e];o=s.app_id,s.app_name?t=s.app_name:Object.keys(n).every((e=>(n[e].step.authorization_type.app.id===s.app_id&&(t=n[e].step.activity.app.name),!0)))})),t?.includes("Incoming Webhook")&&null===o&&(t="Webhook")}return"TEXTAREA"===e.activity_field?.type||"TEXTFIELD"===e.activity_field?.type||"DYNAMIC"===e.activity_field?.type?!e.is_editable||e.is_mappable||e.allow_tags_in_text?!e.is_editable&&e.is_mappable?`Map to a ${t} field...`:e.is_editable&&(e.is_mappable||e.allow_tags_in_text)?`Enter text or map to a ${t} field...`:"Please enter a value":"Enter text...":"CHECKBOX"===e.activity_field?.type||"SELECT"===e.activity_field?.type||"RADIO"===e.activity_field?.type?!e.is_editable||e.is_mappable||e.allow_tags_in_text?!e.is_editable&&e.is_mappable?`Select a value or map to a ${t} field...`:e.is_editable&&e.allow_tags_in_text?`Enter text with ${t} fields or select a value...`:e.is_editable&&e.is_mappable?`Enter text, select a value or map to a ${t} field...`:"Select a value...":"Enter text or select a value...":"TEXTAREA"===e.activity_field?.type||"TEXTFIELD"===e.activity_field?.type?"Enter text...":"CHECKBOX"===e.activity_field?.type||"SELECT"===e.activity_field?.type||"RADIO"===e.activity_field?.type?"Select a value...":""};replacePlaceholders=(e,t)=>{const n={};return Object.entries(e).forEach((e=>{let[i,o]=e;if("string"==typeof o&&o.includes("{")){const e=o.match(/{(.*?)}/);if(e&&e[1]){const s=e[1],a=s.split(".").pop();void 0!==t[s]?n[i]=o.replace(e[0],t[s]):a&&void 0!==t[a]&&(n[i]=o.replace(e[0],t[a]))}}else"string"==typeof o&&o&&(n[i]=o)})),n};render(){const{step:e,stepMapping:t,stepDataMapping:n,setStepFieldData:i,showStepValidation:o,isReadOnly:s,accountConnected:a}=this.props,l=t[e.id]&&t[e.id].step||e,r=n&&n[e.id]||{},d={}||this.props.activityOutputData||{},p=0===l.template_fields?.length||!(this.props.userConfig&&this.props.userConfig.viewAsIU)&&0===l.template_fields?.filter((e=>e.is_visible)).length;return R`
+  `};var Js={actionFormWrap:"styles-module_actionFormWrap__1--9G",noStepFields:"styles-module_noStepFields__1NQe1",actionFormWrapAutoWidth:"styles-module_actionFormWrapAutoWidth__2Vs2x",unsupported:"styles-module_unsupported__2swxl",actionFormLoader:"styles-module_actionFormLoader__2AXe4"};ue('.styles-module_actionFormWrap__1--9G {\n  width: 100%;\n}\n.styles-module_actionFormWrap__1--9G .styles-module_noStepFields__1NQe1 {\n  font-family: "Inter";\n  font-weight: 400;\n  font-size: 14px;\n  line-height: 24px;\n  color: #999999;\n}\n\n.styles-module_actionFormWrapAutoWidth__2Vs2x {\n  margin-left: 24px;\n  margin-right: 24px;\n  width: auto;\n}\n\n.styles-module_unsupported__2swxl {\n  font-size: 12px;\n  color: #ca8c1b;\n}\n\n.styles-module_actionFormLoader__2AXe4 {\n  width: 15px;\n  margin: 0 auto;\n}');var Xs=B.connect(["stepState","stepMapping","stepDataMapping","parentChildMapping","fieldListMapping","conditionalFieldMapping","embedConfig","activityOutputData","genericData","userConfig","authMapping"],re)(class extends g{constructor(e){super(e),this.state={loading:!1,dynamicFieldDataState:{},tagsTree:this.props.tagsTree&&Object.keys(this.props.tagsTree).length>0?Yo(this.props.tagsTree):{}}}componentDidMount(){const{step:e,verifyStepValidity:t}=this.props;t(e.id);const n=this.props.genericData.stepWithActivityOutput;if(n){const{id:e}=n,t=this.getVisibleFieldsDataOnRootStep(e);this.setRootStepData(t)}else this.setRootStepData({})}componentDidUpdate(e){const{step:t,verifyStepValidity:n}=this.props;if(e.step.id!==t.id){n(t.id);const e=this.props.genericData.stepWithActivityOutput;if(e){const{id:t}=e,n=this.getVisibleFieldsDataOnRootStep(t);this.setRootStepData(n)}else this.setRootStepData({})}}getVisibleFieldsDataOnRootStep=e=>{const t=this.props.stepDataMapping[e];return Object.keys(t).filter((e=>t[Number(e)].value)).reduce(((e,n)=>{const i=t[Number(n)];return{...e,[i.machineName]:i.value}}),{})};refreshRootStepData=async e=>{const t=this.props.genericData.stepWithActivityOutput;if(t){const{id:n}=t,i=this.getVisibleFieldsDataOnRootStep(n);this.setRootStepData(i,!0,e)}else this.setRootStepData({},!0,e)};setActivityOutputFromSourceStep=(e,t,n)=>{const{setDynamicData:i}=this,o=this.setState.bind(this),s=this.props.step.source_steps,{stepMapping:a}=this.props,{props:l}=this;Object.keys(s).forEach((s=>{const r=l.step.source_steps[s];let d=!1;return Object.keys(a).every((p=>{const c=a[p].step.id;if(c&&(a[c].step.machine_name===s||a[c].step.machine_name===r.form_step_machine_name)&&!l.genericData.isTestIntegration){if(d=!0,r.activity_output_url){e||o({loading:!0});const n={},a=Object.keys(l.stepDataMapping[c]);for(let e=0;e<a.length;e+=1){const t=a[e],i=l.stepDataMapping[c][t];i.value&&(n[i.machineName]=i.value)}const d=r.activity_output_url.includes("functions/"),p=d?"POST":"GET";l.apiHandler.callDynamicDataEndpoint(new URL(r.activity_output_url),{authorization_id:`${l.stepMapping[c].selectedAuthId}`,...n},p).then((e=>{o({loading:!1});let n=!1;if(e){const t=e;d&&"output"in t?this.setActivityOutputFromIntegryObjectOrRawActivityOutput(t.output,r,s,!0):l.setActivityOutputData({activityOutputData:r.loop_variable_name?this.replaceContactPrefix(e,s,r):e})}else n=!0;t&&t(n)})),r.sample_data_endpoint_url&&c&&i(r.sample_data_endpoint_url,c,{...n})}else r.activity_output&&(o({loading:!1}),t&&t(),this.setActivityOutputFromIntegryObjectOrRawActivityOutput(n,r,s));return!1}return!((l.genericData.isTestIntegration||!r.app_id&&!this.canOverrideIntegryObject(n))&&r.activity_output)||(o({loading:!1}),t&&t(),d=!0,this.setActivityOutputFromRawActivityOutput(r,s),!1)})),!d&&r.activity_output?(this.setActivityOutputFromIntegryObjectOrRawActivityOutput(n,r,s),o({loading:!1}),t&&t(),d=!0,!1):!d}))};replaceContactPrefix=(e,t,n)=>{const i=`steps.${t}.out.${n.loop_variable_name?`${n.loop_variable_name}`:""}`;return e.map((e=>({...e,value:e.value.replace("contact_v1",i)})))};setActivityOutputFromRawActivityOutput=(()=>{var e=this;return function(t){let n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"";try{let i={};i=t.activity_output;const o=Yo(i,"",`steps.${n}.out.${t.loop_variable_name?`${t.loop_variable_name}.`:""}`),s=Qo(i,"",`steps.${n}.out.${t.loop_variable_name?`${t.loop_variable_name}.`:""}`);e.props.setIncomingWebhookPayload({incomingWebhookPayload:i}),e.props.setActivityOutputData({activityOutputData:o||[]}),e.props.setDynamicFieldData({dynamicFieldData:s||{}}),e.setState({dynamicFieldDataState:s||{}})}catch(e){console.error(e)}}})();setDynamicData=(e,t,n)=>{this.props.apiHandler.callDynamicDataEndpoint(new URL(e),{authorization_id:`${this.props.stepMapping[t].selectedAuthId}`,...n}).then((e=>{e&&(this.props.setDynamicFieldData({dynamicFieldData:e}),this.setState({dynamicFieldDataState:e}))}))};canOverrideIntegryObject=e=>{if(e)try{const t=JSON.parse(e);if(this.props.userConfig?.objects?.[t.name])return!0}catch(e){return!1}return!1};setActivityOutputFromIntegryObjectOrRawActivityOutput=(()=>{var e=this;return function(t,n){let i=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"",o=arguments.length>3&&void 0!==arguments[3]&&arguments[3];if(t)try{let s={};if(o)s=t;else{const n=JSON.parse(t);s=e.props.userConfig?.objects?.[n.name]?e.props.userConfig?.objects?.[n.name]:JSON.parse(n.payload)}const a=Yo(s,"",`steps.${i}.out.${n.loop_variable_name?`${n.loop_variable_name}.`:""}`),l=Qo(s,"",`steps.${i}.out.${n.loop_variable_name?`${n.loop_variable_name}.`:""}`);e.props.setIncomingWebhookPayload({incomingWebhookPayload:s}),e.props.setActivityOutputData({activityOutputData:a||[]}),e.props.setDynamicFieldData({dynamicFieldData:l||{}}),e.setState({dynamicFieldDataState:l||{}})}catch(e){console.error(e)}else e.setActivityOutputFromRawActivityOutput(n,i)}})();setRootStepData=async(e,t,n)=>{const i=this.props.genericData.stepWithActivityOutput;let o=i?.template_fields.find((e=>"integry_webhook_object"===e.activity_field?.machine_name))?.default_value;if(o){let e={};try{e=JSON.parse(o||"{}")}catch(t){e={}}e={payload:o||"{}",name:i?.template_fields.find((e=>"payload_name"===e.activity_field?.machine_name))?.default_value||"payload"},o=JSON.stringify(e)}if(this.props.setActivityOutputData({activityOutputData:[]}),this.props.step.source_steps&&Object.keys(this.props.step.source_steps).length>0)this.setActivityOutputFromSourceStep(t,n,o);else if(i){const{id:s}=i;i.activity.activity_output_url?(t||this.setState({loading:!0}),this.props.apiHandler.callDynamicDataEndpoint(new URL(i.activity.activity_output_url),{authorization_id:`${this.props.stepMapping[s].selectedAuthId}`,...e}).then((e=>{this.setState({loading:!1}),n&&n(),e&&this.props.setActivityOutputData({activityOutputData:e})}))):i.activity.activity_output?(this.setActivityOutputFromIntegryObjectOrRawActivityOutput(o,i.activity),this.setState({loading:!1}),n&&n()):(this.setState({loading:!1}),n&&n()),i.activity.dynamic_field_data_endpoint&&this.setDynamicData(i.activity.dynamic_field_data_endpoint,s,e)}};removeCurlyBraces=e=>e.replace(/^{(.*)}$/,"$1");isNotJSON=e=>{try{return!(Array.isArray(e)&&e.length>0&&"object"==typeof e[0])&&(JSON.parse(e),!!Number(e))}catch(e){return!0}};arrayToNestedJSONWithFirstValue=(e,t)=>{let n={},i=[];e&&Array.isArray(e)&&(i=e),Object.keys(t||{}).forEach((e=>{const i=this.removeCurlyBraces(e);n={...n,[i]:t[e]||""}}));let o={};(i||[]).forEach((e=>{o={...o,[e.text]:t[e.value]||""}}));const s={};return(i||[]).forEach((e=>{if(!e.text||!e.value)return;const t=e.text.split(".");let i=s;t.forEach(((o,s)=>{i[o]||(s===t.length-1?n[e.value]&&n[e.value][0]&&this.isNotJSON(n[e.value][0])?i[o]=n[e.value][0]||"":i[o]="":i[o]={}),i=i[o]}))})),s};getFieldValFromActivityOutputRaw=(e,t)=>{const n=t.match(/{([^}]+)}/g);let i=t;return(n||[]).forEach((t=>{const n=t.replace(/{|}/g,"");(e||[]).forEach((e=>{e.text===n&&(i=i.replace(t,`{${e.value}}`))}))})),i};getStepVisibleFieldsData=e=>{const t=this.props.stepDataMapping[e];return Object.keys(t).filter((e=>t[Number(e)].value)).reduce(((e,n)=>{const i=t[Number(n)];return{...e,[i.machineName]:i.value}}),{})};areParentValuesFilled=(e,t)=>{let n=!0;for(let i=0;i<t.length;i+=1){const o=t[i];let s=null;this.props.parentChildMapping[e][o]&&(s=this.props.parentChildMapping[e][o].fieldId);const a=s&&this.props.stepDataMapping[e]&&this.props.stepDataMapping[e][s];if(!a||!a.value){n=!1;break}}return n};doParentFieldsHaveValues=(e,t)=>{let n=!0;const i=this.props.parentChildMapping[e][t];if(i&&i.parentFields)for(let t=0;t<i.parentFields.length;t+=1){const o=this.props.parentChildMapping[e][i.parentFields[t]],s=o&&this.props.stepDataMapping[e]&&this.props.stepDataMapping[e][o.fieldId];if(!s||!s.value){n=!1;break}}return n};shouldShowStep=e=>{if(!this.props.showStepValidation)return!0;const t=this.props.step.id,n=this.props.stepMapping&&this.props.stepMapping[t];if("BUTTON"===e.type||"HTML"===e.type||"SECTION"===e.type)return!0;if(n&&e.activity_field){if(this.props.userConfig&&this.props.userConfig.viewAsIU)return!0;const n=!e.is_hidden,i=!0,{parentFields:o}=this.props.parentChildMapping[t][e.activity_field.machine_name],s=this.props.conditionalFieldMapping[t][e.activity_field.machine_name];let a=!0,l=!0;o&&(a=this.areParentValuesFilled(t,o)),s&&(l=ae(t,s,this.props.stepDataMapping));const r=a&&l;return n&&i&&r}return!1};stepIsOfType=e=>{const t=this.props.step.id,n=this.props.stepMapping&&this.props.stepMapping[t]||{step:this.props.step};return e.indexOf(n.step.activity?.type)>-1};textFieldParentHasValues=e=>{const t=this.props.step.id,n=this.props.stepMapping&&this.props.stepMapping[t]||{step:this.props.step},i=n.step.template_fields.filter((e=>e.is_visible)),o=!(!this.props?.userConfig||!this.props?.userConfig.viewAsIU)||n.selectedAuthId;if(!i.filter((e=>e.activity_field&&"DYNAMIC"===e.activity_field.type))[0])return!0;let s=!1;return i.forEach((t=>{const{activity_field:n}=t,{activity_field:i}=e;n?.child_fields?.includes(i.machine_name)&&(s=!0)})),!s||!!(i.length>0&&e&&e.activity_field&&o&&this.doParentFieldsHaveValues(t,e.activity_field.machine_name))};shouldShowOldMapping=()=>{const e=this.props.step.id,t=this.props.stepMapping&&this.props.stepMapping[e];if(this.stepIsOfType(["ADAPTER","ACTION"])){const n=t.step.template_fields.filter((e=>e.is_visible)),i=t.step.template_fields.filter((e=>e.is_visible&&"TEXTFIELD"===e.activity_field?.type)),o=t.selectedAuthId,s=n.filter((e=>e.activity_field&&"DYNAMIC"===e.activity_field.type))[0];if(i.length>0&&o&&!s&&!this.shouldShowNewMapping())return!0;if(!s)return!1;if(n.length>0&&o&&s&&s.activity_field&&this.doParentFieldsHaveValues(e,s.activity_field.machine_name)){const t=this.props.conditionalFieldMapping[e][s.activity_field.machine_name];return!t||ae(e,t,this.props.stepDataMapping)}return!1}return!1};shouldShowNewMapping=()=>{const{step:e,stepMapping:t}=this.props,n=t[e.id];if(this.stepIsOfType(["ADAPTER","ACTION"])){const e=n.step.template_fields.filter((e=>e.is_visible));if(e){if(e.filter((e=>e.activity_field&&"FIELD_MAPPING"===e.activity_field.type))[0])return!0}}return!1};getMappingDataInput=()=>{const e=this.props.step.id;return{authId:(this.props.stepMapping&&this.props.stepMapping[e]).selectedAuthId,fieldsData:this.getStepVisibleFieldsData(e)}};onFieldChange=e=>{let{stepId:t,fieldId:n,value:i,isRequired:o,machineName:s}=e;this.props.onFieldChangeCallback?this.props.onFieldChangeCallback(s||"",i):(this.props.setStepFieldData({stepId:`${t}`,fieldId:`${n}`,value:i,isRequired:o}),this.props.clearChildFields({stepId:t,fieldId:n}),this.props.verifyStepValidity(Number(t)))};fieldDynamicData=e=>{const t=this.props.step.id;if(this.props.stepMapping&&this.props.stepMapping[t]&&e.activity_field){const n=this.props.parentChildMapping[t][e.activity_field.machine_name]?.parentFields||null;if(n){return n.reduce(((e,n)=>{const{fieldId:i}=this.props.parentChildMapping[t][n];return i?{...e,[n]:this.props.stepDataMapping[t][i].value}:e}),{})}}return null};sourceFlowData=e=>{if(e.source_flow_integration_invocation_url){const{stepMapping:e,stepDataMapping:t}=this.props;return{steps:{...Object.keys(e).reduce(((n,i)=>{const{machine_name:o,id:s}=e[i].step;return o?{...n,[o]:{in:Object.keys(t[s]).reduce(((e,n)=>{const i=parseInt(n,10);if(t[s][i]){const{value:n,machineName:o}=t[s][i];return{...e,[o]:n}}return e}),{})}}:n}),{})}}}return null};isHTML=e=>!!/<\/?[a-z][\s\S]*>/i.test(e);getPlaceholder=e=>{let t="Incoming Webhook"===this.props.genericData.stepWithActivityOutput?.activity?.app?.name?this.props.genericData.selfAppName:this.props.genericData.stepWithActivityOutput?.activity?.app?.name||"";if(!t||t.includes("Webhook")){const e=this.props.step.source_steps,{stepMapping:n}=this.props,{props:i}=this;let o=null;Object.keys(e).forEach((e=>{const s=i.step.source_steps[e];o=s.app_id,s.app_name?t=s.app_name:Object.keys(n).every((e=>(n[e].step.authorization_type.app.id===s.app_id&&(t=n[e].step.activity.app.name),!0)))})),t?.includes("Incoming Webhook")&&null===o&&(t="Webhook")}return"TEXTAREA"===e.activity_field?.type||"TEXTFIELD"===e.activity_field?.type||"DYNAMIC"===e.activity_field?.type?!e.is_editable||e.is_mappable||e.allow_tags_in_text?!e.is_editable&&e.is_mappable?`Map to a ${t} field...`:e.is_editable&&(e.is_mappable||e.allow_tags_in_text)?`Enter text or map to a ${t} field...`:"Please enter a value":"Enter text...":"CHECKBOX"===e.activity_field?.type||"SELECT"===e.activity_field?.type||"RADIO"===e.activity_field?.type?!e.is_editable||e.is_mappable||e.allow_tags_in_text?!e.is_editable&&e.is_mappable?`Select a value or map to a ${t} field...`:e.is_editable&&e.allow_tags_in_text?`Enter text with ${t} fields or select a value...`:e.is_editable&&e.is_mappable?`Enter text, select a value or map to a ${t} field...`:"Select a value...":"Enter text or select a value...":"TEXTAREA"===e.activity_field?.type||"TEXTFIELD"===e.activity_field?.type?"Enter text...":"CHECKBOX"===e.activity_field?.type||"SELECT"===e.activity_field?.type||"RADIO"===e.activity_field?.type?"Select a value...":""};replacePlaceholders=(e,t)=>{const n={};return Object.entries(e).forEach((e=>{let[i,o]=e;if("string"==typeof o&&o.includes("{")){const e=o.match(/{(.*?)}/);if(e&&e[1]){const s=e[1],a=s.split(".").pop();void 0!==t[s]?n[i]=o.replace(e[0],t[s]):a&&void 0!==t[a]&&(n[i]=o.replace(e[0],t[a]))}}else"string"==typeof o&&o&&(n[i]=o)})),n};render(){const{step:e,stepMapping:t,stepDataMapping:n,setStepFieldData:i,showStepValidation:o,isReadOnly:s,accountConnected:a}=this.props,l=t[e.id]&&t[e.id].step||e,r=n&&n[e.id]||{},d={}||this.props.activityOutputData||{},p=0===l.template_fields?.length||!(this.props.userConfig&&this.props.userConfig.viewAsIU)&&0===l.template_fields?.filter((e=>e.is_visible)).length;return R`
       ${this.state.loading?R`<div class=${Js.actionFormLoader}><${Ye} /></div>`:R`
             ${l?R`
                   <div
@@ -3404,7 +3404,7 @@
                                   isHidden=${t.is_hidden}
                                   isSearchable=${!0}
                                   value=${r&&r[t.id]&&r[t.id].value||t.default_value||""}
-                                  onChange=${n=>{this.onFieldChange({stepId:e.id,fieldId:t.id,value:n,isRequired:t.is_required})}}
+                                  onChange=${n=>{this.onFieldChange({stepId:e.id,fieldId:t.id,value:n,isRequired:t.is_required,machineName:t.activity_field?.machine_name})}}
                                   endpointUrl=${_||t.source_flow_integration_invocation_url||t.activity_field?.data_src}
                                   isDynamic=${t.activity_field?.is_dynamic}
                                   endpointData=${JSON.stringify({authorization_id:this.props.stepMapping&&this.props.stepMapping[this.props.step.id]?.selectedAuthId,...this.fieldDynamicData(t)})}
@@ -3465,7 +3465,7 @@
                                     regexErrorMessage=${r[t.id]?r[t.id].regexErrorMessage:""}
                                     isRequired=${t.is_required}
                                     isHidden=${t.is_hidden}
-                                    onChange=${(n,o)=>{i({stepId:`${e.id}`,fieldId:`${t.id}`,value:this.getFieldValFromActivityOutputRaw(this.props.activityOutputData,n),isRequired:t.is_required,passesRegexTest:o}),this.props.verifyStepValidity(e.id)}}
+                                    onChange=${(n,o)=>{this.props.onFieldChangeCallback?this.props.onFieldChangeCallback(t.activity_field?.machine_name||"",n):(i({stepId:`${e.id}`,fieldId:`${t.id}`,value:this.getFieldValFromActivityOutputRaw(this.props.activityOutputData,n),isRequired:t.is_required,passesRegexTest:o}),this.props.verifyStepValidity(e.id))}}
                                     isReadOnly=${s}
                                     isChanged=${n&&n.isChanged}
                                     type=${t.activity_field?.type}
@@ -3612,7 +3612,7 @@
                                   showStepValidation=${o}
                                   isRequired=${t.is_required}
                                   isHidden=${t.is_hidden}
-                                  onChange=${(n,o)=>{i({stepId:`${e.id}`,fieldId:`${t.id}`,value:n,isRequired:t.is_required,passesRegexTest:o}),this.props.verifyStepValidity(e.id)}}
+                                  onChange=${(n,o)=>{this.props.onFieldChangeCallback?this.props.onFieldChangeCallback(t.activity_field?.machine_name||"",n):(i({stepId:`${e.id}`,fieldId:`${t.id}`,value:n,isRequired:t.is_required,passesRegexTest:o}),this.props.verifyStepValidity(e.id))}}
                                   isReadOnly=${s}
                                   isChanged=${n&&n.isChanged}
                                   type=${t.activity_field?.type}
@@ -7000,7 +7000,7 @@
               </div>
             </div>
           `}
-    `}});class Rd{static SDK_VERSION="4.5.6";config;apiHandler;initConfig;eventEmitter=(()=>new G)();static html=(()=>R)();static RenderModes=(()=>ee)();static TemplateFormRenderModes=(()=>Y)();static Layouts=(()=>X)();static ViewStyles=(()=>J)();static MarketplaceRenderModes=(()=>Q)();static Helpers;authModalId="";forceRerender=!1;constructor(e){let t;const n=e.baseUrl||"https://app.integry.io",i=e;if(i.user){const{userId:e,apiKey:t,...n}=i.user;"userId"in i||(i.userId=""),"userId"in i&&(i.userId=e.toString()),i.xIntegryConfig||(i.xIntegryConfig={}),i.xIntegryConfig.appAuth||(i.xIntegryConfig.appAuth={}),i.xIntegryConfig.appAuth.extras||(i.xIntegryConfig.appAuth.extras={}),i.xIntegryConfig.appAuth.apiKey=(t||"").toString(),i.xIntegryConfig.appAuth.extras=n}const o={oauthVerifyPath:"auth/verify",endpointsUrl:"https://integry-app.appspot.com",baseUrl:n,baseUrlv2:`${n}/v2`,baseAPIUrl:"https://api.integry.io",apiKey:i.xIntegryConfig?.appAuth?.apiKey,authId:i.xIntegryConfig?.appAuth?.authId,extras:i.xIntegryConfig?.appAuth?.extras},s=i.options||i.userConfig||{};if(i.options&&i.payloads&&(i.options.objects=e.payloads),"appKey"in i)t={...i,...o,appKey:i.appKey,hash:i.hash,userId:i.userId},this.config={...i,...o,appKey:i.appKey,hash:i.hash,userId:i.userId,deploymentId:i.deploymentId,userConfig:i.deploymentId?{...s,tags:s?.tags?[...s?.tags,`${i.deploymentId}`]:[`${i.deploymentId}`]}:s};else{const e=this.getAuthParamsFromUrl()||{};t={...o,...e},this.config={...o,...e,userConfig:i.userConfig}}this.authModalId=this.getRandomFlowId(6),this.apiHandler=new j(t),this.verifyAuthConfig().then((e=>{e?.config_verified?this.eventEmitter.emit("ready",{isReady:!0}):console.error("IntegrySDK: Auth config verification failed, are your auth parameters correct?")})).catch((e=>console.error(e))),this.initConfig={containerId:"",renderMode:Y.INLINE}}SDKFailedHandler=(e,t)=>{const n=e.options||e.userConfig||{},i=document.getElementById(t);throw i&&T(R`
+    `}});class Rd{static SDK_VERSION="4.5.7";config;apiHandler;initConfig;eventEmitter=(()=>new G)();static html=(()=>R)();static RenderModes=(()=>ee)();static TemplateFormRenderModes=(()=>Y)();static Layouts=(()=>X)();static ViewStyles=(()=>J)();static MarketplaceRenderModes=(()=>Q)();static Helpers;authModalId="";forceRerender=!1;constructor(e){let t;const n=e.baseUrl||"https://app.integry.io",i=e;if(i.user){const{userId:e,apiKey:t,...n}=i.user;"userId"in i||(i.userId=""),"userId"in i&&(i.userId=e.toString()),i.xIntegryConfig||(i.xIntegryConfig={}),i.xIntegryConfig.appAuth||(i.xIntegryConfig.appAuth={}),i.xIntegryConfig.appAuth.extras||(i.xIntegryConfig.appAuth.extras={}),i.xIntegryConfig.appAuth.apiKey=(t||"").toString(),i.xIntegryConfig.appAuth.extras=n}const o={oauthVerifyPath:"auth/verify",endpointsUrl:"https://integry-app.appspot.com",baseUrl:n,baseUrlv2:`${n}/v2`,baseAPIUrl:"https://api.integry.io",apiKey:i.xIntegryConfig?.appAuth?.apiKey,authId:i.xIntegryConfig?.appAuth?.authId,extras:i.xIntegryConfig?.appAuth?.extras},s=i.options||i.userConfig||{};if(i.options&&i.payloads&&(i.options.objects=e.payloads),"appKey"in i)t={...i,...o,appKey:i.appKey,hash:i.hash,userId:i.userId},this.config={...i,...o,appKey:i.appKey,hash:i.hash,userId:i.userId,deploymentId:i.deploymentId,userConfig:i.deploymentId?{...s,tags:s?.tags?[...s?.tags,`${i.deploymentId}`]:[`${i.deploymentId}`]}:s};else{const e=this.getAuthParamsFromUrl()||{};t={...o,...e},this.config={...o,...e,userConfig:i.userConfig}}this.authModalId=this.getRandomFlowId(6),this.apiHandler=new j(t),this.verifyAuthConfig().then((e=>{e?.config_verified?this.eventEmitter.emit("ready",{isReady:!0}):console.error("IntegrySDK: Auth config verification failed, are your auth parameters correct?")})).catch((e=>console.error(e))),this.initConfig={containerId:"",renderMode:Y.INLINE}}SDKFailedHandler=(e,t)=>{const n=e.options||e.userConfig||{},i=document.getElementById(t);throw i&&T(R`
           <${nl}
             message="SDK failed to load"
             debug=${n.debug}
@@ -7277,7 +7277,7 @@
                 fieldId=${n.fieldId}
                 enableTagify=${n.enableTagify}
               />`}
-        </div>`,i):console.warn(`Integry SDK render target with id ${t} was not found`)};renderFlowStep=(()=>{var e=this;return function(t,n,i){let o=arguments.length>3&&void 0!==arguments[3]?arguments[3]:{};const s=document.getElementById(t);if(s){const t=de();T(R`<div>
+        </div>`,i):console.warn(`Integry SDK render target with id ${t} was not found`)};renderFlowStep=(()=>{var e=this;return function(t,n,i){let o=arguments.length>3&&void 0!==arguments[3]?arguments[3]:{},s=arguments.length>4?arguments[4]:void 0;const a=document.getElementById(t);if(a){const t=de();T(R`<div>
           <${ne.Provider}
             value=${{apiHandler:e.apiHandler,eventEmitter:e.eventEmitter,isPreviewMode:!1}}
           >
@@ -7292,7 +7292,8 @@
                 selectedAuthId="${i}"
                 accountConnected=${!0}
                 tagsTree=${o}
+                onFieldChangeCallback=${s}
               />
             <//>
           <//>
-        </div>`,s)}else console.warn(`Integry SDK render target with id ${t} was not found`)}})();verifyAuthConfig=()=>this.apiHandler.verifyAuthConfig({deploymentId:this.config.deploymentId});getUserVariables=async()=>{try{const e=await this.apiHandler.getUserVariables();return e?e.results:[]}catch(e){return console.error(e),[]}};destroy=()=>{try{this.eventEmitter.offAll();const e=document.getElementById(this.authModalId);e&&e.remove()}catch(e){console.error("There was an error unsubscribing from all events")}};static setFieldValue=(e,t)=>{const n=document.getElementById(e)?.querySelector("input");if(n&&n instanceof HTMLInputElement){n.value=t;const e=new KeyboardEvent("keyup",{key:"a",bubbles:!0,cancelable:!0});n.dispatchEvent(e)}const i=document.getElementById(`tagify_${e}`);if(i&&i instanceof HTMLInputElement){i.value=t;const e=new KeyboardEvent("keyup",{key:"a",bubbles:!0,cancelable:!0});i.dispatchEvent(e)}};getMethod=()=>"POST";getBaseAPIUrl=()=>"https://api.integry.io";getHeaders=()=>({"Content-Type":"application/json"})}return Rd.Helpers={getAuthHash:async function(e,t){const n=e=>new Uint8Array([...unescape(encodeURIComponent(e))].map((e=>e.charCodeAt(0)))),i=n(t),o=n(e),s=await crypto.subtle.importKey("raw",i,{name:"HMAC",hash:"SHA-256"},!0,["sign"]),a=await crypto.subtle.sign("HMAC",s,o);return[...new Uint8Array(a)].map((e=>e.toString(16).padStart(2,"0"))).join("")}},Rd.html=R,Rd}));
+        </div>`,a)}else console.warn(`Integry SDK render target with id ${t} was not found`)}})();verifyAuthConfig=()=>this.apiHandler.verifyAuthConfig({deploymentId:this.config.deploymentId});getUserVariables=async()=>{try{const e=await this.apiHandler.getUserVariables();return e?e.results:[]}catch(e){return console.error(e),[]}};destroy=()=>{try{this.eventEmitter.offAll();const e=document.getElementById(this.authModalId);e&&e.remove()}catch(e){console.error("There was an error unsubscribing from all events")}};static setFieldValue=(e,t)=>{const n=document.getElementById(e)?.querySelector("input");if(n&&n instanceof HTMLInputElement){n.value=t;const e=new KeyboardEvent("keyup",{key:"a",bubbles:!0,cancelable:!0});n.dispatchEvent(e)}const i=document.getElementById(`tagify_${e}`);if(i&&i instanceof HTMLInputElement){i.value=t;const e=new KeyboardEvent("keyup",{key:"a",bubbles:!0,cancelable:!0});i.dispatchEvent(e)}};getMethod=()=>"POST";getBaseAPIUrl=()=>"https://api.integry.io";getHeaders=()=>({"Content-Type":"application/json"})}return Rd.Helpers={getAuthHash:async function(e,t){const n=e=>new Uint8Array([...unescape(encodeURIComponent(e))].map((e=>e.charCodeAt(0)))),i=n(t),o=n(e),s=await crypto.subtle.importKey("raw",i,{name:"HMAC",hash:"SHA-256"},!0,["sign"]),a=await crypto.subtle.sign("HMAC",s,o);return[...new Uint8Array(a)].map((e=>e.toString(16).padStart(2,"0"))).join("")}},Rd.html=R,Rd}));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@integry/sdk",
-  "version": "4.5.6",
+  "version": "4.5.7",
   "description": "Integry SDK",
   "main": "dist/umd/index.umd.js",
   "module": "dist/esm/index.csm.js",

package/src/components/MultipurposeField/Dropdown/index.tsx

@@ -276,6 +276,7 @@ const ListBox = (props: ListBoxProps) => {
         data = JSON.parse(endpointData) || {};
         if (selectedAuthId) {
           data.connected_account_id = selectedAuthId;
+          data.authorization_id = selectedAuthId;
         }
       } catch (error) {
         data = '';

package/src/features/common/ActionForm/index.ts

@@ -47,6 +47,7 @@ interface ActionFormPropsType extends StoreType {
   accountConnected: boolean;
   selectedAuthId: string;
   tagsTree: any;
+  onFieldChangeCallback?: (fieldId: string, value: string) => void;
 }
 
 interface ActionFormStateType {
@@ -922,20 +923,27 @@ class ActionForm extends Component<ActionFormPropsType, ActionFormStateType> {
     fieldId,
     value,
     isRequired,
+    machineName,
   }: {
     stepId: number;
     fieldId: number;
     value: string;
     isRequired: boolean;
+    machineName?: string;
   }) => {
-    this.props.setStepFieldData({
-      stepId: `${stepId}`,
-      fieldId: `${fieldId}`,
-      value,
-      isRequired,
-    });
-    this.props.clearChildFields({ stepId, fieldId });
-    this.props.verifyStepValidity(Number(stepId));
+    // we want to check if callback function is passed in props, if yes then call it
+    if (this.props.onFieldChangeCallback) {
+      this.props.onFieldChangeCallback(machineName || '', value);
+    } else {
+      this.props.setStepFieldData({
+        stepId: `${stepId}`,
+        fieldId: `${fieldId}`,
+        value,
+        isRequired,
+      });
+      this.props.clearChildFields({ stepId, fieldId });
+      this.props.verifyStepValidity(Number(stepId));
+    }
   };
 
   private fieldDynamicData = (field: TemplateField) => {
@@ -1235,6 +1243,8 @@ class ActionForm extends Component<ActionFormPropsType, ActionFormStateType> {
                                       fieldId: el.id,
                                       value: val,
                                       isRequired: el.is_required,
+                                      machineName:
+                                        el.activity_field?.machine_name,
                                     });
                                   }}
                                   endpointUrl=${
@@ -1381,17 +1391,24 @@ class ActionForm extends Component<ActionFormPropsType, ActionFormStateType> {
                                       val: string,
                                       passesRegexTest?: boolean,
                                     ) => {
-                                      setStepFieldData({
-                                        stepId: `${step.id}`,
-                                        fieldId: `${el.id}`,
-                                        value: this.getFieldValFromActivityOutputRaw(
-                                          this.props.activityOutputData,
+                                      if (this.props.onFieldChangeCallback) {
+                                        this.props.onFieldChangeCallback(
+                                          el.activity_field?.machine_name || '',
                                           val,
-                                        ),
-                                        isRequired: el.is_required,
-                                        passesRegexTest,
-                                      });
-                                      this.props.verifyStepValidity(step.id);
+                                        );
+                                      } else {
+                                        setStepFieldData({
+                                          stepId: `${step.id}`,
+                                          fieldId: `${el.id}`,
+                                          value: this.getFieldValFromActivityOutputRaw(
+                                            this.props.activityOutputData,
+                                            val,
+                                          ),
+                                          isRequired: el.is_required,
+                                          passesRegexTest,
+                                        });
+                                        this.props.verifyStepValidity(step.id);
+                                      }
                                     }}
                                     isReadOnly=${isReadOnly}
                                     isChanged=${
@@ -1693,14 +1710,21 @@ class ActionForm extends Component<ActionFormPropsType, ActionFormStateType> {
                                     val: string,
                                     passesRegexTest?: boolean,
                                   ) => {
-                                    setStepFieldData({
-                                      stepId: `${step.id}`,
-                                      fieldId: `${el.id}`,
-                                      value: val,
-                                      isRequired: el.is_required,
-                                      passesRegexTest,
-                                    });
-                                    this.props.verifyStepValidity(step.id);
+                                    if (this.props.onFieldChangeCallback) {
+                                      this.props.onFieldChangeCallback(
+                                        el.activity_field?.machine_name || '',
+                                        val,
+                                      );
+                                    } else {
+                                      setStepFieldData({
+                                        stepId: `${step.id}`,
+                                        fieldId: `${el.id}`,
+                                        value: val,
+                                        isRequired: el.is_required,
+                                        passesRegexTest,
+                                      });
+                                      this.props.verifyStepValidity(step.id);
+                                    }
                                   }}
                                   isReadOnly=${isReadOnly}
                                   isChanged=${

package/src/index.ts

@@ -1986,6 +1986,7 @@ export class IntegryJS {
     step: any,
     connectedAccountId: string,
     tagsTree = {},
+    onFieldChangeCallback?: (fieldId: string, value: string) => void,
   ) => {
     const target = document.getElementById(containerId);
 
@@ -2011,6 +2012,7 @@ export class IntegryJS {
                 selectedAuthId="${connectedAccountId}"
                 accountConnected=${true}
                 tagsTree=${tagsTree}
+                onFieldChangeCallback=${onFieldChangeCallback}
               />
             <//>
           <//>