@everymatrix/general-registration-multistep 1.87.33 → 1.87.34

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -14146,7 +14146,8 @@ const CONSTANTS = {
14146
14146
  STEP_THREE: 3,
14147
14147
  REMOVE_WHITESPACE_REGEX: /\s+/g,
14148
14148
  IDENTITY_CARD_NORMALIZED: "identitycard",
14149
- DATE_DASH_SEPARATOR_REGEX: /-/g
14149
+ DATE_DASH_SEPARATOR_REGEX: /-/g,
14150
+ ONLY_DIGITS_REGEX: /\D/g
14150
14151
  };
14151
14152
  const getTranslations = (url) => {
14152
14153
  // fetch url, get the data, replace the TRANSLATIONS content
@@ -14248,6 +14249,7 @@ const GeneralRegistrationMultistep = class {
14248
14249
  this.lastPostalCode = null;
14249
14250
  this.pinAttemptsExceeded = false;
14250
14251
  this.documentIdNineDigits = false;
14252
+ this.isTransitioning = false;
14251
14253
  this.selectedCountry = '';
14252
14254
  this.listOfInputValues = [];
14253
14255
  this.listOfInputValidity = [];
@@ -14371,22 +14373,36 @@ const GeneralRegistrationMultistep = class {
14371
14373
  this.isFormValid = !this.getInvalidStatus(this.listOfInputValidity);
14372
14374
  }
14373
14375
  getInputsValueHandler(event) {
14374
- var _a, _b, _c, _d;
14375
- this.listOfInputValues.find(input => {
14376
- if (input.name == event.detail.name) {
14377
- input.value = event.detail.value;
14378
- input.type = event.detail.type || null;
14379
- }
14380
- });
14376
+ var _a, _b;
14377
+ if (this.isTransitioning) {
14378
+ return;
14379
+ }
14380
+ const { name, value, type } = event.detail;
14381
+ // find the input andd add it if missing
14382
+ let inputItem = this.listOfInputValues.find(input => input.name == name);
14383
+ if (!inputItem) {
14384
+ // If the field (like ValidateSMS) is not in the list because formatConfig didn't clear the old step data
14385
+ // we force-add it so it can be saved and sent to the API
14386
+ inputItem = {
14387
+ name: name,
14388
+ value: value,
14389
+ isDuplicate: false,
14390
+ type: type || null
14391
+ };
14392
+ this.listOfInputValues = [...this.listOfInputValues, inputItem];
14393
+ }
14394
+ else {
14395
+ inputItem.value = value;
14396
+ inputItem.type = type || null;
14397
+ }
14381
14398
  // ---- Document type and document id logic - New custom registration for SA ---- //
14382
- const { name, value } = event.detail;
14383
14399
  // Check SA identity id if valid
14384
14400
  if (name === CONSTANTS.DOCUMENT_TYPE) {
14385
- let type = event.detail.value;
14386
- if ((type || "").replace(CONSTANTS.REMOVE_WHITESPACE_REGEX, "").toLowerCase() === CONSTANTS.IDENTITY_CARD_NORMALIZED) {
14387
- type = CONSTANTS.SOUTH_AFRICAN_ID;
14401
+ let docTypeValue = value;
14402
+ if ((docTypeValue || "").replace(CONSTANTS.REMOVE_WHITESPACE_REGEX, "").toLowerCase() === CONSTANTS.IDENTITY_CARD_NORMALIZED) {
14403
+ docTypeValue = CONSTANTS.SOUTH_AFRICAN_ID;
14388
14404
  }
14389
- window.documentTypeValue = type;
14405
+ window.documentTypeValue = docTypeValue;
14390
14406
  const docField = this.listOfInputValues.find(i => i.name === CONSTANTS.DOCUMENT_NUMBER);
14391
14407
  if (docField)
14392
14408
  docField.value = "";
@@ -14395,11 +14411,12 @@ const GeneralRegistrationMultistep = class {
14395
14411
  docValidity.isValid = false;
14396
14412
  window.dispatchEvent(new CustomEvent("documentNumberUpdatedExternally", { detail: "" }));
14397
14413
  window.dispatchEvent(new CustomEvent("documentNumberResetValidation"));
14414
+ this.stepsStateMachine({ event: 'set', type: 'values' });
14398
14415
  return;
14399
14416
  }
14400
- const docType = window.documentTypeValue;
14417
+ const docTypeContext = window.documentTypeValue;
14401
14418
  // Check if Passport value length and dispatch events to modify the birth date value
14402
- if (name === CONSTANTS.DOCUMENT_NUMBER && docType === CONSTANTS.PASSPORT) {
14419
+ if (name === CONSTANTS.DOCUMENT_NUMBER && docTypeContext === CONSTANTS.PASSPORT) {
14403
14420
  if (value.length === 8 || value.length === 9) {
14404
14421
  const extractedBirthDate = extractBirthDate(value);
14405
14422
  window.dispatchEvent(new CustomEvent('documentIdUpdated', { detail: extractedBirthDate || '' }));
@@ -14414,7 +14431,7 @@ const GeneralRegistrationMultistep = class {
14414
14431
  }
14415
14432
  // If number starts with '0', remove it
14416
14433
  if (name === CONSTANTS.MOBILE) {
14417
- const rawVal = (_b = (_a = event === null || event === void 0 ? void 0 : event.detail) === null || _a === void 0 ? void 0 : _a.value) !== null && _b !== void 0 ? _b : {};
14434
+ const rawVal = value !== null && value !== void 0 ? value : {};
14418
14435
  const phoneRaw = typeof rawVal.phone === "string" ? rawVal.phone : "";
14419
14436
  let phone = phoneRaw;
14420
14437
  if (phone.startsWith("0")) {
@@ -14423,14 +14440,13 @@ const GeneralRegistrationMultistep = class {
14423
14440
  const mobileField = this.listOfInputValues.find(i => i.name === CONSTANTS.MOBILE);
14424
14441
  if (mobileField) {
14425
14442
  mobileField.value = {
14426
- prefix: (_c = rawVal.prefix) !== null && _c !== void 0 ? _c : "",
14443
+ prefix: (_a = rawVal.prefix) !== null && _a !== void 0 ? _a : "",
14427
14444
  phone
14428
14445
  };
14429
14446
  }
14430
14447
  }
14431
14448
  // ---- Postal code lookup logic ---- //
14432
14449
  if (this.haspostalcodelookup) {
14433
- const { name, value } = event.detail;
14434
14450
  if (name === 'CountryCode') {
14435
14451
  this.selectedCountry = value;
14436
14452
  if (value === 'GB') {
@@ -14455,7 +14471,7 @@ const GeneralRegistrationMultistep = class {
14455
14471
  this.addresses.length === 0;
14456
14472
  if (shouldFetch) {
14457
14473
  const country = this.selectedCountry ||
14458
- ((_d = this.listOfInputValues.find(i => i.name === 'CountryCode')) === null || _d === void 0 ? void 0 : _d.value) || '';
14474
+ ((_b = this.listOfInputValues.find(i => i.name === 'CountryCode')) === null || _b === void 0 ? void 0 : _b.value) || '';
14459
14475
  if (this.selectedCountry === 'GB' || this.selectedCountry === 'UK') {
14460
14476
  if (this.addrDebounce)
14461
14477
  clearTimeout(this.addrDebounce);
@@ -14473,7 +14489,7 @@ const GeneralRegistrationMultistep = class {
14473
14489
  }
14474
14490
  }
14475
14491
  this.stepsStateMachine({ event: 'set', type: 'values' });
14476
- this.handleConditionalValidation(event.detail.name, event.detail.value);
14492
+ this.handleConditionalValidation(name, value);
14477
14493
  }
14478
14494
  handleAddressSelection(event) {
14479
14495
  const { city, address1, address2 } = event.detail;
@@ -14508,7 +14524,7 @@ const GeneralRegistrationMultistep = class {
14508
14524
  handleCountryCodeUpdateGlobal(event) {
14509
14525
  const { name } = event.detail;
14510
14526
  if (name === 'CountryCode') {
14511
- const savedState = localStorage.getItem('registrationStepsState');
14527
+ const savedState = sessionStorage.getItem('registrationStepsState');
14512
14528
  if (savedState) {
14513
14529
  const parsedState = JSON.parse(savedState);
14514
14530
  Object.keys(parsedState).forEach(stepKey => {
@@ -14520,7 +14536,7 @@ const GeneralRegistrationMultistep = class {
14520
14536
  });
14521
14537
  }
14522
14538
  });
14523
- localStorage.setItem('registrationStepsState', JSON.stringify(parsedState));
14539
+ sessionStorage.setItem('registrationStepsState', JSON.stringify(parsedState));
14524
14540
  }
14525
14541
  }
14526
14542
  }
@@ -14584,6 +14600,10 @@ const GeneralRegistrationMultistep = class {
14584
14600
  }
14585
14601
  async componentWillLoad() {
14586
14602
  await customElements.whenDefined('general-input');
14603
+ const navigationEntries = performance.getEntriesByType('navigation');
14604
+ if (navigationEntries.length > 0 && navigationEntries[0].type === 'reload') {
14605
+ sessionStorage.removeItem('registrationStepsState');
14606
+ }
14587
14607
  const config = await this.getRegisterConfig();
14588
14608
  this.formatConfig(config);
14589
14609
  this.isFormValid = !this.getInvalidStatus(this.listOfInputValidity);
@@ -14688,11 +14708,75 @@ const GeneralRegistrationMultistep = class {
14688
14708
  this.setRegisterStep();
14689
14709
  }
14690
14710
  backHandler(e) {
14711
+ var _a, _b, _c, _d;
14691
14712
  e.preventDefault();
14692
- this.registrationStep = this.stepChange('decrement');
14693
- this.errorMessage = '';
14694
- this.stepsStateMachine({ event: 'get', type: 'inputs' });
14695
- this.stepsStateMachine({ event: 'get', type: 'values' });
14713
+ this.isTransitioning = true;
14714
+ const stepBeforeBack = this.registrationStep;
14715
+ let targetStep = this.stepChange('decrement');
14716
+ if (stepBeforeBack === 'Step3') {
14717
+ targetStep = 'Step1';
14718
+ this.registrationID = null;
14719
+ this.registrationStepsState.regId = null;
14720
+ const savedUserData = JSON.parse(sessionStorage.getItem('registrationStepsState')) || {};
14721
+ const oldPrefix = ((_d = (_c = (_b = (_a = savedUserData === null || savedUserData === void 0 ? void 0 : savedUserData.Step1) === null || _a === void 0 ? void 0 : _a.registerUserData) === null || _b === void 0 ? void 0 : _b.Mobile) === null || _c === void 0 ? void 0 : _c.value) === null || _d === void 0 ? void 0 : _d.prefix) || '+27';
14722
+ sessionStorage.removeItem('registrationStepsState');
14723
+ this.registrationStepsState = {
14724
+ regId: null
14725
+ };
14726
+ this.listOfInputValues = [];
14727
+ this.getRegisterConfig().then(config => {
14728
+ this.formatConfig(config);
14729
+ this.registrationID = config.content.registrationID;
14730
+ setTimeout(() => {
14731
+ this.listOfInputValues = this.listOfInputs.map(field => {
14732
+ var _a;
14733
+ if (field.name === 'Mobile') {
14734
+ return { name: field.name, value: { prefix: oldPrefix, phone: '' }, isDuplicate: false, type: 'tel' };
14735
+ }
14736
+ return {
14737
+ name: field.name,
14738
+ value: ((_a = field.inputType) === null || _a === void 0 ? void 0 : _a.toLowerCase()) === 'checkbox' ? 'false' : null,
14739
+ isDuplicate: field.isDuplicateInput || false,
14740
+ type: field.inputType
14741
+ };
14742
+ });
14743
+ this.forms = Object.assign({}, this.forms);
14744
+ }, 100);
14745
+ });
14746
+ }
14747
+ this.registrationStep = targetStep;
14748
+ const savedDataAtTarget = JSON.parse(sessionStorage.getItem('registrationStepsState'));
14749
+ if (savedDataAtTarget && savedDataAtTarget[targetStep] && savedDataAtTarget[targetStep].fields) {
14750
+ const stepData = savedDataAtTarget[targetStep];
14751
+ this.listOfInputValidity = [...stepData.fieldsValidity];
14752
+ this.listOfInputs = [...stepData.fields];
14753
+ this.forms = Object.assign(Object.assign({}, this.forms), { [targetStep]: this.listOfInputs.map(input => (Object.assign({}, input))) });
14754
+ const savedValues = stepData.registerUserData || {};
14755
+ this.listOfInputValues = Object.keys(savedValues).length > 0
14756
+ ? Object.keys(savedValues).map(name => ({
14757
+ name,
14758
+ value: savedValues[name].value,
14759
+ isDuplicate: savedValues[name].isDuplicate
14760
+ }))
14761
+ : this.listOfInputs.map(field => {
14762
+ var _a;
14763
+ return ({
14764
+ name: field.name,
14765
+ value: ((_a = field.inputType) === null || _a === void 0 ? void 0 : _a.toLowerCase()) === 'checkbox' ? 'false' : null,
14766
+ isDuplicate: field.isDuplicateInput || false
14767
+ });
14768
+ });
14769
+ this.forms[targetStep] = this.forms[targetStep].map(input => {
14770
+ const savedData = this.listOfInputValues.find(v => v.name === input.name);
14771
+ return savedData ? Object.assign(Object.assign({}, input), { defaultValue: savedData.value }) : input;
14772
+ });
14773
+ }
14774
+ else if (stepBeforeBack !== 'Step3') {
14775
+ this.getRegisterConfig(this.registrationID).then(config => this.formatConfig(config));
14776
+ }
14777
+ this.forms = Object.assign({}, this.forms);
14778
+ this.isFormValid = !this.getInvalidStatus(this.listOfInputValidity);
14779
+ setTimeout(() => { this.isTransitioning = false; }, 300);
14696
14780
  }
14697
14781
  dispatchRegisterCredentialsEvent() {
14698
14782
  let userNameEmail = '';
@@ -14723,10 +14807,10 @@ const GeneralRegistrationMultistep = class {
14723
14807
  stepsStateMachine(state) {
14724
14808
  var _a;
14725
14809
  const saveToLocalStorage = () => {
14726
- localStorage.setItem('registrationStepsState', JSON.stringify(this.registrationStepsState));
14810
+ sessionStorage.setItem('registrationStepsState', JSON.stringify(this.registrationStepsState));
14727
14811
  };
14728
14812
  const loadFromLocalStorage = () => {
14729
- return JSON.parse(localStorage.getItem('registrationStepsState'));
14813
+ return JSON.parse(sessionStorage.getItem('registrationStepsState'));
14730
14814
  };
14731
14815
  switch (state.event) {
14732
14816
  case 'set':
@@ -14738,7 +14822,9 @@ const GeneralRegistrationMultistep = class {
14738
14822
  currentStep.fieldsValidity = this.listOfInputValidity;
14739
14823
  }
14740
14824
  if (state.type == 'values') {
14741
- // Map input values into the current step state
14825
+ if (!this.registrationStepsState[this.registrationStep]) {
14826
+ this.registrationStepsState[this.registrationStep] = {};
14827
+ }
14742
14828
  const currentStep = this.registrationStepsState[this.registrationStep];
14743
14829
  currentStep.registerUserData = this.listOfInputValues.reduce((acc, curr) => {
14744
14830
  acc[curr.name] = { value: curr.value, isDuplicate: curr.isDuplicate };
@@ -14749,21 +14835,42 @@ const GeneralRegistrationMultistep = class {
14749
14835
  break;
14750
14836
  case 'get':
14751
14837
  const savedUserData = loadFromLocalStorage();
14752
- if (!savedUserData)
14838
+ if (!savedUserData || !savedUserData[this.registrationStep])
14753
14839
  return;
14754
14840
  if (state.type == 'inputs') {
14755
14841
  // Load input-related data from the saved state
14756
- const currentStep = this.registrationStepsState[this.registrationStep];
14842
+ const currentStep = savedUserData[this.registrationStep];
14757
14843
  this.listOfInputs = currentStep.fields;
14758
14844
  this.listOfActions = currentStep.actions;
14759
14845
  this.listOfInputValidity = currentStep.fieldsValidity;
14846
+ if (!this.registrationStepsState[this.registrationStep]) {
14847
+ this.registrationStepsState[this.registrationStep] = {};
14848
+ }
14849
+ this.registrationStepsState[this.registrationStep].fields = currentStep.fields;
14850
+ this.registrationStepsState[this.registrationStep].fieldsValidity = currentStep.fieldsValidity;
14760
14851
  }
14761
14852
  if (state.type == 'values') {
14762
- const savedValues = savedUserData[this.registrationStep].registerUserData;
14853
+ const stepEntry = savedUserData[this.registrationStep];
14854
+ if (!stepEntry || !stepEntry.registerUserData || Object.keys(stepEntry.registerUserData).length === 0) {
14855
+ return;
14856
+ }
14857
+ const savedValues = stepEntry.registerUserData;
14763
14858
  // Convert saved values to the expected format for inputs
14764
14859
  this.listOfInputValues = Object.keys(savedValues).map(name => {
14765
14860
  return { name, value: savedValues[name].value, isDuplicate: savedValues[name].isDuplicate };
14766
14861
  });
14862
+ // Sync local state object with storage values
14863
+ if (!this.registrationStepsState[this.registrationStep]) {
14864
+ this.registrationStepsState[this.registrationStep] = {};
14865
+ }
14866
+ this.registrationStepsState[this.registrationStep].registerUserData = savedValues;
14867
+ // Sync the forms object to ensure UI rendering
14868
+ if (this.forms[this.registrationStep]) {
14869
+ this.forms[this.registrationStep] = this.forms[this.registrationStep].map(input => {
14870
+ const savedData = this.listOfInputValues.find(v => v.name === input.name);
14871
+ return savedData ? Object.assign(Object.assign({}, input), { defaultValue: savedData.value }) : input;
14872
+ });
14873
+ }
14767
14874
  // Set the right documentTypeValue when the step is loaded
14768
14875
  let docType = (_a = this.listOfInputValues.find(i => i.name === CONSTANTS.DOCUMENT_TYPE)) === null || _a === void 0 ? void 0 : _a.value;
14769
14876
  if (docType === CONSTANTS.IDENTITY_CARD)
@@ -14778,7 +14885,9 @@ const GeneralRegistrationMultistep = class {
14778
14885
  if (input.inputType === 'togglecheckbox') {
14779
14886
  input.data.subFields.forEach((subfield) => {
14780
14887
  const subfieldValue = this.listOfInputValues.find(subfieldValue => subfieldValue.name === subfield.name);
14781
- subfield.defaultValue = subfieldValue.value;
14888
+ if (subfieldValue) {
14889
+ subfield.defaultValue = subfieldValue.value;
14890
+ }
14782
14891
  });
14783
14892
  }
14784
14893
  }
@@ -14841,45 +14950,87 @@ const GeneralRegistrationMultistep = class {
14841
14950
  setRegisterStep() {
14842
14951
  this.isLoadingPOST = true;
14843
14952
  const url = new URL(`${this.endpoint}/v1/player/legislation/registration/step/`);
14953
+ this.stepsStateMachine({ event: 'set', type: 'values' });
14954
+ const currentStepValue = this.registrationStep;
14844
14955
  const registerStep = {
14845
14956
  registrationId: this.registrationID,
14846
14957
  registerUserDto: this.listOfInputValues
14847
- .filter(input => !input.isDuplicate)
14958
+ .filter(input => {
14959
+ if (input.name === 'ValidateSMS')
14960
+ return true;
14961
+ return !input.isDuplicate;
14962
+ })
14848
14963
  .reduce((acc, curr) => {
14849
- // Because the API is very robust, some values need to be split as separate entities.
14850
- if (curr.name === 'TypeOfPublicArea') {
14851
- acc[curr.name] = curr.value.toLowerCase();
14964
+ // Handle SMS Validation field
14965
+ if (curr.name === 'ValidateSMS') {
14966
+ acc[curr.name] = curr.value;
14967
+ }
14968
+ // Handle specific dropdown fields that need lowercase values
14969
+ else if (curr.name === 'TypeOfPublicArea') {
14970
+ acc[curr.name] = curr.value ? curr.value.toLowerCase() : '';
14852
14971
  }
14853
- else if (curr.type === 'tel') {
14854
- //@ts-ignore
14855
- acc['MobilePrefix'] = curr.value.prefix;
14856
- //@ts-ignore
14857
- acc[curr.name] = curr.value.phone;
14972
+ // handlbe mobile number and prefix
14973
+ else if (curr.name === 'Mobile') {
14974
+ const mobileVal = curr.value;
14975
+ let phone = '';
14976
+ let prefix = '';
14977
+ // extract values from object (general-input format) or fallback to string
14978
+ if (typeof mobileVal === 'object' && mobileVal !== null) {
14979
+ phone = mobileVal.phone || '';
14980
+ prefix = mobileVal.prefix || '';
14981
+ }
14982
+ else {
14983
+ phone = mobileVal || '';
14984
+ }
14985
+ // rmove all non-digit characters from the phone string
14986
+ let cleanPhone = phone.toString().replace(CONSTANTS.ONLY_DIGITS_REGEX, '');
14987
+ // get digits from prefix to check for duplication (e.g., "27" from "+27")
14988
+ const prefixDigits = prefix.replace(CONSTANTS.ONLY_DIGITS_REGEX, '');
14989
+ // clear duplicate prefix
14990
+ if (prefixDigits && cleanPhone.startsWith(prefixDigits)) {
14991
+ cleanPhone = cleanPhone.slice(prefixDigits.length);
14992
+ }
14993
+ // remove leading zero if present
14994
+ if (cleanPhone.startsWith('0')) {
14995
+ cleanPhone = cleanPhone.slice(1);
14996
+ }
14997
+ acc['MobilePrefix'] = prefix;
14998
+ acc['Mobile'] = cleanPhone;
14858
14999
  }
15000
+ // Handle Checkbox Groups
14859
15001
  else if (curr.type === 'checkboxgroup') {
14860
- // Skip adding the parent of the checkboxgroup as a key.
14861
15002
  if (curr.value !== null) {
14862
15003
  Object.entries(curr.value).forEach(([key, value]) => {
14863
15004
  acc[key] = value ? 'true' : 'false';
14864
15005
  });
14865
15006
  }
14866
15007
  }
15008
+ // Handle Toggle/Switch inputs
14867
15009
  else if (curr.type === 'toggle') {
14868
15010
  acc[curr.name] = curr.value ? 'true' : 'false';
14869
15011
  }
15012
+ // Default mapping for all other fields
14870
15013
  else {
14871
15014
  acc[curr.name] = curr.value;
14872
15015
  }
14873
15016
  return acc;
14874
15017
  }, {}),
14875
- step: this.registrationStep,
15018
+ step: currentStepValue,
14876
15019
  };
14877
15020
  const headers = new Headers();
14878
15021
  headers.append('Content-Type', 'application/json');
14879
15022
  headers.append('Accept', 'application/json');
15023
+ // new payload to avoid sendind an old registration id
15024
+ const payload = {
15025
+ registerUserDto: registerStep.registerUserDto, // Datele curățate din reduce (fără prefix dublu)
15026
+ step: currentStepValue
15027
+ };
15028
+ if (this.registrationID && this.registrationID !== "null") {
15029
+ payload.registrationId = this.registrationID;
15030
+ }
14880
15031
  const options = {
14881
15032
  method: 'POST',
14882
- body: JSON.stringify(registerStep),
15033
+ body: JSON.stringify(payload),
14883
15034
  headers
14884
15035
  };
14885
15036
  if (this.lastStep === this.registrationStep) {
@@ -14957,8 +15108,8 @@ const GeneralRegistrationMultistep = class {
14957
15108
  if (this.listOfActions.some(action => action == '/generate-2FA-code/Generate2FACode')) {
14958
15109
  this.extraActions.push('2fa');
14959
15110
  }
14960
- if (localStorage.getItem('playerConsents')) {
14961
- localStorage.removeItem("playerConsents");
15111
+ if (sessionStorage.getItem('playerConsents')) {
15112
+ sessionStorage.removeItem("playerConsents");
14962
15113
  }
14963
15114
  this.setRegister();
14964
15115
  }
@@ -14968,9 +15119,11 @@ const GeneralRegistrationMultistep = class {
14968
15119
  }
14969
15120
  // After sending the current step, increment and check if the next one is in state.
14970
15121
  this.registrationStep = this.stepChange('increment');
14971
- // If step is present in state do NOT fetch the next config.
14972
- if (Object.keys(this.registrationStepsState).find(key => key == this.registrationStep)) {
14973
- // Use the one from state
15122
+ const stepData = this.registrationStepsState[this.registrationStep];
15123
+ const isValidStepInMem = stepData && stepData.fields && stepData.fields.length > 0;
15124
+ if (isValidStepInMem) {
15125
+ // Repopulate form
15126
+ this.forms = Object.assign(Object.assign({}, this.forms), { [this.registrationStep]: stepData.fields.map(f => (Object.assign({}, f))) });
14974
15127
  this.stepsStateMachine({ event: 'get', type: 'inputs' });
14975
15128
  this.stepsStateMachine({ event: 'get', type: 'values' });
14976
15129
  }
@@ -14978,6 +15131,10 @@ const GeneralRegistrationMultistep = class {
14978
15131
  this.getRegisterConfig(this.registrationID).then((config) => {
14979
15132
  // Format the new step config.
14980
15133
  this.formatConfig(config);
15134
+ const savedState = JSON.parse(sessionStorage.getItem('registrationStepsState'));
15135
+ if (savedState && savedState[this.registrationStep]) {
15136
+ this.stepsStateMachine({ event: 'get', type: 'values' });
15137
+ }
14981
15138
  // Set it in local storage.
14982
15139
  this.stepsStateMachine({ event: 'set', type: 'inputs' });
14983
15140
  // Setup conditionalValidationMap
@@ -15054,6 +15211,16 @@ const GeneralRegistrationMultistep = class {
15054
15211
  });
15055
15212
  }
15056
15213
  formatConfig(config) {
15214
+ // reset previous state to avoid data leakage between steps
15215
+ this.listOfInputs = [];
15216
+ this.listOfInputValues = [];
15217
+ this.listOfInputValidity = [];
15218
+ this.forms = Object.assign({}, this.forms);
15219
+ // set current context (MUST be done before restoration)
15220
+ this.registrationStep = config.content.step;
15221
+ this.registrationID = config.content.registrationID;
15222
+ this.listOfActions = config.content.actions.map(action => action);
15223
+ // map fields and handle duplicates
15057
15224
  this.listOfInputs = config.content.fields.flatMap((field) => {
15058
15225
  const duplicateInputRule = field.validate.custom.find(customRule => customRule.rule === 'duplicate-input');
15059
15226
  const inputElement = Object.assign({}, field);
@@ -15084,10 +15251,12 @@ const GeneralRegistrationMultistep = class {
15084
15251
  }
15085
15252
  return acc;
15086
15253
  }, []);
15254
+ // initialize values structure (Creating the "containers" for data)
15255
+ // We do this only ONCE using reduce to capture both main fields and subfields
15087
15256
  this.listOfInputValues = this.listOfInputs.reduce((acc, field) => {
15088
15257
  var _a;
15089
15258
  const inputType = (_a = field.inputType) === null || _a === void 0 ? void 0 : _a.toLowerCase();
15090
- // If the field type is a 'togglecheckbox', add its subfields
15259
+ // If the field type is a 'togglecheckbox', add its subfields first
15091
15260
  if (inputType === 'togglecheckbox') {
15092
15261
  field.data.subFields.forEach(subfield => {
15093
15262
  var _a;
@@ -15095,10 +15264,11 @@ const GeneralRegistrationMultistep = class {
15095
15264
  name: subfield.name,
15096
15265
  value: ((_a = subfield.inputType) === null || _a === void 0 ? void 0 : _a.toLowerCase()) == 'checkbox' ? 'false' : null,
15097
15266
  isDuplicate: subfield.isDuplicateInput || false,
15098
- type: inputType === 'togglecheckbox' ? 'togglecheckbox' : null
15267
+ type: 'togglecheckbox'
15099
15268
  });
15100
15269
  });
15101
15270
  }
15271
+ // Add the main field
15102
15272
  acc.push({
15103
15273
  name: field.name,
15104
15274
  value: inputType === 'checkbox' || inputType === 'togglecheckbox' ? 'false' : null,
@@ -15107,12 +15277,10 @@ const GeneralRegistrationMultistep = class {
15107
15277
  });
15108
15278
  return acc;
15109
15279
  }, []);
15280
+ // restore saved values over the empty structure
15281
+ this.stepsStateMachine({ event: 'get', type: 'values' });
15110
15282
  if (this.btag)
15111
15283
  this.addBtagValue();
15112
- // Set the list of actions
15113
- this.listOfActions = config.content.actions.map(action => action);
15114
- this.registrationID = config.content.registrationID;
15115
- this.registrationStep = config.content.step;
15116
15284
  if (this.listOfActions.some(action => action == '/register')) {
15117
15285
  this.lastStep = this.registrationStep;
15118
15286
  }
@@ -15120,10 +15288,11 @@ const GeneralRegistrationMultistep = class {
15120
15288
  if (this.isConsentReady) {
15121
15289
  this.listOfInputValidity.find((input) => input.name === "Consents").isValid = false;
15122
15290
  this.isFormValid = !this.getInvalidStatus(this.listOfInputValidity);
15123
- return;
15124
15291
  }
15125
- this.listOfInputValidity.push({ name: 'Consents', isValid: false });
15126
- this.isConsentReady = true;
15292
+ else {
15293
+ this.listOfInputValidity.push({ name: 'Consents', isValid: false });
15294
+ this.isConsentReady = true;
15295
+ }
15127
15296
  }
15128
15297
  else {
15129
15298
  this.isConsentReady = false;
@@ -15136,21 +15305,16 @@ const GeneralRegistrationMultistep = class {
15136
15305
  var _a, _b;
15137
15306
  this.addTranslation(field);
15138
15307
  // Logic for field types that have subfields
15139
- if (((_a = field.inputType) === null || _a === void 0 ? void 0 : _a.toLowerCase()) === 'togglecheckbox') {
15140
- field.data.subFields.forEach(subField => this.addTranslation(subField));
15141
- }
15142
- if (((_b = field.inputType) === null || _b === void 0 ? void 0 : _b.toLowerCase()) === 'checkboxgroup') {
15143
- this.addTranslation(field);
15308
+ if (((_a = field.inputType) === null || _a === void 0 ? void 0 : _a.toLowerCase()) === 'togglecheckbox' || ((_b = field.inputType) === null || _b === void 0 ? void 0 : _b.toLowerCase()) === 'checkboxgroup') {
15144
15309
  field.data.subFields.forEach(subField => this.addTranslation(subField));
15145
15310
  }
15146
- return field;
15147
15311
  });
15148
15312
  })
15149
15313
  .catch((error) => {
15150
15314
  console.error('Failed to fetch translations:', error);
15151
15315
  });
15152
15316
  }
15153
- // Add the step to the registrationStepsData
15317
+ // Add the step to the registrationStepsData if not present
15154
15318
  this.registrationStepsState.regId = this.registrationID;
15155
15319
  if (!this.registrationStepsState[this.registrationStep]) {
15156
15320
  this.registrationStepsState[this.registrationStep] = {
@@ -15300,9 +15464,9 @@ const GeneralRegistrationMultistep = class {
15300
15464
  input.inputType.toLowerCase() === 'togglecheckbox'
15301
15465
  ? input.data.subFields
15302
15466
  : input.data.values
15303
- : [], defaultValue: input.defaultValue, autofilled: input.autofill, emitValue: this.emitValue, language: this.language, mbSource: this.mbSource, isDuplicateInput: input.isDuplicateInput, "client-styling": this.clientStyling, tooltip: input.tooltip, placeholder: input.placeholder == null ? '' : input.placeholder, "date-format": this.dateFormat, "twofa-destination": this.twofaDestination, "twofa-resend-interval-seconds": (_a = input.customInfo) === null || _a === void 0 ? void 0 : _a.twofaResendIntervalSeconds, "translation-url": this.translationUrl, emitOnClick: this.emitOnClick, onClick: this.handleInitialClick, haspostalcodelookup: this.haspostalcodelookup, addresses: this.haspostalcodelookup ? this.addresses : null, postalcodelength: this.haspostalcodelookup ? this.postalcodelength : null, "enable-south-african-mode": this.enableSouthAfricanMode, key: ['address1', 'address2', 'City'].includes(input.name)
15304
- ? `${input.name}-${this.addressUpdateKey}`
15305
- : input.name, "ignore-country": this.getIgnoreCountry(input), "pin-attempts-exceeded": this.pinAttemptsExceeded }), ((_b = input.customInfo) === null || _b === void 0 ? void 0 : _b.description) && index.h("div", { class: "input-description" }, input.customInfo.description)));
15467
+ : [], defaultValue: input.defaultValue, autofilled: input.autofill, emitValue: this.emitValue, language: this.language, mbSource: this.mbSource, isDuplicateInput: input.isDuplicateInput, "client-styling": this.clientStyling, tooltip: input.tooltip, placeholder: input.placeholder == null ? '' : input.placeholder, "date-format": this.dateFormat, "twofa-destination": this.twofaDestination, "twofa-resend-interval-seconds": (_a = input.customInfo) === null || _a === void 0 ? void 0 : _a.twofaResendIntervalSeconds, "translation-url": this.translationUrl, emitOnClick: this.emitOnClick, onClick: this.handleInitialClick, haspostalcodelookup: this.haspostalcodelookup, addresses: this.haspostalcodelookup ? this.addresses : null, postalcodelength: this.haspostalcodelookup ? this.postalcodelength : null, "enable-south-african-mode": this.enableSouthAfricanMode, "ignore-country": this.getIgnoreCountry(input), "pin-attempts-exceeded": this.pinAttemptsExceeded, key: ['address1', 'address2', 'City'].includes(input.name)
15468
+ ? `${input.name}-${this.addressUpdateKey}-${this.registrationStep}`
15469
+ : `${input.name}-${this.registrationStep}` }), ((_b = input.customInfo) === null || _b === void 0 ? void 0 : _b.description) && index.h("div", { class: "input-description" }, input.customInfo.description)));
15306
15470
  }), this.forms[this.registrationStep] && this.isConsentReady && this.renderConsents(), this.forms[this.registrationStep] && this.buttonInsideForm && this.renderButtons(), index.h("div", { class: "registration__wrapper--flex" }, index.h("p", { class: "registration__error-message", innerHTML: this.errorMessage })))));
15307
15471
  }
15308
15472
  renderConsents() {