@hmcts/rpx-xui-common-lib 1.9.0-address-lookup-full-2 → 1.9.0-address-inline-errors

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.
@@ -779,11 +779,12 @@
779
779
  * in the data array for the route:
780
780
  * - needsFeaturesEnabled: An array of feature keys that need to be enabled for this route
781
781
  * - featureDisabledRedirect: the URL to redirect to when the this route is not accessible due to disabled features
782
+ * - expectFeatureEnabled: Sets whether a route should be enabled/disabled based on whether feature is present
782
783
  * @param route Automatically provided by Angular
783
784
  */
784
785
  FeatureToggleGuard.prototype.canActivate = function (route) {
785
786
  var _this = this;
786
- return rxjs.combineLatest.apply(void 0, __spread(route.data.needsFeaturesEnabled.map(function (feature) { return _this.featureToggleService.getValueOnce(feature, false); }))).pipe(operators.map(function (featureStatuses) { return featureStatuses.every(function (status) { return status; }); }), operators.map(function (status) { return status || _this.router.parseUrl(route.data.featureDisabledRedirect); }));
787
+ return rxjs.combineLatest(__spread(route.data.needsFeaturesEnabled.map(function (feature) { return _this.featureToggleService.getValueOnce(feature, false); }))).pipe(operators.map(function (featureStatuses) { return featureStatuses.every(function (status) { return status; }); }), operators.map(function (status) { return (route.data.expectFeatureEnabled !== false && status) || (route.data.expectFeatureEnabled === false && !status) || _this.router.parseUrl(route.data.featureDisabledRedirect); }));
787
788
  };
788
789
  return FeatureToggleGuard;
789
790
  }());
@@ -859,7 +860,7 @@
859
860
 
860
861
  exports.AddressMessageEnum = void 0;
861
862
  (function (AddressMessageEnum) {
862
- AddressMessageEnum["NO_OPTION_SELECTED"] = "Please select an answer";
863
+ AddressMessageEnum["NO_OPTION_SELECTED"] = "Select an option";
863
864
  AddressMessageEnum["NO_STREET_SELECTED"] = "Enter building and street";
864
865
  AddressMessageEnum["NO_CITY_SELECTED"] = "Enter town or city";
865
866
  AddressMessageEnum["NO_COUNTRY_SELECTED"] = "Enter country";
@@ -4892,6 +4893,7 @@
4892
4893
  postcode: new forms.FormControl(''),
4893
4894
  addressList: new forms.FormControl('')
4894
4895
  });
4896
+ this.setPostcodeForm();
4895
4897
  };
4896
4898
  WriteAddressFieldComponent.prototype.findAddress = function () {
4897
4899
  var _this = this;
@@ -4998,12 +5000,16 @@
4998
5000
  this.formGroup.get('address').patchValue(this.addressField);
4999
5001
  }
5000
5002
  };
5003
+ WriteAddressFieldComponent.prototype.setPostcodeForm = function () {
5004
+ var postcodeNeeded = this.isInternational === undefined && this.formGroup.get('address') && this.formGroup.get('address').get('postCode');
5005
+ this.addressFormGroup.get('postcode').patchValue(postcodeNeeded ? this.formGroup.get('address').get('postCode').value : '');
5006
+ };
5001
5007
  return WriteAddressFieldComponent;
5002
5008
  }());
5003
5009
  WriteAddressFieldComponent.decorators = [
5004
5010
  { type: i0.Component, args: [{
5005
5011
  selector: 'xuilib-write-address-field',
5006
- template: "<div class=\"govuk-form-group\" [formGroup]=\"addressFormGroup\" [ngClass]=\"{'govuk-form-group--error': optionErrorsPresent}\">\n <p class=\"govuk-error-message\" *ngIf=\"optionErrorsPresent\">\n <span class=\"govuk-visually-hidden\">Error:</span>{{optionErrorMessage}}\n </p>\n <div *ngIf=\"postcodeLookupVisible()\">\n <div class=\"govuk-form-group postcodeLookup\" id=\"addressLookup\">\n <label for=\"postcodeInput\">\n <span class=\"govuk-label\"><b>Provide address details</b></span>\n <span class=\"govuk-label\">Enter a UK postcode</span>\n </label>\n <div class=\"govuk-form-group\"\n [ngClass]=\"{'govuk-form-group--error': missingPostcode || postcodeErrorPresent(true)}\">\n <p class=\"govuk-error-message\" *ngIf=\"missingPostcode || postcodeErrorPresent(true)\">\n <span class=\"govuk-visually-hidden\">Error:</span>{{postcodeErrorMessage}}\n </p>\n <input type=\"text\" [ngClass]=\"{'govuk-input--error': missingPostcode}\" id=\"postcodeInput\" name=\"postcode\"\n class=\"govuk-input govuk-!-width-two-thirds postcodeinput inline-block\" formControlName=\"postcode\">\n <button type=\"button\" class=\"govuk-button\" (click)=\"findAddress()\">Find address</button>\n </div>\n </div>\n\n <div class=\"govuk-form-group\"\n *ngIf=\"addressOptions\" id=\"selectAddress\">\n <label class=\"govuk-label\" for=\"addressList\">\n <span class=\"form-label\">Select an address</span>\n </label>\n <div class=\"govuk-form-group\"\n [ngClass]=\"{'govuk-form-group--error': postcodeErrorPresent(false)}\">\n <p class=\"govuk-error-message\" *ngIf=\"postcodeErrorPresent(false)\">\n <span class=\"govuk-visually-hidden\">Error:</span>{{selectErrorMessage}}\n </p>\n <select class=\"form-control govuk-select ccd-dropdown addressList\" id=\"addressList\" name=\"address\"\n formControlName=\"addressList\" (change)=\"addressSelected()\" focusElement>\n <option *ngFor=\"let addressOption of addressOptions\" [ngValue]=\"addressOption.value\">\n {{addressOption.description}}\n </option>\n </select>\n </div>\n </div>\n\n <a class=\"manual-link govuk-link\" *ngIf=\"!shouldShowDetailFields() || (!startedInternational && !addressChosen)\" (click)=\"blankAddress()\"\n href=\"javascript:void(0)\">I can't enter a UK postcode</a>\n </div>\n\n <div class=\"govuk-radios\" data-module=\"govuk-radios\"\n *ngIf=\"shouldShowDetailFields() && internationalMode && startedInternational && !addressChosen\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"yes\" value=\"yes\" name=\"ukAddress\" type=\"radio\" data-aria-controls=\"address-fields\"\n (click)=\"setInternationalAddress(false)\" formControlName=\"ukAddress\">\n <label class=\"govuk-label govuk-radios__label\" for=\"yes\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"no\" value=\"no\" name=\"ukAddress\" type=\"radio\" data-aria-controls=\"address-fields\"\n (click)=\"setInternationalAddress(true)\" formControlName=\"ukAddress\">\n <label class=\"govuk-label govuk-radios__label\" for=\"no\">\n No\n </label>\n </div>\n <div class=\"govuk-radios__conditional\" id=\"address-fields\">\n <xuilib-write-address-inputs *ngIf=\"isInternational !== undefined\" [formGroup]=\"formGroup\" [isInternational]=\"isInternational\"\n [submissionAttempted]=\"submissionAttempted\">\n </xuilib-write-address-inputs>\n </div>\n </div>\n\n <xuilib-write-address-inputs *ngIf=\"shouldShowDetailFields() && (addressChosen || !internationalMode)\"\n [formGroup]=\"formGroup\" [isInternational]=\"false\" [submissionAttempted]=\"submissionAttempted\"></xuilib-write-address-inputs>\n\n</div>",
5012
+ template: "<div class=\"govuk-form-group\" [formGroup]=\"addressFormGroup\" [ngClass]=\"{'govuk-form-group--error': optionErrorsPresent}\">\n <p class=\"govuk-error-message\" *ngIf=\"optionErrorsPresent\">\n <span class=\"govuk-visually-hidden\">Error:</span>{{optionErrorMessage}}\n </p>\n <div *ngIf=\"postcodeLookupVisible()\">\n <span class=\"govuk-label\"><strong>Provide address details</strong></span>\n <div class=\"govuk-body postcodeLookup\" id=\"addressLookup\" [ngClass]=\"{'govuk-form-group--error': missingPostcode || postcodeErrorPresent(true)}\">\n <p class=\"govuk-error-message\" *ngIf=\"missingPostcode || postcodeErrorPresent(true)\">\n <span class=\"govuk-visually-hidden\">Error:</span>{{postcodeErrorMessage}}\n </p>\n <label for=\"postcodeInput\">\n <span class=\"govuk-hint\">Enter a UK postcode</span>\n </label>\n <div class=\"govuk-body\">\n <input type=\"text\" [ngClass]=\"{'govuk-input--error': missingPostcode}\" id=\"postcodeInput\" name=\"postcode\"\n class=\"govuk-input govuk-!-width-two-thirds postcodeinput inline-block\" formControlName=\"postcode\">\n <button type=\"button\" class=\"govuk-button\" (click)=\"findAddress()\">Find address</button>\n </div>\n </div>\n\n <div class=\"govuk-body\"\n *ngIf=\"addressOptions\" id=\"selectAddress\">\n <div class=\"govuk-body\"\n [ngClass]=\"{'govuk-form-group--error': postcodeErrorPresent(false)}\">\n <p class=\"govuk-error-message\" *ngIf=\"postcodeErrorPresent(false)\">\n <span class=\"govuk-visually-hidden\">Error:</span>{{selectErrorMessage}}\n </p>\n <label class=\"govuk-label\" for=\"addressList\">\n <span class=\"form-label\">Select an address</span>\n </label>\n <select class=\"form-control govuk-select ccd-dropdown addressList\" id=\"addressList\" name=\"address\"\n formControlName=\"addressList\" (change)=\"addressSelected()\" focusElement>\n <option *ngFor=\"let addressOption of addressOptions\" [ngValue]=\"addressOption.value\">\n {{addressOption.description}}\n </option>\n </select>\n </div>\n </div>\n\n <a class=\"manual-link govuk-link\" *ngIf=\"!shouldShowDetailFields() || (!startedInternational && !addressChosen)\" (click)=\"blankAddress()\"\n href=\"javascript:void(0)\">I can't enter a UK postcode</a>\n </div>\n\n <div id=\"govuk-radios\" class=\"govuk-radios\" data-module=\"govuk-radios\"\n *ngIf=\"shouldShowDetailFields() && internationalMode && startedInternational && !addressChosen\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"yes\" value=\"yes\" name=\"ukAddress\" type=\"radio\" data-aria-controls=\"address-fields\"\n (click)=\"setInternationalAddress(false)\" formControlName=\"ukAddress\">\n <label class=\"govuk-label govuk-radios__label\" for=\"yes\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"no\" value=\"no\" name=\"ukAddress\" type=\"radio\" data-aria-controls=\"address-fields\"\n (click)=\"setInternationalAddress(true)\" formControlName=\"ukAddress\">\n <label class=\"govuk-label govuk-radios__label\" for=\"no\">\n No\n </label>\n </div>\n <div class=\"govuk-radios__conditional\" id=\"address-fields\">\n <xuilib-write-address-inputs *ngIf=\"isInternational !== undefined\" [formGroup]=\"formGroup\" [isInternational]=\"isInternational\"\n [submissionAttempted]=\"submissionAttempted\">\n </xuilib-write-address-inputs>\n </div>\n </div>\n\n <xuilib-write-address-inputs *ngIf=\"shouldShowDetailFields() && (addressChosen || !internationalMode)\"\n [formGroup]=\"formGroup\" [isInternational]=\"false\" [submissionAttempted]=\"submissionAttempted\"></xuilib-write-address-inputs>\n\n</div>",
5007
5013
  styles: [".manual-link{cursor:pointer;text-decoration:underline;margin-top:10px}.manual-link,:host{display:block}"]
5008
5014
  },] }
5009
5015
  ];
@@ -5031,9 +5037,15 @@
5031
5037
  this.submissionAttempted = false;
5032
5038
  this.missingPostcode = false;
5033
5039
  this.errorsPresent = false;
5040
+ this.streetInvalid = false;
5041
+ this.townInvalid = false;
5042
+ this.countryInvalid = false;
5034
5043
  }
5035
5044
  WriteAddressInputsComponent.prototype.ngOnChanges = function () {
5036
5045
  var addressGroup = this.formGroup.get('address');
5046
+ this.streetInvalid = !addressGroup.get('addressLine1').valid;
5047
+ this.townInvalid = !addressGroup.get('postTown').valid;
5048
+ this.countryInvalid = !addressGroup.get('country').valid;
5037
5049
  // if there is an issue with the formgroup, ensure error styling is displayed
5038
5050
  this.errorsPresent = !addressGroup.valid;
5039
5051
  };
@@ -5042,7 +5054,7 @@
5042
5054
  WriteAddressInputsComponent.decorators = [
5043
5055
  { type: i0.Component, args: [{
5044
5056
  selector: 'xuilib-write-address-inputs',
5045
- template: "<ng-container>\n <form [formGroup]=\"formGroup\">\n <div class=\"govuk-form-group\" formGroupName=\"address\" [ngClass]=\"{'govuk-form-group--error': submissionAttempted && errorsPresent}\">\n <label class=\"govuk-label govuk-!-font-weight-bold\">\n Enter address details\n </label>\n\n <div class=\"govuk-form-group\">\n <label class=\"govuk-label\" for=\"addressLine1\">\n Building and Street\n </label>\n <p class=\"govuk-error-message\" *ngIf=\"submissionAttempted && !formGroup.get('address').get('addressLine1').valid\">\n <span class=\"govuk-visually-hidden\">Error:</span>{{MESSAGE_ENUM.NO_STREET_SELECTED}}\n </p>\n <input class=\"govuk-input govuk-!-width-full\" id=\"addressLine1\" name=\"addressLine1\" type=\"text\"\n formControlName=\"addressLine1\">\n </div>\n\n <div class=\"govuk-form-group\">\n <label class=\"govuk-label\" for=\"addressLine2\">\n Address line 2 (Optional)\n </label>\n <input class=\"govuk-input govuk-!-width-full\" id=\"addressLine2\" name=\"addressLine2\" type=\"text\"\n formControlName=\"addressLine2\">\n </div>\n\n <div class=\"govuk-form-group\">\n <label class=\"govuk-label\" for=\"addressLine3\">\n Address line 3 (Optional)\n </label>\n <input class=\"govuk-input govuk-!-width-full\" id=\"addressLine3\" name=\"addressLine3\" type=\"text\"\n formControlName=\"addressLine3\">\n </div>\n\n <div class=\"govuk-form-group\">\n <label class=\"govuk-label\" for=\"postTown\">\n Town or City\n </label>\n <p class=\"govuk-error-message\" *ngIf=\"submissionAttempted && !formGroup.get('address').get('postTown').valid\">\n <span class=\"govuk-visually-hidden\">Error:</span>{{MESSAGE_ENUM.NO_CITY_SELECTED}}\n </p>\n <input class=\"govuk-input govuk-!-width-two-thirds\" id=\"postTown\" name=\"postTown\" type=\"text\"\n formControlName=\"postTown\">\n </div>\n\n <div class=\"govuk-form-group\">\n <label class=\"govuk-label\" for=\"county\">\n County{{this.isInternational ? '/ State/ Province' : ''}} (Optional)\n </label>\n <input class=\"govuk-input govuk-!-width-two-thirds\" id=\"county\" name=\"county\" type=\"text\"\n formControlName=\"county\">\n </div>\n\n <div *ngIf=\"isInternational\" class=\"govuk-form-group\">\n <label class=\"govuk-label\" for=\"country\">\n Country\n </label>\n <p class=\"govuk-error-message\" *ngIf=\"submissionAttempted && !formGroup.get('address').get('country').valid\">\n <span class=\"govuk-visually-hidden\">Error:</span>{{MESSAGE_ENUM.NO_COUNTRY_SELECTED}}\n </p>\n <input class=\"govuk-input govuk-!-width-two-thirds\" id=\"country\" name=\"country\" type=\"text\"\n formControlName=\"country\">\n </div>\n\n <div class=\"govuk-form-group\">\n <label class=\"govuk-label\" for=\"postCode\">\n Postcode{{this.isInternational ? ' (Optional)' : ''}}\n </label>\n <p class=\"govuk-error-message\" *ngIf=\"submissionAttempted && !isInternational && this.formGroup.get('address').get('postCode').hasError('required')\">\n <span class=\"govuk-visually-hidden\">Error:</span>{{MESSAGE_ENUM.NO_POSTCODE_SELECTED}}\n </p>\n <p class=\"govuk-error-message\" *ngIf=\"submissionAttempted && !isInternational && this.formGroup.get('address').get('postCode').hasError('invalidPostcode')\">\n <span class=\"govuk-visually-hidden\">Error:</span>{{MESSAGE_ENUM.INVALID_POSTCODE}}\n </p>\n <input class=\"govuk-input govuk-!-width-one-third\" id=\"postCode\" name=\"postCode\" type=\"text\"\n formControlName=\"postCode\">\n </div>\n </div>\n</form>\n</ng-container>"
5057
+ template: "<ng-container>\n <form [formGroup]=\"formGroup\">\n <div class=\"govuk-body\" formGroupName=\"address\">\n <label class=\"govuk-label govuk-!-font-weight-bold\">\n Enter address details\n </label>\n\n <div class=\"govuk-body\" [ngClass]=\"{'govuk-form-group--error': submissionAttempted && streetInvalid}\">\n <label class=\"govuk-label\" for=\"addressLine1\">\n Building and Street\n </label>\n <p class=\"govuk-error-message\" *ngIf=\"submissionAttempted && streetInvalid\">\n <span class=\"govuk-visually-hidden\">Error:</span>{{MESSAGE_ENUM.NO_STREET_SELECTED}}\n </p>\n <input class=\"govuk-input govuk-!-width-full\" id=\"addressLine1\" name=\"addressLine1\" type=\"text\"\n formControlName=\"addressLine1\">\n </div>\n\n <div class=\"govuk-body\">\n <label class=\"govuk-label\" for=\"addressLine2\">\n Address line 2 (Optional)\n </label>\n <input class=\"govuk-input govuk-!-width-full\" id=\"addressLine2\" name=\"addressLine2\" type=\"text\"\n formControlName=\"addressLine2\">\n </div>\n\n <div class=\"govuk-body\">\n <label class=\"govuk-label\" for=\"addressLine3\">\n Address line 3 (Optional)\n </label>\n <input class=\"govuk-input govuk-!-width-full\" id=\"addressLine3\" name=\"addressLine3\" type=\"text\"\n formControlName=\"addressLine3\">\n </div>\n\n <div class=\"govuk-body\" [ngClass]=\"{'govuk-form-group--error': submissionAttempted && townInvalid}\">\n <label class=\"govuk-label\" for=\"postTown\">\n Town or City\n </label>\n <p class=\"govuk-error-message\" *ngIf=\"submissionAttempted && townInvalid\">\n <span class=\"govuk-visually-hidden\">Error:</span>{{MESSAGE_ENUM.NO_CITY_SELECTED}}\n </p>\n <input class=\"govuk-input govuk-!-width-two-thirds\" id=\"postTown\" name=\"postTown\" type=\"text\"\n formControlName=\"postTown\">\n </div>\n\n <div class=\"govuk-body\">\n <label class=\"govuk-label\" for=\"county\">\n County{{this.isInternational ? '/ State/ Province' : ''}} (Optional)\n </label>\n <input class=\"govuk-input govuk-!-width-two-thirds\" id=\"county\" name=\"county\" type=\"text\"\n formControlName=\"county\">\n </div>\n\n <div *ngIf=\"isInternational\" class=\"govuk-body\" [ngClass]=\"{'govuk-form-group--error': submissionAttempted && countryInvalid}\">\n <label class=\"govuk-label\" for=\"country\">\n Country\n </label>\n <p class=\"govuk-error-message\" *ngIf=\"submissionAttempted && countryInvalid\">\n <span class=\"govuk-visually-hidden\">Error:</span>{{MESSAGE_ENUM.NO_COUNTRY_SELECTED}}\n </p>\n <input class=\"govuk-input govuk-!-width-two-thirds\" id=\"country\" name=\"country\" type=\"text\"\n formControlName=\"country\">\n </div>\n\n <div class=\"govuk-body\" [ngClass]=\"{'govuk-form-group--error': submissionAttempted && !isInternational && !formGroup.get('address').get('postCode').valid}\">\n <label class=\"govuk-label\" for=\"postCode\">\n Postcode{{this.isInternational ? ' (Optional)' : ''}}\n </label>\n <p class=\"govuk-error-message\" *ngIf=\"submissionAttempted && !isInternational && this.formGroup.get('address').get('postCode').hasError('required')\">\n <span class=\"govuk-visually-hidden\">Error:</span>{{MESSAGE_ENUM.NO_POSTCODE_SELECTED}}\n </p>\n <p class=\"govuk-error-message\" *ngIf=\"submissionAttempted && !isInternational && this.formGroup.get('address').get('postCode').hasError('invalidPostcode')\">\n <span class=\"govuk-visually-hidden\">Error:</span>{{MESSAGE_ENUM.INVALID_POSTCODE}}\n </p>\n <input class=\"govuk-input govuk-!-width-one-third\" id=\"postCode\" name=\"postCode\" type=\"text\"\n formControlName=\"postCode\">\n </div>\n </div>\n</form>\n</ng-container>"
5046
5058
  },] }
5047
5059
  ];
5048
5060
  WriteAddressInputsComponent.ctorParameters = function () { return []; };